/* وزیرمتن لوکال (فونت متغیر — همهٔ وزن‌های ۱۰۰ تا ۱۰۰۰ در یک فایل)؛ جایگزین Google Fonts */
@font-face {
  font-family: "Vazirmatn";
  src: url("/assets/fonts/Vazirmatn-Variable.woff2") format("woff2-variations");
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;
}

/* ═══════════ «MK Question» — خانوادهٔ ترکیبیِ متنِ سؤال ═══════════════════════
   یک نامِ خانوادگی که مرورگر برای هر کاراکتر از فایلِ درستش می‌خواند. همان
   قراردادی که دفترچه‌های کنکور دارند:

     حرف و متنِ فارسی      → ب نازنین
     صفرِ فارسی «۰»        → وزیرمتن  (صفرِ ب نازنین یک نقطه است — اندازه‌گیری:
                              ارتفاعِ «۰» در ب نازنین ۱۷ و در «۵» همان فونت ۵۸)
     حرف و عددِ لاتین، یونانی → XITS (خانوادهٔ Times؛ همان فونتی که دفترچهٔ کنکور با
                              XeLaTeX با آن حروف‌چینی می‌شود)

   چرا XITS و نه خودِ Times New Roman: آن فونت مالِ Monotype است و هاست‌کردنش
   روی وب‌سرور مجاز نیست. جزئیات در assets/fonts/xits/README.txt

   ترتیب اعلام مهم است: وقتی چند @font-face از یک خانواده یک کاراکتر را پوشش
   می‌دهند، آخرین اعلام برنده است. پس فارسیِ ب نازنین اول می‌آید و صفرِ وزیرمتن
   آخر، تا فقط «۰» از آن خوانده شود.

   همه‌جا بدون local() و با font-display: block — اگر از فونتِ نصب‌شدهٔ کاربر
   خوانده شود، PDFِ سرور (که هیچ فونت سیستمی ندارد) با سایت یکی درنمی‌آید و
   swap یعنی احتمالِ چاپ‌شدنِ صفحه با فونتِ جایگزین.
   منبع ب نازنین: assets/fonts/BNazanin-Credits.txt
   ═════════════════════════════════════════════════════════════════════════ */

/* ۱) فارسی/عربی → ب نازنین */
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/BNazanin-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: block;
  unicode-range: U+0600-06FF, U+0750-077F, U+200C-200D, U+FB50-FDFF, U+FE70-FEFF;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/BNazanin-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: block;
  unicode-range: U+0600-06FF, U+0750-077F, U+200C-200D, U+FB50-FDFF, U+FE70-FEFF;
}

/* ۲) لاتین و یونانی → XITS. برشِ latin عمداً U+200C-200D را ندارد: نیم‌فاصله و
   اتصال‌دهنده باید دستِ فونتِ فارسی بماند وگرنه شکل‌گیریِ حروف به‌هم می‌ریزد. */
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-400-normal-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: block;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-200B, U+200E-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FFFD;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-400-normal-greek.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: block;
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-400-italic-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: block;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-200B, U+200E-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FFFD;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-400-italic-greek.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: block;
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-700-normal-latin.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: block;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-200B, U+200E-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FFFD;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-700-normal-greek.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: block;
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-700-italic-latin.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: block;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-200B, U+200E-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FFFD;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/xits/XITS-700-italic-greek.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: block;
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

/* ۳) و در آخر: صفرِ فارسی از وزیرمتن. وزیرمتن همین حالا برای پوستهٔ سایت لود
   شده، پس این جایگزینی یک بایت هم به صفحه اضافه نمی‌کند.

   نکتهٔ ظریفی که یک بار خوردیمش: این فیس حتماً باید وزنِ **ثابت** بگیرد. با
   `font-weight: 100 1000` (شکلِ طبیعیِ یک فونت متغیر) کروم آن را برندهٔ مرحلهٔ
   تطبیقِ وزن می‌کند و بعد unicode-range بقیهٔ فیس‌ها را نادیده می‌گیرد — نتیجه
   اینکه کلِ لاتین و همهٔ ارقام هم وزیرمتن می‌شدند و XITS هیچ‌وقت دیده نمی‌شد.
   با وزنِ ثابت، تفکیکِ کاراکتری دقیقاً همان می‌شود که انتظار داریم (سنجیده شد). */
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/Vazirmatn-Variable.woff2") format("woff2-variations");
  font-weight: 400;
  font-style: normal;
  font-display: block;
  unicode-range: U+06F0, U+0660;
}
@font-face {
  font-family: "MK Question";
  src: url("/assets/fonts/Vazirmatn-Variable.woff2") format("woff2-variations");
  font-weight: 700;
  font-style: normal;
  font-display: block;
  unicode-range: U+06F0, U+0660;
}

/* نامِ «B Nazanin» هم مستقل می‌ماند: شمارهٔ سؤالِ دفترچهٔ کنکوری از قبل به آن
   ارجاع می‌داد و آنجا ترکیبِ چندفونتی لازم نیست. */
@font-face {
  font-family: "B Nazanin";
  src: url("/assets/fonts/BNazanin-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "B Nazanin";
  src: url("/assets/fonts/BNazanin-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: block;
}

:root {
  --bg: #f7f6f2;
  --panel: #fff;
  --panel-soft: #fbfaf7;
  --ink: #25231f;
  --muted: #827e75;
  --line: #ebe8e0;
  --orange: #ff6b18;
  --orange-soft: #fff0e7;
  --teal: #1aa392;
  --teal-soft: #e9f8f5;
  --blue: #4676e8;
  --blue-soft: #edf3ff;
  --purple: #8664d8;
  --purple-soft: #f2edff;
  --red: #de5a5a;
  --red-soft: #fff0f0;
  --yellow: #d9a52b;
  --yellow-soft: #fff8df;
  --shadow: 0 12px 32px rgba(41, 36, 29, 0.065);
  --radius: 18px;

  /* فونتِ متنِ سؤال. جدا از فونتِ پوسته نگه داشته می‌شود تا دکمه‌ها، منوها و
     جدول‌های مدیریتی وزیرمتن بمانند و فقط خودِ سؤال ب نازنین شود. */
  --q-font: "MK Question", "B Nazanin", "Vazirmatn", Tahoma, sans-serif;
  /* ب نازنین «بدنهٔ» بسیار کوچکی نسبت به em دارد. اندازه‌گیریِ ارتفاعِ گلیف در
     همین پروژه: بدنهٔ «ب» ۱٫۲۵ برابر، «س» ۱٫۲۰ برابر، رقم ۱٫۱۳ برابر و الف
     ۱٫۱۰ برابر باید بزرگ‌تر شود تا هم‌اندازهٔ وزیرمتن دیده شود. ۱٫۲۲ وسطِ
     بازهٔ بدنهٔ حروف است — همان چیزی که چشم موقع خواندن می‌سنجد. */
  --q-scale: 1.22;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 72% 5%, rgba(255, 184, 126, 0.14), transparent 26rem),
    var(--bg);
  color: var(--ink);
  font-family: "Vazirmatn", Tahoma, sans-serif;
  font-size: 14px;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  color: inherit;
}

[hidden] {
  display: none !important;
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 244px minmax(0, 1fr);
}

.sidebar-backdrop { display: none; }
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  z-index: 20;
  background: rgba(252, 251, 248, 0.92);
  backdrop-filter: blur(18px);
  border-left: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  padding: 22px 14px 14px;
  overflow-y: auto;            /* وقتی آیتم‌ها از ارتفاع صفحه بیشتر شوند، اسکرول شود */
  overscroll-behavior: contain;
}
.sidebar::-webkit-scrollbar { width: 7px; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(120,110,95,.28); border-radius: 6px; }

.brand {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 9px 24px;
}

.brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 14px 6px 14px 14px;
  background: var(--orange);
  display: grid;
  place-items: center;
  box-shadow: 0 8px 20px rgba(255, 107, 24, 0.25);
}

.brand-mark svg {
  width: 29px;
  height: 29px;
}

.brand-mark circle {
  fill: #fff;
}

.brand-mark path {
  fill: none;
  stroke: var(--orange);
  stroke-width: 6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.brand strong,
.brand span {
  display: block;
}

.brand strong {
  font-size: 16px;
}

.brand span {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}

.nav-section {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.nav-label {
  color: #aaa59a;
  font-size: 10px;
  font-weight: 700;
  padding: 18px 13px 7px;
}

.nav-item {
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border-radius: 12px;
  color: #68645c;
  cursor: pointer;
  text-align: right;
  transition: 0.18s ease;
}

.nav-item:hover {
  background: #f2f0ea;
  color: var(--ink);
}

.nav-item.active {
  background: var(--orange-soft);
  color: #df580d;
  font-weight: 700;
}

.nav-icon {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ui-icon {
  width: 17px;
  height: 17px;
  display: inline-block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
  pointer-events: none;
}

button > .ui-icon { flex: 0 0 auto; }

.primary-button,
.secondary-button,
.ghost-button,
.danger-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.nav-count {
  margin-right: auto;
  background: #f0eee8;
  color: #817d73;
  border-radius: 20px;
  font-size: 10px;
  padding: 2px 7px;
}

.nav-count.warning {
  color: #b16f00;
  background: var(--yellow-soft);
}

.sidebar-footer {
  margin-top: auto;
  border-top: 1px solid var(--line);
  padding: 16px 8px 0;
}

.storage-row {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
}

.progress {
  background: #ece9e2;
  height: 5px;
  border-radius: 10px;
  margin: 8px 0 5px;
  overflow: hidden;
}

.progress span {
  display: block;
  height: 100%;
  background: var(--orange);
  border-radius: inherit;
}

.sidebar-footer > small {
  color: var(--muted);
  font-size: 9px;
}

.profile-card {
  width: 100%;
  background: white;
  border: 1px solid var(--line);
  border-radius: 14px;
  margin-top: 16px;
  padding: 9px;
  display: flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
}

.avatar {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  background: #26241f;
  color: white;
  display: grid;
  place-items: center;
  font-size: 11px;
  overflow: hidden;
  flex: none;
}

.avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.avatar-empty {
  width: 100%;
  height: 100%;
  display: block;
}

/* برش آواتار با نسبت ۱:۱ (سبک اینستاگرام: جابه‌جایی + بزرگ‌نمایی) */
.avatar-crop-backdrop {
  position: fixed;
  inset: 0;
  z-index: 320;
  display: grid;
  place-items: center;
  background: rgba(20, 18, 15, 0.55);
  padding: 20px;
}

.avatar-cropper {
  position: relative;
  margin: 0 auto 14px;
  border-radius: 22px;
  overflow: hidden;
  background: #111;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.avatar-cropper:active {
  cursor: grabbing;
}

.avatar-cropper img {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: 0 0;
  max-width: none;
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}

.avatar-cropper-ring {
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: 22px;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.65);
}

.av-zoom {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 300px;
  margin: 0 auto 8px;
  color: var(--muted);
}

.av-zoom input[type="range"] {
  flex: 1;
}

.avatar.avatar-lg {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  font-size: 22px;
}

/* ویرایشگر آواتار در فرم پروفایل/مدیر */
.avatar-edit {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 6px;
}

.avatar-edit .avatar-actions {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.avatar-edit .avatar-actions button {
  font-size: 11px;
  padding: 6px 12px;
}

.receipt-thumb {
  height: 32px;
  border-radius: 6px;
  border: 1px solid var(--line);
  cursor: pointer;
}

.profile-card strong,
.profile-card small {
  display: block;
  text-align: right;
}

.profile-card strong {
  font-size: 11px;
}

.profile-card small {
  font-size: 9px;
  color: var(--muted);
}

.profile-card .chevron {
  margin-right: auto;
}

.main {
  min-width: 0;
}

.topbar {
  height: 72px;
  display: flex;
  align-items: center;
  padding: 0 30px;
  gap: 18px;
  border-bottom: 1px solid rgba(229, 226, 218, 0.8);
  background: rgba(247, 246, 242, 0.72);
  backdrop-filter: blur(18px);
  position: sticky;
  top: 0;
  z-index: 45;
}

/* آیکون ذره‌بینِ باکس‌های جست‌وجو — از همان اسپرایتِ SVG (#icon-search).
   نسخهٔ قبلی با border/::after کشیده می‌شد و در RTL دستهٔ ذره‌بین جدا می‌افتاد. */
.search-glyph {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  color: #9a938a;
  stroke-width: 2;
  transition: color .15s ease;
}
.question-code-search:focus-within .search-glyph,
.audit-search-box:focus-within .search-glyph {
  color: var(--orange);
}

.icon-button,
.primary-button,
.secondary-button,
.ghost-button,
.danger-button {
  border: 0;
  cursor: pointer;
  transition: 0.18s ease;
}

.icon-button {
  width: 39px;
  height: 39px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: white;
  display: inline-grid;
  place-items: center;
}

.icon-button:hover,
.secondary-button:hover {
  border-color: #d8d3c7;
  transform: translateY(-1px);
}

.primary-button,
.secondary-button,
.ghost-button,
.danger-button {
  height: 40px;
  padding: 0 15px;
  border-radius: 11px;
  font-weight: 700;
}

.primary-button {
  color: white;
  background: var(--orange);
  box-shadow: 0 8px 18px rgba(255, 107, 24, 0.18);
}

.primary-button:hover {
  background: #ed5d0d;
  transform: translateY(-1px);
}

.secondary-button {
  background: white;
  border: 1px solid var(--line);
}

.ghost-button {
  background: transparent;
  color: var(--muted);
}

.ghost-button:hover {
  background: #f3f1eb;
  color: var(--ink);
}

.danger-button {
  color: var(--red);
  background: var(--red-soft);
}

.content {
  padding: 28px 30px 60px;
  max-width: 1500px;
  margin: 0 auto;
}

.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 24px;
}

.eyebrow {
  color: var(--orange);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.page-head h1 {
  margin: 4px 0 5px;
  font-size: 27px;
  letter-spacing: -0.04em;
}

.page-head p {
  margin: 0;
  color: var(--muted);
}

.head-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.folder-navigation {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 20px;
}

.breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 0;
  color: var(--muted);
  font-size: 12px;
  min-width: 0;
  flex-wrap: wrap;
}

.breadcrumbs button {
  border: 0;
  background: transparent;
  cursor: pointer;
  color: inherit;
  padding: 0;
}

.breadcrumbs button:hover {
  color: var(--orange);
}

.breadcrumbs strong {
  color: var(--ink);
  font-weight: 800;
}

.breadcrumb-arrow {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: #aaa49a;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}

.folder-back-button {
  border: 1px solid var(--line);
  border-radius: 10px;
  min-height: 34px;
  padding: 0 10px;
  background: #fff;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  white-space: nowrap;
}

.folder-back-button:hover {
  color: var(--orange);
  border-color: #efb088;
}

.folder-back-button .ui-icon {
  transform: rotate(180deg);
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
  margin-bottom: 26px;
}

.stat-card {
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(232, 228, 218, 0.85);
  border-radius: var(--radius);
  padding: 17px;
  display: flex;
  gap: 13px;
  align-items: center;
  box-shadow: 0 5px 18px rgba(45, 38, 28, 0.03);
}

.stat-card.clickable {
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.stat-card.clickable:hover {
  transform: translateY(-2px);
  border-color: var(--orange);
  box-shadow: 0 10px 26px rgba(45, 38, 28, 0.1);
}
.stat-card.clickable:active { transform: translateY(0); }

.stat-icon {
  width: 43px;
  height: 43px;
  border-radius: 14px;
  display: grid;
  place-items: center;
}

.stat-icon .ui-icon {
  width: 21px;
  height: 21px;
}

.stat-icon svg {
  width: 22px;
  height: 22px;
  max-width: 22px;
  max-height: 22px;
  stroke-width: 1.8;
}

.tone-orange .stat-icon { background: var(--orange-soft); color: var(--orange); }
.tone-teal .stat-icon { background: var(--teal-soft); color: var(--teal); }
.tone-yellow .stat-icon { background: var(--yellow-soft); color: var(--yellow); }
.tone-purple .stat-icon { background: var(--purple-soft); color: var(--purple); }

.stat-copy small,
.stat-copy strong {
  display: block;
}

.stat-copy small {
  color: var(--muted);
  font-size: 10px;
}

.stat-copy strong {
  font-size: 22px;
  margin-top: 2px;
}

.stat-delta {
  margin-right: auto;
  font-size: 9px;
  color: var(--teal);
  align-self: flex-end;
}

.panel {
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.panel + .panel {
  margin-top: 18px;
}

.panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  padding: 12px 19px;
  border-bottom: 1px solid var(--line);
  gap: 16px;
}

.panel-title {
  display: flex;
  align-items: center;
  gap: 9px;
}

.panel-title h2,
.panel-title h3 {
  font-size: 15px;
  margin: 0;
}

.panel-title .count {
  color: var(--muted);
  background: #f2f0eb;
  border-radius: 20px;
  padding: 2px 8px;
  font-size: 10px;
}

.panel-tools {
  display: flex;
  align-items: center;
  gap: 7px;
}

.mini-search {
  width: 220px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  background: white;
}

.mini-search input {
  border: 0;
  outline: 0;
  min-width: 0;
  width: 100%;
}

.mini-search:focus-within {
  border-color: #f2a562;
  box-shadow: 0 0 0 3px rgba(255, 101, 25, .1);
}

.questions-panel-head {
  align-items: center;
}

.question-code-search {
  width: min(390px, 100%);
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
}

.question-code-search:focus-within {
  border-color: #f0a77e;
  box-shadow: 0 0 0 3px var(--orange-soft);
}

.question-code-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 10px;
}

.question-filter-panel {
  padding: 14px 16px 16px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #fbfaf7, #fff);
}

.question-filter-title,
.question-filter-title > span {
  display: flex;
  align-items: center;
}

.question-filter-title {
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.question-filter-title > span {
  gap: 7px;
}

.question-filter-title .ui-icon {
  width: 16px;
  height: 16px;
  color: var(--orange);
}

.question-filter-title strong {
  font-size: 11px;
}

.question-filter-title b {
  padding: 3px 8px;
  border-radius: 20px;
  background: var(--orange-soft);
  color: #c9510c;
  font-size: 8px;
}

.question-filter-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(125px, 1fr));
  gap: 9px;
}

.question-filter-grid label {
  min-width: 0;
}

.question-filter-grid label > span {
  display: block;
  margin: 0 3px 5px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 700;
}

.question-filter-grid .select-control {
  width: 100%;
  height: 34px;
  min-width: 0;
  font-size: 9px;
}

/* ── فیلتر چندانتخابی ─────────────────────────────── */
.ms-filter {
  position: relative;
  min-width: 0;
}

.ms-label {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0 3px 5px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 700;
}

.ms-label b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14px;
  height: 14px;
  padding: 0 4px;
  border-radius: 20px;
  background: var(--orange-soft);
  color: #c9510c;
  font-size: 8px;
}

.ms-trigger {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 34px;
  min-width: 0;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  text-align: right;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ms-trigger:hover {
  border-color: #d8d2c6;
}

.ms-filter.open .ms-trigger {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(242, 162, 93, 0.18);
}

.ms-ph {
  flex: 1;
  color: #a8a298;
  font-size: 9px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ms-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  flex: 1;
  min-width: 0;
}

.ms-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 4px 2px 7px;
  border-radius: 7px;
  background: #f1f5f3;
  color: #2d766d;
  font-size: 9px;
  font-weight: 700;
}

.ms-chip-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(45, 118, 109, 0.14);
  color: inherit;
  cursor: pointer;
}

.ms-chip-x svg {
  width: 9px;
  height: 9px;
}

.ms-chip-x:hover {
  background: rgba(200, 78, 8, 0.18);
  color: #c84e08;
}

.ms-caret {
  display: inline-flex;
  margin-inline-start: auto;
  color: var(--muted);
  transition: transform 0.18s ease;
}

.ms-caret svg {
  width: 13px;
  height: 13px;
}

.ms-filter.open .ms-caret {
  transform: rotate(180deg);
}

.ms-pop {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  left: 0;
  z-index: 50;
  display: none;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(40, 33, 22, 0.16);
}

.ms-filter.open .ms-pop {
  display: block;
}

.ms-search {
  padding: 2px 2px 6px;
}

.ms-search input {
  width: 100%;
  height: 28px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fbfaf7;
  font-size: 9px;
  font-family: inherit;
}

.ms-search input:focus {
  outline: none;
  border-color: var(--orange);
}

.ms-options {
  max-height: 188px;
  overflow-y: auto;
}

.ms-opt {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border-radius: 7px;
  cursor: pointer;
  font-size: 10px;
  color: #4d4840;
}

.ms-opt:hover {
  background: #faf7f1;
}

.ms-opt.on {
  background: #f1f8f6;
  color: #2d766d;
  font-weight: 700;
}

.ms-opt input {
  accent-color: var(--orange);
  cursor: pointer;
}

.ms-opt span {
  flex: 1;
  min-width: 0;
}

.ms-empty {
  margin: 0;
  padding: 12px;
  text-align: center;
  color: var(--muted);
  font-size: 9px;
}

/* ── باکس فیلترهای انتخاب‌شده ─────────────────────── */
.filter-summary {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid #ece6da;
  border-radius: 12px;
  background: #fbf8f2;
}

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

.filter-summary-head > span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #6a6359;
  font-size: 10px;
  font-weight: 700;
}

.filter-summary-head .ui-icon {
  width: 14px;
  height: 14px;
  color: var(--orange);
}

.filter-summary-head > span b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 5px;
  border-radius: 20px;
  background: var(--orange-soft);
  color: #c9510c;
  font-size: 9px;
}

.filter-summary-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.fs-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 5px 4px 9px;
  border: 1px solid #e7e1d5;
  border-radius: 9px;
  background: #fff;
  font-size: 10px;
  font-weight: 700;
  color: #4d4840;
}

.fs-chip > i {
  font-style: normal;
  font-size: 8px;
  font-weight: 700;
  color: #a59a88;
}

.fs-chip > span {
  color: #2d766d;
}

.fs-chip-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f0eee8;
  color: #8a8377;
  cursor: pointer;
}

.fs-chip-x svg {
  width: 10px;
  height: 10px;
}

.fs-chip-x:hover {
  background: var(--orange-soft);
  color: #c84e08;
}

.folder-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 17px;
}

.folder-grid.list-view {
  grid-template-columns: 1fr;
  gap: 6px;
  padding: 14px 17px 17px;
}

/* ---- ردیف فهرستی پوشه ---- */
.folder-row {
  display: grid;
  grid-template-columns: 30px minmax(120px, 1fr) auto 116px auto;
  align-items: center;
  gap: 14px;
  min-height: 52px;
  padding: 8px 12px 8px 10px;
  border-radius: 12px;
}

.folder-row.is-orderable {
  cursor: pointer;
}

.folder-row:hover {
  transform: none;
  box-shadow: 0 5px 16px rgba(79, 58, 38, 0.07);
}

.folder-row.dragging {
  cursor: grabbing;
}

.folder-row .folder-icon {
  width: 30px;
  height: 25px;
  border-radius: 6px 6px 8px 8px;
  box-shadow: inset 0 -4px 9px rgba(0, 0, 0, 0.06);
}

.folder-row .folder-icon::before {
  width: 14px;
  height: 5px;
  top: -4px;
  right: 2px;
}

.frow-title {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.folder-row h3 {
  margin: 0;
  padding: 0;
  min-width: 0;
  font-size: 12.5px;
  font-weight: 750;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.folder-row .folder-archive-badge {
  margin: 0;
  flex: none;
}

.frow-stats {
  display: grid;
  grid-template-columns: repeat(3, 76px);
  align-items: center;
}

.frow-stats.no-files {
  grid-template-columns: repeat(2, 76px);
}

.frow-stat {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  min-width: 0;
  font-size: 9.5px;
  color: #918a7d;
  white-space: nowrap;
}

.frow-stat b {
  font-size: 11.5px;
  font-weight: 800;
  color: #4b453c;
  font-feature-settings: "ss01";
}

.frow-stat.is-zero b {
  color: #bdb6a9;
  font-weight: 700;
}

.frow-stat i {
  font-style: normal;
}

.frow-time {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  font-size: 9.5px;
  color: #9a958b;
  white-space: nowrap;
}

.frow-time > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.frow-time .ui-icon {
  flex: none;
  width: 12px;
  height: 12px;
  opacity: 0.55;
}

.frow-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

.frow-bank-slot {
  display: flex;
  justify-content: flex-end;
  width: 162px;
}

.frow-bank-slot:empty {
  height: 30px;
}

.folder-bank-control.frow-bank {
  width: 100%;
  margin: 0;
  padding: 6px 9px;
  font-size: 9.5px;
  justify-content: flex-start;
  border-radius: 8px;
}

.folder-bank-control.frow-bank .ui-icon {
  width: 13px;
  height: 13px;
}

.more-button-slot {
  width: 30px;
  height: 30px;
}

/* ---- همگام‌سازی پوشه‌ها بین درس‌ها ---- */
.folder-sync-button {
  position: relative;
}

.folder-sync-button.is-auto {
  border-color: #bfe3d8;
  color: #1c7a68;
  background: #f0faf7;
}

.folder-sync-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--teal, #2d766d);
  box-shadow: 0 0 0 3px rgba(45, 118, 109, 0.16);
}

.fsync-targets {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}

.fsync-target {
  display: grid;
  grid-template-columns: 18px 12px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 9px 11px;
  border: 1px solid var(--line, #ece7dd);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  transition: 0.15s ease;
}

.fsync-target:hover {
  border-color: #efc39f;
  background: #fffaf4;
}

.fsync-target input {
  width: 15px;
  height: 15px;
  accent-color: var(--orange, #ff6718);
  cursor: pointer;
}

.fsync-target-dot {
  width: 11px;
  height: 11px;
  border-radius: 4px;
  background: var(--folder-color, #f4a261);
}

.fsync-target-name {
  min-width: 0;
  font-size: 12px;
  font-weight: 750;
  color: #3c372f;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fsync-target-summary {
  font-size: 9.5px;
  font-weight: 700;
  color: #c06a25;
  white-space: nowrap;
}

.fsync-target.is-clean .fsync-target-summary {
  color: #2d766d;
}

.fsync-options {
  display: grid;
  gap: 11px;
  padding: 12px;
  border: 1px solid var(--line, #ece7dd);
  border-radius: 11px;
  background: #fbfaf7;
}

.fsync-options .switch-row small {
  display: block;
  margin-top: 3px;
  color: var(--muted, #8c8578);
  font-size: 9.5px;
  line-height: 1.7;
}

.icon-button.active {
  color: var(--orange);
  border-color: #efb088;
  background: var(--orange-soft);
}

.folder-sort-button .ui-icon {
  width: 14px;
  height: 14px;
}

.folder-card {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, white, #fcfbf8);
  border-radius: 15px;
  padding: 14px;
  cursor: pointer;
  transition: 0.2s ease;
  position: relative;
  overflow: visible;
}

.folder-card:hover {
  transform: translateY(-3px);
  border-color: #f2b994;
  box-shadow: 0 10px 24px rgba(79, 58, 38, 0.08);
  /* کارت هاور‌شده باید بالای کارت‌های ردیف بعد قرار بگیرد تا پاپ‌آپ زیر متن آن‌ها نرود */
  z-index: 30;
}

.folder-card.dragging {
  opacity: 0.45;
  transform: scale(0.985);
}

.folder-card.drag-over {
  outline: 2px dashed var(--orange);
  outline-offset: 3px;
  border-color: rgba(255, 103, 24, 0.55);
}

.folder-card.drop-after {
  box-shadow: inset -5px 0 0 rgba(255, 103, 24, 0.55), 0 10px 24px rgba(79, 58, 38, 0.08);
}

.folder-grid.list-view .folder-card.drop-after {
  box-shadow: inset 0 -5px 0 rgba(255, 103, 24, 0.55), 0 10px 24px rgba(79, 58, 38, 0.08);
}

.folder-row.drag-over {
  outline-offset: 1px;
}

.folder-card.is-archived {
  background: linear-gradient(145deg, #fff, #f7f3ed);
  border-style: dashed;
  opacity: 0.82;
}

.folder-card.is-archived .folder-icon {
  filter: grayscale(0.35);
}

.folder-archive-badge {
  margin-inline-start: 8px;
  vertical-align: middle;
}

.folder-card.tooltip-ready .folder-tooltip {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.folder-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.folder-icon {
  width: 45px;
  height: 37px;
  border-radius: 8px 8px 11px 11px;
  background: var(--folder-color, #f4a261);
  position: relative;
  box-shadow: inset 0 -6px 12px rgba(0, 0, 0, 0.06);
}

.folder-icon::before {
  content: "";
  position: absolute;
  width: 21px;
  height: 7px;
  top: -5px;
  right: 3px;
  border-radius: 5px 5px 0 0;
  background: inherit;
}

.more-button {
  position: static;
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  border-radius: 7px;
  display: grid;
  place-items: center;
}

.more-button:hover {
  background: #f1efe8;
}

.folder-drag-handle {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: var(--muted);
  opacity: 0.42;
  cursor: grab;
  user-select: none;
  line-height: 1;
  transition: background 0.16s ease, color 0.16s ease, opacity 0.16s ease;
}

.folder-drag-handle:hover,
.folder-card:hover .folder-drag-handle {
  opacity: 0.8;
}

.folder-drag-handle:hover {
  background: #fff5ec;
  color: var(--orange);
}

.folder-drag-handle:active {
  cursor: grabbing;
}

.folder-card h3 {
  margin: 13px 0 3px;
  padding-left: 0;
  font-size: 13px;
}

.folder-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #f0ede6;
  color: var(--muted);
  font-size: 9px;
}

.folder-meta-time {
  margin-right: auto;
  color: #9a958b;
  white-space: nowrap;
  text-align: left;
}

.folder-meta-item {
  white-space: nowrap;
}

.folder-bank-control {
  width: 100%;
  margin-top: 9px;
  padding: 7px 9px;
  border: 1px solid #e8ddcc;
  border-radius: 9px;
  background: #fffaf3;
  color: #8a6f4a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 750;
}
.folder-bank-control:hover { border-color: #efaa7b; color: #c65e1e; background: #fff5eb; }
.folder-bank-control.is-published { border-color: #cce9df; color: #197b68; background: #edf9f5; }
.folder-bank-control .ui-icon { width: 14px; height: 14px; }
.folder-bank-control small { margin-inline-start: auto; color: inherit; opacity: .72; font-size: 9px; }

.folder-tooltip {
  position: absolute;
  z-index: 40;
  width: min(304px, calc(100vw - 24px));
  right: 8px;
  top: calc(100% - 2px);
  background: #282621;
  color: white;
  border-radius: 11px;
  padding: 10px;
  opacity: 0;
  transform: translateY(-5px);
  pointer-events: none;
  transition: 0.16s ease;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
}

.tooltip-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 10px;
}

.tooltip-stats span {
  display: flex;
  justify-content: space-between;
  gap: 7px;
  color: #d1cec7;
  font-size: 9px;
  line-height: 1.55;
}

.tooltip-stats b {
  color: white;
}

.tooltip-users {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid rgba(255,255,255,.12);
  font-size: 9px;
  color: #c7c3ba;
}

.tooltip-access,
.tooltip-rates {
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid rgba(255,255,255,.12);
}

.tooltip-access > strong,
.tooltip-rates > strong {
  display: block;
  color: #fff;
  font-size: 10px;
  margin-bottom: 5px;
}

.tooltip-access-counts {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.tooltip-access-counts span {
  background: rgba(255,255,255,.11);
  border-radius: 6px;
  padding: 2px 6px;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
}

.tooltip-role-list {
  display: grid;
  gap: 3px;
}

.tooltip-role-line {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 6px;
  align-items: start;
  color: #d1cec7;
  font-size: 9px;
}

.tooltip-role-line b {
  color: #fff;
  font-weight: 800;
  white-space: nowrap;
}

.tooltip-role-line span {
  min-width: 0;
  line-height: 1.55;
}

.tooltip-rates > div {
  display: grid;
  gap: 4px;
}

.tooltip-rates span {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 5px 8px;
  align-items: center;
  color: #d1cec7;
  font-size: 9px;
}

.tooltip-rates i {
  font-style: normal;
  color: #fff;
  font-weight: 800;
}

.tooltip-rates b {
  color: #fff;
}

.tooltip-rates small {
  grid-column: 2;
  color: #aaa59a;
  font-size: 8px;
}

.toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.select-control,
.input-control {
  height: 36px;
  border: 1px solid var(--line);
  background: white;
  border-radius: 10px;
  padding: 0 10px;
  outline: none;
  color: #5c5851;
}

.select-control:focus,
.input-control:focus,
.field textarea:focus,
.field input:focus,
.field select:focus {
  border-color: #f0a77e;
  box-shadow: 0 0 0 3px var(--orange-soft);
}

.table-wrap {
  overflow: auto;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 850px;
}

.data-table th {
  color: #9a958b;
  font-size: 10px;
  font-weight: 600;
  text-align: right;
  padding: 11px 14px;
  background: #fbfaf7;
  border-bottom: 1px solid var(--line);
}

.data-table td {
  padding: 13px 14px;
  border-bottom: 1px solid #f1eee8;
  vertical-align: middle;
}

.data-table tbody tr {
  transition: 0.15s ease;
}

.data-table tbody tr:hover {
  background: #fffcf9;
}

.data-table tbody tr:last-child td {
  border-bottom: 0;
}

/* جدول‌های مدیریت حساب: تمام عرض پنل، بدون اسکرول افقی و با ستون‌های کاملاً هم‌راستا */
.management-table-wrap {
  width: 100%;
  overflow: visible;
}
.management-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  direction: rtl;
}
.management-table th,
.management-table td {
  box-sizing: border-box;
  padding-inline: 10px;
  text-align: center;
  overflow-wrap: anywhere;
}
.management-table th:first-child,
.management-table td:first-child {
  text-align: right;
}
.management-table th:last-child,
.management-table td:last-child {
  padding-inline: 5px;
}
.management-table .question-cell {
  min-width: 0;
  max-width: 100%;
}
.management-table .question-cell strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.management-ltr {
  display: inline-block;
  direction: ltr;
  unicode-bidi: isolate;
  white-space: nowrap;
  text-align: center;
}
.management-table .row-action {
  margin: 2px;
}

@media (max-width: 900px) {
  .management-table th,
  .management-table td {
    padding-inline: 5px;
    font-size: 9px;
  }
  .management-table .avatar { width: 28px; height: 28px; }
  .management-table .badge { padding-inline: 6px; white-space: normal; }
}

.question-metadata-table {
  min-width: 1380px;
}

.question-metadata-table th,
.question-metadata-table td {
  padding-right: 10px;
  padding-left: 10px;
}

.question-code {
  border: 0;
  background: transparent;
  padding: 5px 7px;
  border-radius: 7px;
  color: #315eaa;
  direction: ltr;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.question-code:hover {
  color: #c84e08;
  background: var(--orange-soft);
}

.question-value-list,
.question-source-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 80px;
}

.question-value-list > span {
  padding: 4px 10px;
  border-radius: 8px;
  background: #f2f0eb;
  color: #575249;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.question-value-list.lesson-values > span {
  color: #2d766d;
  background: #edf8f6;
}

.question-value-list.book-values > span {
  color: #8a5a1f;
  background: #fdf2e3;
}

.folder-path-cell {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 150px;
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf7;
  color: #5b5650;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.folder-path-cell svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  color: var(--orange);
}

.folder-path-cell span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.folder-path-cell:hover {
  border-color: var(--orange);
  background: var(--orange-soft);
  color: #c84e08;
}

.folder-path-cell:hover svg {
  color: #c84e08;
}

.question-source-list {
  min-width: 130px;
  max-width: 210px;
}

.question-source-list > span {
  display: flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 4px 7px;
  border: 1px solid #e8e3d9;
  border-radius: 8px;
  background: #fffdf9;
}

.question-source-list b {
  max-width: 135px;
  overflow: hidden;
  color: #4d4840;
  font-size: 10px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.question-source-list small {
  color: var(--muted);
  font-size: 8px;
  white-space: nowrap;
}

.difficulty-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.empty-value {
  color: #c5beb4;
}

.check {
  accent-color: var(--orange);
  cursor: pointer;
}

.question-cell {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 290px;
}

.question-thumb {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: #f2f0ea;
  color: #817c72;
  font-weight: 700;
}

.question-cell strong,
.question-cell small {
  display: block;
}

.question-cell strong {
  font-size: 11px;
  max-width: 330px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.question-cell small {
  color: var(--muted);
  font-size: 9px;
  direction: ltr;
  text-align: right;
  margin-top: 3px;
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: 20px;
  padding: 5px 11px;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.badge::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
}

.badge.approved { color: #168878; background: var(--teal-soft); }
.badge.created { color: #3f6fcf; background: var(--blue-soft); }
.badge.pending_review { color: #b27b00; background: var(--yellow-soft); }
.badge.returned_for_correction { color: #c75e15; background: var(--orange-soft); }
.badge.draft { color: #716c64; background: #f0eee8; }
.badge.rejected { color: var(--red); background: var(--red-soft); }
.badge.corrected { color: var(--blue); background: var(--blue-soft); }
.badge.hidden { color: var(--purple); background: var(--purple-soft); }
.badge.archived { color: #7b6a55; background: #f1ece4; }

.difficulty-gauge {
  --gauge-color: var(--teal);
  --gauge-progress: 25;
  --needle-angle: -58deg;
  width: 38px;
  height: 31px;
  display: inline-grid;
  place-items: center;
  border-radius: 10px;
  color: var(--gauge-color);
  background: color-mix(in srgb, var(--gauge-color) 9%, white);
  direction: ltr;
}

.difficulty-gauge svg {
  width: 30px;
  height: 27px;
  overflow: visible;
}

.gauge-track,
.gauge-value {
  fill: none;
  stroke-linecap: round;
  stroke-width: 2.7;
}

.gauge-track { stroke: #dedbd4; }
.gauge-value {
  stroke: currentColor;
  stroke-dasharray: var(--gauge-progress) 100;
}

.gauge-needle {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  transform: rotate(var(--needle-angle));
  transform-origin: 12px 17px;
  transition: transform .2s ease;
}

.gauge-center {
  fill: #fff;
  stroke: currentColor;
  stroke-width: 1.5;
}

.difficulty-gauge.level-1 {
  --gauge-color: #1aa58e;
  --gauge-progress: 25;
  --needle-angle: -58deg;
}

.difficulty-gauge.level-2 {
  --gauge-color: #d59a18;
  --gauge-progress: 50;
  --needle-angle: -20deg;
}

.difficulty-gauge.level-3 {
  --gauge-color: #f2772e;
  --gauge-progress: 75;
  --needle-angle: 22deg;
}

.difficulty-gauge.level-4 {
  --gauge-color: #e5525b;
  --gauge-progress: 100;
  --needle-angle: 58deg;
}

.row-actions {
  display: flex;
  gap: 4px;
}

.row-action {
  border: 0;
  background: transparent;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  color: var(--muted);
  cursor: pointer;
  display: inline-grid;
  place-items: center;
}

.row-action .ui-icon { width: 16px; height: 16px; }

.modal-close .ui-icon {
  width: 15px;
  height: 15px;
}

.chip button .ui-icon,
.tp-chip-rm .ui-icon,
.tp-close .ui-icon {
  width: 14px;
  height: 14px;
}

.row-action:hover {
  color: var(--orange);
  background: var(--orange-soft);
}

.pagination {
  padding: 13px 17px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  color: var(--muted);
  font-size: 10px;
}

.page-buttons {
  margin-right: auto;
  display: flex;
  gap: 4px;
}

.page-buttons button {
  border: 1px solid var(--line);
  background: white;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  cursor: pointer;
}

.page-buttons button.active {
  color: white;
  border-color: var(--orange);
  background: var(--orange);
}

.empty-state {
  padding: 60px 20px;
  text-align: center;
  color: var(--muted);
}

.empty-icon {
  width: 62px;
  height: 62px;
  border-radius: 20px;
  background: var(--orange-soft);
  color: var(--orange);
  display: grid;
  place-items: center;
  margin: 0 auto 12px;
  font-size: 24px;
}
.empty-icon > .ui-icon {
  width: 32px;
  height: 32px;
  stroke-width: 1.9;
}

.empty-state h3 {
  color: var(--ink);
  margin: 0 0 5px;
}

.boot-loading-state p {
  max-width: 520px;
  margin: 0 auto 16px;
  line-height: 1.9;
}

.two-column {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.6fr);
  gap: 18px;
}

/* `.panel + .panel` برای پنل‌های روی‌هم است؛ داخل چیدمان دوستونی، ستون دوم را
   ۱۸px پایین می‌انداخت و چون ارتفاعش ۱۰۰٪ ردیف است، از پایین بیرون می‌زد. */
.two-column > .panel + .panel { margin-top: 0; }

.tree {
  padding: 14px;
}

.tree-node {
  margin: 4px 0;
}

.tree-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 5px 9px;
  border-radius: 10px;
  cursor: pointer;
}

.tree-row:hover {
  background: #f7f5ef;
}

.tree-row.selected {
  background: var(--orange-soft);
  color: #cf530d;
}

.tree-toggle {
  width: 22px;
  color: var(--muted);
  text-align: center;
}

.tree-children {
  margin-right: 24px;
  border-right: 1px dashed #ddd8ce;
  padding-right: 9px;
}

.info-list {
  padding: 8px 18px 18px;
}

.info-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

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

.info-row span {
  color: var(--muted);
}

.info-row > span:last-child {
  min-width: 0;
  max-width: 72%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-tag-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 5px;
  max-width: 68%;
  color: var(--muted);
}

.detail-tag-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  background: #fff4ec;
  border: 1px solid #f1d7c3;
  color: #9f5b1f;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 800;
  white-space: nowrap;
}

.modal-root:empty {
  display: none;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 100;
  background: rgba(30, 28, 24, 0.46);
  backdrop-filter: blur(6px);
  display: grid;
  place-items: center;
  padding: 20px;
}

.modal {
  width: min(680px, 96vw);
  max-height: 92vh;
  /* روی موبایل/تبلت، vh ارتفاعِ «بدون نوار آدرس» است و مودالِ بلند از بالا و پایینِ
     صفحه بیرون می‌زد؛ dvh ارتفاعِ واقعیِ همان لحظه است. روی دسکتاپ چیزی عوض نمی‌شود. */
  max-height: min(92vh, calc(100dvh - 40px));
  overflow: auto;
  overscroll-behavior: contain;   /* اسکرول به پس‌زمینه سرریز نشود */
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 30px 80px rgba(0,0,0,.22);
  animation: modal-in .2s ease;
}

/* وقتی مودال باز است، صفحهٔ پشت اسکرول نمی‌شود (فقط داخلِ پاپ‌آپ) */
body.modal-open { overflow: hidden; }

.modal,
.login-log-list {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.modal::-webkit-scrollbar,
.login-log-list::-webkit-scrollbar {
  display: none;
}

.modal.large {
  width: min(1120px, 97vw);
}

.modal.xlarge {
  width: min(1280px, calc(100vw - 40px));
}

.modal.receipt-modal {
  width: fit-content;
  min-width: min(320px, 92vw);
  max-width: 94vw;
  max-height: 92vh;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto;
}

.modal.receipt-modal::-webkit-scrollbar,
.receipt-viewer-body::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.receipt-viewer-body {
  min-height: 0;
  padding: 14px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #fbfaf7;
  scrollbar-width: none;
}

/* فیش به‌صورت کامل و با حفظ تناسب نمایش داده می‌شود؛ تا حداکثرِ ممکنِ پنجره بزرگ می‌شود ولی کادر را پر نمی‌کند */
.receipt-viewer-img {
  display: block;
  width: auto;
  height: auto;
  max-width: 88vw;
  max-height: calc(92vh - 88px);
  object-fit: contain;
  object-position: center;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 16px 38px rgba(40, 34, 24, .12);
  background: #fff;
}

@keyframes modal-in {
  from { opacity: 0; transform: translateY(12px) scale(.98); }
}

.modal-head {
  position: sticky;
  top: 0;
  z-index: 5;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
  padding: 16px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.modal-head h2 {
  margin: 0;
  font-size: 17px;
}

.modal-close {
  border: 0;
  background: #f2f0ea;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  cursor: pointer;
}

.modal-body {
  padding: 20px;
}

.modal-footer {
  position: sticky;
  bottom: 0;
  z-index: 5;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--line);
  padding: 13px 20px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.modal-footer .left {
  margin-right: auto;
}

/* پای مودال (نسخهٔ کوتاه‌نامِ .modal-foot که در بیشتر پاپ‌آپ‌ها به‌کار می‌رود):
   بدون این قانون دکمه‌ها به لبهٔ کادر می‌چسبیدند. */
.modal-foot {
  position: sticky;
  bottom: 0;
  z-index: 5;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  padding: 13px 20px;
  border-top: 1px solid var(--line);
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(12px);
}
.modal-foot > button { min-height: 42px; }
.modal-foot .left { margin-inline-end: auto; }
@media (max-width: 560px) {
  .modal-foot { padding: 11px 14px; }
  .modal-foot > button { flex: 1 1 140px; justify-content: center; }
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.field.full {
  grid-column: 1 / -1;
}

.field label {
  font-size: 11px;
  font-weight: 700;
}

.required {
  color: var(--red);
}

.field input,
.field select,
.field textarea {
  width: 100%;
  border: 1px solid var(--line);
  outline: 0;
  background: #fff;
  border-radius: 10px;
  min-height: 42px;
  padding: 9px 11px;
}

.field textarea {
  min-height: 90px;
  resize: vertical;
}

.folder-bulk-card {
  border: 1px solid #f1d8c2;
  background: #fffaf5;
  border-radius: 14px;
  padding: 12px;
  display: grid;
  gap: 10px;
  box-shadow: 0 8px 24px rgba(121, 80, 45, .05);
}

.folder-bulk-card:empty {
  display: none;
}

.folder-bulk-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.folder-bulk-head strong {
  font-size: 13px;
  color: #4a3525;
}

.folder-bulk-head small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.8;
}

.folder-bulk-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.folder-bulk-chip {
  position: relative;
  cursor: pointer;
}

.folder-bulk-chip input {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.folder-bulk-chip span {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #eadfce;
  background: #fff;
  color: #6f6255;
  border-radius: 12px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 800;
  transition: .16s ease;
}

.folder-bulk-chip:hover span {
  border-color: #f0b487;
  color: #a45d1f;
  transform: translateY(-1px);
}

.folder-bulk-chip input:checked + span {
  background: #fff0e5;
  border-color: #ffb282;
  color: #c45f18;
  box-shadow: inset 0 0 0 1px rgba(255, 107, 24, .08);
}

.folder-bulk-range {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  align-items: end;
  gap: 10px;
}

.folder-bulk-range label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.folder-bulk-preview {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #f4f1ec;
  color: #7b7064;
  padding: 0 12px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.password-field {
  position: relative;
  display: block;
  width: 100%;
  isolation: isolate;
}

.auth-form .password-field {
  margin-top: 6px;
}

.field .password-field input,
.auth-form .password-field input,
input[data-password-input] {
  direction: ltr;
  text-align: left;
  padding-left: 46px;
  padding-right: 13px;
  font-family: inherit;
  margin-top: 0;
}

.password-toggle {
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
  z-index: 2;
  padding: 0;
  line-height: 1;
  flex: 0 0 auto;
  transform-origin: center;
}

.password-toggle .ui-icon {
  width: 18px;
  height: 18px;
  display: block;
  pointer-events: none;
}

.password-toggle:hover,
.password-toggle.is-visible {
  background: #fff5ec;
  border-color: rgba(255, 103, 24, 0.22);
  color: var(--orange);
}

.password-toggle,
.password-toggle:hover,
.password-toggle:active,
.password-toggle:focus {
  transform: translateY(-50%) !important;
  box-shadow: none;
}

.field small {
  color: var(--muted);
  font-size: 9px;
}

.switch-row {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
}

.switch {
  width: 38px;
  height: 22px;
  border-radius: 20px;
  background: #d8d5ce;
  padding: 3px;
  cursor: pointer;
  transition: .2s;
}

.switch::after {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: white;
  transition: .2s;
  box-shadow: 0 2px 5px rgba(0,0,0,.18);
}

.switch.on {
  background: var(--orange);
}

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

.wizard-layout {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  min-height: 650px;
}

.wizard-side {
  padding: 22px 16px;
  background: #faf9f5;
  border-left: 1px solid var(--line);
}

.wizard-side h3 {
  margin: 0 8px 18px;
  font-size: 13px;
}

.wizard-step {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 9px;
  border-radius: 11px;
  color: var(--muted);
  margin-bottom: 3px;
}

.wizard-step .step-num {
  width: 25px;
  height: 25px;
  flex: 0 0 auto;
  border-radius: 8px;
  background: #ece9e2;
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 800;
}

.wizard-step strong,
.wizard-step small {
  display: block;
}

.wizard-step strong {
  color: inherit;
  font-size: 10px;
}

.wizard-step small {
  font-size: 8px;
  margin-top: 2px;
}

.wizard-step.active {
  background: var(--orange-soft);
  color: #d9570e;
}

.wizard-step.active .step-num {
  color: white;
  background: var(--orange);
}

.wizard-step.done .step-num {
  color: white;
  background: var(--teal);
}

.wizard-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.wizard-content {
  padding: 24px;
  flex: 1;
}

.wizard-content h2 {
  margin: 0 0 5px;
  font-size: 20px;
}

.wizard-content > p {
  margin: 0 0 22px;
  color: var(--muted);
  font-size: 11px;
}

.type-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  width: min(330px, calc(100% - 90px));
  margin: 0;
}

.type-card {
  border: 1px solid var(--line);
  border-radius: 13px;
  min-height: 54px;
  padding: 7px 10px;
  cursor: pointer;
  text-align: right;
  transition: .18s ease;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 8px;
  background: #fff;
  box-shadow: 0 5px 16px rgba(52, 43, 32, .06);
}

.type-card:hover {
  border-color: #f2ad84;
  background: #fffaf6;
}

.type-card.selected {
  border-color: var(--orange);
  background: var(--orange-soft);
  box-shadow: 0 7px 20px rgba(255,107,24,.14), 0 0 0 3px rgba(255,107,24,.08);
}

.type-card span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  margin: 0;
  border-radius: 9px;
  background: #f1efe9;
  font-size: 13px;
  grid-row: 1 / 3;
}

.type-card.selected span {
  background: white;
  color: var(--orange);
}

.type-card strong,
.type-card small {
  display: block;
}

.type-card strong { font-size: 11px; align-self: end; }
.type-card small { font-size: 8px; color: var(--muted); margin-top: 0; align-self: start; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.segmented {
  display: flex;
  background: #f2f0ea;
  padding: 3px;
  border-radius: 10px;
  gap: 2px;
}

.segmented button {
  flex: 1;
  min-height: 36px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  cursor: pointer;
}

.segmented button.active {
  color: #d9570e;
  background: white;
  font-weight: 800;
  box-shadow: 0 2px 7px rgba(35, 30, 24, 0.08);
}

.option-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.question-options-block {
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 14px;
  background: #fbfaf7;
}
.options-block-head h3 { margin: 0; font-size: 13px; }
.options-block-head p { color: var(--muted); font-size: 9px; margin: 3px 0 12px; }
.options-entry-layout { display: grid; grid-template-columns: 118px minmax(0,1fr); gap: 12px; align-items: start; }
.options-entry-layout.image-only { grid-template-columns: 132px; }
.correct-option-picker { display: grid; grid-template-columns: 1fr; gap: 5px; width: 100%; }
.correct-option-picker button {
  border: 1px solid var(--line); background: white; border-radius: 8px; min-height: 32px; padding: 3px 6px; cursor: pointer; font-size: 9px; display: flex; align-items: center; transition: .12s;
}
.correct-option-picker button span {
  width: 21px; height: 21px; display: inline-grid; place-items: center; border-radius: 6px; background: #f0eee8; margin-left: 5px; font-size: 9px; font-weight: 900; flex-shrink: 0;
}
.correct-option-picker button:hover { border-color: #b0d8d2; background: #f5fffe; }
.correct-option-picker button.selected { border-color: #65bdae; background: var(--teal-soft); color: #137f70; font-weight: 800; }
.correct-option-picker button.selected span { background: var(--teal); color: white; }
.locked-field {
  min-height: 48px; border: 1px solid #d9eee9; background: var(--teal-soft); border-radius: 11px; padding: 9px 11px; color: #147e70; font-weight: 800;
}
.locked-field small { display: block; color: #5d938b; font-size: 8px; font-weight: 400; margin-top: 2px; }

.option-key {
  width: 31px;
  height: 31px;
  border-radius: 9px;
  background: #f1efe9;
  display: grid;
  place-items: center;
  font-weight: 800;
}

.option-row input[type="text"] {
  width: 100%;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 10px;
  outline: none;
}

.correct-radio {
  accent-color: var(--teal);
  width: 17px;
  height: 17px;
}

.upload-zone {
  border: 1px dashed #d7d1c6;
  background: #fcfbf8;
  border-radius: 13px;
  padding: 22px;
  text-align: center;
  color: var(--muted);
  cursor: pointer;
}

.upload-zone:hover {
  border-color: var(--orange);
  background: var(--orange-soft);
}

.media-editor {
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  margin: 12px 0 16px;
  background: #fff;
}

.media-editor-head {
  min-height: 49px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  background: #fbfaf7;
}

.media-editor-head strong,
.media-editor-head small {
  display: block;
}

.media-editor-head small {
  color: var(--muted);
  font-size: 8px;
}

.media-drop {
  margin: 12px;
  min-height: 120px;
  border: 1px dashed #d5cfc3;
  background: #fcfbf8;
  border-radius: 12px;
  display: grid;
  place-items: center;
  padding: 20px;
  color: var(--muted);
  text-align: center;
  cursor: pointer;
}

.media-drop:hover,
.media-drop.dragging {
  border-color: var(--orange);
  background: var(--orange-soft);
}

.media-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0 12px 12px;
}

.media-editor .media-list {
  grid-template-columns: 1fr;
}

.explanation-layout-picker {
  display: grid;
  grid-template-columns: minmax(170px, .65fr) minmax(320px, 1.35fr);
  align-items: center;
  gap: 12px 18px;
  margin: 14px 0 18px;
  padding: 14px;
  border: 1px solid #eadfce;
  border-radius: 16px;
  background: linear-gradient(145deg, #fffdfa 0%, #fbf8f2 100%);
}
.explanation-layout-copy strong,
.explanation-layout-copy small {
  display: block;
}
.explanation-layout-copy strong {
  color: #4d3b2a;
  font-size: 12px;
}
.explanation-layout-copy small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 8.5px;
  line-height: 1.8;
}
.explanation-layout-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.explanation-layout-option {
  min-width: 0;
  min-height: 68px;
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 8px;
  border: 1px solid #ded5c8;
  border-radius: 13px;
  background: #fff;
  color: #6f6354;
  text-align: right;
  font: inherit;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.explanation-layout-option:hover {
  border-color: #e7a36f;
  transform: translateY(-1px);
}
.explanation-layout-option.selected {
  border-color: var(--orange);
  background: #fff8f1;
  box-shadow: 0 0 0 3px rgba(255, 105, 24, .09);
}
.explanation-layout-option b,
.explanation-layout-option small {
  display: block;
}
.explanation-layout-option b {
  color: #3e352b;
  font-size: 10.5px;
}
.explanation-layout-option.selected b { color: #d9570e; }
.explanation-layout-option small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 7.5px;
  line-height: 1.6;
}
.layout-option-preview {
  position: relative;
  height: 48px;
  display: grid;
  gap: 3px;
  padding: 5px;
  border: 1px solid #e2d8ca;
  border-radius: 7px;
  background: #fffdfa;
  overflow: hidden;
}
.layout-option-preview i {
  display: block;
  border-radius: 2px;
  background: #d9cfc1;
}
.layout-option-preview.is-horizontal { grid-template-rows: 1fr .7fr .55fr; }
.layout-option-preview.is-vertical {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  direction: rtl;
}
.layout-option-preview.is-vertical::after {
  content: "";
  position: absolute;
  inset-block: 4px;
  inset-inline-start: 50%;
  width: 1px;
  background: #bbad9b;
}
.layout-option-preview.is-vertical i:nth-child(1) { grid-column: 1; grid-row: 1; }
.layout-option-preview.is-vertical i:nth-child(2) { grid-column: 1; grid-row: 2; }
.layout-option-preview.is-vertical i:nth-child(3) { grid-column: 2; grid-row: 1 / 3; }
.explanation-layout-option.selected .layout-option-preview i { background: #ffb07e; }
.vertical-layout-note {
  grid-column: 1 / -1;
  padding: 8px 11px;
  border-radius: 10px;
  background: #fff1e6;
  color: #9a5a1f;
  font-size: 8.5px;
  line-height: 1.8;
}

.media-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: white;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, opacity .16s ease;
}

.media-card.dragging {
  opacity: .55;
  transform: scale(.99);
}

.media-card.drag-over {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(255, 105, 24, .12);
}

.media-card-order {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 8px;
  background: #f6f4ee;
  border-bottom: 1px solid var(--line);
}

.media-drag-handle {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  color: var(--muted);
  background: #fff;
  border: 1px solid var(--line);
  cursor: grab;
  user-select: none;
}

.order-badge {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  margin-inline-end: auto;
  margin-inline-start: 7px;
}

.order-btns {
  display: flex;
  gap: 3px;
}

.order-btn {
  width: 26px;
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: white;
  cursor: pointer;
  font-size: 13px;
  display: grid;
  place-items: center;
  transition: .1s;
}

.order-btn:hover:not(:disabled) {
  border-color: var(--orange);
  color: var(--orange);
  background: var(--orange-soft);
}

.order-btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.media-card img {
  width: 100%;
  height: auto;
  max-height: none;
  display: block;
  object-fit: contain;
  background: #fff;
}

.media-card-body {
  padding: 8px;
}

.media-card-body input {
  width: 100%;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 7px;
  font-size: 10px;
}

.media-card-actions {
  display: flex;
  gap: 3px;
  margin-top: 7px;
}

.image-dimensions {
  padding: 5px 8px;
  border-radius: 8px;
  background: #f6f3ed;
  color: var(--muted);
  font-size: 9px;
  margin: 5px 0;
}

.image-dimensions b {
  color: var(--ink);
}

.media-card-actions button {
  flex: 1;
  height: 30px;
  border: 0;
  border-radius: 7px;
  background: #f2f0ea;
  cursor: pointer;
  font-size: 10px;
}

.media-card-actions button:hover {
  color: var(--orange);
  background: var(--orange-soft);
}

.crop-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
}

.crop-workspace {
  min-width: 0;
}

.crop-stage {
  min-height: 560px;
  height: min(68vh, 720px);
  border-radius: 14px;
  background:
    linear-gradient(45deg, #e0ddd8 25%, transparent 25%),
    linear-gradient(-45deg, #e0ddd8 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #e0ddd8 75%),
    linear-gradient(-45deg, transparent 75%, #e0ddd8 75%), #f2f0ea;
  background-size: 16px 16px;
  background-position: 0 0, 0 8px, 8px -8px, -8px 0;
  display: grid;
  place-items: center;
  overflow: auto;
  padding: 18px;
}

.crop-stage canvas {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
  cursor: crosshair;
  touch-action: none;
}

.crop-help {
  margin-top: 8px;
  color: var(--muted);
  font-size: 10px;
  text-align: center;
}

.crop-controls {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.crop-controls h3 {
  margin: 0;
  font-size: 13px;
}

.crop-section-title {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 6px;
}

.pixel-info {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.pixel-info-card {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}

.pixel-info-card .pcard-label {
  display: block;
  color: var(--muted);
  font-size: 9px;
  margin-bottom: 2px;
}

.pixel-info-card .pcard-value {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
}

.pixel-inputs-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: end;
  gap: 6px;
}

.pixel-input-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pixel-input-field label {
  font-size: 10px;
  color: var(--muted);
  font-weight: 600;
}

.pixel-input-field input {
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 8px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  width: 100%;
}

.pixel-input-field input:focus { border-color: var(--orange); outline: none; }

.aspect-lock-btn {
  width: 30px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 14px;
  color: var(--muted);
  transition: .12s;
  align-self: flex-end;
}

.aspect-lock-btn.locked {
  border-color: var(--orange);
  background: var(--orange-soft);
  color: var(--orange);
}

.range-field {
  margin: 0;
}

.range-field label {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: var(--muted);
  margin-bottom: 4px;
}

.range-field input {
  width: 100%;
  accent-color: var(--orange);
}

.crop-toolbar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.crop-toolbar button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: white;
  cursor: pointer;
  font-size: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  transition: .12s;
}

.crop-toolbar button:hover {
  border-color: #f2ad84;
  color: var(--orange);
  background: var(--orange-soft);
}

.crop-shortcuts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.topic-browser {
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}
.book-tags { margin-top: 18px; border: 1px solid var(--line); border-radius: 14px; padding: 13px; background: #fbfaf7; }
.book-tags-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.book-tags-head strong,.book-tags-head small { display: block; }
.book-tags-head small { color: var(--muted); font-size: 8px; }
.tag-selector { display: flex; flex-wrap: wrap; gap: 7px; }
.tag-choice { border: 1px solid var(--line); background: white; border-radius: 20px; padding: 6px 10px; cursor: pointer; font: inherit; font-size: 9px; color: inherit; }
.tag-choice input { display: none; }
.tag-choice.selected { color: #d9570e; background: var(--orange-soft); border-color: #f1ad83; font-weight: 800; }

.topic-browser-top {
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid var(--line);
  background: #fbfaf7;
}

.topic-browser-top .mini-search {
  flex: 1;
  width: auto;
}

.topic-columns {
  display: grid;
  grid-template-columns: 1.05fr 1fr 1fr 1.25fr;
  min-height: 360px;
}

.topic-column {
  min-width: 0;
  border-left: 1px solid var(--line);
  padding: 9px;
  overflow: auto;
  max-height: 430px;
}

.topic-column:last-child {
  border-left: 0;
}

.topic-column-title {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  padding: 4px 7px 9px;
  position: sticky;
  top: 0;
  background: white;
  z-index: 1;
}

.topic-choice {
  width: 100%;
  min-height: 39px;
  border: 0;
  background: transparent;
  border-radius: 9px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 8px;
  text-align: right;
  cursor: pointer;
  font-size: 10px;
}

.topic-choice:hover {
  background: #f7f5ef;
}

.topic-choice.active {
  color: #d9570e;
  background: var(--orange-soft);
  font-weight: 800;
}

.topic-choice span:last-child {
  margin-right: auto;
  color: #aaa59b;
}

.topic-leaf {
  min-height: 38px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 7px;
  border-radius: 9px;
  cursor: pointer;
  font-size: 10px;
  line-height: 1.7;
}

.topic-leaf:hover {
  background: #f7f5ef;
}

.topic-leaf input {
  margin-top: 4px;
  accent-color: var(--orange);
}

.topic-selected {
  padding: 11px 12px;
  border-top: 1px solid var(--line);
  background: #fbfaf7;
}

.topic-selected > strong {
  display: block;
  font-size: 10px;
  margin-bottom: 7px;
}

.chip-box {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
  min-height: 47px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f0eee8;
  border-radius: 20px;
  padding: 5px 9px;
  font-size: 9px;
}

.chip.primary {
  color: #d9560c;
  background: var(--orange-soft);
}

.chip.topic-chip { align-items: flex-start; padding: 6px 10px; }
.tc-body { display: flex; flex-direction: column; gap: 2px; }
.tc-leaf { font-size: 10px; font-weight: 600; color: #2a2520; line-height: 1.3; }
.tc-ctx { font-size: 8px; color: var(--muted); line-height: 1.3; }

.chip button {
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  padding: 0;
}

.select-tree {
  max-height: 310px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 13px;
  padding: 9px;
}

.select-tree label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-radius: 8px;
  cursor: pointer;
}

.select-tree label:hover {
  background: #f7f5ef;
}

.select-tree .depth-1 { padding-right: 27px; }
.select-tree .depth-2 { padding-right: 48px; }
.select-tree .depth-3 { padding-right: 69px; }

.source-entry {
  display: grid;
  grid-template-columns: 78px minmax(240px, 1.65fr) minmax(155px, .8fr) minmax(130px, .7fr) 42px;
  gap: 10px;
  margin-bottom: 10px;
  align-items: center;
}

.source-primary-pick {
  height: 46px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}

.source-primary-pick input {
  accent-color: var(--orange);
  width: 15px;
  height: 15px;
}

.source-primary-pick:hover,
.source-primary-pick.on {
  border-color: rgba(255, 105, 24, .55);
  background: var(--orange-soft);
  color: var(--orange-dark);
}

.source-entry input:not([type="radio"]),
.source-entry select {
  min-width: 0;
  width: 100%;
  height: 46px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 12px;
  outline: 0;
  background: #fff;
  font-size: 13px;
  font-weight: 700;
}

.source-entry .row-action {
  width: 42px;
  height: 42px;
}

.form-grid .field select,
.form-grid .field input,
.form-grid .field textarea {
  min-height: 46px;
  border-radius: 10px;
  font-size: 13px;
}

.preview-sheet {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 24px;
}

.preview-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 18px;
}

.preview-question {
  font-family: "Vazirmatn", "B Nazanin", Tahoma, sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 2.3;
  margin-bottom: 18px;
}

.preview-image-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 12px 0;
}

.preview-image-figure {
  margin: 0;
}

.preview-upload-image,
.question-detail-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.question-detail-image {
  margin-top: 10px;
}

.preview-image-figure figcaption {
  font-size: 9px;
  color: var(--muted);
  text-align: center;
  margin-top: 5px;
}

.preview-section {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px dashed #dcd7cc;
  font-family: "Vazirmatn", "B Nazanin", Tahoma, sans-serif;
  font-size: 17px;
  font-weight: 500;
  line-height: 2.2;
}

.preview-section h4 {
  margin: 0 0 7px;
  color: var(--orange);
}

.wizard-footer {
  position: sticky;
  bottom: 0;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--line);
  padding: 13px 20px;
  display: flex;
  gap: 8px;
}

.wizard-footer .left {
  margin-right: auto;
}

.question-page {
  padding-bottom: 90px;
}

.question-page-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 20px;
}

.question-page-head h1 {
  margin: 5px 0;
  font-size: 27px;
}

.question-page-head p {
  margin: 0;
  color: var(--muted);
}

.question-head-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.autosave-state {
  color: var(--teal);
  font-size: 10px;
}

.question-page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: 18px;
  align-items: start;
}

.question-form-main {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.question-form-section {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 13px;
  padding: 22px;
  background: rgba(255,255,255,.9);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(46,39,29,.035);
  scroll-margin-top: 92px;
}

.question-structure-section {
  margin-top: 0;
  padding-top: 22px;
}

.question-structure-section .type-cards {
  position: static;
  margin: 0 0 18px;
}

.section-number {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #d9570e;
  background: var(--orange-soft);
  font-weight: 900;
}

.section-content {
  min-width: 0;
}

.section-content > h2 {
  margin: 0 0 4px;
  font-size: 18px;
}

.section-content > p {
  color: var(--muted);
  margin: 0 0 18px;
  font-size: 10px;
}

.question-form-nav {
  position: sticky;
  top: 92px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  padding: 12px;
  box-shadow: var(--shadow);
}

.question-form-nav > strong {
  display: block;
  padding: 4px 7px 10px;
  font-size: 11px;
}

.question-form-nav > button {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #625e56;
  text-decoration: none;
  padding: 8px;
  border-radius: 9px;
  font-size: 10px;
  border: 0;
  background: transparent;
  width: 100%;
  cursor: pointer;
}

.question-form-nav > button:hover {
  color: #d9570e;
  background: var(--orange-soft);
}

.question-form-nav > button span {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: #f0eee8;
  font-weight: 800;
}

.question-form-nav > button.done {
  color: #168878;
}

.question-form-nav > button.done span {
  background: var(--teal-soft);
  color: #168878;
}

.question-form-nav > button.done::after {
  content: "✓";
  margin-inline-start: auto;
  font-size: 12px;
  font-weight: 900;
  color: #1aa088;
}

.qa-summary {
  margin: 10px 2px 4px;
  padding: 7px 9px;
  border-radius: 9px;
  background: #f0eee8;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  text-align: center;
}

.qa-summary.all-done {
  background: var(--teal-soft);
  color: #168878;
}

/* ── درس‌های مجاز پوشه ─────────────────────────────── */
.lesson-allow-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.lesson-allow-choice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  font-size: 11px;
  font-weight: 700;
  color: #5b5650;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.lesson-allow-choice:hover {
  border-color: #d8d2c6;
}

.lesson-allow-choice.on {
  border-color: var(--teal);
  background: var(--teal-soft);
  color: #168878;
}

.lesson-allow-choice input {
  width: 15px;
  height: 15px;
  min-height: 0;
  flex: none;
  margin: 0;
  padding: 0;
  border-radius: 4px;
  accent-color: var(--teal);
  cursor: pointer;
}

.lesson-scope-note {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 14px;
  padding: 9px 12px;
  border: 1px solid #e7eef0;
  border-radius: 10px;
  background: #f1f8f6;
  color: #2d766d;
  font-size: 11px;
}

.lesson-scope-note .ui-icon {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
}

.lesson-scope-note b {
  color: #168878;
}

/* ── دسترسی پوشه‌محور ─────────────────────────────── */
.modal-hint {
  margin: 0 0 12px;
  padding: 9px 12px;
  border-radius: 10px;
  background: #f1f8f6;
  color: #2d766d;
  font-size: 11px;
  line-height: 1.7;
}

.modal-hint b { color: #168878; }

.access-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}

.access-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
}

.access-row-main {
  display: flex;
  align-items: center;
  gap: 9px;
}

.access-row-main strong { font-size: 12px; }
.access-row-main small { display: block; margin-top: 3px; }

.access-row-scope {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
}

.access-direct { color: #2d766d; font-weight: 700; }

.access-inherit {
  padding: 4px 9px;
  border-radius: 7px;
  background: #fbf3e2;
  color: #9a7a2a;
  font-weight: 700;
}

.access-empty {
  padding: 18px;
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  border: 1px dashed var(--line);
  border-radius: 11px;
  margin-bottom: 16px;
}

.access-add {
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.access-add > strong { display: block; margin-bottom: 9px; font-size: 12px; }

.access-add-row {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 8px;
}

.access-add-row .select-control { height: 38px; }

.row-action.danger:hover { color: var(--red); }

.tooltip-access {
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.tooltip-access > strong {
  display: block;
  font-size: 10px;
  margin-bottom: 5px;
  opacity: 0.85;
}

.tooltip-access-counts {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 5px;
}

.tooltip-access-counts span {
  padding: 2px 7px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.14);
  font-size: 9px;
  font-weight: 700;
}

.tooltip-access > small { opacity: 0.75; font-size: 9px; }

.tag-admin-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.sortable-tags { margin-top: 12px; }
.sortable-tag { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); padding: 8px 3px; font-size: 10px; }
.sortable-tag button { border: 0; background: #f1efe9; border-radius: 6px; cursor: pointer; margin-right: 3px; }
.curriculum-admin { display: flex; flex-direction: column; gap: 16px; }
.curriculum-card .curriculum-tree { padding: 12px 14px; }

.tree-node { position: relative; }

.tree-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border-radius: 9px;
  cursor: default;
  transition: background .1s;
  min-height: 38px;
}

.tree-chapter-row {
  background: var(--orange-soft);
  color: #c8510d;
  border-radius: 10px;
  margin-bottom: 2px;
  font-size: 13px;
}

.tree-section-row {
  background: #f5f3ee;
  border-radius: 9px;
  margin-bottom: 1px;
  font-size: 12px;
}

.tree-item-row {
  font-size: 11px;
  color: var(--ink);
}

.tree-item-row:hover, .tree-section-row:hover { background: #eeeae2; }
.tree-chapter-row:hover { background: #fde8d6; }

.drag-handle {
  cursor: grab;
  color: #bbb;
  font-size: 14px;
  flex-shrink: 0;
  padding: 0 2px;
  user-select: none;
  letter-spacing: -1px;
}

.drag-handle:hover { color: var(--orange); }

.tree-toggle {
  width: 20px;
  height: 20px;
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 11px;
  display: grid;
  place-items: center;
  color: var(--muted);
  flex-shrink: 0;
  border-radius: 4px;
  transition: .1s;
}

.tree-toggle:hover { background: rgba(0,0,0,.08); color: var(--ink); }
.tree-toggle.open { color: var(--orange); }

.tree-label { flex: 1; min-width: 0; }

.tree-bullet { color: var(--muted); font-size: 10px; flex-shrink: 0; }

.badge-sm {
  font-size: 9px;
  padding: 2px 7px;
  border-radius: 20px;
  background: rgba(0,0,0,.06);
  color: var(--muted);
  white-space: nowrap;
  flex-shrink: 0;
}

.tree-chapter-row .badge-sm { background: rgba(255,107,24,.15); color: #c8510d; }

.tree-acts {
  display: flex;
  gap: 3px;
  opacity: 0;
  transition: opacity .1s;
  flex-shrink: 0;
}

.tree-row:hover .tree-acts { opacity: 1; }

.tree-acts button {
  height: 26px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: white;
  cursor: pointer;
  font-size: 10px;
  transition: .1s;
  white-space: nowrap;
}

.tree-acts button:hover { border-color: var(--orange); color: var(--orange); }
.btn-danger { color: #e05252 !important; }
.btn-danger:hover { border-color: #e05252 !important; background: #fff5f5 !important; }

.tree-children {
  margin-right: 28px;
  padding-right: 10px;
  border-right: 2px solid #e8e3d9;
  margin-top: 2px;
  margin-bottom: 4px;
}

.tree-children.closed { display: none; }

.tree-sections-wrap {
  margin-right: 28px;
  padding-right: 10px;
  border-right: 2px solid #f0c090;
}

.tree-empty-hint {
  padding: 8px 10px;
  color: var(--muted);
  font-size: 10px;
}

.tree-row.dragging { opacity: .4; }
.tree-row.drag-over { outline: 2px dashed var(--orange); outline-offset: -2px; background: var(--orange-soft) !important; }

/* ── Wizard topic tree browser ─────────────────────────────── */
/* ── Step-4 topic trigger card ── */
.topic-trigger-card {
  border: 1.5px solid var(--line);
  border-radius: 14px;
  padding: 14px 16px;
  margin-top: 14px;
  background: #faf8f4;
  transition: border-color .15s, box-shadow .15s;
}
.topic-trigger-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.topic-trigger-head strong { font-size: 13px; font-weight: 700; display: block; }
.topic-trigger-head p { font-size: 11px; color: var(--muted); margin: 2px 0 0; }

.topic-path-list {
  margin-top: 16px;
  padding: 14px;
  border: 1px solid #ebe5da;
  border-radius: 16px;
  background: rgba(255,255,255,.82);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.topic-path-item {
  position: relative;
  padding-top: 18px;
}

.topic-path-track {
  direction: rtl;
  display: flex;
  align-items: center;
  min-width: 0;
  overflow: hidden;
  scrollbar-width: none;
  border: 1px solid #dcd6cb;
  border-radius: 999px;
  background: #fbfaf7;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}

.topic-path-track::-webkit-scrollbar {
  display: none;
}

.topic-path-segment {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 0;
  border-left: 0;
  border-inline-start: 1px solid #ded8cd;
  background: transparent;
  color: #635e56;
  white-space: nowrap;
  position: relative;
}

.topic-path-segment b {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1.2;
}

.topic-path-segment:first-child {
  border-radius: 0 999px 999px 0;
}

.topic-path-segment:nth-child(even) { background: rgba(246, 244, 238, .82); }

.topic-path-segment.segment-1 {
  flex-basis: 26%;
}

.topic-path-segment.segment-2 {
  flex-basis: 28%;
}

.topic-path-segment:last-of-type {
  border-radius: 999px 0 0 999px;
  flex-basis: 46%;
  background: #deddd9;
  color: #292621;
}

.topic-path-segment:last-of-type b {
  font-weight: 900;
}

.topic-path-remove {
  width: 28px;
  height: 28px;
  margin-inline: 7px;
  border: 0;
  border-radius: 10px;
  background: #f3f0ea;
  color: #8c857a;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
}

.topic-path-remove:hover {
  color: #d9570e;
  background: var(--orange-soft);
}

.topic-path-remove .ui-icon {
  width: 14px;
  height: 14px;
}

.topic-path-tooltip {
  position: absolute;
  z-index: 8;
  bottom: calc(100% + 7px);
  right: 42px;
  max-width: min(760px, calc(100vw - 140px));
  overflow: visible;
  white-space: nowrap;
  padding: 8px 12px;
  border: 1px solid rgba(235, 191, 74, .62);
  border-radius: 8px;
  background: #ffe16a;
  color: #45351f;
  box-shadow: 0 10px 22px rgba(98, 73, 30, .16);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.7;
  word-spacing: 0;
  opacity: 0;
  transform: translateY(7px) scale(.98);
  pointer-events: none;
  transition: opacity .18s ease, transform .22s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.topic-path-tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  right: 26px;
  border: 7px solid transparent;
  border-top-color: #ffe16a;
  filter: drop-shadow(0 4px 3px rgba(98,73,30,.08));
}

.topic-path-item:hover .topic-path-tooltip,
.topic-path-item:focus-within .topic-path-tooltip {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: none;
}

/* ── Topic picker popup ── */
.modal-root:not(:empty) {
  position: relative;
  z-index: 100000;
}
.tp-overlay {
  position: fixed;
  inset: 0;
  background: rgba(20,18,14,0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}
.tp-overlay.tp-visible { opacity: 1; pointer-events: all; }
.tp-overlay.tp-visible .tp-modal { transform: translateY(0) scale(1); opacity: 1; }

.tp-modal {
  background: #fff;
  border-radius: 22px;
  width: 100%;
  max-width: 980px;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.28), 0 4px 24px rgba(0,0,0,.1);
  transform: translateY(24px) scale(0.97);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.34,1.38,0.64,1), opacity 0.22s ease;
}
.tp-tree-loading,
.tp-tree-error {
  min-height: 220px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 10px;
  padding: 28px;
  color: #756b5d;
  text-align: center;
}
.tp-tree-loading span {
  width: 26px;
  height: 26px;
  border: 3px solid #eee5d8;
  border-top-color: var(--orange);
  border-radius: 50%;
  animation: tp-tree-spin .7s linear infinite;
}
.tp-tree-loading b,
.tp-tree-error b { font-size: 12px; }
.tp-tree-error span { color: var(--muted); font-size: 10px; }
@keyframes tp-tree-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .tp-tree-loading span { animation: none; border-top-color: #bca98f; }
}

/* Header */
.tp-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  border-bottom: 1px solid #ede8de;
  background: #faf8f4;
  flex-shrink: 0;
}
.tp-title { font-size: 14px; font-weight: 700; color: #1a1814; flex-shrink: 0; }
.tp-search-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 7px;
  background: #fff;
  border: 1.5px solid #e0dbd0;
  border-radius: 10px;
  padding: 7px 12px;
  transition: border-color .15s, box-shadow .15s;
}
.tp-search-wrap:focus-within { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255,107,24,.1); }
.tp-search-wrap input { border: none; outline: none; background: transparent; font-family: inherit; font-size: 12px; width: 100%; color: #1a1814; }
.tp-search-icon { width: 16px; height: 16px; color: #8f8779; flex: 0 0 16px; }
.tp-close {
  width: 34px; height: 34px; border: none; background: none;
  font-size: 20px; cursor: pointer; border-radius: 9px; color: #a09080;
  display: flex; align-items: center; justify-content: center;
  transition: background .12s, color .12s; flex-shrink: 0;
}
.tp-close:hover { background: #f0ece2; color: #1a1814; }

/* Body: tree + sidebar */
.tp-body { display: flex; flex: 1; overflow: hidden; }

.tp-tree {
  flex: 1;
  overflow-y: auto;
  padding: 10px 8px;
  min-width: 0;
}
.tp-tree::-webkit-scrollbar { width: 5px; }
.tp-tree::-webkit-scrollbar-thumb { background: #e0dbd0; border-radius: 10px; }

.tp-sidebar-panel {
  width: 240px;
  min-width: 200px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #ede8de;
  background: #faf8f4;
  overflow: hidden;
}
.tp-sidebar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid #ede8de;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}
.tp-chips-list { flex: 1; overflow-y: auto; padding: 10px 10px 14px; }
.tp-chip {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  background: #fff;
  border: 1px solid #e0dbd0;
  border-radius: 9px;
  padding: 7px 9px;
  margin-bottom: 6px;
  font-size: 10.5px;
  line-height: 1.4;
  transition: border-color .12s, box-shadow .12s;
}
.tp-chip:hover { border-color: var(--orange); box-shadow: 0 1px 6px rgba(255,107,24,.1); }
.tp-chip-lbl { flex: 1; color: #3a3530; display: flex; flex-direction: column; gap: 3px; }
.tp-chip-lbl { min-width: 0; }
.tp-chip-leaf,
.tp-chip-ctx {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tp-chip-leaf { font-weight: 600; color: #2a2520; font-size: 11px; line-height: 1.4; }
.tp-chip-ctx { font-size: 9px; color: var(--muted); line-height: 1.3; }
.tp-chip-rm { border: none; background: none; color: #c0b8a8; cursor: pointer; font-size: 16px; line-height: 1; padding: 0; flex-shrink: 0; transition: color .1s; margin-top: 2px; }
.tp-chip-rm:hover { color: #e04000; }
.tp-empty-sel { text-align: center; padding: 28px 10px; color: var(--muted); }
.tp-empty-sel p { font-size: 11.5px; font-weight: 600; margin: 0 0 4px; }
.tp-empty-sel small { font-size: 10px; }

/* Footer */
.tp-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  padding: 12px 18px;
  border-top: 1px solid #ede8de;
  background: #faf8f4;
  flex-shrink: 0;
}
.tp-count-label { font-size: 11px; color: var(--muted); }

/* ── wt-* tree component (used inside .tp-tree) ── */
.tp-tree .wt-node { position: relative; }
.tp-tree .wt-ch {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.24s cubic-bezier(0.4,0,0.2,1), opacity 0.2s ease;
  opacity: 0;
  margin-right: 14px;
  padding-right: 8px;
  border-right: 2px solid #ede8de;
}
.tp-tree .wt-ch.open { grid-template-rows: 1fr; opacity: 1; }
.tp-tree .wt-ch-inner { overflow: hidden; min-height: 0; }
.tp-tree .wt-row {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border-radius: 9px;
  cursor: pointer;
  transition: background .1s;
  user-select: none;
  min-height: 34px;
}
.tp-tree .wt-row:hover { background: #f5f1eb; }
.tp-tree .wt-row.has-sel > .wt-lbl { color: var(--orange); }
.tp-tree .wt-row.has-sel > .wt-arr { color: var(--orange); }
.tp-tree .wt-leaf { cursor: default; }
.tp-tree .wt-leaf:hover { background: #f6f2ec; }
.tp-tree .wt-leaf.wt-sel { background: var(--orange-soft); }
.tp-tree .wt-leaf.wt-sel .wt-lbl { color: #c85000; font-weight: 600; }
.tp-tree .wt-arr { font-size: 10px; color: #c0b8a8; width: 16px; text-align: center; flex-shrink: 0; line-height: 1; transition: color .15s; }
.tp-tree .wt-arr.open { color: var(--orange); }
.tp-tree .wt-arr-placeholder { width: 16px; flex-shrink: 0; }
.tp-tree .wt-lbl {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.45;
  color: #1a1814;
}
.tp-tree .wt-badge { background: var(--orange); color: #fff; font-size: 9px; font-weight: 700; padding: 1px 8px; border-radius: 20px; flex-shrink: 0; }
.tp-tree .wt-cnt { font-size: 10px; color: #c0bab0; flex-shrink: 0; white-space: nowrap; }
.tp-tree .wt-cb { display: flex; align-items: center; flex-shrink: 0; padding: 3px 2px; cursor: pointer; }
.tp-tree .wt-cb input { width: 14px; height: 14px; accent-color: var(--orange); cursor: pointer; }
.tp-tree .wt-empty { font-size: 10.5px; color: var(--muted); padding: 4px 10px; margin: 0; }
/* Level font weights (type names as stored in topicNodes) */
.tp-tree .wt-row-education > .wt-lbl { font-weight: 700; font-size: 13.5px; }
.tp-tree .wt-row-grade > .wt-lbl { font-weight: 700; font-size: 13px; }
.tp-tree .wt-row-field > .wt-lbl { font-weight: 600; font-size: 12.5px; }
.tp-tree .wt-row-lesson > .wt-lbl { font-size: 12px; }
.tp-tree .wt-row-book > .wt-lbl { color: #b84500; font-weight: 600; }
.tp-tree .wt-row-chapter > .wt-lbl { font-size: 12px; }
.tp-tree .wt-row-section > .wt-lbl { font-size: 11.5px; }
.tp-tree .wt-row-item > .wt-lbl,
.tp-tree .wt-leaf > .wt-lbl { font-size: 11px; color: #555; }

/* ── کاوشگر ساختار: نقشه مباحث / منابع / برچسب‌ها ──
   هم‌زبان با پاپ‌آپ «انتخاب موضوع» (.tp-tree .wt-*): ردیف‌های سبک، بازوبستهٔ نرم
   و عملیاتی که فقط روی ردیفِ زیرِ نشانگر دیده می‌شوند. */
.stx-page { max-width: 1180px; margin: 0 auto; }
.stx-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.stx-eyebrow { font-size: 10px; font-weight: 800; color: var(--orange); letter-spacing: .04em; }
.stx-head h1 { margin: 5px 0 5px; font-size: 26px; letter-spacing: -.04em; }
.stx-head p { margin: 0; color: var(--muted); font-size: 11.5px; }
.stx-tabs {
  display: flex;
  gap: 3px;
  flex: 0 0 auto;
  padding: 4px;
  border: 1px solid #e7e1d7;
  border-radius: 13px;
  background: #f5f1eb;
}
.stx-tab {
  border: none;
  background: none;
  font: inherit;
  font-size: 11.5px;
  font-weight: 750;
  color: #6d645a;
  padding: 7px 15px;
  border-radius: 10px;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.stx-tab:hover { color: #2a2520; }
.stx-tab.on { background: #fff; color: var(--orange); box-shadow: 0 2px 6px rgba(55, 42, 27, .08); }

.stx-panel {
  border: 1px solid #e2dbd1;
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 14px 38px rgba(53, 43, 30, .06);
}
.stx-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 11px 12px;
  border-bottom: 1px solid #ece6dd;
  background: #fbfaf8;
}
.stx-search {
  flex: 1 1 240px;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 11px;
  border: 1.5px solid #e0dbd0;
  border-radius: 11px;
  background: #fff;
  color: #978b7d;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.stx-search:focus-within { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 107, 24, .1); }
.stx-search .ui-icon { width: 16px; height: 16px; flex: 0 0 16px; }
.stx-search input {
  min-width: 0;
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #28231e;
  font: inherit;
  font-size: 11.5px;
}
.stx-search > button {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: #f4efe9;
  color: #887b6e;
  cursor: pointer;
}
.stx-search > button:hover { background: #ece5dc; color: #3f3832; }
.stx-search > button .ui-icon { width: 13px; height: 13px; }
.stx-count { font-size: 10px; font-weight: 750; color: #8a7f72; white-space: nowrap; }
.stx-bar-acts { display: flex; align-items: center; gap: 6px; margin-inline-start: auto; }
.stx-tool {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid #e1d9ce;
  border-radius: 9px;
  background: #fff;
  color: #61584f;
  font: inherit;
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
  transition: .16s ease;
}
.stx-tool:hover { border-color: #efb48d; color: #ba5418; background: #fff9f5; }
.stx-tool .ui-icon { width: 14px; height: 14px; }
.stx-add { min-height: 34px; font-size: 11px; }

.stx-tree { padding: 10px 10px 18px; }
.stx-node { position: relative; }
.stx-ch {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows .24s cubic-bezier(.4, 0, .2, 1), opacity .2s ease;
  margin-inline-start: 15px;
  padding-inline-start: 9px;
  border-inline-start: 2px solid #f0ebe2;
}
.stx-ch.open { grid-template-rows: 1fr; opacity: 1; }
.stx-ch-inner { overflow: hidden; min-height: 0; }
.stx-row {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 5px 9px;
  border-radius: 10px;
  cursor: grab;
  user-select: none;
  transition: background .12s ease, box-shadow .12s ease, opacity .12s ease;
}
.stx-row:active { cursor: grabbing; }
.stx-row:hover { background: #f7f3ed; }
.stx-row.dragging { opacity: .4; }
.stx-row.drag-over-before { box-shadow: inset 0 2px 0 var(--orange); }
.stx-row.drag-over-after { box-shadow: inset 0 -2px 0 var(--orange); }
.stx-arr {
  width: 16px;
  flex: 0 0 16px;
  text-align: center;
  font-size: 10px;
  line-height: 1;
  color: #c0b8a8;
  transition: color .15s ease;
}
.stx-row:hover .stx-arr { color: var(--orange); }
.stx-arr-ph { width: 16px; flex: 0 0 16px; }
.stx-lbl {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.45;
  color: #1a1814;
}
.stx-lbl mark { background: #ffe2c9; color: #a94410; border-radius: 3px; padding: 0 1px; }
.stx-cnt {
  font-size: 9.5px;
  font-weight: 750;
  color: #a89f93;
  background: #f3efe8;
  border-radius: 999px;
  padding: 2px 7px;
  flex-shrink: 0;
  white-space: nowrap;
}
.stx-meta { display: inline-flex; align-items: center; gap: 4px; flex-shrink: 0; max-width: 45%; overflow: hidden; }
.stx-logo { width: 20px; height: 20px; flex: 0 0 20px; display: inline-flex; align-items: center; justify-content: center; }
.stx-logo svg, .stx-logo img { width: 100%; height: 100%; object-fit: contain; }
.stx-acts {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-shrink: 0;
  margin-inline-start: auto;
  opacity: 0;
  transition: opacity .14s ease;
}
.stx-row:hover .stx-acts,
.stx-row:focus-within .stx-acts { opacity: 1; }
.stx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 27px;
  padding: 0 8px;
  border: 1px solid #e5ded4;
  border-radius: 8px;
  background: #fff;
  color: #665d54;
  font: inherit;
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color .14s ease, background .14s ease, color .14s ease;
}
.stx-btn .ui-icon { width: 14px; height: 14px; }
.stx-btn:hover { border-color: #cfc3b6; background: #f4efe9; color: #2f2a25; }
.stx-btn:disabled { opacity: .35; cursor: default; }
.stx-btn:disabled:hover { border-color: #e5ded4; background: #fff; color: #665d54; }
.stx-btn-add { border-color: #f0cbb1; background: #fff6ef; color: #bf571d; }
.stx-btn-add:hover { border-color: #e8aa7e; background: #ffe8d8; color: #a94410; }
.stx-btn-del:hover { border-color: #e6b9b6; background: #fff1f0; color: #b33c3c; }

/* سطح‌های درخت — همان سلسله‌مراتبِ تایپوگرافیکِ پاپ‌آپ انتخاب موضوع */
.stx-row-education > .stx-lbl { font-weight: 800; font-size: 13.5px; }
.stx-row-grade > .stx-lbl { font-weight: 750; font-size: 13px; }
.stx-row-field > .stx-lbl { font-weight: 700; font-size: 12.5px; }
.stx-row-lesson > .stx-lbl { font-weight: 650; font-size: 12px; }
.stx-row-book > .stx-lbl { color: #b84500; font-weight: 700; }
.stx-row-chapter > .stx-lbl { font-size: 12px; }
.stx-row-section > .stx-lbl { font-size: 11.5px; }
.stx-row-item > .stx-lbl { font-size: 11px; color: #5b544c; }
.stx-row-source-type > .stx-lbl { font-weight: 800; font-size: 13px; }
.stx-row-source > .stx-lbl { font-size: 12px; }
.stx-row-lesson-def > .stx-lbl { font-weight: 750; font-size: 13px; }
.stx-row-tag > .stx-lbl { font-size: 11.5px; color: #5b544c; }

.stx-empty { margin: 0; padding: 5px 11px; font-size: 10.5px; color: #c0b8ae; font-style: italic; }
.stx-blank {
  margin: 8px 0;
  padding: 40px 24px;
  text-align: center;
  color: var(--muted);
  font-size: 12px;
  background: #faf9f6;
  border: 1.5px dashed #e0d9cf;
  border-radius: 14px;
}
.stx-extra:empty { display: none; }
.stx-side-card {
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid #e2dbd1;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(53, 43, 30, .04);
}
.stx-side-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.stx-side-head strong { display: block; font-size: 13px; }
.stx-side-head small { display: block; color: var(--muted); font-size: 10px; margin-top: 2px; }

@media (hover: none) {
  .stx-acts { opacity: 1; }
}
@media (max-width: 720px) {
  .stx-head { align-items: flex-start; }
  .stx-tabs { width: 100%; }
  .stx-tab { flex: 1; padding: 7px 6px; }
  .stx-bar-acts { margin-inline-start: 0; width: 100%; }
  .stx-add { margin-inline-start: auto; }
  .stx-meta { display: none; }
  /* در عرض کم، عنوانِ ردیف اولویت دارد: تورفتگی کمتر، دکمه‌های جمع‌وجورِ همیشه‌پیدا */
  .stx-tree { padding: 8px 6px 14px; }
  .stx-ch { margin-inline-start: 7px; padding-inline-start: 5px; }
  .stx-row { padding: 5px 6px; gap: 5px; }
  .stx-acts { opacity: 1; gap: 2px; }
  .stx-btn { padding: 0 6px; min-height: 26px; }
  .stx-cnt { padding: 2px 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .stx-ch { transition: none; }
}

.folder-context {
  border-top: 1px solid var(--line);
  margin-top: 10px;
  padding: 12px 7px 4px;
}

.folder-context small,
.folder-context strong,
.folder-context span {
  display: block;
}

.folder-context small,
.folder-context span {
  color: var(--muted);
  font-size: 8px;
}

.folder-context strong {
  font-size: 10px;
  margin: 3px 0 7px;
}

.question-save-bar {
  position: fixed;
  z-index: 30;
  bottom: 16px;
  left: 30px;
  right: 274px;
  max-width: 1210px;
  margin: auto;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 14px;
  border: 1px solid rgba(224,219,209,.9);
  border-radius: 16px;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(18px);
  box-shadow: 0 16px 45px rgba(38,32,25,.15);
}

.question-save-bar > div {
  margin-left: auto;
}

.question-save-bar strong,
.question-save-bar span {
  display: block;
}

.question-save-bar strong {
  font-size: 11px;
}

.question-save-bar span {
  color: var(--muted);
  font-size: 8px;
  margin-top: 2px;
}

.question-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
}

.detail-main,
.detail-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.detail-card {
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 16px;
}

.detail-card h3 {
  font-size: 12px;
  margin: 0 0 12px;
}

.timeline {
  position: relative;
  padding-right: 20px;
}

.timeline::before {
  content: "";
  position: absolute;
  right: 5px;
  top: 7px;
  bottom: 7px;
  width: 1px;
  background: #dedad1;
}

.timeline-item {
  position: relative;
  padding: 0 0 16px;
}

.timeline-item::before {
  content: "";
  position: absolute;
  right: -20px;
  top: 5px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--orange);
  border: 3px solid #fff0e7;
}

.timeline-item strong,
.timeline-item small {
  display: block;
}

.timeline-item strong { font-size: 10px; }
.timeline-item small { font-size: 9px; color: var(--muted); margin-top: 2px; }

/* رنگ نقطهٔ تایم‌لاین بر اساس نوع رویداد بازبینی */
.timeline-item.tl-approved::before { background: #168878; border-color: var(--teal-soft); }
.timeline-item.tl-returned_for_correction::before { background: #c75e15; border-color: var(--orange-soft); }
.timeline-item.tl-rejected::before { background: var(--red); border-color: var(--red-soft); }
.timeline-item.tl-pending_review::before { background: #b27b00; border-color: var(--yellow-soft); }
.timeline-item.tl-corrected::before { background: var(--blue); border-color: var(--blue-soft); }
.timeline-item.tl-draft::before,
.timeline-item.tl-hidden::before,
.timeline-item.tl-neutral::before { background: #b6afa2; border-color: #f0eee8; }

.tl-reason {
  display: block;
  margin-top: 3px;
  padding: 5px 8px;
  border-radius: 7px;
  background: #faf7f1;
  border-right: 2px solid #e6ddcc;
  color: #6a6359;
  font-size: 9px;
  line-height: 1.7;
}

.timeline-empty {
  margin: 0;
  padding: 14px;
  text-align: center;
  color: var(--muted);
  font-size: 10px;
}

/* ── صفحهٔ ورود مدیران ─────────────────────────────── */
.auth-gate[hidden] { display: none !important; }

.auth-gate {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: linear-gradient(160deg, #f7f6f2, #efeae0);
}

.auth-card {
  width: 100%;
  max-width: 380px;
  padding: 28px 26px 22px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(40, 33, 22, 0.16);
}

.auth-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 22px;
}

.auth-brand .brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: var(--orange);
  display: grid;
  place-items: center;
}

.auth-brand .brand-mark svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.auth-brand strong { display: block; font-size: 13px; }
.auth-brand span { font-size: 10px; color: var(--muted); }

.auth-card h1 { font-size: 17px; margin: 0 0 6px; }
.auth-sub { margin: 0 0 18px; font-size: 11px; color: var(--muted); line-height: 1.8; }

.auth-form label {
  display: block;
  margin-bottom: 13px;
  font-size: 11px;
  font-weight: 700;
  color: #5b5650;
}

.auth-form input {
  width: 100%;
  height: 44px;
  margin-top: 6px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fbfaf7;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
}

.auth-form input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(242, 162, 93, 0.18); background: #fff; }

.auth-submit {
  width: 100%;
  height: 46px;
  margin-top: 4px;
  border: 0;
  border-radius: 12px;
  background: var(--orange);
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: filter 0.15s ease;
}

.auth-submit:hover { filter: brightness(1.05); }

.auth-otp-demo {
  margin-bottom: 16px;
  padding: 11px 13px;
  border: 1px dashed #d8c9a8;
  border-radius: 11px;
  background: #fdf8ee;
  color: #9a7a2a;
  font-size: 11px;
  text-align: center;
}

.auth-otp-demo b { font-size: 16px; letter-spacing: 4px; color: #7a5e1a; }

.auth-otp-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0 10px;
  padding: 10px 11px;
  border: 1px solid rgba(242, 162, 93, 0.34);
  border-radius: 13px;
  background: #fff8f1;
}

.auth-otp-copy {
  min-width: 0;
  display: block;
  flex: 1;
  color: #5f4a35;
  font-size: 11px;
  line-height: 1.7;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.auth-otp-copy b {
  color: #9a5a1f;
  font-size: 11.5px;
}

.auth-otp-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 14px;
}

.auth-otp-timer {
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 700;
}

.auth-otp-timer[data-expired="1"] {
  color: #c45528;
}

.auth-inline-action {
  border: 0;
  background: transparent;
  color: #a65c1f;
  font-family: inherit;
  font-size: 10.5px;
  font-weight: 800;
  cursor: pointer;
  padding: 4px 0;
  white-space: nowrap;
}

.auth-inline-action:hover {
  color: var(--orange);
}

.auth-inline-action:disabled {
  cursor: default;
  color: #b7aca0;
}

.auth-note {
  margin-top: 18px;
  padding-top: 15px;
  border-top: 1px solid var(--line);
  font-size: 10px;
  color: var(--muted);
  line-height: 1.8;
  text-align: center;
}

.auth-back {
  width: 100%;
  margin-top: 12px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-family: inherit;
  font-size: 11px;
  cursor: pointer;
}

.auth-back:hover { color: var(--orange); }

.auth-remember {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 8px;
  font-weight: 600 !important;
  font-size: 11px !important;
  color: #5b5650;
  cursor: pointer;
}
.auth-remember input { width: 16px; height: 16px; margin: 0; accent-color: var(--orange); cursor: pointer; }
.auth-remember span { margin: 0; }

.auth-device {
  margin-top: 14px;
  padding: 9px 11px;
  border-radius: 9px;
  background: #faf7f1;
  border: 1px solid var(--line);
  font-size: 10px;
  color: #6a6359;
  text-align: center;
}
.auth-device b { color: #4d4840; }

.login-log-list { display: flex; flex-direction: column; gap: 7px; max-height: 230px; overflow-y: auto; }
.login-log-row {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}
.login-log-dev { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: #4d4840; }
.login-log-dev svg { width: 13px; height: 13px; color: var(--orange); }
.login-log-meta { font-size: 9px; color: var(--muted); }

/* ── درآمد و تسویه ─────────────────────────────────── */
.settlement-policy-panel {
  margin-bottom: 18px;
}
.settlement-policy-panel form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 18px;
  padding: 18px 20px;
}
.settlement-policy-copy,
.settlement-policy-control,
.settlement-policy-control label {
  display: flex;
  align-items: center;
  gap: 12px;
}
.settlement-policy-copy > span:last-child {
  display: grid;
  gap: 4px;
}
.settlement-policy-copy small {
  color: var(--muted);
}
/* باکس مبلغ: کادر یکپارچه با حلقهٔ فوکوس؛ عدد سه‌رقمی‌شده و واحد ثابت کنارش */
.settlement-amount-field {
  min-width: 260px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0 14px;
  background: var(--card);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.settlement-amount-field:hover {
  border-color: #f0b487;
}
.settlement-amount-field:focus-within {
  border-color: #f0a77e;
  background: #fff;
  box-shadow: 0 0 0 3px var(--orange-soft);
}
.settlement-policy-control input {
  width: 170px;
  border: 0;
  background: transparent;
  padding: 12px 0;
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .3px;
  color: var(--ink);
  outline: 0;
}
/* پُرکردن خودکارِ مرورگر، متن و پس‌زمینهٔ باکس را رنگی می‌کرد */
.settlement-policy-control input:-webkit-autofill,
.settlement-policy-control input:-webkit-autofill:hover,
.settlement-policy-control input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--ink);
  -webkit-box-shadow: 0 0 0 40px var(--card) inset;
  caret-color: var(--ink);
  transition: background-color 9999s ease-out;
}
.settlement-policy-control input::selection {
  background: var(--orange-soft);
  color: var(--ink);
}
.settlement-amount-unit {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  padding-inline-start: 10px;
  border-inline-start: 1px solid var(--line);
}
.settlement-policy-words {
  grid-column: 1 / -1;
  margin: 0;
  padding: 9px 13px;
  border-radius: 11px;
  background: var(--orange-soft);
  color: #a8541a;
  font-size: 12.5px;
  font-weight: 800;
  line-height: 1.9;
}
.settlement-policy-words.is-hint {
  background: var(--soft);
  color: var(--muted);
  font-weight: 700;
}

.academic-year-manager {
  margin-top: 18px;
}
.academic-year-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 18px 20px;
}
.academic-year-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  color: var(--text);
  font-weight: 800;
}
.academic-year-chip.latest {
  border-color: rgba(34, 139, 112, .35);
  background: rgba(34, 139, 112, .08);
}
.academic-year-chip small {
  color: var(--teal);
  font-size: 10px;
}
.academic-year-preview {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--soft);
  color: var(--muted);
}
.academic-year-preview strong {
  color: var(--text);
}
@media (max-width: 760px) {
  .settlement-policy-panel form {
    grid-template-columns: minmax(0, 1fr);
  }
  .settlement-policy-control {
    align-items: stretch;
    flex-direction: column;
  }
  .settlement-amount-field {
    min-width: 0;
  }
  .settlement-policy-control input {
    width: 100%;
  }
}

.settle-progress { margin-top: 14px; }
.settle-bar {
  height: 10px;
  border-radius: 20px;
  background: #efeae0;
  overflow: hidden;
}
.settle-bar span {
  display: block;
  height: 100%;
  border-radius: 20px;
  background: linear-gradient(90deg, var(--teal), #1aa088);
}
.settle-progress small { display: block; margin-top: 6px; font-size: 10px; color: var(--muted); }

/* کیف پول ستون اصلی است و اطلاعات بانکی (دو ورودی + یک دکمه) ستون باریک. */
.earnings-settlement-grid {
  grid-template-columns: minmax(0, 1.75fr) minmax(290px, 1fr);
  align-items: stretch;
}

.earnings-settlement-grid > .panel {
  min-width: 0;
  height: 100%;
}

.earnings-bank-body {
  display: grid;
  gap: 14px;
  padding: 16px 18px 20px;
  /* ارتفاع پنل با ستون کناری یکی است؛ فیلدها از بالا شروع می‌شوند نه کشیده. */
  align-content: start;
}

.earnings-bank-body .field {
  margin: 0;
}

.earnings-bank-body input {
  width: 100%;
  min-height: 46px;
  text-align: left;
}

.earnings-bank-save {
  display: flex;
  justify-content: center;
  width: min(100%, 290px);
  min-height: 42px;
  margin: 2px auto 0;
  text-align: center;
}

.finance-chart-panel .panel-header {
  align-items: center;
  gap: 12px;
}

.chart-controls,
.chart-subcontrols {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border: 1px solid #ebe4d9;
  border-radius: 12px;
  background: #fffaf4;
}

.chart-subcontrols {
  /* بدون حاشیهٔ بالا، این نوار دقیقاً به خطِ زیرِ هدر پنل می‌چسبید */
  margin: 12px 18px 4px;
  background: #f8fbfa;
  border-color: #dbece7;
}

.chart-controls button,
.chart-subcontrols button {
  border: 0;
  border-radius: 9px;
  padding: 7px 10px;
  background: transparent;
  color: #81796d;
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
  white-space: nowrap;
}

.chart-controls button.active,
.chart-subcontrols button.active {
  background: #fff;
  color: #c25710;
  box-shadow: 0 8px 18px rgba(79,58,38,.08);
}

.chart-subcontrols button.active {
  color: #168878;
}

.finance-chart-body {
  display: block;
  padding: 12px 18px 18px;
}

.finance-chart-wrap {
  min-width: 0;
  padding: 12px;
  border: 1px solid #eee7dd;
  border-radius: 14px;
  background: #fffdf9;
  --chart-income-color: #ef8b43;
  --chart-income-text: #b35f24;
  --chart-activity-color: #168878;
}

.finance-chart-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.chart-axis {
  stroke: #e4dccf;
  stroke-width: 1;
}

.finance-bar .payment-bar-segment {
  fill: var(--chart-income-color, #ef8b43);
  opacity: .95;
  filter: drop-shadow(0 9px 12px rgba(194,87,16,.14));
  transition: opacity .18s ease, filter .18s ease;
}

.finance-bar .payment-bar-reward {
  fill: var(--teal);
  filter: drop-shadow(0 8px 11px rgba(22,136,120,.14));
}

.finance-bar .payment-bar-penalty {
  fill: url(#paymentPenaltyHatch);
  stroke: #d96c64;
  stroke-width: 1.4;
  filter: none;
}

.payment-penalty-hatch-line {
  stroke: rgba(217,108,100,.62);
  stroke-width: 2;
}

.finance-bar:hover .payment-bar-segment {
  opacity: 1;
  filter: brightness(1.025) drop-shadow(0 10px 14px rgba(101,72,43,.16));
}

.chart-tooltip {
  opacity: 0;
  pointer-events: none;
  transform-box: fill-box;
  transition: opacity .16s ease, transform .18s var(--ease-soft);
}

.chart-tooltip .cht-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 100%;
}

.chart-tooltip .cht-box {
  display: inline-block;
  width: auto;
  max-width: 100%;
  direction: rtl;
  text-align: right;
  padding: 7px 10px;
  border-radius: 11px;
  background: rgba(255, 255, 255, .98);
  border: 1px solid rgba(240, 180, 135, .78);
  box-shadow: 0 12px 18px rgba(65, 47, 29, .16);
  font-family: inherit;
}

.chart-tooltip .cht-line {
  font-size: 8px;
  font-weight: 800;
  line-height: 1.55;
  color: #8a5b2e;
  white-space: nowrap;
}

.chart-tooltip .cht-head {
  color: var(--chart-income-text, #b35f24);
  font-weight: 850;
}

.finance-bar:hover .chart-tooltip,
.chart-point:hover .chart-tooltip {
  opacity: 1;
}

.chart-value {
  fill: var(--chart-income-text, #b35f24);
  font-size: 10px;
  font-weight: 850;
}

.chart-label {
  fill: #9a958b;
  font-size: 8.6px;
  font-weight: 750;
}

.chart-area {
  fill: rgba(22, 136, 120, .12);
}

.chart-line {
  fill: none;
  stroke: var(--chart-activity-color);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 8px 10px rgba(22,163,148,.18));
}

.chart-point circle {
  fill: #fff;
  stroke: var(--chart-activity-color);
  stroke-width: 2;
  transition: r .18s ease, fill .18s ease;
}

.chart-point:hover circle {
  r: 4.5;
  fill: #e8f8f5;
}

.chart-point.is-clickable {
  cursor: pointer;
}

button[disabled] { opacity: 0.55; cursor: not-allowed; }

.dash-wallet-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 11px;
  color: var(--muted);
}
.dash-wallet-row b { color: #4d4840; }

.review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.review-actions button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex: 1 1 auto;
  min-width: 130px;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 11px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: filter 0.15s ease, background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.review-actions button svg { width: 15px; height: 15px; }

.review-actions .primary-button {
  background: var(--teal);
  color: #fff;
  box-shadow: none;
}
.review-actions .primary-button:hover { filter: brightness(1.06); }

.review-actions [data-status-action="returned_for_correction"] {
  background: var(--orange-soft);
  color: #c25710;
  border-color: #f0d3b4;
}
.review-actions [data-status-action="returned_for_correction"]:hover { background: #fbe6cf; }

.review-actions [data-status-action="rejected"] {
  background: var(--red-soft);
  color: var(--red);
  border-color: #f0c6c1;
}
.review-actions [data-status-action="rejected"]:hover { background: #f9d8d3; }

.review-actions #detailEdit {
  background: #fff;
  color: #5b5650;
  border-color: var(--line);
}
.review-actions #detailEdit:hover { border-color: var(--orange); color: #c84e08; }

/* چیپ‌های متادیتای جزئیات سؤال (موضوعات و …) */
.meta-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
  max-width: 78%;
  min-width: 0;
}

.info-row > .meta-chips {
  max-width: 78%;
  overflow: visible;
  white-space: normal;
}

.meta-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 5px 9px;
  border: 1px solid #e5ebe7;
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff, #f7fbf9);
  font-size: 10px;
  font-weight: 700;
  cursor: default;
  box-shadow: 0 5px 14px rgba(38, 32, 25, 0.045);
}

.meta-chip .mc-key {
  flex: 0 0 auto;
  color: #9a5a1f;
  white-space: nowrap;
}

.meta-chip .mc-mid {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #9a958b;
  font-weight: 600;
}

.meta-chip .mc-leaf {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #168878;
  white-space: nowrap;
}

.meta-chip.has-tooltip {
  overflow: visible;
}

.meta-chip.has-tooltip:hover {
  border-color: #f0b487;
  background: #fffaf5;
  box-shadow: 0 12px 28px rgba(65,47,29,.11);
  transform: translateY(-1px);
}

.topic-meta-chip {
  width: fit-content;
  min-width: 0;
  max-width: 100%;
  padding-inline: 12px;
}

.source-meta-chips {
  align-items: flex-start;
  max-width: 82%;
  justify-content: flex-end;
}

.info-row > .source-meta-chips {
  max-width: 82%;
  overflow: visible;
  white-space: nowrap;
}

.source-meta-chip {
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border-color: #e8e1d7;
  background: #fffaf5;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) max-content;
  max-width: 100%;
  width: min(100%, 340px);
  min-height: 46px;
  overflow: visible;
}

.detail-source-icon {
  width: 28px;
  height: 28px;
  flex: none;
  display: inline-grid;
  place-items: center;
  border-radius: 9px;
  background: #fff0e7;
  color: var(--orange);
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(173, 90, 22, .08);
}

.detail-source-icon svg {
  width: 18px !important;
  height: 18px !important;
  max-width: 18px;
  max-height: 18px;
}

/* لوگوهای تصویری (PNG/JPG/WebP) باید درون کادر آیکون جا بگیرند؛ بدون این قانون با اندازهٔ طبیعی بریده می‌شدند و خالی به نظر می‌رسیدند */
.detail-source-icon img,
.src-icon img {
  width: 20px !important;
  height: 20px !important;
  max-width: 20px;
  max-height: 20px;
  object-fit: contain;
  display: block;
}

.source-chip-copy {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  color: inherit;
  overflow: hidden;
  white-space: nowrap;
}

.source-chip-copy .mc-key,
.source-chip-copy .mc-mid,
.source-chip-copy .mc-leaf {
  flex: 0 1 auto;
  line-height: 1.45;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.source-chip-copy .mc-leaf {
  flex: 0 0 auto;
}

.source-chip-copy .mc-mid {
  max-width: 150px;
  opacity: .8;
}

.source-chip-badges {
  display: grid;
  gap: 5px;
  justify-items: end;
  align-items: center;
  min-width: max-content;
}

.source-year-badge,
.source-number-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 8px;
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}

.source-year-badge {
  background: #edf8f6;
  color: #168878 !important;
}

.source-number-badge {
  background: #fff0e6;
  color: #ad5a16 !important;
}

.meta-tooltip {
  position: absolute;
  z-index: 520;
  right: 0;
  bottom: calc(100% + 9px);
  width: max-content;
  max-width: min(520px, 78vw);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  overflow-wrap: normal;
  white-space: nowrap;
  padding: 10px 12px;
  border: 1px solid rgba(240, 180, 135, 0.72);
  border-radius: 13px;
  background: linear-gradient(180deg, rgba(255,255,255,.99), rgba(255,250,246,.99));
  box-shadow: 0 18px 42px rgba(65,47,29,.17);
  color: #4d3b2a !important;
  font-size: 10px;
  line-height: 1.75;
  opacity: 0;
  transform: translateY(7px) scale(.98);
  pointer-events: none;
  transition: opacity .18s ease, transform .22s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.meta-tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  right: auto;
  left: var(--mt-arrow, calc(100% - 24px));
  transform: translateX(-50%);
  border: 7px solid transparent;
  border-top-color: rgba(255,250,246,.99);
  filter: drop-shadow(0 4px 3px rgba(65,47,29,.08));
}

/* وقتی تول‌تیپ زیر چیپ قرار می‌گیرد (با موتور موقعیت‌دهی)، فلش به سمت بالا برمی‌گردد */
.meta-tooltip.mt-below::after {
  top: auto;
  bottom: 100%;
  border-top-color: transparent;
  border-bottom-color: rgba(255,250,246,.99);
  filter: drop-shadow(0 -4px 3px rgba(65,47,29,.08));
}

.meta-tooltip b {
  color: #b76620;
  font-size: 9px;
}

.meta-tooltip span {
  color: #4d3b2a !important;
  white-space: nowrap;
  overflow-wrap: normal;
}

.meta-tooltip-path {
  direction: rtl;
  text-align: right;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* عرضِ تولتیپ دقیقاً به‌اندازهٔ بلندترین مسیر است؛ min-width فضای خالی می‌ساخت */
.student-topic-tooltip,
.kn-similar-tooltip {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  width: max-content;
  max-width: min(760px, 86vw);
  white-space: normal;
}

.student-topic-tooltip-list,
.meta-tip-rows {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.student-topic-tooltip-row,
.meta-tip-row {
  display: block;
  max-width: 100%;
  padding: 5px 8px;
  border: 1px solid #f2e7da;
  border-radius: 9px;
  background: #fff;
  color: #4d3b2a !important;
  direction: rtl;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.student-topic-tooltip-row.main {
  border-color: rgba(240, 180, 135, 0.82);
  background: #fff7ef;
  color: #9a5a1f !important;
}

.meta-chip:hover .meta-tooltip,
.meta-chip:focus-within .meta-tooltip {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.meta-chip .meta-tooltip {
  display: none;
}

.meta-tooltip-portal {
  position: fixed !important;
  z-index: 100000 !important;
  right: auto !important;
  bottom: auto !important;
  display: inline-flex !important;
  opacity: 0;
  pointer-events: none !important;
  transform: translateY(4px) scale(.98);
}

.meta-tooltip-portal.show {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
}

/* توست‌ها باید از هر لایهٔ دیگری بالاتر بنشینند: پاپ‌آپ‌ها (modal-root و
   tp-overlay روی ۱۰۰۰۰۰)، رانرِ آزمون و صفحه‌های تمام‌صفحه. با z-index قدیمیِ
   ۲۰۰ هر پیام سیستمی زیرِ backdropِ مودال گم و تارِ blur می‌شد. pointer-events
   هم برداشته شده تا توستِ روی مودال جلوی کلیک روی دکمه‌های زیرش را نگیرد. */
.toast-stack {
  position: fixed;
  left: 22px;
  bottom: 22px;
  z-index: 100060;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.toast {
  min-width: 280px;
  max-width: 390px;
  background: #292721;
  color: white;
  border-radius: 12px;
  padding: 12px 14px;
  box-shadow: 0 14px 35px rgba(0,0,0,.2);
  animation: toast-in .22s ease;
  font-size: 11px;
}

.toast.success { border-right: 4px solid var(--teal); }
.toast.error { border-right: 4px solid var(--red); }
/* روی پس‌زمینهٔ تارِ مودال، توست باید «جدا» دیده شود؛ یک هالهٔ نازک کافی است. */
body:has(#modalRoot:not(:empty)) .toast {
  box-shadow: 0 16px 40px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.16);
}

@keyframes toast-in {
  from { opacity: 0; transform: translateY(8px); }
}

.mobile-only {
  display: none;
}

@media (max-width: 1100px) {
  .folder-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* در عرض کم، ردیف چهار طبقه می‌شود: نام، آمار، زمان، دکمهٔ بانک آزمون.
     .frow-actions به contents تبدیل می‌شود تا دکمهٔ «⋯» کنار نام بماند و
     دکمهٔ عریضِ بانک آزمون ستون نام را تنگ نکند. */
  .folder-row {
    grid-template-columns: 30px minmax(0, 1fr) 30px;
    row-gap: 8px;
  }
  .folder-row .frow-actions {
    display: contents;
  }
  .folder-row .more-button,
  .folder-row .more-button-slot {
    grid-column: 3;
    grid-row: 1;
  }
  .folder-row .frow-stats {
    grid-column: 1 / 4;
    grid-row: 2;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .folder-row .frow-stats.no-files {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .folder-row .frow-time {
    grid-column: 1 / 4;
    grid-row: 3;
  }
  .folder-row .frow-bank-slot {
    grid-column: 1 / 4;
    grid-row: 4;
    width: 100%;
  }
  .folder-row .frow-bank-slot:empty {
    display: none;
  }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wizard-layout { grid-template-columns: 190px minmax(0, 1fr); }
  .question-filter-grid { grid-template-columns: repeat(3, minmax(125px, 1fr)); }
}

@media (max-width: 820px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
    overflow-x: clip;
  }
  .app-shell { display: block; }
  .sidebar {
    position: fixed;
    top: 72px;                                   /* زیرِ هدر باز شود، نه زیرِ آن */
    right: 0;
    height: calc(100dvh - 72px);
    width: 250px;
    z-index: 60;                                 /* بالای محتوا؛ هدر (۴۵) هم‌چنان دیده می‌شود */
    transform: translateX(105%);
    transition: transform .3s cubic-bezier(.22, .61, .36, 1);
    box-shadow: -16px 0 44px rgba(30, 24, 18, .16);
    border-left: 1px solid var(--line);
    will-change: transform;
  }
  .sidebar.open { transform: translateX(0); }
  .sidebar-backdrop {
    display: block;
    position: fixed;
    inset: 72px 0 0 0;
    z-index: 55;
    background: rgba(28, 22, 16, .34);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s ease, visibility .3s ease;
  }
  .sidebar-backdrop.open { opacity: 1; visibility: visible; }
  .mobile-only { display: inline-grid; place-items: center; }
  .topbar { padding: 0 16px; }
  .content { padding: 22px 16px 50px; }
  .questions-panel-head { align-items: flex-start; flex-direction: column; }
  .question-code-search { width: 100%; }
  .question-filter-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .folder-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .folder-navigation { align-items: flex-start; flex-direction: column; }
  .two-column, .question-detail-grid { grid-template-columns: 1fr; }
  .wizard-layout { grid-template-columns: 1fr; }
  .wizard-side {
    border-left: 0;
    border-bottom: 1px solid var(--line);
    display: flex;
    overflow: auto;
  }
  .wizard-side h3 { display: none; }
  .wizard-step { min-width: 130px; }
  .topic-columns { grid-template-columns: 1fr 1fr; }
  .topic-column { min-height: 220px; }
  .crop-layout { grid-template-columns: 1fr; }
  .question-page-layout { grid-template-columns: 1fr; }
  .question-form-nav { display: none; }
  .question-save-bar { right: 16px; left: 16px; }
  .tag-admin-grid { grid-template-columns: 1fr; }
  .question-structure-section .type-cards { width: min(330px, calc(100% - 76px)); }
}

.drag-handle { cursor: grab; opacity: 0.35; font-size: 15px; flex-shrink: 0; line-height: 1; }
.drag-handle:active { cursor: grabbing; }

@media (max-width: 560px) {
  .page-head { align-items: flex-start; flex-direction: column; }
  .question-filter-grid { grid-template-columns: 1fr; }
  .question-filter-title { align-items: flex-start; }
  .stats-grid, .folder-grid, .form-grid { grid-template-columns: 1fr; }
  .panel-header { align-items: flex-start; flex-direction: column; }
  .panel-tools, .mini-search { width: 100%; }
  .source-entry { grid-template-columns: 1fr 1fr; }
  .media-list, .topic-columns { grid-template-columns: 1fr; }
  .question-page-head { align-items: flex-start; flex-direction: column; }
  .question-form-section { grid-template-columns: 1fr; padding: 16px; }
  .question-save-bar { flex-wrap: wrap; }
  .question-save-bar > div { width: 100%; margin-left: 0; }
  .options-entry-layout { grid-template-columns: 1fr; }
  .correct-option-picker { grid-template-columns: 1fr 1fr; }
  .question-structure-section { margin-top: 0; padding-top: 16px; }
  .question-structure-section .type-cards { width: 100%; }
  .type-card small { display: none; }
  .topic-path-item { padding-top: 26px; }
  .topic-path-track { overflow: visible; padding-bottom: 0; flex-wrap: wrap; border-radius: 14px; }
  .topic-path-segment { flex: 1 1 100% !important; max-width: none !important; border-inline-start: 0; border-top: 1px solid #ded8cd; border-radius: 0 !important; }
  .topic-path-segment:first-child { border-top: 0; border-radius: 14px 14px 0 0 !important; }
  .topic-path-segment:last-of-type { border-radius: 0 0 14px 14px !important; }
  .topic-path-tooltip { right: 8px; max-width: calc(100vw - 60px); white-space: nowrap; }
  .modal-backdrop { padding: 0; }
  .modal, .modal.large, .modal.xlarge { width: 100vw; max-height: 100vh; height: 100vh; border-radius: 0; }
  .modal.receipt-modal { width: 100vw; min-width: 0; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; grid-template-rows: auto minmax(0, 1fr); }
  .receipt-viewer-body { min-height: 0; padding: 10px; }
  .receipt-viewer-img { max-width: 94vw; max-height: calc(100vh - 86px); }
  .finance-chart-panel .panel-header { align-items: flex-start; flex-direction: column; }
  .chart-controls, .chart-subcontrols { width: 100%; overflow-x: auto; justify-content: flex-start; }
  .finance-chart-body { padding: 10px 12px 14px; }
  .source-meta-chip { grid-template-columns: 28px minmax(0, 1fr) max-content; width: min(100%, 280px); }
  .source-chip-badges { justify-items: end; }
}

/* ───────────── صفحهٔ ورود: تب نقش، لینک‌ها، گرید دوتایی ───────────── */
.auth-tabs {
  display: flex;
  gap: 6px;
  background: #efece4;
  padding: 5px;
  border-radius: 13px;
  margin: 4px 0 16px;
}
.auth-tabs button {
  flex: 1;
  border: 0;
  background: transparent;
  padding: 9px 10px;
  border-radius: 9px;
  font: inherit;
  font-weight: 700;
  font-size: 12px;
  color: var(--muted);
  cursor: pointer;
  transition: 0.16s ease;
}
.auth-tabs button.active {
  background: white;
  color: var(--ink);
  box-shadow: 0 4px 12px rgba(79, 58, 38, 0.08);
}
.auth-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.auth-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 14px;
  justify-content: center;
}
.auth-links button {
  border: 0;
  background: transparent;
  color: var(--orange);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.auth-links button:hover { text-decoration: underline; }

/* ───────────── پنل دانش‌آموز ───────────── */
#studentRoot { display: block; }

.student-bank-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 14px;
  padding: 16px 18px 20px;
}
.sq-card {
  border: 1px solid var(--line);
  background: linear-gradient(150deg, #fff, #fcfbf8);
  border-radius: 15px;
  padding: 14px;
  cursor: pointer;
  transition: 0.18s ease;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.sq-card:hover {
  transform: none;
  border-color: var(--line);
  box-shadow: none;
}
.sq-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sq-code {
  font-size: 11px;
  font-weight: 700;
  color: var(--orange);
  letter-spacing: 0.3px;
}
.sq-title {
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--ink);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sq-topic {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #2d766d;
  font-weight: 600;
}
.sq-topic svg { width: 14px; height: 14px; flex: none; }
.sq-topic span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sq-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.sq-tag {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 7px;
  background: #f1f5f3;
  color: #5b766f;
}
.sq-tag.alt { background: #fbf0e6; color: #9a5a1f; }
.sq-tag.diff { display: inline-flex; align-items: center; gap: 5px; }
.sq-tag.diff .difficulty-gauge { width: 20px; height: 18px; }

/* جزئیات سؤال دانش‌آموز */
.sq-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.sq-detail-tags { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.sq-body { font-size: 14px; line-height: 2.1; color: var(--ink); }
.sq-options {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 16px;
}
.sq-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  font-size: 13px;
  background: #fff;
}
.sq-option.correct {
  border-color: #b3ddd0;
  background: #f1fbf7;
}
.sq-opt-no {
  width: 24px;
  height: 24px;
  flex: none;
  border-radius: 8px;
  background: #f1efe8;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
}
.sq-option.correct .sq-opt-no { background: #2f9e83; color: #fff; }
.sq-opt-flag {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  color: #2f9e83;
}
.sq-opt-flag svg { width: 15px; height: 15px; }
.sq-explain {
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  background: #fbfaf6;
}
.sq-explain summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 12.5px;
  color: var(--ink);
}
.sq-explain > div {
  margin-top: 10px;
  font-size: 13px;
  line-height: 2;
  color: #4a463f;
}

/* داشبورد دانش‌آموز: پراکندگی سطح دشواری */
.sd-diff-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 12px;
  padding: 16px 18px;
}
.sd-diff-card {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: 0.16s ease;
}
.sd-diff-card:hover { transform: translateY(-2px); border-color: #f2b994; box-shadow: 0 8px 18px rgba(79,58,38,.08); }
.sd-diff-card .difficulty-gauge { width: 34px; height: 30px; }
.sd-diff-card strong { font-size: 19px; }
.sd-diff-card small { color: var(--muted); font-size: 11px; }

/* ───────── صفحهٔ ورود/ثبت‌نام: انیمیشن نرم و کارت‌های نقش ───────── */
.auth-stage {
  animation: authStageIn 0.42s cubic-bezier(0.22, 0.61, 0.36, 1);
}
@keyframes authStageIn {
  from { opacity: 0; transform: translateY(10px) scale(0.985); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.auth-card { transition: box-shadow 0.3s ease; }
.auth-form label, .auth-form .auth-submit { transition: 0.18s ease; }
.auth-submit { transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease; }
.auth-submit:active { transform: translateY(1px) scale(0.99); }

/* لینک‌های ثانویه و بازگشت مرحله */
.auth-step-back {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  margin-bottom: 6px;
}
.auth-step-back svg { width: 15px; height: 15px; }
.auth-step-back:hover { color: var(--orange); }

/* گرید انتخاب نقش */
.role-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
  margin-top: 6px;
}
.role-grid .role-card:nth-child(5) { grid-column: 1 / -1; }
.role-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  text-align: center;
  min-height: 124px;
  padding: 14px 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(160deg, #fff, #fcfbf8);
  cursor: pointer;
  transition: transform 0.18s cubic-bezier(0.22,0.61,0.36,1), border-color 0.18s ease, box-shadow 0.18s ease;
  animation: roleIn 0.4s backwards cubic-bezier(0.22,0.61,0.36,1);
}
.role-grid .role-card:nth-child(1) { animation-delay: 0.02s; }
.role-grid .role-card:nth-child(2) { animation-delay: 0.06s; }
.role-grid .role-card:nth-child(3) { animation-delay: 0.10s; }
.role-grid .role-card:nth-child(4) { animation-delay: 0.14s; }
.role-grid .role-card:nth-child(5) { animation-delay: 0.18s; }
@keyframes roleIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.role-card:hover {
  transform: translateY(-3px);
  border-color: #f0b487;
  box-shadow: 0 14px 30px rgba(79, 58, 38, 0.12);
}
.role-card strong { font-size: 12.5px; color: var(--ink); line-height: 1.5; }
.role-card small { font-size: 10px; color: var(--muted); line-height: 1.5; max-width: 130px; }
.role-ic {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: linear-gradient(150deg, #fbecd9, #f7e0c4);
  color: #b9762a;
  transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.role-card:hover .role-ic { transform: scale(1.06) rotate(-3deg); background: linear-gradient(150deg, #f6c98a, #ef9f4f); color: #fff; }
.role-ic svg { width: 23px; height: 23px; }
.role-ic.sm { width: 30px; height: 30px; border-radius: 9px; }
.role-ic.sm svg { width: 17px; height: 17px; }

/* تراشهٔ نقش انتخاب‌شده در مرحلهٔ اطلاعات */
.role-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 5px 12px 5px 6px;
  border-radius: 999px;
  background: #fbf0e3;
  color: #9a5a1f;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 4px;
}

@media (max-width: 430px) {
  .role-grid {
    gap: 9px;
  }
  .role-card {
    min-height: 112px;
    padding: 12px 9px;
  }
  .role-card strong {
    font-size: 12px;
  }
  .role-card small {
    display: none;
  }
  .role-ic {
    width: 42px;
    height: 42px;
  }
  .role-ic svg {
    width: 21px;
    height: 21px;
  }
  .auth-otp-notice,
  .auth-otp-tools {
    align-items: center;
  }
  .auth-otp-copy { white-space: normal; }
}

/* ───────────── بانک سؤال کاربر ───────────── */
.sbank {
  display: flex;
  flex-direction: row-reverse; /* در RTL: نوار فیلتر سمت راست، سؤال‌ها سمت چپ */
  gap: 18px;
  align-items: flex-start;     /* لازم برای کارکرد sticky نوار فیلتر */
}
.sbank,
.sbank-main,
.sbank-side,
#studentContent {
  scrollbar-width: none;
}
.sbank::-webkit-scrollbar,
.sbank-main::-webkit-scrollbar,
.sbank-side::-webkit-scrollbar,
#studentContent::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}
.sbank-side { flex: 0 0 236px; align-self: flex-start; }  /* نوار فیلتر باریک‌تر تا فضای سؤال بیشتر شود */
.sbank-main { flex: 1 1 auto; min-width: 0; }              /* سؤال‌ها سمت چپ */
.sbank-topbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 12px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  margin-bottom: 14px;
}
.seg-group { display: inline-flex; background: #efece4; border-radius: 10px; padding: 3px; }
.seg {
  border: 0; background: transparent; font: inherit; font-size: 12px; font-weight: 700;
  color: var(--muted); padding: 6px 13px; border-radius: 8px; cursor: pointer; transition: 0.15s ease;
}
.seg.on { background: #fff; color: var(--ink); box-shadow: 0 3px 8px rgba(79,58,38,.08); }
.ctx-picker {
  display: grid;
  gap: 18px;
}
.ctx-pick-section > label {
  display: block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 850;
  color: var(--ink);
}
.ctx-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 9px;
}
.ctx-choice {
  position: relative;
  min-height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
  color: #5f5a51;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
  transition: transform .16s var(--ease-soft), border-color .16s ease, background .16s ease, box-shadow .16s ease, color .16s ease;
}
.ctx-choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.ctx-choice:hover {
  transform: translateY(-1px);
  border-color: #f0b487;
  background: #fffaf5;
}
.ctx-choice.on,
.ctx-choice:has(input:checked) {
  border-color: var(--orange);
  background: var(--orange-soft);
  color: #c25710;
  box-shadow: 0 10px 22px rgba(255,107,24,.1);
}
.sbank-chip {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--line); background: #fff; border-radius: 10px;
  padding: 7px 12px; font: inherit; font-size: 12px; font-weight: 600; color: var(--ink);
  cursor: pointer; transition: 0.15s ease;
}
.sbank-chip:hover { border-color: #f0b487; }
.sbank-chip.on { background: #fbf0e3; color: #9a5a1f; border-color: #f0d3b4; }
.sbank-chip svg { width: 15px; height: 15px; }
.sbank-chip .ms-caret { width: 13px; height: 13px; opacity: .6; }
.sbank-year { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--muted); }
.sbank-year select { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; font: inherit; font-size: 11px; background: #fff; }
.sbank-search { position: relative; flex: 1; min-width: 180px; }
.sbank-search input { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 8px 32px 8px 12px; font: inherit; font-size: 12px; background: #fff; }
.sbank-search .search-glyph { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); }

.sbank-listhead {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-size: 12px; color: var(--muted); margin-bottom: 12px; flex-wrap: wrap;
}
.sbank-found-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.sb-found b { color: var(--ink); font-size: 15px; }
.sb-pagination { display: inline-flex; align-items: center; gap: 4px; }
.sb-page {
  min-width: 30px; height: 30px; padding: 0 7px;
  border: 1px solid var(--line); background: #fff; border-radius: 9px;
  font: inherit; font-size: 12px; font-weight: 600; color: var(--ink);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  transition: 0.15s cubic-bezier(0.22,0.61,0.36,1);
}
.sb-page:hover:not(:disabled) { border-color: #f0b487; transform: translateY(-1px); }
.sb-page.on { background: var(--orange); color: #fff; border-color: var(--orange); }
.sb-page:disabled { opacity: .38; cursor: default; }
.sb-page svg { width: 15px; height: 15px; }
.sb-ellipsis { color: var(--muted); padding: 0 2px; }
.sbank-side-toggle {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--line); background: #fff; border-radius: 10px;
  padding: 7px 13px; font: inherit; font-size: 12px; font-weight: 600; color: var(--ink);
  cursor: pointer; transition: 0.16s ease;
}
.sbank-side-toggle:hover { border-color: #f0b487; background: #fbf0e3; }
.sbank-side-toggle svg { width: 15px; height: 15px; }

.sbank-list { display: flex; flex-direction: column; gap: 14px; }
.sq-item {
  border: 1px solid var(--line); background: var(--card); border-radius: 15px;
  position: relative; transition: box-shadow .18s ease, transform .18s var(--ease-soft), border-color .18s ease;
  display: flex; align-items: stretch; gap: 0; overflow: hidden;
  scroll-margin-top: 96px;
}
.sq-item:hover {
  transform: none;
  box-shadow: none;
}
.sq-main { position: relative; flex: 1; min-width: 0; padding: 16px 18px; }
.sq-item.ans-correct { border-inline-start: 3px solid #2f9e83; }
.sq-item.ans-wrong { border-inline-start: 3px solid var(--red, #d3603f); }
.sq-item.ans-dunno { border-inline-start: 3px solid #c9a23a; }
/* ریل سمت چپِ سؤال: منبع، ضریب تمیز، سطح سؤال */
.sq-rail {
  flex: none; width: 136px; display: flex; flex-direction: column;
  border-inline-start: 1px solid #f1efe9; background: #fbfaf7;
}
.sq-rail-cell {
  position: relative;
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  min-height: 122px;
  padding: 14px 10px; text-align: center;
}
.sq-rail-cell + .sq-rail-cell { border-top: 1px solid #f1efe9; }
.sq-rail-cell > svg { width: 28px; height: 28px; color: var(--muted); }
.sq-rail-cell b { font-size: 13px; color: var(--ink); line-height: 1.45; }
.sq-rail-src b { font-size: 12px; max-width: 100%; overflow-wrap: anywhere; }
.sq-rail-cell small { font-size: 10px; color: var(--muted); }
.sq-rail-disc b { color: #9a5a1f; }
.sq-rail-diff .difficulty-gauge {
  width: 44px;
  height: 38px;
  background: color-mix(in srgb, var(--gauge-color) 12%, white);
}
.sq-rail-diff .difficulty-gauge svg {
  width: 34px;
  height: 30px;
  color: inherit;
}
.sq-rail-diff .gauge-track {
  stroke: #d5d1c9;
}
.sq-rail-diff .gauge-value,
.sq-rail-diff .gauge-needle {
  stroke-width: 3;
}
.sq-rail-diff .gauge-center {
  stroke-width: 1.8;
}
.sq-rail-cell[data-rail-tip]::after {
  content: attr(data-rail-tip);
  position: absolute;
  left: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%) translateX(6px);
  width: max-content;
  min-width: 190px;
  max-width: none;
  padding: 10px 12px;
  border: 1px solid rgba(240, 180, 135, .74);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.99), rgba(255,250,246,.99));
  box-shadow: 0 16px 32px rgba(65,47,29,.14);
  color: #4d3b2a;
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1.8;
  white-space: nowrap;
  text-align: right;
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease, transform .18s var(--ease-soft);
  z-index: 35;
}

.sq-source-tooltip {
  position: absolute;
  left: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%) translateX(6px);
  /* اندازه دقیقاً به‌قدرِ متن؛ قبلاً min-width ثابت باعث فضای خالیِ زیاد می‌شد */
  width: max-content;
  max-width: min(340px, calc(100vw - 230px));
  padding: 4px;
  border: 1px solid rgba(240, 180, 135, .74);
  border-radius: 12px;
  background: rgba(255, 253, 250, .98);
  box-shadow: 0 14px 30px rgba(65, 47, 29, .13);
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease, transform .18s var(--ease-soft);
  z-index: 45;
  backdrop-filter: blur(12px);
}

/* نوک راهنمای منبع/آزمون: همیشه از لبهٔ چپ به خانهٔ ریل اشاره می‌کند. */
.sq-source-tooltip::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 50%;
  width: 12px;
  height: 12px;
  border-left: 1px solid rgba(240, 180, 135, .74);
  border-bottom: 1px solid rgba(240, 180, 135, .74);
  background: rgba(255,253,250,.99);
  transform: translateY(-50%) rotate(45deg);
  pointer-events: none;
}

.sq-rail-src:hover .sq-source-tooltip,
.sq-rail-src:focus-within .sq-source-tooltip {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

.sq-source-tip-row {
  display: block;
  position: relative;
  padding: 4px 7px;
  border-radius: 7px;
  color: #4d3b2a;
  text-align: right;
  line-height: 1.6;
}

.sq-source-tip-row + .sq-source-tip-row {
  margin-top: 4px;
  padding-top: 8px;
}

.sq-source-tip-row + .sq-source-tip-row::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 50%;
  width: calc(100% - 10px);
  height: 1px;
  background: rgba(228, 218, 204, .9);
  transform: translateX(-50%);
}

.sq-source-tip-row b {
  font-size: 11px;
  font-weight: 850;
  color: #4d3b2a;
  overflow-wrap: anywhere;
}
.sq-rail-cell[data-rail-tip]::before {
  content: "";
  position: absolute;
  left: calc(100% + 4px);
  top: 50%;
  width: 12px;
  height: 12px;
  border-left: 1px solid rgba(240, 180, 135, .74);
  border-bottom: 1px solid rgba(240, 180, 135, .74);
  background: rgba(255,253,250,.99);
  transform: translateY(-50%) translateX(6px) rotate(45deg);
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease, transform .18s var(--ease-soft);
  z-index: 36;
}
.sq-rail-cell[data-rail-tip]:hover::after,
.sq-rail-cell[data-rail-tip]:focus-within::after,
.sq-rail-cell[data-rail-tip]:hover::before,
.sq-rail-cell[data-rail-tip]:focus-within::before {
  opacity: 1;
  transform: translateY(-50%) translateX(0) rotate(var(--rail-tip-rotate, 0deg));
}
.sq-rail-cell[data-rail-tip]:hover::before,
.sq-rail-cell[data-rail-tip]:focus-within::before {
  --rail-tip-rotate: 45deg;
}
.sq-item-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.sq-num {
  width: 26px; height: 26px; flex: none; border-radius: 8px; background: #f1efe8;
  display: grid; place-items: center; font-size: 12px; font-weight: 700; color: var(--muted);
}
.sq-num-btn {
  border: 0;
  padding: 0;
  font-family: inherit;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, transform .15s var(--ease-soft);
}
.sq-num-btn:hover,
.sq-num-btn:focus-visible {
  background: var(--orange-soft);
  color: var(--orange);
  transform: translateY(-1px);
}
.sq-item-topic { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: #2d766d; }
.sq-item-topic svg { width: 14px; height: 14px; }
.sq-item-code { margin-inline-start: auto; font-size: 11px; font-weight: 700; color: var(--orange); }
.sq-bank-time {
  position: relative;
  margin-inline-start: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 2px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #7d766c;
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1.6;
  white-space: nowrap;
  box-shadow: none;
  transition: color .16s ease;
  z-index: 30;
}
.sq-bank-time:hover,
.sq-bank-time:focus-visible {
  color: #4d3b2a;
}
.sq-bank-time b {
  color: #9a5a1f;
}
.sq-bank-time i {
  position: absolute;
  inset-block-start: calc(100% + 6px);
  inset-inline-start: 0;
  width: max-content;
  max-width: min(260px, 58vw);
  padding: 6px 9px;
  border: 1px solid #eadfce;
  border-radius: 8px;
  background: #fffdfa;
  box-shadow: 0 10px 22px rgba(65, 47, 29, .1);
  color: #4d3b2a;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.65;
  white-space: normal;
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity .16s ease, transform .18s var(--ease-soft);
  z-index: 95;
}
.sq-bank-time:hover i,
.sq-bank-time:focus-visible i {
  opacity: 1;
  transform: translateY(0);
}
/* ورقهٔ سفیدِ سؤال: صورت سؤال، شکل و گزینه‌ها روی «یک» سطح می‌نشینند تا مثل
   صفحهٔ کتاب یکپارچه دیده شوند، نه چند جزیرهٔ سفیدِ جدا روی زمینهٔ کارت. */
.sq-item .sq-sheet {
  background: #fff; border: 1px solid #f1efe9; border-radius: 12px; padding: 14px 16px;
}
.sq-item .sq-body {
  font-size: 14px; line-height: 2; color: var(--ink);
  background: transparent; border: 0; border-radius: 0; padding: 0;
}
/* اسکلتِ کوتاهِ محتوای سؤالی که هنوز از سرور نرسیده (تور ایمنیِ هیدریت). */
.sq-content-loading {
  display: block; min-height: 46px; border-radius: 12px;
  background: linear-gradient(90deg, #f3f1ec 25%, #eceae4 37%, #f3f1ec 63%);
  background-size: 400% 100%;
  animation: sqContentLoading 1.4s ease infinite;
}
@keyframes sqContentLoading { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) { .sq-content-loading { animation: none; } }

.sq-rich-text + .sq-content-image { margin-top: 10px; }
.sq-content-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  margin: 0 auto;
  border-radius: 12px;
}

/* پاسخ تشریحی عمودی: ستون اول در RTL سمت راست است و ستون دوم با خط میانی جدا می‌شود. */
.sq-explanation-columns {
  direction: rtl;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 0;
  margin-top: 10px;
  border: 1px solid #e7dfd3;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}
.sq-explanation-column {
  min-width: 0;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
}
.sq-explanation-column + .sq-explanation-column {
  border-inline-start: 1px solid #9d958b;
}
.sq-explanation-image {
  display: block;
  width: 100%;
  margin: 0;
  break-inside: avoid;
  page-break-inside: avoid;
}
.sq-explanation-image .sq-content-image {
  width: 100%;
  margin: 0;
  border-radius: 6px;
}
.sq-rich-text + .sq-explanation-columns { margin-top: 12px; }

.sq-src-more {
  color: var(--orange);
  background: var(--orange-soft);
  border-radius: 999px;
  padding: 2px 7px;
}

/* آخرین بلوکِ ورقه فاصلهٔ اضافه نمی‌گیرد و ورقه دور همه‌شان یکی می‌ماند */
.sq-item .sq-sheet > *:first-child { margin-top: 0; }
.sq-answer-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  align-content: start;
  /* چهار کادرِ یک سؤال هم‌قدند: `1fr` در گریدی که ارتفاعش auto است یعنی همهٔ
     سطرها به اندازهٔ بلندترین سطر. بدون این، گزینهٔ کسردار از گزینهٔ تک‌خطیِ
     کنارش بلندتر می‌شد و ردیف گزینه‌ها پله‌پله دیده می‌شد. */
  grid-auto-rows: 1fr;
  gap: 9px;
  margin-top: 14px;
}
/* کوتاه‌ها چهار ستون مساوی و سراسری‌اند؛ متوسط‌ها دوتایی و بلندها تمام‌عرض‌اند. */
.sq-answer-options.is-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sq-answer-options.is-row .sq-ans-opt { width: 100%; min-width: 0; }
.sq-answer-options.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* گزینهٔ تمام‌عرض کنارِ گزینهٔ دیگری نیست، پس هم‌قدسازی فقط ارتفاعِ بلندترین
   گزینه را چهار بار تکرار می‌کند؛ در این حالت هر کادر به‌اندازهٔ متنِ خودش است. */
.sq-answer-options.is-stack { grid-template-columns: minmax(0, 1fr); grid-auto-rows: max-content; }
/* سؤال تصویری گزینهٔ واقعی ندارد و این چهار کادر فقط جای کلیک‌اند؛ کمی بلندتر
   از کادرِ متنی، تا دکمه‌ها زیر تصویرِ سؤال بی‌جان و باریک دیده نشوند. */
.sq-answer-options.is-image-question .sq-ans-opt { min-height: 40px; }
/* چیدمانِ عمودی (کنارِ شکل): هر گزینه یک سطر، به‌اندازهٔ متنِ خودش و نه بیشتر.
   کادرِ تمام‌عرض برای «۱۰/۵» یعنی یک مستطیلِ خالیِ ۶۰۰پیکسلی؛ `fit-content` عرض
   را به محتوا می‌چسباند و `min-width` کفِ یک‌چهارمِ ستون را نگه می‌دارد تا کادر
   از دکمه هم کوچک‌تر نشود. سقفِ ۱۰۰٪ داخل fit-content است، پس گزینهٔ بلند به
   تمامِ عرضِ ستون می‌رسد و بعد می‌شکند — همان «دو ردیفی/تک ردیفی» شدنِ خودکار.
   کشیده‌شدنِ کادرها تا قدِ شکل عمداً انجام نمی‌شود (کادرهای بلندِ ناخواسته). */
.sq-answer-options.is-side,
.qv-opts.is-side,
.er-options.is-side {
  grid-template-columns: fit-content(100%);
  grid-auto-rows: max-content;
  align-items: start;
  gap: 7px;
  /* واحدِ cqw لازم است: `min-width: 25%` روی گرید‌آیتمی که عرضِ ترکش از خودِ
     آیتم می‌آید، حلقهٔ محاسباتی می‌سازد و مرورگر آن را auto می‌گیرد (سنجیده شد:
     کادر ۷۵px می‌ماند). با container-type، درصد از عرضِ خودِ ظرف حساب می‌شود. */
  container-type: inline-size;
}
.sq-answer-options.is-side .sq-ans-opt,
.qv-opts.is-side > span,
.er-options.is-side .er-opt { min-width: 25cqw; width: auto; }
.sq-ans-opt {
  display: flex; align-items: center; align-self: stretch; justify-content: flex-start; gap: 8px; text-align: start;
  width: 100%; height: auto;
  border: 1px solid var(--line); background: #fff; border-radius: 11px; padding: 2px 9px;
  min-height: 36px;
  font: inherit; font-size: 13px; cursor: pointer; transition: 0.14s ease; color: var(--ink);
}
.sq-ans-opt > span:last-child { min-width: 0; flex: 1 1 auto; align-self: center; overflow-wrap: anywhere; }
/* HTMLِ گزینهٔ متنی معمولاً یک <p> دارد. margin پیش‌فرض مرورگر همان متن تک‌خطی
   را بی‌دلیل بلندتر از گزینهٔ سؤال تصویری می‌کرد؛ فقط خود محتوا ارتفاع را زیاد می‌کند. */
.sq-ans-opt > span:last-child > :first-child { margin-top: 0; }
.sq-ans-opt > span:last-child > :last-child { margin-bottom: 0; }
.sq-ans-opt > span:last-child > p { margin-block: 0; }
.sq-ans-opt:hover { border-color: #f0b487; }
.sq-ans-opt.picked { border-color: #c9b8a4; background: #faf6ef; }
.sq-ans-opt.is-correct { border-color: #b3ddd0; background: #f1fbf7; }
.sq-ans-opt.picked:not(.is-correct) { border-color: #eec3b6; background: #fdf3f0; }
.sq-ans-opt:disabled {
  cursor: default;
}
.sq-ans-opt:disabled:not(.picked):not(.is-correct) {
  opacity: .58;
}
.sq-ans-no { width: 20px; height: 20px; flex: none; border-radius: 6px; background: #f1efe8; display: grid; place-items: center; font-size: 10.5px; font-weight: 700; color: var(--muted); }
.sq-ans-opt.is-correct .sq-ans-no { background: #2f9e83; color: #fff; }
/* ── چیدمانِ کتابی: شکل در یک ستون، گزینه‌ها روبه‌رویش ───────────────────────
   عرضِ ستونِ شکل همان درصدی است که مدیر در ویرایشگر داده (--sq-side-fig)، پس
   اندازهٔ دیداریِ شکل دقیقاً همان قبل می‌ماند و فقط جای گزینه‌ها عوض می‌شود.
   شکل پیش‌فرض سمتِ پایانِ خط (چپ در RTL) می‌نشیند — همان جایی که در دفترچه
   می‌نشیند — مگر مدیر صریحاً راست‌چینش کرده باشد. */
.sq-side-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--sq-side-fig, 30%);
  align-items: start;
  gap: 10px 16px;
  margin-top: 12px;
}
.sq-side-layout.is-figure-start { grid-template-columns: var(--sq-side-fig, 30%) minmax(0, 1fr); }
.sq-side-layout.is-figure-start .sq-side-figure { grid-column: 1; grid-row: 1; }
.sq-side-layout.is-figure-start .sq-side-options { grid-column: 2; grid-row: 1; }
.sq-side-layout .sq-answer-options,
.sq-side-layout .qv-opts,
.sq-side-layout .er-options { margin-top: 0; }
/* عرضِ درصدیِ خودِ شکل حالا مالِ ستون است، وگرنه درصد دوباره روی ستون اعمال
   می‌شود و شکل چندبرابر کوچک‌تر از انتخابِ مدیر درمی‌آید. */
.sq-side-figure .mkfig { width: 100% !important; margin: 0; }
@media (max-width: 760px) {
  /* روی موبایل ستونِ کناری معنا ندارد: شکل سرِ جای همیشگی‌اش بالای گزینه‌ها
     برمی‌گردد و اندازه‌اش هم همان درصدِ قبلی می‌ماند. */
  .sq-side-layout { grid-template-columns: minmax(0, 1fr); }
  .sq-side-layout .sq-side-figure,
  .sq-side-layout.is-figure-start .sq-side-figure { grid-column: 1; grid-row: 1; }
  .sq-side-layout .sq-side-options,
  .sq-side-layout.is-figure-start .sq-side-options { grid-column: 1; grid-row: 2; }
  /* عرض و ترازِ شکل دقیقاً همان چیزی می‌شود که بدون این چیدمان بود */
  .sq-side-figure .mkfig { width: var(--sq-side-fig, 30%) !important; }
  /* گزینهٔ خیلی کوتاه روی موبایل هم دوتایی می‌ماند؛ چهار سطرِ تک‌گزینه‌ای فقط
     صفحه را بلند می‌کند. بلندترها همان تک‌ستونی می‌مانند. */
  .sq-answer-options.is-side[data-narrow-layout="is-row"],
  .qv-opts.is-side[data-narrow-layout="is-row"],
  .er-options.is-side[data-narrow-layout="is-row"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
  }
  .sq-answer-options.is-side .sq-ans-opt,
  .qv-opts.is-side > span,
  .er-options.is-side .er-opt { min-width: 0; width: 100%; }
}
.sq-quick-row { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.sq-dunno { border: 1px dashed var(--line); background: transparent; border-radius: 9px; padding: 6px 12px; font: inherit; font-size: 12px; cursor: pointer; color: var(--muted); }
.sq-dunno:hover { color: var(--ink); border-color: #c9a23a; }
.sq-dunno:disabled { opacity: .55; cursor: default; }
.sq-show-answer {
  border: 1px solid #f0d3b4;
  background: #fffaf5;
  color: #9a5a1f;
  border-radius: 9px;
  padding: 6px 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .15s var(--ease-soft), background .15s ease, border-color .15s ease;
}
.sq-show-answer:hover {
  transform: translateY(-1px);
  background: var(--orange-soft);
  border-color: #f0b487;
}
.sq-result { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 8px; }
.sq-result.correct { background: #e9f8f2; color: #2f9e83; }
.sq-result.wrong { background: #fdeee9; color: #d3603f; }
.sq-result.dunno { background: #fbf3df; color: #b5891f; }
.sq-result.muted { background: #f1efe8; color: var(--muted); }
.sq-attempts { font-size: 11px; color: var(--muted); }
.student-history-summary {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}
.student-history-chart {
  width: 132px;
  aspect-ratio: 1;
  border-radius: 50%;
  display: grid;
  place-items: center;
  align-content: center;
  justify-self: center;
  background: conic-gradient(#2f9e83 0 calc(var(--correct) * 1%), #d3603f calc(var(--correct) * 1%) calc(var(--wrong) * 1%), #d7a72e calc(var(--wrong) * 1%) 100%);
  box-shadow: inset 0 0 0 18px #fff, 0 14px 32px rgba(65, 47, 29, .1);
}
.student-history-chart b {
  font-size: 24px;
  line-height: 1;
  color: var(--ink);
}
.student-history-chart span {
  font-size: 10px;
  color: var(--muted);
  font-weight: 800;
}
.student-history-stats {
  display: grid;
  gap: 4px;
}
.student-history-legend {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 14px 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.student-history-legend span::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  margin-inline-end: 5px;
}
.student-history-legend .correct::before { background: #2f9e83; }
.student-history-legend .wrong::before { background: #d3603f; }
.student-history-legend .dunno::before { background: #d7a72e; }
.student-history-table {
  border: 1px solid #efe7dc;
  border-radius: 14px;
  overflow: hidden;
  background: #fffdfa;
}
.student-history-head,
.student-history-row {
  display: grid;
  grid-template-columns: 42px minmax(98px, .85fr) minmax(126px, 1.1fr) minmax(112px, .95fr) minmax(104px, .85fr);
  align-items: center;
  column-gap: 12px;
}
.student-history-head {
  padding: 12px 14px;
  background: #f8f3eb;
  color: #4a4036;
  font-size: 12px;
  font-weight: 900;
}
.student-history-body {
  display: grid;
}
.student-history-row {
  min-height: 58px;
  padding: 10px 14px;
  border-top: 1px solid #efe7dc;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}
.student-history-row > span,
.student-history-head > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
}
.student-history-row .history-index {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  justify-self: center;
  background: #f1efe8;
  color: var(--muted);
}
.student-history-row .sq-result {
  display: inline-flex;
  justify-content: center;
  margin-inline: auto;
  min-width: 82px;
}
.student-history-row .history-set-link {
  display: inline-block; max-width: 100%; vertical-align: middle;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  color: var(--orange); font: inherit; font-weight: 800;
}
.student-history-row .history-set-link:hover { text-decoration: underline; }
@media (max-width: 640px) {
  .student-history-summary {
    grid-template-columns: 1fr;
  }
  .student-history-head,
  .student-history-row {
    grid-template-columns: 32px minmax(68px, .85fr) minmax(70px, .9fr) minmax(70px, .85fr) minmax(70px, .85fr);
    column-gap: 6px;
  }
  .student-history-head,
  .student-history-row {
    padding-inline: 8px;
    font-size: 10px;
  }
  .student-history-row .sq-result {
    min-width: 0;
    padding-inline: 6px;
    font-size: 10px;
  }
}
.sq-item .sq-explain { margin-top: 14px; }
.sq-reveal-panel {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  animation: sdBodyIn .24s ease;
}
.sq-reveal-tabs {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  padding: 4px;
  border: 1px solid #eee3d7;
  border-radius: 12px;
  background: #f8f6f1;
}
.sq-reveal-tabs button {
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  padding: 7px 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.sq-reveal-tabs button.on {
  background: #fff;
  color: #9a5a1f;
  box-shadow: 0 6px 14px rgba(65,47,29,.08);
}
.sq-reveal-block {
  border: 1px solid #eee3d7;
  border-radius: 13px;
  background: #fffdf9;
  padding: 12px 14px;
}
.sq-reveal-block h4 {
  margin: 0 0 8px;
  font-size: 12.5px;
  color: #9a5a1f;
}
.sq-reveal-block > div {
  font-size: 13px;
  line-height: 2;
  color: #4a463f;
}
.sq-answer-loading {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-weight: 750;
}
.sq-answer-loading::before {
  content: "";
  width: 14px;
  height: 14px;
  flex: none;
  border: 2px solid #eadfd3;
  border-top-color: var(--orange);
  border-radius: 50%;
  animation: spin .75s linear infinite;
}

.sq-info-bar {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 14px;
  margin-top: 14px; margin-bottom: 12px; padding-top: 12px; border-top: 1px solid #f0ede6;
}
.sq-info-actions { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.sq-info { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--muted); }
.sq-info svg { width: 17px; height: 17px; }
.sq-info.diff .difficulty-gauge { width: 30px; height: 26px; }
.sq-info-act {
  display: inline-flex; align-items: center; gap: 4px; margin-inline-start: 2px;
  border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 5px 10px;
  font: inherit; font-size: 11px; font-weight: 600; color: var(--muted); cursor: pointer; transition: 0.14s ease;
}
.sq-info-act:hover { border-color: #f0b487; color: var(--ink); }
.sq-info-act.on { background: #fbf0e3; color: #9a5a1f; border-color: #f0d3b4; }
.sq-info-act svg { width: 13px; height: 13px; }
.sq-info-bar .sq-bank-time i {
  inset-block-start: auto;
  inset-block-end: calc(100% + 6px);
  inset-inline-start: auto;
  inset-inline-end: 0;
}
.sq-card-pen {
  position: absolute;
  top: 12px;
  left: 14px;
  z-index: 22;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid #e8dfd1;
  border-radius: 10px;
  background: rgba(255,253,250,.96);
  color: #7d766c;
  box-shadow: 0 8px 18px rgba(65,47,29,.08);
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s var(--ease-soft);
}
.sq-card-pen:hover,
.sq-card-pen.on {
  border-color: #f0b487;
  background: #fff3e8;
  color: #9a5a1f;
  transform: translateY(-1px);
}
.sq-card-pen svg,
.sq-card-pen img {
  width: 23px;
  height: 23px;
}
.sq-card-set {
  top: 12px;
  left: 60px;
}
.sq-card-set svg {
  width: 20px;
  height: 20px;
}
.draw-pen-img {
  display: block;
  width: 23px;
  height: 23px;
  object-fit: contain;
}
.draw-tool .draw-pen-img {
  width: 20px;
  height: 20px;
}

.qset-layout {
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  width: min(100%, 1120px);
  margin-inline: auto;
}
.qset-layout.solo {
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
}
.qset-layout.detail {
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
}
.qset-detail-layout {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  direction: rtl;
}
.qset-index-panel,
.qset-main-cards {
  direction: rtl;
  min-width: 0;
}
.qset-index-panel {
  position: sticky;
  top: 86px;
  max-height: calc(100vh - 120px);
  overflow-y: auto;
  overflow-x: hidden;
  /* overscroll-behavior: contain اینجا نباشد — وقتی محتوای نوار فقط چند ده پیکسل
     بلندتر از پنل است، چرخِ موس همان چند پیکسل را می‌رود و بعد به صفحه منتقل
     نمی‌شود، یعنی اسکرول روی نوار عملاً قطع می‌شود. */
  /* نوار اسکرول پهن و قابل‌گرفتن با موس (به‌جای نوار نازکِ overlay سیستمی) */
  scrollbar-width: auto;
  scrollbar-color: #e8c3a1 transparent;
  padding-left: 6px;
  background:
    radial-gradient(circle at 100% 0, rgba(255,101,25,.07), transparent 180px),
    #fffdfa;
}
/* مرورگرهای تازه از همان scrollbar-width/scrollbar-color بالا استفاده می‌کنند و
   وقتی آن‌ها ست شده باشند، ::-webkit-scrollbar را کلاً نادیده می‌گیرند؛ پس این
   بلوک فقط فالبکِ مرورگرهای قدیمی است. */
@supports not (scrollbar-color: auto) {
  .qset-index-panel::-webkit-scrollbar {
    width: 12px;
  }
  .qset-index-panel::-webkit-scrollbar-track {
    background: #f7f1e9;
    border-radius: 99px;
    margin: 8px 0;
  }
  .qset-index-panel::-webkit-scrollbar-thumb {
    background: #e8c3a1;
    border: 3px solid #fffdfa;
    border-radius: 99px;
  }
  .qset-index-panel::-webkit-scrollbar-thumb:hover {
    background: var(--orange);
  }
  .qset-index-panel::-webkit-scrollbar-thumb:active {
    background: #e05c14;
  }
}
.qset-main-cards {
  display: grid;
  gap: 14px;
  align-content: start;
}
.qset-panel {
  border: 1px solid #eee5da;
  border-radius: 16px;
  background: #fffdfa;
  box-shadow: 0 14px 32px rgba(65,47,29,.06);
  padding: 14px;
  min-width: 0;
}
.qset-create {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
}
.qset-create input,
.qset-modal-search input,
.qset-auto-card input {
  width: 100%;
  min-width: 0;
  border: 1px solid #eadfd1;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 10px 12px;
  outline: none;
}
.qset-create input:focus,
.qset-modal-search input:focus,
.qset-auto-card input:focus {
  border-color: #f2a562;
  box-shadow: 0 0 0 3px rgba(255,101,25,.1);
}
.qset-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 0 12px;
  border: 1px solid #eadfd1;
  border-radius: 10px;
  background: #fff;
  color: var(--muted);
  cursor: text;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.qset-search:focus-within {
  border-color: #f2a562;
  box-shadow: 0 0 0 3px rgba(255,101,25,.1);
}
.qset-search > svg {
  width: 16px;
  height: 16px;
  flex: none;
}
.qset-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 10px 0;
}
.qset-search-clear {
  flex: none;
  width: 24px;
  height: 24px;
  display: none;
  place-items: center;
  border: 0;
  border-radius: 8px;
  background: #f7f1e8;
  color: #6b5f4e;
  cursor: pointer;
  transition: background .14s ease, color .14s ease;
}
.qset-search-clear.show {
  display: grid;
}
.qset-search-clear svg {
  width: 14px;
  height: 14px;
}
.qset-search-clear:hover {
  background: #fdeceb;
  color: #c24a3a;
}
.qset-filter-panel {
  display: grid;
  gap: 10px;
  margin: 0 0 12px;
  padding: 12px;
  border: 1px solid #eee5da;
  border-radius: 14px;
  background: #fffaf5;
}
.qset-filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.qset-filter-head strong {
  font-size: 13px;
  font-weight: 900;
}
.qset-filter-head small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.qset-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.qset-filter-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.qset-filter-field span {
  color: #8c8272;
  font-size: 10.5px;
  font-weight: 900;
}
.qset-filter-field select {
  width: 100%;
  min-width: 0;
  height: 38px;
  border: 1px solid #eadfd1;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  padding: 0 10px;
  outline: none;
}
.qset-filter-field select:focus {
  border-color: #f2a562;
  box-shadow: 0 0 0 3px rgba(255,101,25,.1);
}
.qset-filter-clear {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 0;
  background: transparent;
  color: #8c8272;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
}
.qset-filter-clear:hover { color: var(--orange); }
.qset-filter-clear svg { width: 14px; height: 14px; }
.qset-list {
  display: grid;
  gap: 8px;
}
.qset-card {
  display: grid;
  /* ستون چهارم = لینک همگام‌سازی با عرض ثابت تا آیکون همهٔ کارت‌ها دقیقاً زیر هم بیفتد */
  grid-template-columns: 42px minmax(0, 1fr) auto 32px auto;
  gap: 12px;
  align-items: center;
  border: 1px solid #eee5da;
  border-radius: 12px;
  background: #fff;
  padding: 8px 12px;
  color: var(--ink);
  font: inherit;
  text-align: right;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s var(--ease-soft);
}
.qset-card.pinned {
  border-color: #f0b487;
  background: linear-gradient(180deg, #fffaf5, #fff);
}
.qset-card:focus-visible {
  outline: 3px solid rgba(255, 95, 31, .16);
  outline-offset: 2px;
}
.qset-card-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--orange-soft);
  color: var(--orange);
}
.qset-card-icon svg {
  width: 22px;
  height: 22px;
}
.qset-card:hover,
.qset-card.active {
  border-color: #f0b487;
  background: #fff5eb;
  transform: translateY(-1px);
}
.qset-card-main,
.qset-row-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.qset-card-main {
  display: flex;
  align-items: center;
  gap: 10px;
}
.qset-count-cluster {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.qset-card-main small {
  flex: none;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f7f1e8;
  white-space: nowrap;
}
.qset-card-title {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.qset-card-title b { flex: 0 1 auto; }
.qset-card-title em {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #fff2e8;
  color: var(--orange);
  font-style: normal;
  font-size: 10px;
  font-weight: 900;
}
.qset-card-title em svg {
  width: 12px;
  height: 12px;
}
.qset-card-main b,
.qset-row-main b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qset-card-main small,
.qset-card-meta,
.qset-row-main small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.qset-card-meta {
  direction: ltr;
  unicode-bidi: isolate;
  white-space: nowrap;
}
/* لینک همگام‌سازی: ستون مستقل کنار تاریخ؛ عرض ثابت و همیشه رزروشده تا در همهٔ کارت‌ها هم‌راستا باشد */
.qset-card-sync {
  display: grid;
  place-items: center;
  width: 32px;
}
/* جای دکمهٔ اشتراک‌گذاری در مجموعه‌های دریافتی رزرو می‌ماند تا عرض ستون عملیات ثابت بماند */
.qset-card-action-slot {
  display: block;
  width: 32px;
  flex: none;
}
.qset-card-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
}
.qset-card-action {
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid #eadfd1;
  border-radius: 9px;
  background: #fff;
  color: #6b5f4e;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  padding: 0 10px;
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease, color .14s ease, transform .14s var(--ease-soft);
}
.qset-card-action svg {
  width: 16px;
  height: 16px;
}
.qset-card-action:hover {
  border-color: #f0b487;
  background: #fff7ef;
  color: var(--orange);
  transform: translateY(-1px);
}
.qset-card-action.primary {
  background: var(--orange);
  border-color: var(--orange);
  color: #fff;
  box-shadow: 0 8px 18px rgba(255,95,31,.14);
}
.qset-card-action.primary:hover {
  background: #f05a18;
  color: #fff;
}
.qset-card-action.icon-only {
  width: 32px;
  padding: 0;
}
.qset-card-action.icon-only.on {
  background: #fff2e8;
  border-color: #f0b487;
  color: var(--orange);
}
.qset-card-action.danger:hover {
  background: #fdeceb;
  border-color: #f0ccc6;
  color: #c24a3a;
}
.qset-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.qset-detail-head strong {
  font-size: 14px;
}
.qset-question-list,
.qset-practice-list,
.qset-manual-list {
  display: grid;
  gap: 10px;
}
.qset-question-row,
.qset-manual-row {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) minmax(112px, auto) auto;
  gap: 10px;
  align-items: center;
  min-height: 58px;
  border: 1px solid #eee5da;
  border-radius: 12px;
  background: #fff;
  padding: 10px;
}
.qset-question-row {
  cursor: grab;
}
.qset-index-panel .qset-question-row {
  grid-template-columns: 32px minmax(0, 1fr) auto;
  gap: 8px;
  min-height: 54px;
  cursor: grab;
}
.qset-index-panel .qset-row-diff {
  display: none;
}
.qset-index-panel .qset-row-main b {
  font-size: 11px;
  line-height: 1.65;
  white-space: nowrap;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.qset-index-panel .qset-row-main small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qset-question-row.dragging {
  opacity: .55;
  cursor: grabbing;
}
.qset-question-row.drag-over {
  border-color: #f0b487;
  background: #fff5eb;
  box-shadow: inset 0 0 0 2px rgba(255,101,25,.08);
}
.qset-manual-row {
  grid-template-columns: 24px minmax(0, 1fr) minmax(112px, auto);
  cursor: pointer;
}
.qset-manual-row.on {
  border-color: #8fd8c7;
  background: #f0fbf8;
}
.qset-row-no {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: #f2eee8;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.qset-row-diff {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.qset-row-diff .difficulty-gauge {
  width: 28px;
  height: 24px;
}
.qset-row-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.qset-jump-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  gap: 0;
  margin-bottom: 12px;
  overflow: hidden;
  border: 1px solid #eadfd1;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 5px 14px rgba(65,47,29,.04);
}
.qset-jump-form input {
  width: 100%;
  min-width: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  padding: 10px 12px;
  outline: none;
}
.qset-jump-form input:focus {
  box-shadow: none;
}
.qset-jump-form button {
  border: 0;
  border-inline-start: 1px solid #f0e4d8;
  border-radius: 0;
  background: #fff7ef;
  color: var(--orange);
  display: grid;
  place-items: center;
  cursor: pointer;
}
.qset-jump-form button svg {
  width: 17px;
  height: 17px;
}
.qset-jump-form:focus-within {
  border-color: #f2a562;
  box-shadow: 0 0 0 3px rgba(255,101,25,.09);
}
.qset-status-block,
.qset-sort-block {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
  padding: 10px;
  border: 1px solid #eee5da;
  border-radius: 13px;
  background: rgba(255,255,255,.8);
}
.qset-mini-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.qset-mini-head > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #4e473e;
  font-size: 11px;
  font-weight: 950;
}
.qset-mini-head svg {
  width: 14px;
  height: 14px;
  color: var(--orange);
}
.qset-mini-head small {
  color: #a19689;
  font-size: 9px;
  font-weight: 850;
}
.qset-status-filter {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}
.qset-status-chip,
.qset-status-clear {
  min-width: 0;
  min-height: 38px;
  border: 1px solid #eadfd1;
  border-radius: 10px;
  background: #fffdfa;
  color: #68645c;
  font: inherit;
  font-size: 10px;
  font-weight: 850;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 7px 9px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, color .15s ease, transform .15s var(--ease-soft);
}
.qset-status-chip span {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qset-status-chip span svg {
  flex: none;
  width: 13px;
  height: 13px;
}
.qset-status-chip b {
  flex: none;
  color: var(--muted);
}
.qset-status-chip:hover,
.qset-status-clear:hover {
  border-color: #f0b487;
  background: #fffaf4;
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(160,105,52,.10);
}
.qset-status-chip:active,
.qset-status-clear:active {
  transform: translateY(0) scale(.975);
  box-shadow: none;
}
.qset-status-chip:focus-visible,
.qset-status-clear:focus-visible,
.qset-sort-options button:focus-visible {
  outline: 2px solid rgba(255,101,25,.55);
  outline-offset: 2px;
}
.qset-status-chip.on {
  border-color: #f0d3b4;
  background: #fbf0e3;
  color: #9a5a1f;
}
.qset-status-chip.status-correct { color: #258f78; }
.qset-status-chip.status-correct.on { border-color: #a8dfd2; background: #effaf7; color: #167966; }
.qset-status-chip.status-wrong { color: #c65c4a; }
.qset-status-chip.status-wrong.on { border-color: #efc2ba; background: #fff1ef; color: #ad4636; }
.qset-status-chip.status-dunno { color: #b18224; }
.qset-status-chip.status-dunno.on { border-color: #ead39f; background: #fff8e8; color: #8c6516; }
.qset-status-chip.status-unused { color: #7b746b; }
.qset-status-chip.status-unused.on { border-color: #d9d1c6; background: #f5f2ed; color: #5f584f; }
.qset-status-clear {
  grid-column: 1 / -1;
  justify-content: center;
  color: #c75c47;
  background: #fff7f5;
}
.qset-sort-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
}
.qset-sort-options button {
  min-width: 0;
  min-height: 34px;
  border: 1px solid #eadfd1;
  border-radius: 9px;
  background: #fff;
  color: #71685d;
  font: inherit;
  font-size: 9px;
  font-weight: 900;
  line-height: 1.5;
  padding: 5px 4px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, color .15s ease, transform .15s var(--ease-soft), box-shadow .15s ease;
}
.qset-sort-options button:hover {
  border-color: #f0b487;
  background: #fffaf4;
  color: var(--orange);
  transform: translateY(-1px);
}
.qset-sort-options button:active {
  transform: translateY(0) scale(.97);
}
.qset-sort-options button.on {
  border-color: #f0b487;
  background: #fff2e8;
  color: #c95e1c;
  box-shadow: inset 0 0 0 1px rgba(255,101,25,.06);
}
.qset-sort-options button:disabled {
  opacity: .55;
  cursor: wait;
  transform: none;
}
.qset-sort-options button.is-busy {
  opacity: 1;
  border-color: #f0b487;
  background: #fff2e8;
  color: #c95e1c;
  animation: qsetSortBusy 1s ease-in-out infinite;
}
@keyframes qsetSortBusy {
  0%, 100% { opacity: 1; }
  50% { opacity: .6; }
}
.qset-sort-block p {
  margin: 0;
  color: #9a9084;
  font-size: 8.7px;
  font-weight: 750;
  line-height: 1.75;
}
.qset-flash {
  animation: qsetFlash 1.1s ease;
}
@keyframes qsetFlash {
  0%, 100% { box-shadow: 0 0 0 rgba(255,101,25,0); }
  28% { box-shadow: 0 0 0 4px rgba(255,101,25,.16); }
}
.qset-drag-handle {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid #eee5da;
  border-radius: 9px;
  background: #fffdfa;
  color: var(--muted);
  font-weight: 900;
  cursor: grab;
}
.qset-bank-mode {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid #f0d7c2;
  border-radius: 14px;
  background: #fff5eb;
  color: var(--ink);
}
.qset-bank-title {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.qset-bank-mode strong {
  font-size: 13px;
}
.qset-bank-mode span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.qset-add-tabs {
  flex: 0 0 auto;
  background: rgba(255,255,255,.72);
}
.qset-auto-bank {
  display: grid;
  gap: 14px;
  border: 1px solid #eee5da;
  border-radius: 16px;
  background: #fffdfa;
  padding: 16px;
}
.qset-auto-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.qset-auto-head strong {
  font-size: 14px;
}
.qset-auto-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.qset-auto-actions {
  display: flex;
  justify-content: flex-end;
}
.qset-add-card {
  border-color: #8fd8c7;
  background: #effbf8;
  color: #178f79;
}
.qset-add-card.remove {
  border-color: #f0c4bb;
  background: #fff1ef;
  color: #c75c47;
}
.icon-button.sm {
  width: 32px;
  height: 32px;
  border-radius: 9px;
}
.icon-button.danger {
  color: #c75c47;
}
.qset-picker-modal,
.qset-add-modal {
  display: grid;
  gap: 12px;
}
.modal.qset-modal-size {
  width: min(94vw, 680px);
  overflow: hidden;
  border-color: #eadfd1;
  box-shadow: 0 28px 70px rgba(55,39,24,.2);
}
.qset-picker-head {
  min-height: 86px;
  background:
    radial-gradient(circle at 85% 0, rgba(255,101,25,.12), transparent 190px),
    #fffdfa;
}
.qset-picker-title {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.qset-picker-title h2 {
  margin: 0 0 3px;
}
.qset-picker-title p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}
.qset-picker-title p b {
  color: var(--orange);
}
.qset-picker-emblem {
  flex: none;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(145deg, #ff7b32, #ff5f1f);
  color: #fff;
  box-shadow: 0 10px 22px rgba(255,95,31,.2);
}
.qset-picker-emblem svg {
  width: 24px;
  height: 24px;
}
.qset-modal-emblem {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin: -6px auto 0;
  background: #ffb11a;
  color: #fff;
  box-shadow: 0 14px 26px rgba(255,177,26,.24);
}
.qset-modal-emblem svg {
  width: 30px;
  height: 30px;
}
.qset-create-modal {
  width: 100%;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 10px;
  margin: 0;
  padding: 10px;
  border: 1px solid #f0ddca;
  border-radius: 14px;
  background: #fff7ef;
}
.qset-create-modal .qset-create-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #fff;
  color: var(--orange);
}
.qset-create-modal .qset-create-icon svg {
  width: 18px;
  height: 18px;
}
.qset-create-modal label {
  display: grid;
  gap: 2px;
  min-width: 0;
  min-height: 52px;
  padding: 6px 11px;
  border: 1px solid #e8d8c7;
  border-radius: 11px;
  background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.qset-create-modal label:focus-within {
  border-color: #f2a562;
  box-shadow: 0 0 0 3px rgba(255,101,25,.08);
}
.qset-create-modal label small {
  color: #9b8771;
  font-size: 9px;
  font-weight: 900;
}
.qset-create-modal input {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 1px 0 0;
}
.qset-create-modal input:focus,
.qset-create-modal input:focus-visible {
  border: 0;
  outline: 0;
  box-shadow: none;
}
.qset-create-modal .primary-button {
  align-self: center;
  min-height: 38px;
}
.qset-picker-search {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding: 0 12px;
  border: 1px solid #eadfd1;
  border-radius: 12px;
  background: #fff;
}
.qset-picker-search:focus-within {
  border-color: #f2a562;
  box-shadow: 0 0 0 3px rgba(255,101,25,.09);
}
.qset-picker-search > svg {
  flex: none;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #a19689;
  stroke-width: 2;
  stroke-linecap: round;
}
.qset-picker-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}
.qset-picker-search input:focus,
.qset-picker-search input:focus-visible {
  border: 0;
  outline: 0;
  box-shadow: none;
}
.qset-picker-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 2px;
}
.qset-picker-list-head strong {
  font-size: 12px;
}
.qset-picker-list-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}
.qset-picker-list {
  display: grid;
  gap: 8px;
  max-height: min(42vh, 360px);
  overflow: auto;
  padding: 5px 2px 10px;
  scroll-padding-top: 5px;
}
.qset-picker-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  border: 1px solid #eee5da;
  border-radius: 12px;
  background: #fffdfa;
  color: var(--ink);
  font: inherit;
  font-weight: 900;
  padding: 7px 9px;
  text-align: right;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s var(--ease-soft);
}
.qset-picker-row:hover {
  border-color: #f0b487;
  background: #fff8f1;
  transform: translateY(-1px);
}
.qset-picker-folder {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #fff1e5;
  color: var(--orange);
}
.qset-picker-folder svg {
  width: 21px;
  height: 21px;
}
.qset-picker-row-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.qset-picker-row-main b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qset-picker-row-main small {
  color: var(--muted);
  font-size: 10px;
}
.qset-picker-row.added {
  border-color: #afe0d4;
  background: #f1fbf8;
  cursor: pointer;
}
.qset-picker-row.added .qset-picker-add {
  border-color: #efc3bb;
  background: #fff;
  color: #b64c3b;
}
.qset-picker-add {
  min-width: 74px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid #f0d0b5;
  border-radius: 9px;
  background: #fff5eb;
  color: #c85c1b;
  font-size: 10px;
  font-weight: 950;
}
.qset-picker-add svg {
  width: 13px;
  height: 13px;
}
.qset-picker-empty {
  min-height: 128px;
  border: 1px dashed #e6d9c9;
  border-radius: 12px;
  background: #fffdfa;
}
.qset-picker-footer {
  justify-content: space-between;
}
.qset-picker-footer > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}
.qset-tabs {
  justify-self: center;
}
.qset-auto-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.qset-auto-card {
  display: grid;
  gap: 8px;
  border: 1px solid #eee5da;
  border-radius: 14px;
  background: #fff;
  padding: 12px;
}
.qset-auto-card span {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
}
.qset-auto-card small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.qset-auto-card input::placeholder {
  color: #aaa199;
  opacity: .75;
}
.qset-auto-card .difficulty-gauge {
  width: 30px;
  height: 25px;
}
@media (max-width: 900px) {
  .qset-layout {
    grid-template-columns: 1fr;
  }
  .qset-detail-layout {
    grid-template-columns: 1fr;
    direction: rtl;
  }
  .qset-index-panel {
    position: static;
    max-height: none;
  }
  .qset-question-row {
    grid-template-columns: 32px minmax(0, 1fr);
  }
  .qset-card {
    grid-template-columns: 42px minmax(0, 1fr) auto 32px;
  }
  .qset-card-actions {
    grid-column: 1 / -1;
    flex-wrap: wrap;
    padding-top: 4px;
  }
  .qset-row-diff,
  .qset-row-actions {
    grid-column: 2;
    justify-content: flex-start;
  }
  .qset-bank-mode {
    align-items: stretch;
    flex-direction: column;
  }
  .qset-add-tabs {
    width: 100%;
  }
  .qset-add-tabs .seg {
    flex: 1;
  }
  .qset-auto-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .qset-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .qset-create,
  .qset-create-modal,
  .qset-auto-grid {
    grid-template-columns: 1fr;
  }
  .qset-card {
    grid-template-columns: 38px minmax(0, 1fr) 32px;
  }
  .qset-card-meta {
    grid-column: 2;
  }
  .qset-card-action span {
    display: none;
  }
  .qset-card-action {
    width: 32px;
    padding: 0;
  }
  .qset-filter-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .qset-filter-grid {
    grid-template-columns: 1fr;
  }
  .qset-picker-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  .qset-picker-row small {
    grid-column: 2;
  }
}
.sq-visual-badge {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  border-radius: 999px;
  background: #2a8a7a;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

/* یادداشت تصویری و قلم سؤال */
.draw-modal-head {
  gap: 14px;
}
.draw-modal-head h2 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.draw-modal-head small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}
.draw-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
#drawSaveState {
  min-width: 84px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #f7f4ee;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-align: center;
}
#drawSaveState[data-tone="ok"] {
  background: #eaf8f4;
  color: #168878;
}
#drawSaveState[data-tone="error"] {
  background: #fdeceb;
  color: #c24a3a;
}
#drawSaveState[data-tone="warn"] {
  background: #fff6df;
  color: #9a6a13;
}
.draw-modal-body {
  padding: 0;
  background: #fbfaf7;
}
.draw-toolbar {
  position: sticky;
  top: 0;
  z-index: 8;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
  background: rgba(255,253,250,.92);
  backdrop-filter: blur(14px);
}
.draw-tool,
.draw-icon-btn,
.draw-control {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  border: 1px solid #e8dfd1;
  border-radius: 10px;
  background: #fff;
  color: #6f675c;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
}
.draw-tool,
.draw-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s var(--ease-soft);
}
.draw-tool:hover,
.draw-icon-btn:hover {
  border-color: #f0b487;
  color: var(--ink);
  transform: translateY(-1px);
}
.draw-tool.on {
  border-color: #f0b487;
  background: #fff3e8;
  color: #9a5a1f;
}
.draw-tool svg,
.draw-icon-btn svg {
  width: 15px;
  height: 15px;
}
.draw-icon-btn#drawUndo svg,
.draw-icon-btn#drawRedo svg {
  width: 18px;
  height: 18px;
  stroke-width: 2.35;
}
.draw-control {
  display: grid;
  place-items: center;
  padding: 0;
}
.draw-control input[type="color"] {
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: transparent;
}
.draw-control input[type="range"] {
  width: 100%;
  height: 16px;
  accent-color: #f26a1b;
}
.draw-control:not(.draw-color) {
  width: 144px;
  min-width: 144px;
}
.draw-range-control {
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
  justify-content: stretch;
  align-content: center;
  gap: 3px;
  height: 42px;
  min-height: 42px;
  padding: 5px 10px 4px;
}
.draw-range-control span {
  justify-self: start;
  color: #7d766c;
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}
.draw-shape-group {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid #eee6da;
  border-radius: 12px;
  background: #fffdfa;
}
.draw-shape {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #6f675c;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s var(--ease-soft);
}
.draw-shape:hover,
.draw-shape.on {
  border-color: #f0b487;
  background: #fff3e8;
  color: #9a5a1f;
  transform: translateY(-1px);
}
.draw-shape svg {
  width: 17px;
  height: 17px;
}
.draw-layout {
  display: grid;
  grid-template-columns: 226px minmax(0, 1fr);
  min-height: min(70vh, 740px);
}
.draw-side {
  border-inline-end: 1px solid var(--line);
  background: rgba(255,255,255,.72);
  padding: 12px;
  overflow: auto;
  scrollbar-width: none;
}
.draw-side::-webkit-scrollbar,
.draw-stage-scroll::-webkit-scrollbar,
.draw-simple-toolbar::-webkit-scrollbar,
.modal.xlarge::-webkit-scrollbar {
  display: none;
}
.draw-side-block + .draw-side-block {
  margin-top: 14px;
}
.draw-side-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.draw-side-title strong {
  font-size: 12px;
}
.draw-side-title button,
.draw-list-item,
.draw-layer button {
  border: 1px solid #e8dfd1;
  background: #fff;
  color: #6f675c;
  border-radius: 9px;
  font: inherit;
  font-size: 10.5px;
  font-weight: 800;
  cursor: pointer;
}
.draw-side-title button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 8px;
}
.draw-side-title svg { width: 13px; height: 13px; }
.draw-list {
  display: grid;
  gap: 7px;
}
.draw-list-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  gap: 6px;
  align-items: stretch;
}
.draw-list-row.on .draw-list-item {
  border-color: #f0b487;
  background: #fff6ed;
  color: #9a5a1f;
}
.draw-list-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  padding: 9px 10px;
  text-align: right;
}
.draw-list-item span {
  color: var(--muted);
  font-size: 10px;
}
.draw-list-delete {
  display: grid;
  place-items: center;
  border: 1px solid #eadfce;
  border-radius: 9px;
  background: #fff;
  color: #b45b3d;
  cursor: pointer;
}
.draw-list-delete svg {
  width: 14px;
  height: 14px;
}
.draw-layers {
  display: grid;
  gap: 8px;
}
.draw-layer {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  align-items: stretch;
  padding: 6px;
  border: 1px solid #eee6da;
  border-radius: 12px;
  background: #fffdfa;
}
.draw-layer.on {
  border-color: #f0b487;
  box-shadow: 0 8px 18px rgba(65,47,29,.06);
}
.draw-layer.locked {
  opacity: .74;
}
.draw-layer-main {
  grid-column: 1 / -1;
  text-align: right;
  padding: 7px 8px;
}
.draw-layer-main b,
.draw-layer-main small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.draw-layer-main small {
  margin-top: 2px;
  color: var(--muted);
}
.draw-layer button:not(.draw-layer-main) {
  display: grid;
  place-items: center;
  padding: 0;
}
.draw-layer button:disabled {
  opacity: .4;
  cursor: not-allowed;
}
.draw-layer svg {
  width: 13px;
  height: 13px;
}
.draw-board {
  min-width: 0;
  padding: 12px;
}
.draw-version-warning {
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid #f0d3b4;
  border-radius: 12px;
  background: #fff6ed;
  color: #9a5a1f;
  font-size: 11px;
  font-weight: 850;
}
.draw-stage-scroll {
  height: min(76vh, 860px);
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f7f4ee;
}
.draw-stage {
  position: relative;
  width: min(980px, 100%);
  min-height: 590px;
  margin: 0 auto;
  transform-origin: top center;
  transition: transform .16s var(--ease-soft);
}
.draw-stage-shell,
.draw-stage-shell * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}
.draw-stage-shell img {
  -webkit-user-drag: none;
  user-drag: none;
  pointer-events: none;
}
.draw-question-card {
  position: relative;
  z-index: 1;
  min-height: 760px;
  /* فضای خالیِ فراوان زیر صورت سؤال برای حل‌کردن و نوشتن (بیشترین سطحِ کار) */
  padding: 18px 22px 560px 86px;
  background: #fff;
  color: var(--ink);
}
.draw-question-content {
  width: 100%;
  transform-origin: top right;
  transition: transform .14s var(--ease-soft);
  will-change: transform;
}
.draw-question-body {
  font-size: 16px;
  line-height: 2.05;
}
.draw-question-card.has-body-visual .draw-question-body .mkfig {
  max-width: 72%;
}
.draw-question-card.has-body-visual .draw-question-body .mkfig img {
  width: 100%;
  height: auto;
  max-height: 340px;
  object-fit: contain;
}
.draw-question-card.has-body-visual .draw-question-body > .sq-content-image {
  width: min(78%, 720px);
  max-height: 430px;
  object-fit: contain;
}
/* روی نمایشگرهای بزرگ، صورت سؤال به سمت راست (ابتدای RTL) می‌چسبد تا سمت چپ برای نوشتن/حل باز بماند */
@media (min-width: 720px) {
  .draw-question-body {
    max-width: 100%;
    margin-inline-start: 0;
    margin-inline-end: auto;
  }
  .draw-question-body .sq-content-image { max-width: 100%; height: auto; margin-inline-start: auto; margin-inline-end: 0; }
}
.draw-question-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  grid-auto-rows: 1fr;   /* هر چهار کادر هم‌ارتفاع، مثل بقیهٔ نمایش‌های سؤال */
  gap: 12px;
  margin-top: 24px;
}
.draw-question-options.is-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.draw-question-options.is-row > div { width: 100%; min-width: 0; }
.draw-question-options.is-stack { grid-template-columns: minmax(0, 1fr); grid-auto-rows: max-content; }
.draw-question-options .mkfig { width: 100% !important; max-width: 100%; margin: 4px auto; }
.draw-question-options img { display: block; width: auto; max-width: 100%; height: auto; max-height: 240px; margin: 0 auto; object-fit: contain; }
.draw-question-options > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 9px 12px;
  border: 1px solid #eee6da;
  border-radius: 10px;
  background: #fffdfa;
}
.draw-question-options b {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #f1efe8;
  color: var(--muted);
}
/* سؤال متنیِ صفحهٔ نوشتن از همان pq-* چاپ استفاده می‌کند. این سه قاعده دقیقاً
   تنظیمات قالب سادهٔ چاپ‌اند، بدون ابعاد و قابِ کامل A4 که برای بوم لازم نیست. */
.draw-print-question {
  color: #24211d;
  font-family: "Vazirmatn", "B Nazanin", Tahoma, sans-serif;
  text-rendering: optimizeLegibility;
}
.draw-print-question .pq-body { font-size: 15px; font-weight: 480; line-height: 2.12; }
.draw-print-question .pq-option { color: #35302a; font-size: 14.3px; line-height: 1.9; }
.draw-print-question .pq-option b { color: inherit; }
/* چاپ برای حفظ قوارهٔ دفترچه ستون شکل را حداقل ۲۷٪ می‌کند؛ بومِ نوشتن باید
   مثل بانک سؤال دقیقاً درصد ذخیره‌شدهٔ خودِ شکل را نگه دارد، حتی اگر کوچک‌تر باشد. */
.draw-print-question .pq-side-layout {
  grid-template-columns: minmax(0, 1fr) var(--pq-side-fig, 30%);
}
.draw-print-question .pq-side-layout.is-figure-start {
  grid-template-columns: var(--pq-side-fig, 30%) minmax(0, 1fr);
}
.draw-svg {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  touch-action: none;
  -webkit-tap-highlight-color: transparent;
  cursor: crosshair;
}
.draw-svg[data-tool="eraser"] { cursor: cell; }
.draw-svg[data-tool="select"] { cursor: default; }
.draw-svg[data-tool="pan"] { cursor: grab; }
.draw-svg[data-tool="pan"].is-panning { cursor: grabbing; }
.draw-svg[data-tool="move-question"] { cursor: grab; }
.draw-svg-item {
  vector-effect: non-scaling-stroke;
  pointer-events: stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: filter .12s ease, opacity .12s ease;
}
text.draw-svg-item {
  pointer-events: bounding-box;
}
.draw-svg-item.selected {
  filter: drop-shadow(0 0 4px rgba(242,106,27,.55));
}
.draw-selection {
  pointer-events: none;
}
.draw-selection rect {
  fill: none;
  stroke: rgba(242,106,27,.78);
  stroke-width: 1.5;
  stroke-dasharray: 8 7;
  vector-effect: non-scaling-stroke;
}
.draw-marquee {
  fill: rgba(242,106,27,.08);
  stroke: rgba(242,106,27,.82);
  stroke-width: 1.5;
  stroke-dasharray: 8 6;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}
.draw-handle {
  fill: #fff;
  stroke: #f26a1b;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
  pointer-events: all;
  cursor: nwse-resize;
  filter: drop-shadow(0 3px 6px rgba(65,47,29,.2));
}
.draw-footer {
  gap: 9px;
}

/* چیدمانِ چرک‌نویس/نوشتن روی سؤال ستونی است تا سر و پای مودال همیشه سرِ جایشان بمانند
   و فقط صفحهٔ کار اسکرول شود؛ ارتفاع با dvh بسته می‌شود چون روی تبلت/موبایل، vh
   ارتفاعِ «بدون نوار آدرس» است و مودال از بالا و پایین بیرون می‌زد. */
.modal.draw-simple-modal {
  width: min(1120px, 96vw);
  max-height: 92vh;
  max-height: min(92vh, calc(100dvh - 40px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.draw-simple-modal .draw-modal-head {
  min-height: 62px;
  padding-block: 14px;
  flex: 0 0 auto;
}

.draw-simple-modal .draw-footer {
  flex: 0 0 auto;
}

.draw-simple-modal .draw-modal-body {
  background: #f8f6f1;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.draw-simple-layout {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}

.draw-simple-layout .draw-board {
  padding: 10px;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.draw-stage-shell {
  position: relative;
  min-height: 0;
}

.draw-simple-modal .draw-stage-shell {
  flex: 1 1 auto;
  display: flex;
  min-height: 0;
}

.draw-simple-modal .draw-stage-scroll {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  border-radius: 14px;
  background: #fff;
}

.draw-simple-modal .draw-stage {
  /* صفحهٔ کار تمام عرض می‌شود تا دور صورت سؤال (به‌خصوص سمت راست) فضای خالی خاکستری نماند */
  width: 100%;
  /* دستِ‌کم به‌اندازهٔ کادرِ دیده‌شده، و روی صفحه‌های بلند به‌اندازهٔ فضای موردنیازِ حل */
  min-height: max(100%, 720px);
}

.draw-simple-modal .draw-question-card {
  min-height: max(100%, 720px);
  /* فضای خالیِ زیرِ صورت سؤال برای حل؛ روی تبلت‌های کوتاه‌تر کمتر می‌شود تا اسکرولِ بی‌مورد نخورد */
  padding: 18px 22px clamp(260px, 52vh, 560px) 86px;
}

.draw-simple-toolbar {
  position: absolute;
  left: 16px;
  top: 18px;
  z-index: 12;
  display: grid;
  gap: 5px;
  /* روی تبلت‌های کوتاه، نوار ابزار از کادر بیرون می‌زد؛ حالا خودش اسکرول می‌شود */
  max-height: calc(100% - 32px);
  overflow-y: auto;
  scrollbar-width: none;
  padding: 8px 7px;
  border: 1px solid #eadfce;
  border-radius: 20px;
  background: rgba(255,253,250,.94);
  backdrop-filter: blur(16px);
  box-shadow: 0 14px 30px rgba(65,47,29,.12);
}

.draw-simple-toolbar .draw-tool,
.draw-simple-toolbar .draw-icon-btn {
  position: relative;
  width: 42px;
  min-width: 42px;
  height: 42px;
  min-height: 42px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  color: #746b5f;
  display: grid;
  place-items: center;
  padding: 0;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s var(--ease-soft);
}

/* جداکنندهٔ ظریف بین ابزارهای نوشتن و دکمه‌های تاریخچه/نمایش */
.draw-simple-toolbar #drawUndo {
  margin-top: 9px;
}
.draw-simple-toolbar #drawUndo::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 8px;
  right: 8px;
  height: 1px;
  background: #eee3d2;
}

.draw-simple-toolbar #drawQuestionSmaller {
  margin-top: 9px;
}

.draw-simple-toolbar #drawQuestionSmaller,
.draw-simple-toolbar #drawQuestionLarger {
  font-size: 24px;
  font-weight: 850;
  line-height: 1;
}

.draw-simple-toolbar #drawQuestionSmaller::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 8px;
  right: 8px;
  height: 1px;
  background: #eee3d2;
}

.draw-simple-toolbar .draw-tool:hover,
.draw-simple-toolbar .draw-icon-btn:hover {
  border-color: #f2c5a2;
  background: var(--orange-soft);
  color: var(--orange);
  transform: translateY(-1px);
}

.draw-simple-toolbar .draw-tool.on,
.draw-simple-toolbar .draw-icon-btn.on {
  border-color: #f2c5a2;
  background: #fff4ec;
  color: var(--orange);
  box-shadow: 0 8px 16px rgba(255,107,24,.12);
}

.draw-simple-toolbar .draw-tool svg,
.draw-simple-toolbar .draw-icon-btn svg {
  width: 21px;
  height: 21px;
  stroke-width: 2;
}

.draw-simple-toolbar .draw-icon-btn:disabled {
  opacity: .42;
  cursor: not-allowed;
  transform: none;
}

.draw-simple-toolbar .draw-tool-svg {
  opacity: .86;
  transition: opacity .16s ease, transform .16s var(--ease-soft);
}

.draw-simple-toolbar .draw-tool:hover .draw-tool-svg,
.draw-simple-toolbar .draw-tool.on .draw-tool-svg {
  opacity: 1;
}

.draw-simple-toolbar .draw-tool[data-draw-tool="pen"]::after,
.draw-simple-toolbar .draw-tool[data-draw-tool="highlight"]::after {
  content: "";
  position: absolute;
  left: 13px;
  right: 13px;
  bottom: 5px;
  height: 2.5px;
  border-radius: 999px;
  background: var(--draw-pen-color, #2563eb);
  box-shadow: 0 1px 4px color-mix(in srgb, var(--draw-pen-color, #2563eb) 30%, transparent);
}

.draw-simple-toolbar .draw-tool[data-draw-tool="highlight"]::after {
  background: var(--draw-highlight-color, #facc15);
  box-shadow: 0 1px 5px color-mix(in srgb, var(--draw-highlight-color, #facc15) 34%, transparent);
}

.draw-simple-toolbar .draw-icon-btn.off {
  color: #b7afa4;
  background: #f3f0e9;
}

.draw-simple-popover {
  position: absolute;
  left: 76px;
  top: 20px;
  z-index: 11;
  display: grid;
  gap: 14px;
  width: min(390px, calc(100% - 110px));
  padding: 17px 20px;
  border-radius: 24px;
  border: 1px solid #eadfce;
  background: rgba(255,253,250,.96);
  color: var(--ink);
  backdrop-filter: blur(16px);
  box-shadow: 0 18px 38px rgba(65,47,29,.14);
  opacity: 1;
  transform: translateX(0) scale(1);
  transform-origin: top left;
  transition: opacity .16s ease, transform .16s var(--ease-soft), visibility .16s ease;
}

.draw-simple-popover.is-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-8px) scale(.98);
}

.draw-size-picker {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 12px;
}

.draw-size-picker span {
  width: 22px;
  height: 2px;
  border-radius: 999px;
  background: #7a7166;
  box-shadow: 0 6px 0 #7a7166, 0 -6px 0 #7a7166;
  opacity: .82;
}

.draw-size-picker input {
  width: 100%;
  accent-color: var(--orange);
}

.draw-size-picker b {
  color: var(--ink);
  font-size: 14px;
  text-align: center;
}

.draw-color-palette {
  display: flex;
  align-items: center;
  gap: 16px;
}

.draw-color-palette button,
.draw-custom-color {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: var(--swatch, #fff);
  color: #7a7166;
  cursor: pointer;
  box-shadow: 0 0 0 0 rgba(255,255,255,0);
}

.draw-color-palette button.on {
  box-shadow: 0 0 0 10px color-mix(in srgb, var(--swatch, #fff) 22%, transparent);
}

.draw-custom-color {
  border: 2px solid #ded4c5;
  background: #fff;
  position: relative;
}

.draw-custom-color svg {
  width: 20px;
  height: 20px;
}

.draw-custom-color input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.draw-simple-modal .draw-footer {
  padding-block: 12px;
  flex-wrap: wrap;
}

/* زمانِ دفترچهٔ فعال، داخل خودِ چرک‌نویس: دانش‌آموز برای دیدن زمان مجبور نیست چرک‌نویس را ببندد */
.draw-exam-clock {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid #e6ded0;
  background: #fbf7ef;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}
.draw-exam-clock i {
  font-style: normal;
  color: var(--muted);
  font-weight: 700;
}
.draw-exam-clock b {
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}
.draw-exam-clock.danger {
  border-color: #f3c2bb;
  background: #fdecea;
  color: #b93a2a;
}
.draw-exam-clock.danger i { color: #c4655a; }

/* ثبت پاسخ بدون بستنِ چرک‌نویس */
.draw-answer-bar {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
}
.draw-answer-opt {
  width: 42px;
  height: 42px;
  border-radius: 13px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
}
.draw-answer-opt:hover { border-color: var(--orange); }
.draw-answer-opt.on {
  background: var(--orange);
  border-color: var(--orange);
  color: #fff;
}

@media (max-width: 840px) {
  .draw-layout {
    grid-template-columns: 1fr;
  }
  .draw-side {
    border-inline-end: 0;
    border-bottom: 1px solid var(--line);
    max-height: 220px;
  }
  .draw-stage-scroll {
    height: calc(100vh - 360px);
  }
  .draw-stage,
  .draw-question-card {
    min-height: 540px;
  }
  .draw-question-card {
    padding: 18px;
  }
  .draw-question-options {
    grid-template-columns: 1fr;
  }
  .draw-question-options.is-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .draw-tool b {
    display: none;
  }
  .draw-simple-modal .draw-stage-scroll {
    height: auto; /* ارتفاع از چیدمانِ ستونیِ مودال می‌آید، نه از vh */
  }
  .draw-simple-modal .draw-stage,
  .draw-simple-modal .draw-question-card {
    min-height: max(100%, 520px);
  }
  .draw-simple-modal .draw-question-card {
    padding: 14px 14px clamp(200px, 46vh, 420px) 68px;
  }
  .draw-simple-toolbar {
    left: 10px;
    top: 12px;
    gap: 6px;
    padding: 8px 6px;
    border-radius: 18px;
  }
  .draw-simple-toolbar .draw-tool,
  .draw-simple-toolbar .draw-icon-btn {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    border-radius: 14px;
  }
  .draw-simple-popover {
    left: 60px;
    top: 12px;
    width: min(310px, calc(100% - 78px));
    padding: 13px 14px;
    gap: 10px;
    border-radius: 18px;
  }
  .draw-color-palette {
    gap: 10px;
  }
}

/* موبایل: مودالِ نوشتن تمام‌صفحه است ولی با ارتفاعِ واقعیِ همان لحظه (dvh)، نه 100vh
   که با باز بودن نوار آدرس از پایین بیرون می‌زد. بعد از قانون‌های بالا می‌آید تا برنده شود. */
@media (max-width: 640px) {
  .modal.draw-simple-modal {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }
}

/* تبلت و صفحه‌های کم‌ارتفاع: نوار ابزار و پای مودال جا را از صفحهٔ کار نگیرند */
@media (max-height: 700px) {
  .draw-simple-modal .draw-modal-head {
    min-height: 0;
    padding-block: 9px;
  }
  .draw-simple-modal .draw-footer {
    padding-block: 8px;
  }
  .draw-simple-layout .draw-board {
    padding: 7px;
  }
  .draw-simple-modal .draw-stage,
  .draw-simple-modal .draw-question-card {
    min-height: max(100%, 460px);
  }
  .draw-simple-toolbar {
    top: 10px;
    left: 10px;
    gap: 3px;
    padding: 6px 5px;
  }
  .draw-simple-toolbar .draw-tool,
  .draw-simple-toolbar .draw-icon-btn {
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    border-radius: 12px;
  }
  .draw-simple-toolbar #drawUndo {
    margin-top: 6px;
  }
  .draw-answer-opt {
    width: 38px;
    height: 38px;
  }
}

/* نوار کناری فیلترها */
.sbank-side {
  position: sticky; top: 16px;
  background: var(--card); border: 1px solid var(--line); border-radius: 16px;
  padding: 6px; max-height: calc(100vh - 32px); overflow-y: auto;
}
.sd-summary-head { display: flex; align-items: center; gap: 7px; padding: 12px 12px 8px; font-size: 13px; }
.sd-summary-head svg { width: 16px; height: 16px; color: var(--orange); }
.sd-summary { padding: 0 12px 10px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.sd-sel-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sd-empty-sel { font-size: 11px; color: var(--muted); padding: 4px 0; }
.sd-clear { font-size: 11px; margin-top: 8px; padding: 5px 10px; }

.sd-section {
  border-bottom: 1px solid #f1efe9;
  border-radius: 12px;
  overflow: hidden;
}
.sd-section[open] { background: #fffdf9; }
.sd-section > summary {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px; font-size: 12.5px; font-weight: 700; cursor: pointer; color: var(--ink); list-style: none;
}
.sd-section > summary::-webkit-details-marker { display: none; }
.sd-section > summary svg { width: 15px; height: 15px; color: var(--muted); transition: transform .2s ease; }
.sd-section[open] > summary svg { transform: rotate(180deg); }
.sd-body { padding: 0 12px 12px; }
.sd-select, .sd-num { width: 100%; border: 1px solid var(--line); border-radius: 9px; padding: 7px 9px; font: inherit; font-size: 12px; background: #fff; }
.sd-num { width: 90px; }
.sd-inline { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--muted); }
.sd-mini-label { display: block; font-size: 11px; color: var(--muted); margin-bottom: 6px; }
.sd-hint { display: block; font-size: 10px; color: var(--muted); margin-top: 7px; }
.sd-limit-box {
  display: grid;
  gap: 9px;
}
.sd-limit-box .sd-select {
  height: 38px;
  font-weight: 800;
}
.sd-limit-box .sd-inline {
  justify-content: space-between;
}
.sd-limit-box .sd-num {
  width: 118px;
  height: 42px;
  text-align: center;
  font-weight: 800;
}
.sd-recent-row {
  display: grid;
  grid-template-columns: minmax(82px, 1fr) auto auto;
  align-items: center;
  gap: 8px;
}
.sd-recent-row .sd-num {
  width: 100%;
  height: 40px;
  text-align: center;
  font-weight: 900;
}
.sd-recent-row > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.sd-apply-btn {
  height: 40px;
  border: 1px solid #f0d3b4;
  border-radius: 10px;
  background: var(--orange-soft);
  color: #9a5a1f;
  padding: 0 12px;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
}
.sd-apply-btn:hover {
  border-color: #f0b487;
  background: #ffe9d5;
  transform: translateY(-1px);
}
.sd-check-group { display: flex; flex-direction: column; gap: 2px; }
.sd-check, .sd-radio {
  display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 9px;
  font-size: 12px; cursor: pointer; transition: background .12s ease;
}
.sd-check:hover, .sd-radio:hover { background: #fff7ef; transform: translateX(-1px); }
.sd-check.on, .sd-radio.on { color: #9a5a1f; font-weight: 800; background: #fff3e8; }
.sd-check input, .sd-radio input { width: 15px; height: 15px; flex: none; accent-color: var(--orange); }
.sd-check b { margin-inline-start: auto; font-size: 11px; color: var(--muted); }
.sd-radio-group { display: flex; flex-direction: column; gap: 2px; }
.composition-filter {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.comp-nested {
  border: 1px solid #f0e8dc;
  border-radius: 12px;
  background: #fffdfa;
  overflow: hidden;
}
.comp-nested > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px;
  align-items: center;
  gap: 6px;
  padding: 3px;
  cursor: pointer;
  list-style: none;
}
.comp-nested > summary::-webkit-details-marker {
  display: none;
}
.comp-nested > summary > svg {
  width: 14px;
  height: 14px;
  color: var(--muted);
  transition: transform .18s var(--ease-soft), color .18s ease;
}
.comp-nested[open] > summary > svg {
  transform: rotate(180deg);
  color: var(--orange);
}
.comp-nested .sd-radio {
  margin: 0;
}
.comp-nested .sd-radio b {
  margin-inline-start: auto;
  min-width: 22px;
  color: var(--muted);
  font-size: 10px;
  text-align: left;
}
.comp-sublist {
  padding: 0 12px 8px 6px;
}
.comp-empty {
  margin: 0 12px 10px 6px;
  padding: 9px 10px;
  border: 1px dashed #eadfce;
  border-radius: 10px;
  background: #fff;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1.7;
  text-align: right;
  white-space: normal;
  overflow-wrap: anywhere;
}
.comp-sublist .sd-check {
  min-height: 32px;
  padding: 6px 8px;
  background: #fff;
  border: 1px solid #f2ece2;
}
.comp-sublist .sd-check.on {
  background: #fff3e8;
}

/* درخت منبع */
.src-tree { display: flex; flex-direction: column; }
.src-row { display: flex; align-items: center; gap: 4px; padding: 5px 0; }
.src-caret { border: 0; background: transparent; cursor: pointer; color: var(--muted); display: grid; place-items: center; width: 20px; height: 20px; flex: none; }
.src-caret svg { width: 14px; height: 14px; transition: transform .18s ease; transform: rotate(-90deg); }
.src-caret.open svg { transform: rotate(0deg); }
.src-caret.hidden { visibility: hidden; }
.src-check { display: flex; align-items: center; gap: 7px; font-size: 12px; cursor: pointer; flex: 1; min-width: 0; }
.src-check span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.src-check input { width: 14px; height: 14px; flex: none; accent-color: var(--orange); }
.src-check.on { font-weight: 700; color: var(--ink); }
.src-count { font-size: 11px; color: var(--muted); flex: none; }
.src-year { display: flex; align-items: center; gap: 7px; padding: 5px 0; font-size: 11px; color: var(--muted); cursor: pointer; }
.src-year input { width: 13px; height: 13px; flex: none; accent-color: var(--orange); }
.src-year span { flex: none; min-width: 0; white-space: nowrap; }
.src-year b { margin-inline-start: auto; font-size: 10px; }
.src-year.on { color: var(--ink); font-weight: 600; }

@media (max-width: 980px) {
  .sbank { flex-direction: column; }
  .sbank-side { position: static; max-height: none; flex-basis: auto; width: 100%; }
  /* در حالت ستونی، align-items:flex-start باعث می‌شد main به عرض max-content (چیپ بلند مبحث) باز شود و صفحه اسکرول افقی بگیرد */
  .sbank-main { width: 100%; max-width: 100%; }
}

.sd-collapse-btn {
  margin-inline-start: auto; border: 0; background: transparent; color: var(--muted);
  cursor: pointer; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 7px;
  transition: 0.15s ease;
}
.sd-collapse-btn:hover { background: #f1efe8; color: var(--ink); }
.sd-collapse-btn svg { width: 16px; height: 16px; }

.sd-sec-title { display: inline-flex; align-items: center; gap: 8px; }
.sd-sec-title svg { width: 16px; height: 16px; color: var(--orange); opacity: .85; }

.sd-section > summary, .sd-check, .sd-radio, .src-row, .fs-chip, .seg, .sb-page, .sbank-chip { transition: 0.16s cubic-bezier(0.22,0.61,0.36,1); }
.src-row:hover { background: #f7f5f0; border-radius: 8px; }

/* باز/بستهٔ نرمِ بخش‌های نوار فیلتر و زیرشاخه‌های درخت منبع: ارتفاع با Web Animations
   در JS انیمیت می‌شود (بخش «باز/بسته‌شدنِ نرم» در app.js)، چون transition روی
   ::details-content در همهٔ مرورگرها ارتفاع را درون‌یابی نمی‌کند و پرش می‌دهد. */
.sd-body, .src-children { will-change: height; }
/* حسِ تعاملیِ انتخاب در درخت منبع، هم‌سنگِ چک‌باکس‌های بالاتر */
.src-year { border-radius: 8px; padding-block: 5px; transition: 0.16s cubic-bezier(0.22,0.61,0.36,1); }
.src-year:hover { background: #f7f5f0; }
.sd-check:active, .sd-radio:active { filter: brightness(.98); }
@media (prefers-reduced-motion: reduce) {
  .sd-body { animation: none; }
  .sd-section::details-content { transition: none; }
}
.meta-chip .mc-more { flex: none; font-size: 9px; font-weight: 800; color: #b9762a; background: #fbecd9; border-radius: 6px; padding: 1px 5px; }

/* مودال گزارش خطا — کارت‌های دلیل */
.report-reasons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.report-reason {
  border: 1px solid var(--line); background: #fff; border-radius: 12px;
  padding: 13px 14px; font: inherit; font-size: 13px; font-weight: 600; color: var(--ink);
  cursor: pointer; text-align: center; transition: 0.16s cubic-bezier(0.22,0.61,0.36,1);
}
.report-reason:hover { border-color: #f0b487; transform: translateY(-2px); box-shadow: 0 8px 18px rgba(79,58,38,.08); }
.report-reason.on { background: #fdecec; border-color: #f0b3b3; color: #d3473f; }

/* ───────── نوار ناوبری جمع‌شونده دانش‌آموز در همه بخش‌ها به‌جز داشبورد ───────── */
.app-shell.nav-mini {
  grid-template-columns: 74px minmax(0, 1fr);
  transition: grid-template-columns .25s cubic-bezier(0.22,0.61,0.36,1);
}

@media (min-width: 821px) {
  .app-shell.nav-mini .sidebar {
    width: 74px;
    padding: 18px 10px 12px;
    align-items: stretch;
    overflow-x: hidden;
    z-index: 50;                 /* بالای هدر (۴۵) تا هنگام باز شدن زیرِ آن نرود */
    transition:
      width .28s cubic-bezier(0.22,0.61,0.36,1),
      padding .28s cubic-bezier(0.22,0.61,0.36,1),
      box-shadow .2s ease,
      background .2s ease;
    will-change: width;
  }

  .app-shell.nav-mini .sidebar.is-open,
  .app-shell.nav-mini .sidebar:focus-within {
    width: 244px;
    padding: 22px 14px 14px;
    background: rgba(252, 251, 248, 0.98);
    box-shadow: -18px 0 38px rgba(41, 36, 29, 0.1);
  }

  .app-shell.nav-mini .brand {
    justify-content: center;
    gap: 0;
    padding-inline: 0;
    transition:
      gap .24s cubic-bezier(0.22,0.61,0.36,1),
      padding .24s cubic-bezier(0.22,0.61,0.36,1);
  }

  .app-shell.nav-mini .sidebar.is-open .brand,
  .app-shell.nav-mini .sidebar:focus-within .brand {
    justify-content: flex-start;
    gap: 11px;
    padding: 0 9px 24px;
  }

  .app-shell.nav-mini .brand > div:last-child {
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    white-space: nowrap;
    transform: translateX(8px);
    transition:
      max-width .26s cubic-bezier(0.22,0.61,0.36,1),
      opacity .18s ease,
      transform .26s cubic-bezier(0.22,0.61,0.36,1);
  }

  .app-shell.nav-mini .sidebar.is-open .brand > div:last-child,
  .app-shell.nav-mini .sidebar:focus-within .brand > div:last-child {
    max-width: 150px;
    opacity: 1;
    transform: translateX(0);
  }

  .app-shell.nav-mini .nav-label {
    max-height: 0;
    opacity: 0;
    padding-block: 0;
    overflow: hidden;
    transition:
      max-height .24s cubic-bezier(0.22,0.61,0.36,1),
      opacity .18s ease,
      padding .24s cubic-bezier(0.22,0.61,0.36,1);
  }

  .app-shell.nav-mini .sidebar.is-open .nav-label,
  .app-shell.nav-mini .sidebar:focus-within .nav-label {
    max-height: 36px;
    opacity: 1;
    padding: 18px 13px 7px;
  }

  .app-shell.nav-mini .nav-item {
    justify-content: center;
    padding-inline: 0;
    gap: 0;
    transition:
      background .16s ease,
      color .16s ease,
      transform .16s cubic-bezier(0.22,0.61,0.36,1),
      padding .24s cubic-bezier(0.22,0.61,0.36,1),
      gap .24s cubic-bezier(0.22,0.61,0.36,1);
  }

  .app-shell.nav-mini .sidebar.is-open .nav-item,
  .app-shell.nav-mini .sidebar:focus-within .nav-item {
    justify-content: flex-start;
    padding-inline: 12px;
    gap: 10px;
  }

  .app-shell.nav-mini .nav-item > span:not(.nav-count) {
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    white-space: nowrap;
    transform: translateX(8px);
    transition:
      max-width .26s cubic-bezier(0.22,0.61,0.36,1),
      opacity .18s ease,
      transform .26s cubic-bezier(0.22,0.61,0.36,1);
  }

  .app-shell.nav-mini .sidebar.is-open .nav-item > span:not(.nav-count),
  .app-shell.nav-mini .sidebar:focus-within .nav-item > span:not(.nav-count) {
    max-width: 150px;
    opacity: 1;
    transform: translateX(0);
  }

  .app-shell.nav-mini .nav-item .nav-count { display: none; }
}

/* ───────── آیکون سطح در فیلتر، آیکون منبع، تولتیپ، پاپ‌اوور سال ───────── */
.sd-check .difficulty-gauge { width: 26px; height: 22px; flex: none; }
.sd-sec-title { gap: 0; } /* بدون آیکون */

.src-node-icon { width: 18px; height: 18px; display: inline-flex; flex: none; }
.src-node-icon svg,
.src-node-icon img { width: 100%; height: 100%; object-fit: contain; }
.sq-src-icon {
  display: grid;
  place-items: center;
  width: 56px !important;
  height: 56px !important;
  min-width: 56px;
  min-height: 56px;
  max-width: 56px;
  max-height: 56px;
  margin: 0 auto 6px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid #eee3d7;
  overflow: hidden;
}
.sq-src-icon svg,
.sq-src-icon img { width: 82%; height: 82%; object-fit: contain; }
.sq-src-icon.src-icon-fallback svg {
  width: 30px;
  height: 30px;
}
.src-icon-fallback svg { width: 16px; height: 16px; color: var(--muted); }

/* تولتیپ تعاملی نام منبع */
[data-src-tip] { position: relative; }
[data-src-tip]:hover::after {
  content: attr(data-src-tip);
  position: absolute; bottom: calc(100% + 6px); right: 0;
  background: #282621; color: #fff; font-size: 10px; font-weight: 700;
  padding: 5px 9px; border-radius: 8px; white-space: nowrap; z-index: 60;
  box-shadow: 0 8px 20px rgba(0,0,0,.18); pointer-events: none;
  animation: tipIn .16s ease;
}
@keyframes tipIn { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }

/* پاپ‌اوور بازهٔ سال (الهام از نمونه) */
.sbank-year-wrap { position: relative; }
.year-pop {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 55;
  width: 330px; background: #fff; border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 22px 50px rgba(40,34,24,.22); padding: 12px;
  animation: authStageIn .2s cubic-bezier(0.22,0.61,0.36,1);
}
.year-tabs { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.year-tab {
  flex: 1; border: 1px solid var(--line); background: #fff; border-radius: 10px;
  padding: 8px; font: inherit; font-size: 11px; font-weight: 600; color: var(--muted); cursor: pointer;
  transition: 0.15s ease;
}
.year-tab b { color: var(--ink); font-weight: 800; }
.year-tab.on { background: #fbf0e3; border-color: #f0d3b4; color: #9a5a1f; }
.year-tabs-mid { font-size: 11px; font-weight: 700; color: var(--muted); flex: none; }
.year-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.year-cell {
  border: 1px solid var(--line); background: #fff; border-radius: 11px;
  padding: 11px 4px; font: inherit; font-size: 12px; font-weight: 700; color: var(--ink);
  cursor: pointer; transition: 0.15s cubic-bezier(0.22,0.61,0.36,1); direction: ltr;
}
.year-cell:hover { border-color: #f0b487; transform: translateY(-1px); }
.year-cell.on { background: var(--orange); color: #fff; border-color: var(--orange); }
.year-cell.special { direction: rtl; color: #9a5a1f; background: #fdf6ec; }
.year-cell.special.on { background: var(--orange); color: #fff; }

@media (max-width: 760px) {
  .sq-item {
    flex-direction: column;
  }
  .sq-rail {
    width: 100%;
    flex-direction: row;
    border-inline-start: 0;
    border-top: 1px solid #f1efe9;
  }
  .sq-rail-cell {
    min-height: 96px;
  }
  .sq-rail-cell + .sq-rail-cell {
    border-top: 0;
    border-inline-start: 1px solid #f1efe9;
  }
  .sq-rail-cell[data-rail-tip]::after {
    left: 50%;
    top: auto;
    bottom: calc(100% + 10px);
    max-width: min(320px, calc(100vw - 32px));
    white-space: normal;
    transform: translateX(-50%) translateY(6px);
  }
  .sq-rail-cell[data-rail-tip]::before {
    left: 50%;
    top: auto;
    bottom: calc(100% + 4px);
    transform: translateX(-50%) translateY(6px) rotate(-135deg);
  }
  .sq-rail-cell[data-rail-tip]:hover::after,
  .sq-rail-cell[data-rail-tip]:focus-within::after {
    transform: translateX(-50%) translateY(0);
  }
  .sq-rail-cell[data-rail-tip]:hover::before,
  .sq-rail-cell[data-rail-tip]:focus-within::before {
    transform: translateX(-50%) translateY(0) rotate(-135deg);
  }
  .sq-source-tooltip {
    left: 50%;
    top: auto;
    bottom: calc(100% + 10px);
    width: max-content;
    max-width: calc(100vw - 28px);
    transform: translateX(-50%) translateY(8px);
  }
  .sq-source-tooltip::before {
    left: 50%;
    top: auto;
    bottom: -7px;
    border-left: 0;
    border-bottom: 1px solid rgba(240, 180, 135, .74);
    border-right: 1px solid rgba(240, 180, 135, .74);
    transform: translateX(-50%) rotate(45deg);
  }
  .sq-rail-src:hover .sq-source-tooltip,
  .sq-rail-src:focus-within .sq-source-tooltip {
    transform: translateX(-50%) translateY(0);
  }
  /* روی موبایل، گزینهٔ متوسط و بلند تک‌ستونی می‌شود؛ آنجا هم‌قدسازی فقط ارتفاعِ
     بلندترین گزینه را چهار بار تکرار می‌کند و صفحه را بی‌دلیل بلند می‌کند. */
  .sq-answer-options {
    grid-template-columns: 1fr;
    grid-auto-rows: max-content;
  }
  .sq-answer-options.is-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
  }
  /* شکلِ سؤال روی گوشی: درصدی که مدیر برای صفحهٔ دسکتاپ انتخاب کرده (مثلاً ۲۱٪)
     روی عرض ۳۴۰ پیکسلی یعنی یک تصویرِ ۷۰ پیکسلیِ ناخوانا. کف می‌گذاریم تا هر
     شکلی دست‌کم دوسومِ عرضِ صفحه را بگیرد؛ سقفِ ۱۰۰٪ سرِ جایش است، پس شکلِ
     عریض تغییری نمی‌کند و تراز (چپ/راست/وسط) هم حفظ می‌شود. */
  .sq-rich-text .mkfig,
  .sq-side-figure .mkfig { min-width: min(100%, 66%); }
  .sq-item .sq-sheet { padding: 12px; }
  .year-pop {
    width: min(330px, calc(100vw - 42px));
    right: auto;
    left: 0;
  }
}

/* چیپ سطح سؤال در سربرگ سؤال (سمت راست، با رنگ متناسب با سطح) */
/* سلول سطح سؤال در ریل (زیر ضریب تمیز)، با رنگ متناسب با سطح */
.sq-rail-diff small { font-weight: 800; }
.sq-rail-diff.level-1 small { color: #1aa58e; }
.sq-rail-diff.level-2 small { color: #b07d12; }
.sq-rail-diff.level-3 small { color: #d4631f; }
.sq-rail-diff.level-4 small { color: #d2434c; }

/* ───────── گزارش فعالیت: چیپ‌های نوع فعالیت ───────── */
.audit-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 18px 16px; }
.audit-chip {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); background: #fff; border-radius: 999px;
  padding: 7px 13px; font: inherit; font-size: 12px; font-weight: 600; color: var(--ink);
  cursor: pointer; transition: 0.16s cubic-bezier(0.22,0.61,0.36,1);
}
.audit-chip:hover { border-color: #f0b487; transform: translateY(-1px); }
.audit-chip.on { background: var(--orange); color: #fff; border-color: var(--orange); }
.audit-chip b { font-size: 10px; background: rgba(0,0,0,.06); border-radius: 6px; padding: 1px 6px; }
.audit-chip.on b { background: rgba(255,255,255,.25); }
.audit-actor { display: inline-flex; align-items: center; gap: 5px; }
.audit-actor .avatar { width: 20px; height: 20px; border-radius: 6px; }

.audit-date-range {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 0 18px 14px;
}
.audit-date-range button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 12px;
  min-height: 38px;
  padding: 0 11px;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  color: var(--muted);
  cursor: pointer;
  transition: transform .16s var(--ease-soft), border-color .16s ease, background .16s ease, color .16s ease;
}
.audit-date-range button:hover,
.audit-date-range button.on {
  transform: translateY(-1px);
  border-color: #f0b487;
  background: var(--orange-soft);
  color: #c25710;
}
.audit-date-range button svg { width: 15px; height: 15px; }
.audit-date-range button b { color: var(--ink); font-size: 12px; }
.audit-date-range .audit-date-clear {
  background: #f8f6f1;
  color: #8f8170;
}
.audit-date-range small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.audit-calendar {
  width: min(320px, calc(100% - 36px));
  margin: -4px 18px 14px auto;
  border: 1px solid #f0d3b4;
  border-radius: 15px;
  background: #fffdf9;
  box-shadow: 0 18px 35px rgba(65, 47, 29, .12);
  padding: 10px;
}
.audit-cal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.audit-cal-head button {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 10px;
  display: grid;
  place-items: center;
  cursor: pointer;
  color: #9a5a1f;
  transition: transform .16s var(--ease-soft), background .16s ease;
}
.audit-cal-head button:hover { transform: translateY(-1px); background: var(--orange-soft); }
.audit-cal-head button svg { width: 15px; height: 15px; }
.audit-cal-head strong { font-size: 13px; color: var(--ink); }
.audit-cal-weekdays,
.audit-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}
.audit-cal-weekdays span {
  text-align: center;
  font-size: 10px;
  font-weight: 850;
  color: var(--muted);
  padding: 3px 0;
}
.audit-cal-cell {
  min-height: 34px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
  transition: transform .14s var(--ease-soft), border-color .14s ease, background .14s ease, color .14s ease;
}
.audit-cal-cell.empty {
  background: transparent;
  pointer-events: none;
}
.audit-cal-cell:hover {
  transform: translateY(-1px);
  border-color: #f0b487;
  color: #c25710;
}
.audit-cal-cell.today { background: #f8f6f1; border-color: #eee7dd; }
.audit-cal-cell.selected {
  background: var(--orange);
  color: #fff;
  border-color: var(--orange);
  box-shadow: 0 8px 18px rgba(255, 107, 24, .18);
}

.audit-event-list {
  padding-top: 6px;
}
.audit-event-row {
  align-items: center;
  gap: 16px;
  margin: 0 -6px;
  padding: 12px 10px;
  border-radius: 13px;
  transition: background .16s ease, transform .16s var(--ease-soft), box-shadow .16s ease, border-color .16s ease;
}
.audit-event-row:hover {
  background: #fffaf5;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(65, 47, 29, .07);
}
.audit-event-main {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.audit-event-main strong {
  color: #6b655b;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.audit-event-meta {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 280px;
  white-space: nowrap;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}
.audit-actor-line {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #4d4840;
}
.audit-actor-line .avatar { width: 24px; height: 24px; border-radius: 8px; }
.audit-actor-line b { font-size: 12px; color: var(--ink); }
.audit-actor-line i {
  font-style: normal;
  font-size: 10px;
  color: #9a5a1f;
  background: #fbf0e3;
  border-radius: 7px;
  padding: 2px 7px;
}
.audit-event-meta time {
  color: #827e75;
  direction: ltr;
}
@media (max-width: 760px) {
  .audit-event-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
  .audit-event-main,
  .audit-event-meta {
    width: 100%;
  }
  .audit-event-meta {
    justify-content: flex-start;
    min-width: 0;
    overflow-x: auto;
  }
  .audit-calendar {
    width: calc(100% - 36px);
  }
}

/* ───────── گزارش فعالیت: جستجوی کاربر ───────── */
.audit-user-search { padding: 4px 18px 14px; position: relative; max-width: 480px; }
.audit-search-box { position: relative; }
.audit-search-box input {
  width: 100%; border: 1px solid var(--line); border-radius: 11px;
  padding: 10px 36px 10px 12px; font: inherit; font-size: 13px; background: #fff;
}
.audit-search-box .search-glyph { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); }
.audit-user-results {
  margin-top: 8px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
  box-shadow: 0 14px 34px rgba(40,34,24,.12); overflow: hidden;
}
.audit-user-result {
  display: flex; align-items: center; gap: 10px; width: 100%; text-align: right;
  border: 0; border-bottom: 1px solid #f1efe9; background: #fff; cursor: pointer;
  padding: 9px 12px; font: inherit; transition: background .12s ease;
}
.audit-user-result:last-child { border-bottom: 0; }
.audit-user-result:hover { background: #f7f5f0; }
.aur-main { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.aur-main b { font-size: 12.5px; color: var(--ink); }
.aur-main small { font-size: 10px; color: var(--muted); }
.aur-kind { font-size: 10px; font-weight: 700; color: #9a5a1f; background: #fbf0e3; border-radius: 7px; padding: 3px 9px; flex: none; }
.audit-user-empty { padding: 12px; font-size: 12px; color: var(--muted); }
.audit-actor-pill {
  display: inline-flex; align-items: center; gap: 8px;
  background: #fbf0e3; border: 1px solid #f0d3b4; border-radius: 999px; padding: 5px 6px 5px 12px;
}
.audit-actor-pill b { font-size: 12.5px; color: #9a5a1f; }
.audit-actor-uid { font-size: 10px; color: var(--muted); }
.audit-actor-pill .avatar { width: 24px; height: 24px; border-radius: 8px; }
.audit-actor-x { border: 0; background: rgba(0,0,0,.06); width: 22px; height: 22px; border-radius: 7px; cursor: pointer; display: grid; place-items: center; color: #9a5a1f; }
.audit-actor-x svg { width: 13px; height: 13px; }

/* ───────── فایل‌های پیوست پوشه ───────── */
.folder-files { display: flex; flex-direction: column; gap: 10px; padding: 14px 18px 18px; }
.folder-file {
  display: flex; align-items: center; gap: 12px;
  border: 1px solid var(--line); background: #fff; border-radius: 13px; padding: 12px 14px;
  transition: 0.16s ease;
}
.folder-file:hover { border-color: #f0b487; box-shadow: 0 8px 18px rgba(79,58,38,.06); }
.file-type {
  flex: none; width: 46px; height: 40px; border-radius: 9px; color: #fff;
  display: grid; place-items: center; font-size: 11px; font-weight: 800; letter-spacing: .3px;
}
.ff-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ff-info strong { font-size: 13px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ff-info small { font-size: 10px; color: var(--muted); }
.ff-download {
  display: inline-flex; align-items: center; gap: 5px; flex: none;
  border: 1px solid #b3ddd0; background: #f1fbf7; color: #2f9e83; border-radius: 10px;
  padding: 8px 14px; font-size: 12px; font-weight: 700; text-decoration: none; transition: 0.15s ease;
}
.ff-download:hover { background: #2f9e83; color: #fff; border-color: #2f9e83; }
.ff-download svg { width: 15px; height: 15px; }

/* ───────── پروفایل در هدر (بالا سمت چپ) ───────── */
.topbar-profile {
  width: auto;
  margin: 0;
  margin-inline-start: auto;   /* در RTL به سمت چپِ هدر می‌رود */
  padding: 6px 12px 6px 7px;
  border-radius: 12px;
  max-width: 280px;
  transition: 0.16s ease;
}
.topbar-profile:hover { background: #fbfaf7; border-color: #f0b487; box-shadow: 0 6px 16px rgba(79,58,38,.07); }
.topbar-profile .avatar { width: 32px; height: 32px; border-radius: 10px; }
.topbar-profile strong, .topbar-profile small { display: block; text-align: right; line-height: 1.4; }
.topbar-profile strong { font-size: 12px; }
.topbar-profile small { font-size: 10px; color: var(--muted); }
.topbar-profile .chevron { width: 14px; height: 14px; color: var(--muted); flex: none; }
@media (max-width: 640px) {
  .topbar-profile small { display: none; }
  .topbar-profile { max-width: 180px; }
}

/* ───────── Micro interactions layer ───────── */
:root {
  --motion-fast: 140ms;
  --motion-med: 260ms;
  --motion-slow: 440ms;
  --ease-pop: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-soft: cubic-bezier(0.22, 0.61, 0.36, 1);
  --lift-shadow: 0 14px 34px rgba(48, 39, 27, 0.1);
}

::selection {
  background: rgba(255, 107, 24, 0.18);
}

button,
a,
input,
select,
textarea,
.folder-card,
.stat-card,
.panel,
.type-card,
.sd-diff-card,
.media-card,
.folder-file,
.role-card,
.ms-opt,
.sd-check,
.sd-radio,
.src-row,
.question-form-nav > button,
.data-table tbody tr {
  -webkit-tap-highlight-color: transparent;
}

button,
a,
.folder-card,
.stat-card.clickable,
.type-card,
.sd-diff-card,
.media-card,
.folder-file,
.role-card,
.ms-opt,
.sd-check,
.sd-radio,
.src-row {
  transition-duration: var(--motion-med);
  transition-timing-function: var(--ease-soft);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[contenteditable="true"]:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(255, 107, 24, 0.18), 0 0 0 1px rgba(255, 107, 24, 0.38);
}

/* داخل باکس‌های سرچ، هایلایت فوکوس باید روی کل کادر (focus-within کانتینر) بیفتد نه input داخلی.
   بدون این استثنا دو کادرِ رنگی هم‌زمان دیده می‌شود: حلقهٔ سراسریِ input و
   حاشیه/هالهٔ خودِ کادر. یک تغییرِ رنگ کافی است. */
.mini-search input:focus-visible,
.qset-search input:focus-visible,
.emf-search input:focus-visible,
.question-code-search input:focus-visible,
.tp-search-wrap input:focus-visible,
.settlement-amount-field input:focus-visible,
.ms-search input:focus-visible,
.audit-search-box input:focus-visible,
.ax-tp-search input:focus-visible,
.brw-search input:focus-visible {
  box-shadow: none;
}

/* این دو کادر بعد از خاموش‌شدنِ حلقهٔ سراسری نشانهٔ فوکوس نداشتند */
.audit-search-box:focus-within input,
.brw-search:focus-within {
  border-color: #f0a77e;
  box-shadow: 0 0 0 3px var(--orange-soft);
}

.mini-search input:focus,
.qset-search input:focus,
.emf-search input:focus,
.question-code-search input:focus,
.tp-search-wrap input:focus,
.audit-search-box input:focus,
.sbank-search input:focus,
.ms-search input:focus,
.qset-modal-search input:focus {
  transform: none;
}

.content {
  transform-origin: 50% 18px;
  transition: opacity var(--motion-fast) var(--ease-soft), transform var(--motion-fast) var(--ease-soft);
}

.content.motion-leave {
  opacity: 0.24;
  transform: translateY(7px) scale(0.994);
  pointer-events: none;
}

.content.motion-enter > * {
  opacity: 0;
  transform: translateY(14px) scale(0.992);
}

.content.motion-enter.motion-ready > * {
  animation: viewItemIn var(--motion-slow) var(--ease-pop) both;
}

.content.motion-enter.motion-ready > *:nth-child(2) { animation-delay: 35ms; }
.content.motion-enter.motion-ready > *:nth-child(3) { animation-delay: 70ms; }
.content.motion-enter.motion-ready > *:nth-child(4) { animation-delay: 105ms; }
.content.motion-enter.motion-ready > *:nth-child(n + 5) { animation-delay: 135ms; }

@keyframes viewItemIn {
  0% { opacity: 0; transform: translateY(14px) scale(0.992); filter: blur(2px); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

.micro-pressing {
  transform: translateY(1px) scale(0.985) !important;
}

.nav-item {
  position: relative;
  overflow: hidden;
  transform-origin: right center;
}

.nav-item::before {
  content: "";
  position: absolute;
  inset: 8px auto 8px 7px;
  width: 3px;
  border-radius: 10px;
  background: currentColor;
  opacity: 0;
  transform: scaleY(0.35);
  transition: opacity var(--motion-med) var(--ease-soft), transform var(--motion-med) var(--ease-pop);
}

.nav-item:hover {
  transform: translateX(-2px);
}

.nav-item.active::before {
  opacity: 0.65;
  transform: scaleY(1);
}

.nav-item .nav-icon,
.icon-button .ui-icon,
.row-action .ui-icon,
.more-button .ui-icon,
.tree-toggle,
.src-caret svg,
.sd-section > summary svg {
  transition: transform var(--motion-med) var(--ease-pop), color var(--motion-med) ease;
}

.nav-item:hover .nav-icon,
.icon-button:hover .ui-icon,
.row-action:hover .ui-icon,
.more-button:hover .ui-icon {
  transform: translateY(-1px) scale(1.08);
}

.primary-button,
.secondary-button,
.ghost-button,
.danger-button,
.auth-submit,
.ff-download,
.page-buttons button,
.segmented button,
.correct-option-picker button,
.question-form-nav > button {
  transform-origin: center;
  transition: transform var(--motion-fast) var(--ease-pop), box-shadow var(--motion-med) ease, background var(--motion-med) ease, border-color var(--motion-med) ease, color var(--motion-med) ease, filter var(--motion-med) ease;
}

.primary-button:hover,
.auth-submit:hover {
  box-shadow: 0 12px 26px rgba(255, 107, 24, 0.24);
}

.secondary-button:hover,
.ghost-button:hover,
.danger-button:hover,
.ff-download:hover,
.page-buttons button:hover,
.segmented button:hover,
.correct-option-picker button:hover,
.question-form-nav > button:hover {
  transform: translateY(-1px);
}

.panel,
.folder-card,
.stat-card,
.sd-diff-card,
.media-card,
.detail-card,
.topic-trigger-card,
.folder-file,
.role-card,
.pixel-info-card {
  transition: transform var(--motion-med) var(--ease-pop), box-shadow var(--motion-med) ease, border-color var(--motion-med) ease, background var(--motion-med) ease;
}

.folder-card:hover,
.stat-card.clickable:hover,
.sd-diff-card:hover,
.media-card:hover,
.topic-trigger-card:hover,
.folder-file:hover,
.role-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--lift-shadow);
}

.panel:hover {
  box-shadow: 0 16px 38px rgba(48, 39, 27, 0.075);
}

.folder-card::after,
.stat-card::after,
.type-card::after,
.role-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.42) 45%, transparent 64%);
  opacity: 0;
  transform: translateX(32%);
  transition: opacity var(--motion-med) ease, transform var(--motion-slow) var(--ease-soft);
}

.folder-card,
.stat-card,
.type-card,
.role-card {
  position: relative;
  overflow: hidden;
}

.folder-card:hover::after,
.stat-card:hover::after,
.type-card:hover::after,
.role-card:hover::after {
  opacity: 1;
  transform: translateX(-34%);
}

.folder-card {
  overflow: visible;
}

.folder-card::after {
  content: none;
  display: none;
}

.data-table tbody tr {
  transition: background var(--motion-fast) ease, transform var(--motion-fast) var(--ease-soft), box-shadow var(--motion-fast) ease;
}

.data-table tbody tr:hover {
  background: #fffaf4;
  transform: translateX(-2px);
}

.ms-trigger,
.ms-opt,
.fs-chip,
.badge,
.sbank-chip,
.meta-chip,
.seg,
.sd-check,
.sd-radio,
.src-row,
.tag-pill,
.chip,
.filter-chip {
  transition: transform var(--motion-fast) var(--ease-pop), background var(--motion-med) ease, border-color var(--motion-med) ease, color var(--motion-med) ease, box-shadow var(--motion-med) ease;
}

.ms-trigger:hover,
.ms-opt:hover,
.sd-check:hover,
.sd-radio:hover,
.src-row:hover {
  transform: translateY(-1px);
}

.fs-chip,
.sbank-chip,
.chip,
.badge {
  animation: microPop 220ms var(--ease-pop) both;
}

@keyframes microPop {
  from { opacity: 0; transform: scale(0.94); }
  to { opacity: 1; transform: scale(1); }
}

input,
select,
textarea,
[contenteditable="true"] {
  transition: border-color var(--motion-med) ease, box-shadow var(--motion-med) ease, background var(--motion-med) ease, transform var(--motion-fast) var(--ease-soft);
}

input:focus,
select:focus,
textarea:focus,
[contenteditable="true"]:focus {
  transform: translateY(-1px);
}

.modal-backdrop {
  animation: backdropIn var(--motion-med) ease both;
}

.modal {
  animation: modal-in 280ms var(--ease-pop);
}

.modal-backdrop.modal-closing {
  animation: backdropOut 170ms ease both;
}

.modal-backdrop.modal-closing .modal {
  animation: modalOut 170ms ease both;
}

@keyframes backdropIn {
  from { opacity: 0; backdrop-filter: blur(0); }
  to { opacity: 1; }
}

@keyframes backdropOut {
  to { opacity: 0; backdrop-filter: blur(0); }
}

@keyframes modalOut {
  to { opacity: 0; transform: translateY(10px) scale(0.985); }
}

.toast {
  position: relative;
  overflow: hidden;
}

.toast::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 2px;
  background: rgba(255, 107, 24, 0.42);
  transform-origin: right center;
  animation: toastTimer 3.6s linear forwards;
}

.toast.error::after {
  background: rgba(222, 90, 90, 0.48);
}

@keyframes toastTimer {
  from { transform: scaleX(1); }
  to { transform: scaleX(0); }
}

.question-form-nav > button.done span,
.correct-option-picker button.selected span,
.type-card.selected span,
.segmented button.active,
.auth-tabs button.active,
.page-buttons button.active {
  animation: selectedPulse 360ms var(--ease-pop) both;
}

@keyframes selectedPulse {
  0% { transform: scale(0.96); }
  55% { transform: scale(1.04); }
  100% { transform: scale(1); }
}

.progress span {
  animation: progressGrow 720ms var(--ease-pop) both;
  transform-origin: right center;
}

@keyframes progressGrow {
  from { transform: scaleX(0.18); }
  to { transform: scaleX(1); }
}

.brand-mark,
.avatar {
  transition: transform var(--motion-med) var(--ease-pop), box-shadow var(--motion-med) ease;
}

.brand:hover .brand-mark,
.profile-card:hover .avatar {
  transform: rotate(-2deg) scale(1.04);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
  .micro-pressing,
  .content.motion-leave,
  .content.motion-enter > *,
  .data-table tbody tr:hover,
  .folder-card:hover,
  .stat-card.clickable:hover,
  .sd-diff-card:hover,
  .media-card:hover,
  .topic-trigger-card:hover,
  .folder-file:hover,
  .role-card:hover {
    transform: none !important;
    filter: none !important;
  }
}

/* ───────────── پروفایل گیم‌محور کاربر ───────────── */
.student-profile-page {
  --sp-night: #151817;
  --sp-night-soft: #222522;
  --sp-orange: #ff7426;
  --sp-lime: #c8ed75;
  display: grid;
  gap: 18px;
  width: min(100%, 1320px);
  margin-inline: auto;
}

.sp-command-card {
  position: relative;
  isolation: isolate;
  min-height: 268px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(270px, 340px);
  grid-template-areas: "identity level" "actions level";
  align-items: center;
  gap: 24px 34px;
  overflow: hidden;
  padding: 32px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 26px;
  color: #fff;
  background:
    radial-gradient(circle at 11% 12%, rgba(255,116,38,.24), transparent 22rem),
    linear-gradient(118deg, #101312 0%, #22251f 64%, #171a18 100%);
  box-shadow: 0 22px 52px rgba(29,30,25,.18);
}

.sp-command-card::before,
.sp-command-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

.sp-command-card::before {
  inset-inline-end: -68px;
  inset-block-start: -115px;
  width: 360px;
  height: 360px;
  border: 1px solid rgba(200,237,117,.15);
  border-radius: 50%;
  box-shadow: 0 0 0 48px rgba(255,255,255,.018), 0 0 0 96px rgba(255,255,255,.012);
}

.sp-command-card::after {
  inset: 0;
  opacity: .18;
  background: linear-gradient(105deg, transparent 0 48%, rgba(255,255,255,.055) 48.1% 48.4%, transparent 48.5%);
}

.sp-grid-lines {
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .07;
  background-image:
    linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(90deg, #000, transparent 72%);
}

.sp-identity {
  grid-area: identity;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 22px;
}

.sp-avatar-wrap {
  position: relative;
  width: 112px;
  height: 112px;
  flex: 0 0 112px;
  padding: 5px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 28px 10px 28px 28px;
  background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.02));
  box-shadow: 0 14px 34px rgba(0,0,0,.32);
}

.avatar.sp-avatar {
  width: 100%;
  height: 100%;
  border-radius: 23px 7px 23px 23px;
  background: #2f332e;
}

.sp-avatar-corner {
  position: absolute;
  inset-inline-end: -7px;
  inset-block-end: -7px;
  min-width: 31px;
  height: 25px;
  display: grid;
  place-items: center;
  padding-inline: 6px;
  border: 3px solid #181b18;
  border-radius: 8px;
  color: #1d211c;
  background: var(--sp-lime);
  font: 900 9px/1 Arial, sans-serif;
  letter-spacing: .08em;
}

.sp-identity-copy { min-width: 0; }
.sp-call-sign,
.sp-kicker {
  display: block;
  color: #b87039;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .03em;
}
.sp-command-card .sp-call-sign { color: var(--sp-lime); opacity: .85; }
.sp-identity-copy h1 {
  max-width: 100%;
  margin: 5px 0 11px;
  overflow: hidden;
  color: #fff;
  font-size: clamp(23px, 3vw, 38px);
  font-weight: 950;
  letter-spacing: -.045em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sp-id-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.sp-id-row > * {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 7px;
  color: rgba(255,255,255,.72);
  background: rgba(255,255,255,.055);
  font-size: 9px;
  font-weight: 750;
}
.sp-id-row bdi { color: #fff; font-family: Arial, sans-serif; letter-spacing: .04em; }

/* حساب غیر دانش‌آموز لول ندارد؛ ستون لول از گرید حذف می‌شود تا کارت خالی نماند */
.sp-command-card.no-level {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "identity" "actions";
}

.sp-level-card {
  grid-area: level;
  align-self: stretch;
  position: relative;
  isolation: isolate;
  width: 100%;
  display: block;
  overflow: hidden;
  padding: 20px;
  border: 1px solid rgba(200,237,117,.18);
  border-radius: 22px;
  color: inherit;
  background: rgba(5,8,6,.36);
  box-shadow: inset 0 1px rgba(255,255,255,.05);
  backdrop-filter: blur(9px);
  cursor: pointer;
  text-align: start;
  font-family: inherit;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.sp-level-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset-inline-end: -64px;
  inset-block-start: -82px;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200,237,117,.13), transparent 68%);
  pointer-events: none;
}
.sp-level-card:hover { border-color: rgba(200,237,117,.42); box-shadow: inset 0 1px rgba(255,255,255,.08), 0 14px 28px rgba(0,0,0,.13); transform: translateY(-2px); }
.sp-level-card:focus-visible { outline: 2px solid var(--sp-lime); outline-offset: 3px; }
.sp-level-head { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 11px; }
.sp-level-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(200,237,117,.22);
  border-radius: 15px;
  color: var(--sp-lime);
  background: rgba(200,237,117,.08);
}
.sp-level-icon svg { width: 23px; height: 23px; stroke-width: 1.8; }
.sp-level-heading { min-width: 0; display: block; }
.sp-level-heading small { display: block; color: rgba(255,255,255,.48); font-size: 9px; font-weight: 800; }
.sp-level-heading strong { display: block; margin-top: 3px; color: var(--sp-lime); font-size: 22px; font-weight: 950; line-height: 1.35; }
.sp-level-open { display: inline-flex; align-items: center; gap: 3px; color: rgba(255,255,255,.52); font-size: 9px; font-weight: 800; white-space: nowrap; }
.sp-level-open svg { width: 14px; height: 14px; transition: transform .2s ease; }
.sp-level-card:hover .sp-level-open svg { transform: translateX(-3px); }
.sp-level-summary { display: grid; grid-template-columns: 1fr 1.25fr; margin-top: 18px; padding: 12px 0; border-block: 1px solid rgba(255,255,255,.08); }
.sp-level-summary > span { min-width: 0; display: block; }
.sp-level-summary > span + span { padding-inline-start: 15px; border-inline-start: 1px solid rgba(255,255,255,.09); }
.sp-level-summary small { display: block; color: rgba(255,255,255,.43); font-size: 9px; font-weight: 750; }
.sp-level-summary b { display: block; margin-top: 4px; color: rgba(255,255,255,.92); font-size: 17px; font-weight: 950; line-height: 1.4; }
.sp-level-summary b em { color: rgba(255,255,255,.45); font-size: 9px; font-style: normal; font-weight: 750; }
.sp-level-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 14px 0 7px; }
.sp-level-progress-head small { color: rgba(255,255,255,.48); font-size: 9px; font-weight: 750; }
.sp-level-progress-head b { color: var(--sp-lime); font-size: 10px; font-weight: 900; }
.sp-xp-track { height: 7px; display: block; overflow: hidden; border-radius: 20px; background: rgba(255,255,255,.09); }
.sp-xp-track i { position: relative; width: 0; height: 100%; display: block; border-radius: 20px; background: linear-gradient(90deg, var(--sp-lime), #ecffbd); box-shadow: 0 0 14px rgba(200,237,117,.3); transition: width .45s ease; }
.sp-level-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 7px; color: rgba(255,255,255,.38); font-size: 8px; font-weight: 700; }

/* مودال اختصاصی جزئیات لول */
.modal.sp-level-modal-shell {
  width: min(980px, 96vw);
  border: 1px solid rgba(52, 91, 73, .12);
  border-radius: 28px;
  background: #f7f4ee;
  box-shadow: 0 34px 90px rgba(28, 48, 39, .25);
}
.sp-level-modal-shell .splm-modal-head { padding: 17px 22px; border-color: #e8e0d5; background: rgba(255,253,249,.93); }
.splm-modal-title { display: flex; align-items: center; gap: 11px; }
.splm-modal-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #cfe2d5; border-radius: 13px; color: #347c63; background: linear-gradient(145deg, #f2faf5, #e3f1e8); box-shadow: inset 0 1px #fff; }
.splm-modal-icon svg { width: 21px; height: 21px; stroke-width: 1.8; }
.splm-modal-title small { display: block; margin-bottom: 1px; color: #9a8068; font-size: 10px; font-weight: 850; }
.sp-level-modal-shell .splm-modal-title h2 { color: #312a24; font-size: 19px; font-weight: 950; }
.sp-level-modal-shell .modal-close { border: 1px solid #ebe2d7; color: #71665c; background: #fff; transition: color .18s ease, border-color .18s ease, transform .18s ease; }
.sp-level-modal-shell .modal-close:hover { border-color: #ccdcd1; color: #347c63; transform: rotate(-4deg); }
.sp-level-modal-shell .modal-body { padding: 22px; background: #f7f4ee; }
.sp-level-modal { display: grid; gap: 16px; }

.splm-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 178px minmax(0, 1fr);
  align-items: center;
  gap: 22px 30px;
  overflow: hidden;
  padding: 28px;
  border: 1px solid rgba(204, 231, 214, .14);
  border-radius: 24px;
  color: #fff;
  background:
    radial-gradient(circle at 8% 15%, rgba(185, 224, 129, .16), transparent 16rem),
    linear-gradient(135deg, #173d31, #225845 64%, #1b493b);
  box-shadow: 0 18px 38px rgba(28, 68, 53, .2);
}
.splm-hero::before { content: ""; position: absolute; z-index: -1; inset-inline-end: -95px; inset-block-start: -115px; width: 310px; height: 310px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; box-shadow: 0 0 0 45px rgba(255,255,255,.018), 0 0 0 90px rgba(255,255,255,.012); }
.splm-hero-level { display: grid; place-items: center; }
.splm-level-ring { width: 150px; height: 150px; display: grid; place-items: center; padding: 8px; border-radius: 50%; background: conic-gradient(#c6e889 0 var(--splm-progress), rgba(255,255,255,.13) var(--splm-progress) 360deg); box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 18px 38px rgba(7, 25, 18, .28); }
.splm-level-core { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; background: linear-gradient(145deg, #1c493a, #15362c); box-shadow: inset 0 2px 12px rgba(255,255,255,.05); }
.splm-level-core svg { width: 21px; height: 21px; margin-bottom: 6px; color: #c6e889; }
.splm-level-core small { color: rgba(255,255,255,.58); font-size: 10px; font-weight: 750; }
.splm-level-core strong { margin-top: 2px; color: #fff; font-size: 40px; font-weight: 950; line-height: 1.15; }
.splm-hero-copy { min-width: 0; }
.splm-hero-kicker { display: block; color: #c6e889; font-size: 11px; font-weight: 850; }
.splm-hero-copy h3 { margin: 5px 0 18px; color: rgba(255,255,255,.82); font-size: 22px; font-weight: 800; }
.splm-hero-copy h3 strong { color: #fff; font-size: 31px; font-weight: 950; }
.splm-progress-label, .splm-progress-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.splm-progress-label { margin-bottom: 8px; color: rgba(255,255,255,.66); font-size: 10px; font-weight: 750; }
.splm-progress-label b { color: #c6e889; font-size: 12px; font-weight: 900; }
.splm-hero-copy .sp-xp-track { height: 10px; border: 1px solid rgba(255,255,255,.06); background: rgba(7, 25, 18, .3); box-shadow: inset 0 1px 3px rgba(0,0,0,.16); }
.splm-hero-copy .sp-xp-track i { background: linear-gradient(90deg, #a8d66d, #d9f3aa); box-shadow: 0 0 16px rgba(198,232,137,.35); }
.splm-progress-meta { margin-top: 8px; color: rgba(255,255,255,.48); font-size: 9px; font-weight: 700; }
.splm-hero-stats { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.splm-hero-stats article { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 11px 13px; border: 1px solid rgba(255,255,255,.09); border-radius: 14px; background: rgba(255,255,255,.065); backdrop-filter: blur(5px); }
.splm-hero-stats article > span { width: 33px; height: 33px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 10px; color: #c6e889; background: rgba(198,232,137,.1); }
.splm-hero-stats svg { width: 17px; height: 17px; }
.splm-hero-stats small { display: block; overflow: hidden; color: rgba(255,255,255,.53); font-size: 9px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.splm-hero-stats strong { display: block; margin-top: 2px; color: #fff; font-size: 17px; font-weight: 950; }

.splm-block { padding: 20px; border: 1px solid #e8e0d5; border-radius: 20px; background: #fff; box-shadow: 0 9px 22px rgba(74, 57, 38, .045); }
.splm-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.splm-section-head small { display: block; margin-bottom: 3px; color: #a77b55; font-size: 9px; font-weight: 850; }
.splm-section-head h3 { margin: 0; color: #342d27; font-size: 16px; font-weight: 950; }
.splm-section-head > span { flex: 0 0 auto; padding: 5px 9px; border: 1px solid #e5ded4; border-radius: 999px; color: #86796d; background: #faf8f4; font-size: 9px; font-weight: 800; }
.splm-formula { display: flex; align-items: center; justify-content: center; gap: 9px; margin-bottom: 14px; padding: 12px 14px; border: 1px solid #dce9df; border-radius: 14px; color: #376e5b; background: linear-gradient(135deg, #f2f8f4, #f8fbf8); }
.splm-formula-label { margin-inline-end: auto; color: #76695d; font-size: 10px; font-weight: 800; }
.splm-formula b { font-size: 11px; font-weight: 900; }
.splm-formula svg { width: 13px; height: 13px; color: #83a28f; stroke-width: 2.4; }
.splm-rules { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.splm-rules > article { min-width: 0; overflow: hidden; padding: 13px; border: 1px solid #ebe4da; border-radius: 15px; background: #fdfcf9; }
.splm-rules article > header { display: flex; align-items: center; gap: 9px; margin-bottom: 11px; }
.splm-rules article > header > span { width: 34px; height: 34px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 10px; color: #4a886f; background: #eaf5ee; }
.splm-rules article > header svg { width: 17px; height: 17px; }
.splm-rules article > header small { display: block; color: #9b8d7f; font-size: 8px; font-weight: 750; }
.splm-rules h4 { margin: 1px 0 0; color: #433a32; font-size: 12px; font-weight: 950; }
.splm-rules ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 5px; }
.splm-rules li { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 35px; padding: 6px 8px; border-radius: 9px; color: #62584f; background: #f7f4ef; font-size: 9.5px; font-weight: 750; }
.splm-rule-value { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.splm-rule-value small { color: #a4978a; font-size: 7.5px; font-weight: 700; }
.splm-rule-value b { min-width: 27px; display: inline-grid; place-items: center; padding: 3px 5px; border-radius: 7px; color: #347c63; background: #e6f2ea; font-family: inherit; font-size: 10px; font-weight: 950; }
.splm-rule-value em { color: #9a8d80; font-size: 8px; font-style: normal; }
.splm-note { display: flex; align-items: center; gap: 10px; margin-top: 13px; padding: 11px 12px; border: 1px solid #f0dfc9; border-radius: 12px; color: #746457; background: #fff9ef; }
.splm-note > span { width: 30px; height: 30px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 9px; color: #b36c32; background: #ffedd6; }
.splm-note svg { width: 16px; height: 16px; }
.splm-note p { margin: 0; font-size: 9.5px; line-height: 1.9; }
.splm-note b { color: #5d4a3a; font-weight: 950; }

.splm-share { display: grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap: 10px; }
.splm-share article { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 9px 10px; padding: 13px; border: 1px solid #e8e1d8; border-radius: 15px; background: #fdfcf9; }
.splm-share-icon { width: 40px; height: 40px; display: grid; grid-row: 1; place-items: center; border-radius: 12px; color: #347c63; background: #e9f4ed; }
.splm-share-icon svg { width: 19px; height: 19px; }
.splm-share-copy { min-width: 0; }
.splm-share-copy small { display: block; overflow: hidden; color: #83776c; font-size: 9px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.splm-share-copy b { display: block; margin-top: 2px; color: #3e3730; font-size: 15px; font-weight: 950; }
.splm-share-copy em { color: #988a7c; font-size: 8px; font-style: normal; font-weight: 750; }
.splm-share-rate { min-width: 40px; padding: 5px 7px; border-radius: 9px; color: #347c63; background: #e9f4ed; font-size: 11px; font-weight: 950; text-align: center; }
.splm-share-bar { grid-column: 1 / -1; height: 5px; overflow: hidden; border-radius: 999px; background: #ece7df; }
.splm-share-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #4f9275, #91c3a8); }
.splm-share footer { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #94887c; font-size: 8px; font-weight: 700; }

.splm-exams { margin: 0; padding: 0; list-style: none; display: grid; gap: 7px; }
.splm-exams li { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 58px; padding: 9px 11px; border: 1px solid #ece5dc; border-radius: 13px; background: #fdfcf9; transition: border-color .16s ease, transform .16s ease; }
.splm-exams li:hover { border-color: #cfded3; transform: translateX(-2px); }
.splm-exam-index { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: #4d806d; background: #eaf4ed; font-size: 10px; font-weight: 950; }
.splm-exams li > div { min-width: 0; }
.splm-exams li > div > b { display: block; overflow: hidden; color: #453c34; font-size: 11px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.splm-exams li > div > small { display: flex; align-items: center; gap: 5px; margin-top: 4px; }
.splm-exams li > div > small span { max-width: 190px; overflow: hidden; padding: 2px 6px; border-radius: 6px; color: #918478; background: #f1ede7; font-size: 7.5px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.splm-exams li > strong { min-width: 64px; padding: 6px 8px; border: 1px solid #d9e8de; border-radius: 10px; color: #347c63; background: #edf7f0; font-size: 12px; font-weight: 950; text-align: center; }
.splm-exams li > strong small { display: block; margin-top: 1px; color: #779687; font-size: 7px; font-weight: 750; }
.splm-empty { display: flex; align-items: center; gap: 13px; }
.splm-empty > span { width: 46px; height: 46px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 14px; color: #4c8a70; background: #eaf5ee; }
.splm-empty > span svg { width: 21px; height: 21px; }
.splm-empty h3 { margin: 0 0 3px; color: #433a32; font-size: 13px; font-weight: 950; }
.splm-empty p { margin: 0; color: #8c8075; font-size: 9.5px; line-height: 1.8; }
.sp-level-modal-shell .splm-modal-foot { justify-content: space-between; padding: 12px 22px; border-color: #e6ded3; background: rgba(255,253,249,.95); }
.splm-modal-foot > span { display: inline-flex; align-items: center; gap: 7px; color: #807469; font-size: 9px; font-weight: 750; }
.splm-modal-foot > span svg { width: 15px; height: 15px; color: #4b8c70; }
.splm-modal-foot .primary-button { min-width: 124px; background: #347c63; box-shadow: 0 6px 14px rgba(52,124,99,.18); }
.splm-modal-foot .primary-button:hover { background: #286a53; }

.sp-command-actions { grid-area: actions; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sp-dark-button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 10px;
  color: #151814;
  background: var(--sp-lime);
  font: inherit;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}
.sp-dark-button.subtle { color: rgba(255,255,255,.82); background: rgba(255,255,255,.055); }
.sp-dark-button:hover { transform: translateY(-1px); background: #d8fa8f; }
.sp-dark-button.subtle:hover { background: rgba(255,255,255,.11); }
.sp-dark-button svg { width: 15px; height: 15px; }

.sp-tabbar {
  position: sticky;
  top: 84px;
  z-index: 16;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px;
  border: 1px solid rgba(229,225,216,.92);
  border-radius: 15px;
  background: rgba(251,250,247,.9);
  box-shadow: 0 8px 26px rgba(56,49,39,.055);
  backdrop-filter: blur(18px);
}
.sp-tabbar > div { display: flex; gap: 4px; }
.sp-tabbar [role="tab"],
.sp-refresh {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 15px;
  border: 0;
  border-radius: 10px;
  color: #777168;
  background: transparent;
  font: inherit;
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
}
.sp-tabbar [role="tab"]:hover,
.sp-refresh:hover { color: #26231e; background: #f1eee7; }
.sp-tabbar [role="tab"].active { color: #fff; background: #22241f; box-shadow: 0 6px 14px rgba(35,34,29,.16); }
.sp-refresh { border: 1px solid var(--line); background: #fff; }
.sp-refresh svg { width: 14px; height: 14px; }
.sp-refresh:disabled { opacity: .48; cursor: wait; }

.sp-tab-content { display: grid; gap: 18px; }
.sp-surface {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 30px rgba(54,46,36,.055);
}
.sp-inline-error {
  padding: 9px 13px;
  border: 1px solid #f1caca;
  border-radius: 11px;
  color: #a64040;
  background: #fff2f2;
  font-size: 10px;
}

.sp-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.sp-metric {
  min-width: 0;
  min-height: 118px;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(54,46,36,.045);
}
.sp-metric-icon {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  flex: 0 0 43px;
  border-radius: 13px;
}
.sp-metric-icon svg { width: 20px; height: 20px; }
.sp-metric.orange .sp-metric-icon { color: #d95b15; background: #fff0e6; }
.sp-metric.blue .sp-metric-icon { color: #3d6fc5; background: #edf3ff; }
.sp-metric.purple .sp-metric-icon { color: #7756c8; background: #f2edff; }
.sp-metric.teal .sp-metric-icon { color: #168878; background: #e9f8f5; }
.sp-metric div { min-width: 0; }
.sp-metric small,
.sp-metric strong,
.sp-metric p { display: block; }
.sp-metric small { color: #777168; font-size: 9px; font-weight: 750; }
.sp-metric strong { margin-top: 3px; overflow-wrap: anywhere; color: #24211d; font-size: clamp(17px, 2vw, 23px); font-weight: 950; }
.sp-metric p { margin: 4px 0 0; color: #a19a8f; font-size: 8px; line-height: 1.6; }

.sp-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(270px, .65fr);
  gap: 14px;
  align-items: stretch;
}
.sp-answer-card { padding: 21px; }
.sp-answer-card > header,
.sp-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.sp-answer-card h2,
.sp-section-head h2 { margin: 3px 0 0; color: #24211d; font-size: 18px; font-weight: 950; }
.sp-answer-total,
.sp-history-count {
  flex: none;
  padding: 5px 9px;
  border-radius: 8px;
  color: #8c8174;
  background: #f5f2ec;
  font-size: 8px;
  font-weight: 800;
}
.sp-answer-bar {
  height: 8px;
  display: flex;
  overflow: hidden;
  margin: 22px 0 18px;
  border-radius: 99px;
  background: #f0eee9;
  direction: ltr;
}
.sp-answer-bar span { display: block; height: 100%; }
.sp-answer-bar .correct { background: #26937f; }
.sp-answer-bar .wrong { background: #db684d; }
.sp-answer-bar .blank { background: #d9ac35; }
.sp-answer-bar .pending { background: #788694; }
.sp-answer-breakdown {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));
  gap: 8px;
}
.sp-answer-breakdown > div {
  display: grid;
  grid-template-columns: 7px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 10px;
  border: 1px solid #efede7;
  border-radius: 12px;
  background: #fcfbf8;
}
.sp-answer-breakdown i { width: 7px; height: 28px; border-radius: 8px; }
.sp-answer-breakdown .correct i { background: #26937f; }
.sp-answer-breakdown .wrong i { background: #db684d; }
.sp-answer-breakdown .blank i { background: #d9ac35; }
.sp-answer-breakdown .pending i { background: #788694; }
.sp-answer-breakdown span small,
.sp-answer-breakdown span b { display: block; }
.sp-answer-breakdown span small { color: #878177; font-size: 8px; }
.sp-answer-breakdown span b { margin-top: 1px; font-size: 15px; }
.sp-answer-breakdown > div > strong { color: #6f695f; font-size: 10px; }
.sp-pending-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 12px 0 0;
  padding: 8px 10px;
  border-radius: 9px;
  color: #66717b;
  background: #f1f4f6;
  font-size: 8.5px;
  line-height: 1.7;
}
.sp-pending-note svg { width: 13px; height: 13px; flex: none; }

.sp-record-stack { display: grid; gap: 10px; }
.sp-record-card {
  min-height: 118px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 19px;
  color: #fff;
  background: #242720;
  box-shadow: 0 12px 30px rgba(43,42,34,.12);
}
.sp-record-card.sets { color: #2b2923; border-color: #e9dfcc; background: #fff8e8; box-shadow: none; }
.sp-record-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  flex: 0 0 48px;
  border-radius: 15px;
  color: #25291e;
  background: var(--sp-lime);
  font-size: 15px;
  font-weight: 950;
}
.sp-record-card.sets .sp-record-icon { color: #b36a20; background: #ffe8bd; }
.sp-record-icon svg { width: 21px; height: 21px; }
.sp-record-card small,
.sp-record-card strong { display: block; }
.sp-record-card small { color: inherit; opacity: .58; font-size: 8px; }
.sp-record-card strong { margin-top: 3px; font-size: 20px; font-weight: 950; }
.sp-record-card p { margin: 3px 0 0; color: inherit; opacity: .52; font-size: 8px; line-height: 1.6; }

.sp-quick-performance,
.sp-mode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.sp-section-head.standalone {
  align-items: flex-end;
  padding: 6px 2px 0;
}
.sp-section-head p { max-width: 720px; margin: 5px 0 0; color: #858077; font-size: 9px; line-height: 1.8; }
.sp-mode-card { min-width: 0; padding: 20px; }
.sp-mode-card > header { display: flex; align-items: center; gap: 11px; }
.sp-mode-icon {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #7050c4;
  background: #f1edff;
}
.sp-mode-card.practice .sp-mode-icon { color: #167d70; background: #e9f8f5; }
.sp-mode-card.total .sp-mode-icon { color: #c65c24; background: #fff0e5; }
.sp-mode-icon svg { width: 19px; height: 19px; }
.sp-mode-card h3 { margin: 2px 0 0; font-size: 14px; font-weight: 950; }
.sp-rate-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0; }
.sp-rate {
  position: relative;
  width: min(128px, 100%);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  justify-self: center;
  border-radius: 50%;
  background: conic-gradient(#7b5ed0 calc(var(--rate) * 1%), #eeeaf6 0);
}
.sp-rate::before { content: ""; position: absolute; inset: 8px; border-radius: inherit; background: #fff; }
.sp-rate.accuracy { background: conic-gradient(#ff792f calc(var(--rate) * 1%), #f3ebe5 0); }
.sp-rate span { position: relative; z-index: 1; display: grid; place-items: center; text-align: center; }
.sp-rate b { font-size: 17px; font-weight: 950; }
.sp-rate.pending-only b { color: #6f7880; font-size: 11px; }
.sp-rate small { margin-top: 2px; color: #8c867c; font-size: 7.5px; }
.sp-mode-foot { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0; }
.sp-mode-foot div { padding: 8px; border-radius: 9px; background: #f7f5f0; text-align: center; }
.sp-mode-foot div.pending { grid-column: 1 / -1; }
.sp-mode-foot dt { color: #8b857a; font-size: 7px; }
.sp-mode-foot dd { margin: 2px 0 0; font-size: 11px; font-weight: 900; }

.sp-history { padding: 22px; }
.sp-history-filters {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  margin: 18px 0;
  padding-bottom: 3px;
  scrollbar-width: none;
}
.sp-history-filters::-webkit-scrollbar { display: none; }
.sp-history-filters button {
  min-height: 32px;
  flex: none;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: #777168;
  background: #fff;
  font: inherit;
  font-size: 9px;
  font-weight: 800;
  cursor: pointer;
}
.sp-history-filters button[aria-pressed="true"] { color: #fff; border-color: #252720; background: #252720; }
.sp-timeline {
  position: relative;
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sp-timeline::before {
  content: "";
  position: absolute;
  inset-block: 28px;
  inset-inline-start: 20px;
  width: 1px;
  background: #e8e4dc;
}
.sp-timeline li {
  position: relative;
  min-height: 90px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: start;
  gap: 13px;
  padding: 12px 0;
  border-bottom: 1px solid #f0ede7;
}
.sp-timeline li:last-child { border-bottom: 0; }
.sp-timeline-icon {
  position: relative;
  z-index: 1;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 5px solid #fff;
  border-radius: 14px;
  color: #7154c4;
  background: #eee9ff;
  box-shadow: 0 0 0 1px #e7e2da;
}
.sp-timeline li.print .sp-timeline-icon { color: #c35e20; background: #fff0e5; }
.sp-timeline li.set .sp-timeline-icon { color: #148071; background: #e8f8f4; }
.sp-timeline li.login .sp-timeline-icon { color: #3e70c7; background: #edf3ff; }
.sp-timeline li.account .sp-timeline-icon { color: #9d781d; background: #fff8df; }
.sp-timeline li.activity .sp-timeline-icon { color: #63707b; background: #eef1f3; }
.sp-timeline-icon svg { width: 17px; height: 17px; }
.sp-timeline-copy { min-width: 0; }
.sp-timeline-type { display: block; color: #9a9389; font-size: 7.5px; font-weight: 850; }
.sp-timeline-copy h3 { margin: 2px 0 0; color: #2b2823; font-size: 12px; font-weight: 900; }
.sp-timeline-copy p { margin: 4px 0 0; color: #7e786e; font-size: 9px; line-height: 1.7; overflow-wrap: anywhere; }
.sp-timeline-copy time { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; color: #aaa398; font-size: 8px; }
.sp-timeline-copy time svg { width: 12px; height: 12px; }
.sp-timeline-badge { align-self: center; padding: 4px 7px; border-radius: 7px; color: #766e63; background: #f3f0ea; font-size: 7.5px; }
.sp-history-more { display: flex; margin: 16px auto 0; }
.sp-empty,
.sp-error {
  min-height: 260px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 7px;
  padding: 30px;
  text-align: center;
}
.sp-empty > span,
.sp-error > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; color: #7f756a; background: #f2efe9; }
.sp-empty > span svg,
.sp-error > span svg { width: 22px; height: 22px; }
.sp-empty h3,
.sp-error h2 { margin: 4px 0 0; font-size: 15px; }
.sp-empty p,
.sp-error p { max-width: 470px; margin: 0; color: #898379; font-size: 9px; line-height: 1.8; }
.sp-error { min-height: 420px; }
.sp-error .primary-button { margin-top: 7px; }

.sp-loading { display: grid; gap: 16px; }
.sp-loading-hero {
  min-height: 250px;
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 32px;
  border-radius: 25px;
  background: #20231f;
}
.sp-loading-hero > span { width: 104px; height: 104px; flex: none; border-radius: 27px; background: rgba(255,255,255,.08); animation: sqImgShimmer 1.6s infinite linear; }
.sp-loading-hero > div { width: min(520px, 60%); }
.sp-loading-hero .sk-bar { background: rgba(255,255,255,.1); }
.sp-loading-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sp-loading-grid > div { min-height: 108px; padding: 20px; border: 1px solid var(--line); border-radius: 17px; background: #fff; }

.student-profile-page button:focus-visible {
  outline: 3px solid rgba(255,116,38,.3);
  outline-offset: 2px;
}

@media (max-width: 1100px) {
  .sp-command-card { grid-template-columns: minmax(0, 1fr) 280px; padding: 27px; }
  .sp-overview-grid { grid-template-columns: 1fr; }
  .sp-record-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .student-profile-page { gap: 14px; }
  .sp-command-card {
    grid-template-columns: 1fr;
    grid-template-areas: "identity" "level" "actions";
    gap: 19px;
    min-height: 0;
    padding: 23px;
    border-radius: 22px;
  }
  .sp-command-card.no-level { grid-template-areas: "identity" "actions"; }
  .sp-level-card { min-height: 120px; }
  .sp-tabbar { top: 78px; }
  .sp-mode-grid,
  .sp-quick-performance { grid-template-columns: 1fr; }
  .sp-history { padding: 17px; }
  .sp-loading-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .splm-rules { grid-template-columns: 1fr; }
  .splm-rules > article { padding: 14px; }
}

@media (max-width: 520px) {
  .sp-command-card { padding: 18px; border-radius: 19px; }
  .sp-identity { align-items: flex-start; gap: 14px; }
  .sp-avatar-wrap { width: 78px; height: 78px; flex-basis: 78px; border-radius: 21px 8px 21px 21px; }
  .avatar.sp-avatar { border-radius: 17px 5px 17px 17px; }
  .sp-avatar-corner { min-width: 27px; height: 22px; font-size: 8px; }
  .sp-identity-copy h1 { margin-top: 3px; font-size: 21px; white-space: normal; }
  .sp-id-row { gap: 5px; }
  .sp-id-row > * { min-height: 21px; padding-inline: 7px; font-size: 7.5px; }
  .sp-level-card { padding: 16px; }
  .sp-level-head { grid-template-columns: 44px minmax(0, 1fr) auto; }
  .sp-level-icon { width: 44px; height: 44px; border-radius: 13px; }
  .sp-level-open { font-size: 8px; }
  .sp-level-summary { margin-top: 15px; }
  .sp-level-foot { align-items: flex-start; flex-direction: column; gap: 3px; }
  .modal.sp-level-modal-shell { width: calc(100vw - 16px); max-height: calc(100vh - 16px); border-radius: 22px; }
  .sp-level-modal-shell .splm-modal-head { padding: 13px 14px; }
  .splm-modal-icon { width: 38px; height: 38px; border-radius: 12px; }
  .sp-level-modal-shell .splm-modal-title h2 { font-size: 16px; }
  .splm-modal-title small { font-size: 8.5px; }
  .sp-level-modal-shell .modal-body { padding: 12px; }
  .sp-level-modal { gap: 11px; }
  .splm-hero { grid-template-columns: 1fr; gap: 19px; padding: 20px 16px 16px; border-radius: 19px; text-align: center; }
  .splm-level-ring { width: 132px; height: 132px; }
  .splm-level-core strong { font-size: 34px; }
  .splm-hero-copy h3 { margin-bottom: 15px; font-size: 17px; }
  .splm-hero-copy h3 strong { font-size: 25px; }
  .splm-progress-label, .splm-progress-meta { text-align: start; }
  .splm-hero-stats { grid-template-columns: 1fr; }
  .splm-hero-stats article { text-align: start; }
  .splm-block { padding: 15px; border-radius: 17px; }
  .splm-section-head { align-items: flex-start; flex-direction: column; gap: 8px; }
  .splm-section-head h3 { font-size: 14px; }
  .splm-formula { flex-wrap: wrap; gap: 7px; }
  .splm-formula-label { flex: 1 0 100%; margin: 0 0 2px; text-align: center; }
  .splm-formula b { font-size: 9px; }
  .splm-rules > article { padding: 11px; }
  .splm-note { align-items: flex-start; }
  .splm-share { grid-template-columns: 1fr; }
  .splm-exams li { grid-template-columns: 30px minmax(0, 1fr) auto; gap: 8px; padding: 8px; }
  .splm-exam-index { width: 28px; height: 28px; }
  .splm-exams li > div > small { align-items: flex-start; flex-direction: column; }
  .splm-exams li > strong { min-width: 56px; }
  .sp-level-modal-shell .splm-modal-foot { padding: 10px 13px; }
  .splm-modal-foot > span { display: none; }
  .splm-modal-foot .primary-button { width: 100%; }
  .sp-command-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .sp-dark-button { min-width: 0; padding-inline: 8px; font-size: 8px; }
  .sp-tabbar { gap: 5px; overflow: hidden; }
  .sp-tabbar > div { min-width: 0; flex: 1; }
  .sp-tabbar [role="tab"] { min-width: 0; flex: 1; padding-inline: 7px; font-size: 8px; }
  .sp-refresh { width: 38px; flex: none; padding: 0; }
  .sp-refresh span { display: none; }
  .sp-metrics { grid-template-columns: 1fr; }
  .sp-metric { min-height: 96px; }
  .sp-record-stack { grid-template-columns: 1fr; }
  .sp-answer-card { padding: 16px; }
  .sp-answer-card > header { align-items: flex-start; }
  .sp-answer-breakdown { grid-template-columns: 1fr 1fr; }
  .sp-answer-total { display: none; }
  .sp-rate { width: min(110px, 100%); }
  .sp-mode-card { padding: 16px; }
  .sp-section-head { flex-direction: column; gap: 9px; }
  .sp-history-count { align-self: flex-start; }
  .sp-timeline li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; }
  .sp-timeline::before { inset-inline-start: 18px; }
  .sp-timeline-icon { width: 38px; height: 38px; }
  .sp-timeline-badge { grid-column: 2; justify-self: start; align-self: start; }
  .sp-loading-hero { min-height: 210px; padding: 22px; }
  .sp-loading-hero > span { width: 78px; height: 78px; }
  .sp-loading-grid { grid-template-columns: 1fr; }
}

/* پالایش خوانایی و هماهنگی بصری پروفایل با قالب روشن سایت */
.student-profile-page {
  --sp-night: #554639;
  --sp-night-soft: #fff8ed;
  --sp-orange: #df6b2b;
  --sp-lime: #6fa88d;
}

.sp-command-card {
  min-height: 232px;
  border-color: #eadbc6;
  color: #393129;
  background:
    radial-gradient(circle at 9% 12%, rgba(230, 127, 62, .15), transparent 20rem),
    radial-gradient(circle at 88% 82%, rgba(100, 158, 128, .12), transparent 19rem),
    linear-gradient(132deg, #fffdf9 0%, #fff8ed 100%);
  box-shadow: 0 16px 38px rgba(91, 67, 38, .1);
}
.sp-command-card::before {
  border-color: rgba(197, 126, 68, .18);
  box-shadow: 0 0 0 48px rgba(220, 157, 95, .035), 0 0 0 96px rgba(100, 158, 128, .025);
}
.sp-command-card::after { opacity: .5; background: linear-gradient(105deg, transparent 0 48%, rgba(182, 127, 76, .055) 48.1% 48.4%, transparent 48.5%); }
.sp-grid-lines { opacity: .22; background-image: linear-gradient(rgba(183, 136, 93, .28) 1px, transparent 1px), linear-gradient(90deg, rgba(183, 136, 93, .28) 1px, transparent 1px); }
.sp-avatar-wrap {
  border-color: #ebd6bc;
  background: linear-gradient(145deg, #fff, #f6eadb);
  box-shadow: 0 12px 27px rgba(115, 77, 40, .14);
}
.avatar.sp-avatar { background: #f1e4d3; }
.sp-avatar-corner { border-color: #fff8ed; color: #fff; background: #df6b2b; font-size: 11px; }
.sp-command-card .sp-call-sign { color: #b45d25; opacity: 1; }
.sp-call-sign,
.sp-kicker { color: #ae652e; font-size: 12px; }
.sp-identity-copy h1 { color: #302922; }
.sp-id-row > * { border-color: #e6d4bd; color: #716154; background: rgba(255,255,255,.72); font-size: 11px; }
.sp-id-row bdi { color: #4a3c31; }
.sp-level-card {
  border-color: #e2d4c2;
  background:
    radial-gradient(circle at 92% 8%, rgba(91, 155, 124, .12), transparent 9rem),
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(251,247,240,.88));
  box-shadow: inset 0 1px rgba(255,255,255,.95), 0 10px 24px rgba(88, 63, 38, .07);
}
.sp-level-card::before { background: radial-gradient(circle, rgba(101, 166, 134, .13), transparent 68%); }
.sp-level-card:hover { border-color: #b9d6c5; box-shadow: inset 0 1px #fff, 0 16px 30px rgba(70, 103, 81, .12); }
.sp-level-icon { border-color: #cfe2d5; color: #347c63; background: linear-gradient(145deg, #f2faf5, #e3f1e8); box-shadow: inset 0 1px #fff; }
.sp-level-heading small { color: #8d7d6e; font-size: 11px; }
.sp-level-heading strong { color: #347c63; font-size: 24px; }
.sp-level-open { color: #8a796a; font-size: 10px; }
.sp-level-summary { border-color: #ebe1d5; }
.sp-level-summary > span + span { border-color: #e8ddd0; }
.sp-level-summary small { color: #8d7f72; font-size: 10px; }
.sp-level-summary b { color: #433a32; font-size: 19px; }
.sp-level-summary b em { color: #948577; font-size: 10px; }
.sp-level-progress-head small { color: #817267; font-size: 10px; }
.sp-level-progress-head b { color: #347c63; font-size: 11px; }
.sp-level-foot { color: #94877a; font-size: 9px; }
.sp-xp-track { background: #ece4da; }
.sp-xp-track i { background: linear-gradient(90deg, #4f9275, #8fc3a6); box-shadow: 0 0 12px rgba(79,146,117,.25); }
.sp-dark-button { border-color: #d96225; color: #fff; background: #df6b2b; font-size: 12px; }
.sp-dark-button.subtle { border-color: #e2d2be; color: #624f3d; background: rgba(255,255,255,.8); }
.sp-dark-button:hover { background: #c9571d; }
.sp-dark-button.subtle:hover { background: #fff7ea; }

.sp-tabbar [role="tab"],
.sp-refresh { font-size: 12px; }
.sp-tabbar [role="tab"].active { background: #df6b2b; box-shadow: 0 6px 14px rgba(173, 82, 30, .18); }

.sp-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.sp-metric {
  min-height: 88px;
  gap: 12px;
  padding: 14px 16px;
  border-color: #e9e0d5;
}
.sp-metric-icon { width: 40px; height: 40px; flex-basis: 40px; border-radius: 12px; }
.sp-metric-icon svg { width: 19px; height: 19px; }
.sp-metric small { font-size: 12px; font-weight: 800; }
.sp-metric strong { margin-top: 2px; font-size: clamp(21px, 1.8vw, 27px); line-height: 1.15; }
.sp-metrics .sp-metric small,
.sp-metrics .sp-metric strong {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sp-metric.blue strong {
  overflow-wrap: normal;
  white-space: nowrap;
  font-size: clamp(19px, 1.65vw, 25px);
}
/* توضیح ثبت/یادداشت در کارت‌های فشرده، از شلوغی و افزایش ارتفاع جلوگیری می‌کند. */
.sp-metric p,
.sp-record-card p { display: none; }

.sp-overview-grid { grid-template-columns: minmax(0, 1fr); }
.sp-answer-card { padding: 24px; }
.sp-answer-card h2,
.sp-section-head h2 { font-size: 22px; }
.sp-answer-total,
.sp-history-count { padding: 6px 10px; font-size: 11px; }
.sp-answer-bar { height: 10px; margin: 22px 0 18px; }
.sp-answer-breakdown { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.sp-answer-breakdown > div { grid-template-columns: 7px minmax(0, 1fr) auto; gap: 9px; padding: 12px; }
.sp-answer-breakdown i { height: 32px; }
.sp-answer-breakdown span small { font-size: 11px; }
.sp-answer-breakdown span b { font-size: 18px; }
.sp-answer-breakdown > div > strong { font-size: 12px; }
.sp-pending-note { padding: 10px 12px; font-size: 11px; }

.sp-record-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.sp-record-card {
  min-height: 96px;
  gap: 13px;
  padding: 16px 18px;
  border-color: #d8e8de;
  color: #2f5e4f;
  background: #f1faf4;
  box-shadow: none;
}
.sp-record-card.sets,
.sp-record-card.reviewed { border-color: #eeddbd; color: #805028; background: #fff8e9; }
.sp-record-icon { width: 44px; height: 44px; flex-basis: 44px; border-radius: 14px; color: #267a62; background: #dff1e5; font-size: 14px; }
.sp-record-card.sets .sp-record-icon,
.sp-record-card.reviewed .sp-record-icon { color: #b36a20; background: #ffebc5; }
.sp-record-icon svg { width: 20px; height: 20px; }
.sp-record-card small { color: inherit; opacity: .76; font-size: 12px; font-weight: 800; }
.sp-record-card strong { margin-top: 3px; font-size: 22px; line-height: 1.1; }
.sp-metrics .sp-record-card {
  min-width: 0;
  min-height: 88px;
  padding: 14px 16px;
  border-radius: 18px;
}
.sp-metrics .sp-record-card.top-ten { justify-content: flex-start; }
.sp-metrics .sp-record-card > div { min-width: 0; }
.sp-metrics .sp-record-icon { width: 40px; height: 40px; flex-basis: 40px; border-radius: 12px; }
.sp-metrics .sp-record-card small { overflow: hidden; font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.sp-metrics .sp-record-card strong { font-size: 20px; white-space: nowrap; }
.sp-metrics > .sp-metric,
.sp-metrics > .sp-record-card {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  column-gap: 12px;
}
.sp-metrics > .sp-metric > div,
.sp-metrics > .sp-record-card > div {
  min-width: 0;
  display: grid;
  grid-template-rows: 18px 30px;
  align-items: center;
}
.sp-metrics > .sp-metric small,
.sp-metrics > .sp-record-card small {
  height: 18px;
  margin: 0;
  line-height: 18px;
}
.sp-metrics > .sp-metric strong,
.sp-metrics > .sp-record-card strong {
  height: 30px;
  display: flex;
  align-items: center;
  margin: 0;
  line-height: 1;
}

/* هیت‌مپ فشردهٔ فعالیت پاسخ‌گویی؛ تقویم از شنبه تا جمعه و از قدیم به جدید است. */
.sp-heatmap-card {
  --heat-cell: 11px;
  position: relative;
  overflow: visible;
  padding: 15px 18px 12px;
}
.sp-heatmap-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.sp-heatmap-card > header > div:first-child { display: flex; align-items: baseline; gap: 7px; }
.sp-heatmap-card > header strong { color: #3d352d; font-size: 13px; font-weight: 950; }
.sp-heatmap-card > header small { color: #999085; font-size: 8.5px; font-weight: 750; }
.sp-heatmap-toggle { display: inline-flex; gap: 2px; padding: 2px; border-radius: 9px; background: #f2eee8; }
.sp-heatmap-toggle button {
  min-height: 27px;
  padding: 0 10px;
  border: 0;
  border-radius: 7px;
  color: #8a8176;
  background: transparent;
  font: inherit;
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
}
.sp-heatmap-toggle button[aria-pressed="true"] { color: #fff; background: #4d806d; box-shadow: 0 4px 10px rgba(48, 104, 82, .18); }
.sp-heatmap-scroll { max-width: 100%; overflow-x: auto; overflow-y: hidden; padding: 1px 1px 5px; direction: ltr; scrollbar-width: thin; scrollbar-color: #d9d0c5 transparent; }
.sp-heatmap-calendar { min-width: 790px; width: 100%; }
.sp-heatmap-months,
.sp-heatmap-weeks {
  display: grid;
  grid-template-columns: repeat(var(--heat-week-count), var(--heat-cell));
  justify-content: space-between;
  direction: ltr;
}
.sp-heatmap-months { min-height: 17px; align-items: start; margin-bottom: 2px; }
.sp-heatmap-months span {
  width: max-content;
  min-width: 0;
  overflow: visible;
  color: #91887d;
  font-size: 8px;
  font-weight: 750;
  line-height: 1.2;
  text-align: left;
  white-space: nowrap;
  direction: rtl;
}
/* ماه جاری ممکن است فقط یک ستون از شبکه را بگیرد؛ نام کامل آن به‌سمت داخل تقویم باز می‌شود. */
.sp-heatmap-months span:last-child { justify-self: end; text-align: right; }
.sp-heat-week,
.sp-heat-week-button {
  width: var(--heat-cell);
  display: grid;
  grid-template-rows: repeat(7, var(--heat-cell));
  gap: 3px;
}
.sp-heat-cell,
.sp-heat-week-pixel,
.sp-heatmap-card > footer i {
  width: var(--heat-cell);
  height: var(--heat-cell);
  display: block;
  border: 0;
  border-radius: 3px;
  background: #eeeae4;
}
button.sp-heat-cell,
.sp-heat-week-button { padding: 0; font: inherit; cursor: help; }
.sp-heat-week-button { border: 0; background: transparent; }
.sp-heat-cell.outside,
.sp-heat-week-pixel.outside { visibility: hidden; }
.sp-heat-cell[data-level="1"],
.sp-heat-week-pixel[data-level="1"],
.sp-heatmap-card > footer i[data-level="1"] { background: #e1eee8; }
.sp-heat-cell[data-level="2"],
.sp-heat-week-pixel[data-level="2"],
.sp-heatmap-card > footer i[data-level="2"] { background: #c3ddcf; }
.sp-heat-cell[data-level="3"],
.sp-heat-week-pixel[data-level="3"],
.sp-heatmap-card > footer i[data-level="3"] { background: #96c5af; }
.sp-heat-cell[data-level="4"],
.sp-heat-week-pixel[data-level="4"],
.sp-heatmap-card > footer i[data-level="4"] { background: #66a88c; }
.sp-heat-cell[data-level="5"],
.sp-heat-week-pixel[data-level="5"],
.sp-heatmap-card > footer i[data-level="5"] { background: #3b896f; }
.sp-heat-cell[data-level="6"],
.sp-heat-week-pixel[data-level="6"],
.sp-heatmap-card > footer i[data-level="6"] { background: #176850; }
.sp-heat-cell:hover,
.sp-heat-cell.active { box-shadow: 0 0 0 2px #fff, 0 0 0 3px #4d806d; transform: scale(1.08); }
.sp-heat-week-button:hover .sp-heat-week-pixel:not(.outside),
.sp-heat-week-button.active .sp-heat-week-pixel:not(.outside) { box-shadow: 0 0 0 1px #3f745f; }
.sp-heatmap-card > footer { display: flex; align-items: center; justify-content: flex-end; gap: 4px; margin-top: 4px; color: #9b9287; font-size: 7.5px; font-weight: 750; direction: ltr; }
.sp-heatmap-card > footer i { --heat-cell: 9px; }
.sp-heatmap-tip {
  position: absolute;
  z-index: 30;
  min-width: 178px;
  max-width: min(250px, calc(100% - 14px));
  display: grid;
  gap: 4px;
  padding: 8px 9px;
  border: 1px solid #d9cec1;
  border-radius: 10px;
  color: #50463d;
  background: rgba(255, 253, 249, .98);
  box-shadow: 0 10px 24px rgba(67, 49, 31, .16);
  pointer-events: none;
  direction: rtl;
}
.sp-heatmap-tip:not(.on) { opacity: 0; }
.sp-heatmap-tip > b { overflow: hidden; font-size: 9.5px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.sp-heatmap-tip > strong { color: #3f745f; font-size: 11px; font-weight: 950; }
.sp-heatmap-tip > div { display: flex; flex-wrap: wrap; gap: 3px 8px; padding-top: 3px; border-top: 1px solid #eee6dd; }
.sp-heatmap-tip > div > span { display: inline-flex; align-items: center; gap: 3px; color: #7b7268; font-size: 7.8px; font-weight: 750; white-space: nowrap; }
.sp-heatmap-tip span > i { width: 6px; height: 6px; border-radius: 50%; }
.sp-heatmap-tip .correct i { background: #2f9e83; }
.sp-heatmap-tip .wrong i { background: #d3603f; }
.sp-heatmap-tip .blank i { background: #d0a027; }
.sp-heatmap-tip .pending i { background: #788694; }
.sp-heatmap-tip [hidden] { display: none; }

/* نمودار روند فعالیت درسی؛ سری‌ها بر اساس درس و بازه‌ها با تقویم شمسی هستند. */
.sp-trend-card {
  position: relative;
  overflow: visible;
  padding: 18px;
}
.sp-trend-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}
.sp-trend-card > header > div:first-child { display: grid; gap: 3px; }
.sp-trend-card > header strong { color: #3d352d; font-size: 15px; font-weight: 950; }
.sp-trend-card > header small { color: #91887d; font-size: 9px; font-weight: 750; line-height: 1.6; }
.sp-trend-period,
.sp-trend-metrics {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  border-radius: 10px;
  background: #f2eee8;
}
.sp-trend-period button,
.sp-trend-metrics button {
  min-height: 29px;
  padding: 0 11px;
  border: 0;
  border-radius: 8px;
  color: #887f74;
  background: transparent;
  font: inherit;
  font-size: 9px;
  font-weight: 850;
  white-space: nowrap;
  cursor: pointer;
}
.sp-trend-period button[aria-pressed="true"],
.sp-trend-metrics button[aria-pressed="true"] {
  color: #fff;
  background: #4d806d;
  box-shadow: 0 4px 10px rgba(48, 104, 82, .16);
}
.sp-trend-controls { display: grid; gap: 10px; margin-bottom: 8px; }
.sp-trend-metrics { justify-self: start; }
.sp-trend-subjects {
  display: flex;
  gap: 6px;
  max-width: 100%;
  padding: 1px 1px 5px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #d9d0c5 transparent;
}
.sp-trend-subjects button {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: none;
  padding: 0 9px;
  border: 1px solid #e5ddd2;
  border-radius: 9px;
  color: #81786e;
  background: #fffdfa;
  font: inherit;
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
}
.sp-trend-subjects button[aria-pressed="true"] { border-color: color-mix(in srgb, var(--trend-color), #fff 55%); color: #443a32; background: #fff; box-shadow: 0 4px 10px rgba(75, 57, 40, .07); }
.sp-trend-subjects button[aria-pressed="true"]::after { content: "✓"; color: var(--trend-color); font-size: 9px; font-weight: 950; }
.sp-trend-subjects button > i { width: 7px; height: 7px; border-radius: 50%; background: var(--trend-color); }
.sp-trend-subjects button > small { color: #aaa197; font-size: 7.5px; font-weight: 800; }
.sp-trend-scroll { width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; overflow-y: hidden; padding-bottom: 2px; direction: ltr; scrollbar-width: thin; scrollbar-color: #d9d0c5 transparent; }
.sp-trend-chart { width: 100%; min-width: 0; max-width: 100%; display: block; overflow: hidden; font-family: inherit; }
.sp-trend-grid line { stroke: #eee8df; stroke-width: 1; }
.sp-trend-grid text { fill: #a49b90; font-size: 8px; font-weight: 750; text-anchor: end; }
.sp-trend-x-label { fill: #91887d; font-size: 8px; font-weight: 750; text-anchor: middle; direction: rtl; }
.sp-trend-line { fill: none; stroke: var(--trend-color); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; opacity: .92; vector-effect: non-scaling-stroke; }
.sp-trend-point { outline: none; cursor: help; }
.sp-trend-point.drillable { cursor: pointer; }
.sp-trend-point .hit { fill: transparent; }
.sp-trend-point .dot { fill: #fff; stroke: var(--trend-color); stroke-width: 2.2; transition: r .14s ease, fill .14s ease; vector-effect: non-scaling-stroke; }
.sp-trend-point:hover .dot,
.sp-trend-point:focus .dot,
.sp-trend-point.active .dot { r: 5.2px; fill: var(--trend-color); }
.sp-trend-drill {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 2px 0 8px;
  padding: 7px 10px;
  border: 1px solid #d9e8e1;
  border-radius: 11px;
  color: #3d6f5d;
  background: #f3faf6;
}
.sp-trend-drill > div { min-width: 0; display: flex; align-items: baseline; gap: 7px; }
.sp-trend-drill span { color: #7b8d84; font-size: 8px; font-weight: 800; white-space: nowrap; }
.sp-trend-drill strong { overflow: hidden; font-size: 10px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.sp-trend-drill button {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: none;
  padding: 0 9px;
  border: 1px solid #cfe2d9;
  border-radius: 8px;
  color: #3f745f;
  background: #fff;
  font: inherit;
  font-size: 8px;
  font-weight: 850;
  cursor: pointer;
}
.sp-trend-drill button .ui-icon { width: 13px; height: 13px; }
.sp-trend-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 9px; border-top: 1px solid #f0e9df; }
.sp-trend-card > footer > small { color: #9b9287; font-size: 8px; font-weight: 750; }
.sp-trend-legend { display: flex; flex-wrap: wrap; gap: 6px 12px; }
.sp-trend-legend span { display: inline-flex; align-items: center; gap: 5px; color: #70675e; font-size: 8.5px; font-weight: 850; }
.sp-trend-legend i,
.sp-trend-tip [data-trend-tip-subject] > i { width: 8px; height: 8px; border-radius: 50%; background: var(--trend-color); }
.sp-trend-tip {
  position: absolute;
  z-index: 35;
  min-width: 185px;
  max-width: min(255px, calc(100% - 16px));
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid #d9cec1;
  border-radius: 11px;
  color: #50463d;
  background: rgba(255, 253, 249, .98);
  box-shadow: 0 12px 26px rgba(67, 49, 31, .17);
  pointer-events: none;
  direction: rtl;
}
.sp-trend-tip:not(.on) { opacity: 0; }
.sp-trend-tip > b { overflow: hidden; font-size: 9px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.sp-trend-tip [data-trend-tip-subject] { display: flex; align-items: center; gap: 5px; color: #71675e; font-size: 8.5px; }
.sp-trend-tip-main { display: flex; align-items: baseline; gap: 4px; color: #3f745f; }
.sp-trend-tip-main b { font-size: 16px; font-weight: 950; }
.sp-trend-tip-main small { font-size: 8px; font-weight: 850; }
.sp-trend-tip-detail { display: flex; flex-wrap: wrap; gap: 3px 8px; padding-top: 5px; border-top: 1px solid #eee6dd; }
.sp-trend-tip-detail > span { display: inline-flex; align-items: center; gap: 3px; color: #7b7268; font-size: 7.8px; font-weight: 750; white-space: nowrap; }
.sp-trend-tip-detail i { width: 6px; height: 6px; border-radius: 50%; }
.sp-trend-tip-detail .correct i { background: #2f9e83; }
.sp-trend-tip-detail .wrong i { background: #d3603f; }
.sp-trend-tip-detail .blank i { background: #d0a027; }
.sp-trend-tip-detail .pending i { background: #788694; }
.sp-trend-tip [hidden] { display: none; }
.sp-trend-empty { min-height: 125px; display: grid; place-items: center; align-content: center; gap: 5px; text-align: center; }
.sp-trend-empty > .ui-icon { width: 24px; height: 24px; color: #4d806d; }
.sp-trend-empty h3 { margin: 0; color: #40372f; font-size: 13px; }
.sp-trend-empty p { margin: 0; color: #958c81; font-size: 9px; }

.sp-section-head p { font-size: 12px; line-height: 1.75; }
.sp-mode-card { padding: 22px; }
.sp-mode-card h3 { font-size: 17px; }
.sp-rate-grid { margin: 22px 0; }
.sp-rate b { font-size: 20px; }
.sp-rate.pending-only b { font-size: 13px; }
.sp-rate small { font-size: 11px; }
/* چهار شاخص اصلی همیشه در یک ردیف می‌مانند. */
.sp-mode-foot { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.sp-mode-foot div { padding: 10px 8px; }
.sp-mode-foot dt { font-size: 11.5px; }
.sp-mode-foot dd { font-size: 15px; }

.sp-history { padding: 26px; }
.sp-history-filters button { min-height: 36px; padding-inline: 14px; font-size: 12px; }
.sp-timeline li { min-height: 96px; gap: 14px; padding: 14px 0; }
.sp-timeline-type { font-size: 11px; }
.sp-timeline-copy h3 { font-size: 15px; }
.sp-timeline-copy p { font-size: 12px; line-height: 1.75; }
.sp-timeline-copy time { font-size: 11px; }
.sp-timeline-badge { padding: 5px 8px; font-size: 11px; }
.sp-empty p,
.sp-error p { font-size: 12px; }
.sp-loading-hero { border: 1px solid #eadbc6; background: #fff8ed; }
.sp-loading-hero > span { background: #f1e2d0; }
.sp-loading-hero .sk-bar { background: #eadcca; }

@media (max-width: 1180px) and (min-width: 981px) {
  .sp-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sp-metrics .sp-record-card { grid-column: span 2; }
}

@media (min-width: 1181px) {
  .sp-metrics .sp-metric { gap: 10px; padding-inline: 12px; }
  .sp-metrics .sp-metric-icon { width: 38px; flex-basis: 38px; }
  .sp-metrics .sp-metric small { font-size: 10.5px; }
  .sp-metrics .sp-record-card small { font-size: 9.5px; }
  .sp-metrics .sp-metric.blue strong { font-size: 17px; }
}

@media (max-width: 980px) {
  .sp-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1100px) and (min-width: 981px) {
  .sp-metric { gap: 10px; padding-inline: 12px; }
  .sp-metric-icon { width: 38px; flex-basis: 38px; }
}

@media (max-width: 760px) {
  .sp-command-card { min-height: 0; }
  .sp-answer-breakdown { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sp-history { padding: 20px; }
  .sp-heatmap-card { padding-inline: 14px; }
  .sp-trend-card { padding: 15px 13px; }
  .sp-trend-chart { width: 680px; min-width: 680px; max-width: none; }
  .sp-trend-card > footer { align-items: flex-start; flex-direction: column; }
  .sp-trend-drill { align-items: flex-start; flex-direction: column; }
  .sp-trend-drill button { align-self: stretch; justify-content: center; }
}

@media (max-width: 520px) {
  .sp-command-card { padding: 18px; }
  .sp-avatar-corner { font-size: 10px; }
  .sp-id-row > * { font-size: 10px; }
  .sp-dark-button { font-size: 11px; }
  .sp-tabbar [role="tab"] { font-size: 10px; }
  .sp-metrics,
  .sp-record-stack { grid-template-columns: 1fr; }
  .sp-metric { min-height: 82px; }
  .sp-heatmap-card { padding: 12px 11px 9px; }
  .sp-heatmap-card > header { align-items: flex-start; }
  .sp-heatmap-card > header > div:first-child { display: grid; gap: 1px; }
  .sp-heatmap-card > header strong { font-size: 11px; }
  .sp-heatmap-toggle button { min-height: 25px; padding-inline: 8px; font-size: 8px; }
  .sp-heatmap-calendar { min-width: 735px; }
  .sp-trend-card > header { align-items: flex-start; }
  .sp-trend-card > header > div:first-child { max-width: 58%; }
  .sp-trend-period button,
  .sp-trend-metrics button { min-height: 27px; padding-inline: 8px; font-size: 8px; }
  .sp-trend-metrics { max-width: 100%; overflow-x: auto; }
  .sp-trend-subjects button { min-height: 28px; font-size: 8px; }
  .sp-answer-card { padding: 18px; }
  .sp-answer-card h2,
  .sp-section-head h2 { font-size: 20px; }
  .sp-answer-breakdown { gap: 8px; }
  .sp-record-card { min-height: 88px; }
  .sp-mode-foot { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
  .sp-mode-foot div { padding-inline: 4px; }
  .sp-mode-foot dt { font-size: 9.5px; }
  .sp-timeline-copy h3 { font-size: 14px; }
  .sp-timeline-copy p,
  .sp-timeline-copy time { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .sp-dark-button:hover { transform: none; }
  .sp-loading-hero > span { animation: none; }
}

/* ── جابه‌جاگر حسابِ مخصوص محیط لوکال ── */
#devSwitcher {
  position: fixed;
  inset-inline-start: 16px;
  inset-block-end: 16px;
  z-index: 9999;
  font-family: inherit;
  direction: rtl;
}
.dev-switch-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 13px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: #1f2937;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
}
.dev-switch-toggle svg { width: 15px; height: 15px; }
.dev-switch-toggle:hover { background: #111827; }
.dev-switch-panel {
  display: none;
  flex-direction: column;
  gap: 4px;
  width: 270px;
  max-height: 60vh;
  overflow-y: auto;
  margin-block-end: 8px;
  padding: 8px;
  border: 1px solid var(--line, #e8e8e8);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.2);
}
.dev-switch-panel.open { display: flex; }
.dev-switch-sec {
  font-size: 10px;
  font-weight: 800;
  color: var(--muted, #8a8a8a);
  padding: 7px 6px 3px;
}
.dev-acc {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 8px 9px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: #f7f7f5;
  cursor: pointer;
  text-align: start;
}
.dev-acc:hover { background: #eef2f7; }
.dev-acc.on { border-color: var(--orange, #f0a35e); background: #fff6ed; }
.dev-acc-av {
  flex: none;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #2a8a7a;
  color: #fff;
  font-weight: 800;
  font-size: 13px;
}
.dev-acc-info { display: flex; flex-direction: column; line-height: 1.35; min-width: 0; }
.dev-acc-info b { font-size: 12px; color: #222; }
.dev-acc-info small { font-size: 10px; color: var(--muted, #8a8a8a); }
.dev-acc.dev-logout { background: #fdecec; margin-top: 4px; justify-content: center; gap: 5px; font-size: 12px; font-weight: 700; color: #c0392b; }
.dev-acc.dev-logout svg { width: 14px; height: 14px; }

/* placeholderِ درخشانِ تصویرِ سؤال تا وقتی تک‌تک لود می‌شوند (حسِ لود شدنِ حرفه‌ای) */
.sq-img-lazy {
  display: block;
  width: 100%;
  min-height: 120px;
  border-radius: 12px;
  background: linear-gradient(100deg, #f1ede8 20%, #faf8f4 45%, #f1ede8 70%);
  background-size: 220% 100%;
  animation: sqImgShimmer 1.25s ease-in-out infinite;
}
/* metadata ابعاد اجازه می‌دهد پیش از رسیدن تصویر، ارتفاع نهایی صفحه دقیق بماند. */
.sq-img-lazy.sq-img-sized { min-height: 0; }
.sq-img-loaded {
  animation: none;
  background: none;
  min-height: 0;
}
@keyframes sqImgShimmer {
  0% { background-position: 220% 0; }
  100% { background-position: -220% 0; }
}

/* ── اسکلتِ لود صفحه (قالب سایت با درخشش، حسِ اپ‌های حرفه‌ای) ── */
.skeleton-page { padding: 6px 2px 40px; animation: skFade .3s ease; }
.sk-head { margin-bottom: 22px; }
.sk-toolbar { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.sk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.sk-card { border: 1px solid var(--line, #eee3d6); border-radius: 16px; background: #fff; overflow: hidden; }
.sk-card-media { height: 130px; }
.sk-card-body { padding: 14px 16px 16px; }
.sk-chips { display: flex; gap: 8px; margin-top: 14px; }
.sk-bar, .sk-card-media {
  display: inline-block;
  border-radius: 7px;
  background: linear-gradient(100deg, #efeae3 20%, #f9f6f1 46%, #efeae3 72%);
  background-size: 220% 100%;
  animation: sqImgShimmer 1.25s ease-in-out infinite;
}
@keyframes skFade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .sk-bar, .sk-card-media, .sq-img-lazy { animation: none; }
}

/* ==== استودیوی چاپ مجموعه سوال ==== */
.print-studio {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  flex-direction: column;
  background: #efece5;
}
body.pstudio-open { overflow: hidden; }
.pstudio-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 20px;
  background: #fffdfa;
  border-bottom: 1px solid var(--line);
}
.pstudio-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.pstudio-title b { font-size: 16px; }
.pstudio-title span { color: var(--muted); font-weight: 700; }
.pstudio-title small { color: var(--muted); font-size: 11px; }
.pstudio-actions { display: flex; align-items: center; gap: 10px; }
/* انتخاب قالبِ چاپ آزمونِ برگزارشده (دفترچه/پاسخ/کلید/همه) در نوار بالای استودیو */
.pstudio-exam-tpls { display: flex; flex-wrap: wrap; gap: 6px; margin-inline-start: auto; }
.pstudio-exam-tpls .pset-template { padding: 8px 12px; }
.pstudio-layout {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
}
.pstudio-side {
  grid-column: 1;
  grid-row: 1;
  overflow: auto;
  padding: 16px;
  background: #fffdfa;
  border-inline-end: 1px solid var(--line);
}
.pstudio-preview {
  /* جایگاه صریح است تا لایهٔ لودینگ (که روی همین خانه می‌نشیند) آن را به ردیف بعد هل ندهد */
  grid-column: 2;
  grid-row: 1;
  overflow: auto;
  padding: 26px 20px 60px;
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 22px;
}
.pstudio-layout.no-side .pstudio-preview { grid-column: 1; }

/* ── حالت «در حال آماده‌سازی/صفحه‌بندی» ──
   روی همان خانهٔ گرید پیش‌نمایش می‌نشیند (نه روی تنظیمات) و pointer-events ندارد،
   پس نوار تنظیمات و اسکرول صفحه‌ها همچنان در دسترس‌اند. */
.pstudio-busy {
  grid-column: 2;
  grid-row: 1;
  z-index: 6;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 12vh 16px 16px;
  pointer-events: none;
  background: rgba(239, 236, 229, .72);
}
.pstudio-layout.no-side .pstudio-busy { grid-column: 1; }
/* بعد از آماده‌شدن batch اول، صفحه‌ها زیر یک لایهٔ روشن و نوار کوچک زنده می‌مانند؛
   کاربر می‌تواند نتیجه را بخواند و اسکرول کند، در حالی که ادامه تکمیل می‌شود. */
.pstudio-busy.has-preview {
  padding-top: 16px;
  background: rgba(239, 236, 229, .18);
}
.pstudio-busy.has-preview .pstudio-busy-card {
  position: sticky;
  top: 12px;
  box-shadow: 0 9px 24px rgba(60, 47, 32, .16);
}
.pstudio-busy-card {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  min-width: 260px;
  max-width: 100%;
  padding: 14px 20px;
  border-radius: 18px;
  background: #fffdfa;
  border: 1px solid var(--line);
  box-shadow: 0 14px 34px rgba(60, 47, 32, .2);
  animation: skFade .2s ease;
}
.pstudio-busy-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.pstudio-busy-card b { font-size: 13.5px; }
.pstudio-busy-card small { color: var(--muted); font-size: 11px; }
.pstudio-busy-card small:empty { display: none; }
/* نوار پیشرفتِ دریافت سؤال‌ها؛ فقط وقتی درصد واقعی داریم دیده می‌شود */
.pstudio-busy-bar {
  display: block;
  height: 5px;
  margin-top: 5px;
  border-radius: 99px;
  background: #f1e9df;
  overflow: hidden;
}
.pstudio-busy-bar[hidden] { display: none; }
.pstudio-busy-bar i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: var(--orange);
  transition: width .25s ease;
}
/* پیش از رسیدن اولین تکه، نوار نامعین می‌لغزد (transform است، پس روی compositor می‌ماند) */
.pstudio-busy-bar.is-indeterminate i {
  width: 38%;
  transition: none;
  animation: pstudioBarSlide 1.15s ease-in-out infinite;
}
@keyframes pstudioBarSlide {
  from { transform: translateX(-110%); }
  to { transform: translateX(275%); }
}
.pstudio-busy-spin {
  width: 18px;
  height: 18px;
  flex: none;
  border: 2px solid #eadfd3;
  border-top-color: var(--orange);
  border-radius: 50%;
  animation: pstudioSpin .75s linear infinite;
}
@keyframes pstudioSpin { to { transform: rotate(360deg); } }
.pstudio-preview.is-busy { cursor: progress; }
.pstudio-busy.is-error { pointer-events: auto; }
.pstudio-busy.is-error .pstudio-busy-card { border-color: #efc9c4; box-shadow: 0 14px 34px rgba(111, 43, 37, .18); }
.pstudio-busy.is-error .pstudio-busy-spin {
  border: 0;
  border-radius: 50%;
  background: #fff0ee;
  animation: none;
}
.pstudio-busy.is-error .pstudio-busy-spin::before {
  content: "!";
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #b5473e;
  font-size: 12px;
  font-weight: 900;
}
.pstudio-busy-actions { display: flex; margin-top: 7px; }
.pstudio-busy-actions button {
  padding: 7px 13px;
  border: 1px solid #e8b9b4;
  border-radius: 9px;
  background: #fff;
  color: #a23f37;
  font: inherit;
  font-size: 11.5px;
  font-weight: 850;
  cursor: pointer;
}
.pstudio-busy-actions button:disabled { opacity: .6; cursor: wait; }

/* اسکلت A4 تا اولین صفحه‌بندی؛ ناحیهٔ پیش‌نمایش هرگز خالی دیده نمی‌شود.
   بدون انیمیشن: درخششِ گرادیان روی سطحی به این بزرگی هر فریم repaint می‌خواهد و
   دقیقاً حین صفحه‌بندی رشتهٔ اصلی را کند می‌کند؛ حرکت را همان اسپینر کوچک می‌رساند. */
.pstudio-skeleton { display: grid; justify-items: center; gap: 22px; }
.pstudio-skeleton-page {
  width: 794px;
  max-width: 100%;
  height: 1123px;
  border-radius: 12px;
  border: 1px solid #e5dacb;
  box-shadow: 0 10px 34px rgba(60, 47, 32, .14);
  background: #fbf9f5;
}
@media (prefers-reduced-motion: reduce) {
  .pstudio-busy-spin, .pstudio-busy-bar.is-indeterminate i { animation: none; }
}

/* تنظیمات */
.pset-group { margin-bottom: 20px; }
.pset-group h4 { margin: 0 0 10px; font-size: 13px; }
.pset-templates { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pset-template {
  padding: 10px 8px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  cursor: pointer;
  transition: all .15s ease;
}
.pset-template.on { border-color: var(--orange); color: var(--orange); background: var(--orange-soft); }
.pset-select {
  width: 100%;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-size: 12px;
}
.pset-subselect { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px; margin-top: 8px; font-size: 12px; font-weight: 700; color: var(--muted); }
.pset-subselect .pset-select { width: 100%; }
.pset-check { display: flex; align-items: center; gap: 8px; padding: 6px 0; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.pset-check input { accent-color: var(--orange); width: 15px; height: 15px; }
.pset-check.head { padding: 0; font-size: 13px; }
.pset-topic-parts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
  padding: 8px;
  border: 1px solid #eee3d7;
  border-radius: 12px;
  background: #fffdfa;
}
.pset-topic-part {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 7px;
  border: 1px solid #f0e7dc;
  border-radius: 10px;
  background: #fff;
  color: #6c6355;
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
}
.pset-topic-part input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--orange);
  flex: none;
}
.pset-topic-part span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pset-slider { display: grid; gap: 6px; padding-top: 8px; font-size: 12.5px; font-weight: 700; }
.pset-slider input { width: 100%; accent-color: var(--orange); }
.pset-slider b { color: var(--orange); font-size: 12px; }
.pset-header-rows { display: grid; gap: 7px; }
.pset-header-rows.is-off { opacity: .45; pointer-events: none; }
.pset-header-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.pset-header-head h4 { margin: 0; }
.pset-align-tools {
  display: inline-flex;
  direction: rtl;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f7f4ee;
}
.pset-align-tools button {
  width: 30px;
  height: 28px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #817766;
  cursor: pointer;
}
.pset-align-tools button:hover { color: var(--orange); }
.pset-align-tools button.on {
  color: #9a5a1f;
  background: #fff;
  box-shadow: 0 2px 7px rgba(67, 49, 30, .12);
}
.pset-align-tools svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.pset-header-row { display: grid; grid-template-columns: 16px 82px minmax(0, 1fr); align-items: center; gap: 7px; }
.pset-header-row.has-align { grid-template-columns: 16px 70px minmax(0, 1fr) auto; }
.pset-row-align { padding: 2px; border-radius: 9px; }
.pset-row-align button { width: 23px; height: 26px; border-radius: 6px; }
.pset-row-align svg { width: 15px; height: 15px; }
.pset-header-row input[type="checkbox"] { accent-color: var(--orange); }
.pset-header-row input[type="text"] {
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  font: inherit;
  font-size: 11.5px;
  min-width: 0;
}
.pset-badge-tabs { margin-bottom: 8px; }
.pset-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pset-two label { display: grid; gap: 5px; font-size: 11.5px; font-weight: 700; color: var(--muted); }
.pset-two input {
  width: 78px;
  max-width: 100%;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  font: inherit;
  font-size: 12px;
  text-align: center;
}
.pset-hint { font-size: 11px; color: var(--muted); background: #f7f4ee; border-radius: 10px; padding: 9px 11px; }
.pset-templates.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pset-total-mark {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 10px;
  padding: 9px 11px;
  border: 1px solid #eadfd1;
  border-radius: 10px;
  background: #fff8ef;
  color: #7d6f5d;
  font-size: 12px;
  font-weight: 800;
}
.pset-total-mark b { color: #9a5a1f; font-size: 13px; }
.pset-qgrid-head,
.pset-qrow {
  display: grid;
  grid-template-columns: 34px 1fr 1fr;
  align-items: center;
  gap: 6px;
}
.pset-qgrid-head.mark-only,
.pset-qgrid.mark-only .pset-qrow {
  grid-template-columns: 34px 1fr;
}
.pset-qgrid-head {
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
}
.pset-qgrid {
  display: grid;
  gap: 5px;
  max-height: 260px;
  overflow: auto;
  padding-inline-end: 2px;
}
.pset-qrow {
  padding: 5px;
  border: 1px solid #eee6da;
  border-radius: 9px;
  background: #fffdfa;
}
.pset-qrow b {
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #f4f0ea;
  color: #5e584f;
  font-size: 11px;
}
.pset-qrow input {
  min-width: 0;
  width: 100%;
  padding: 6px 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font: inherit;
  font-size: 11px;
  text-align: center;
}
.pset-empty { margin: 0; color: var(--muted); font-size: 11px; }

/* صفحه A4 */
.pstudio-page {
  position: relative;
  box-sizing: border-box;
  width: 794px;
  min-height: 1123px;
  background: #fff;
  border: 1px solid #e5dacb;
  border-radius: 12px;
  box-shadow: 0 10px 34px rgba(60,47,32,.14);
  padding: 57px;
  overflow: hidden;
}
@media screen {
  /* صفحه‌های پایین viewport تا زمان نزدیک‌شدن paint نمی‌شوند؛ ابعاد ذاتی ثابت
     می‌ماند و این rule در چاپ/PDF فعال نیست. */
  .pstudio-page { content-visibility: auto; contain-intrinsic-size: 794px 1123px; }
}
.pstudio-page::before {
  content: "";
  position: absolute;
  inset: 30px;
  border: 1px solid #e3d7c4;
  border-radius: 14px;
  pointer-events: none;
}
/* قالب‌های غیرِ سؤال (پاسخنامهٔ تشریحی/کلیدی/پاسخبرگ) کادرِ حالت آزمون را ندارند */
.pstudio-page.no-frame::before { display: none; }
.pstudio-page-inner {
  position: relative;
  z-index: 1;
  display: block;
}
.pstudio-page-inner > * + * {
  margin-top: var(--pq-gap, 38px);
}
.pstudio-page-inner > .pq-header + * {
  margin-top: 18px;
}
.pstudio-page.is-final .pstudio-page-inner > * + *,
.pstudio-page.is-final .pstudio-page-inner > .pq-header + * {
  margin-top: 0;
}
.pstudio-page.is-final {
  --pstudio-final-side: 42px;
  --pstudio-final-line: 1px;
}
.pstudio-page-footer {
  position: absolute;
  right: 0;
  left: 0;
  /* کمی بالاتر تا شمارهٔ صفحه از خطِ کادر فاصله بگیرد */
  bottom: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #8b8272;
  font-size: 10.5px;
  font-weight: 700;
  z-index: 2;
}
.pstudio-page-footer b {
  min-width: 28px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 1px solid #eadfd1;
  border-radius: 8px;
  color: #9a5a1f;
  background: #fff8ef;
}

/* نسخهٔ سادهٔ چاپ مجموعه سؤال: سربرگ ثابت، تایپوگرافی فارسی و فوتر برند */
.pstudio-page.is-simple {
  padding: 118px 57px 72px;
  color: #24211d;
  font-family: "Vazirmatn", "B Nazanin", Tahoma, sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.pstudio-measure.is-simple-measure {
  color: #24211d;
  font-family: "Vazirmatn", "B Nazanin", Tahoma, sans-serif;
  text-rendering: optimizeLegibility;
}
.pstudio-page.is-simple::before {
  inset: 25px;
  border: 1px solid #e7ded2;
  border-radius: 20px;
  box-shadow: inset 0 0 0 4px #fbf9f6;
}
.psimple-page-head {
  position: absolute;
  z-index: 3;
  top: 33px;
  right: 39px;
  left: 39px;
  min-height: 62px;
  display: grid;
  grid-template-columns: 176px minmax(0, 1fr) 176px;
  align-items: center;
  gap: 14px;
  padding: 0 4px 12px;
  border-bottom: 1px solid #ddd2c4;
  color: #25313a;
}
.psimple-page-head::after {
  content: none;
}
.psimple-brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}
.psimple-brand > span:last-child { min-width: 0; display: grid; gap: 1px; }
.psimple-brand b { font-size: 13px; font-weight: 950; color: #173e58; white-space: nowrap; }
.psimple-brand small { font-size: 8.5px; font-weight: 720; color: #8b8174; white-space: nowrap; }
.psimple-logo {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #fff1e7;
  color: #ed6a2c;
}
.psimple-logo svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.psimple-title {
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 1px;
  padding-inline: 14px;
  border-inline: 1px solid #eee7de;
  text-align: center;
}
.psimple-title small { font-size: 8.5px; font-weight: 800; color: #9b8e7e; }
.psimple-title b {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #24211d;
  font-size: 14.5px;
  font-weight: 900;
}
.psimple-count { width: 100%; display: grid; justify-self: stretch; justify-items: center; gap: 1px; text-align: center; }
.psimple-count small { font-size: 8.5px; font-weight: 800; color: #9b8e7e; }
.psimple-count b { min-width: 34px; color: #173e58; font-size: 14px; font-weight: 950; text-align: center; }
.psimple-page-footer {
  position: absolute;
  z-index: 3;
  right: 42px;
  left: 42px;
  bottom: 34px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  padding-top: 8px;
  border-top: 1px solid #e1d8cc;
  color: #81776a;
  font-size: 9.5px;
  font-weight: 750;
}
.psimple-site {
  justify-self: end;
  color: #28536f;
  font-family: "Vazirmatn", Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 850;
  letter-spacing: .2px;
}
.psimple-footer-mark {
  position: relative;
  width: 42px;
  height: 1px;
  background: #d9cfc2;
}
.psimple-footer-mark::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5px;
  height: 5px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #ed6a2c;
  box-shadow: 0 0 0 1px #ed6a2c;
  transform: translate(-50%, -50%);
}
.psimple-page-no { justify-self: start; white-space: nowrap; color: #6e6559; font-size: 10.5px; font-weight: 850; }

/* مقدار فاصلهٔ چیدمان، فضای خالی بعد از سؤال قبلی است؛ نه بالای سؤال یا بین عنوان بخش و سؤال آن. */
.pstudio-page.is-simple .pstudio-page-inner > * + * { margin-top: 0; }
.pstudio-page.is-simple .pstudio-page-inner > .pq-header + * { margin-top: 18px; }
.pstudio-page.is-simple .pstudio-page-inner > .pq-block + * { margin-top: var(--pq-gap, 0); }
.pstudio-page.is-simple .pstudio-page-inner > .pq-section-title + .pq-block { margin-top: 8px; }

.pstudio-page.is-simple .psimple-info,
.pstudio-measure.is-simple-measure .psimple-info {
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  overflow: hidden;
  padding: 0;
  border: 1px solid #e3d8ca;
  border-radius: 14px;
  background: #e9e0d5;
  box-shadow: 0 5px 16px rgba(47, 37, 25, .045);
}
.pstudio-page.is-simple .psimple-info .pqh-cell,
.pstudio-measure.is-simple-measure .psimple-info .pqh-cell {
  min-height: 43px;
  padding: 9px 14px;
  background: #fffdfa;
  color: #37312b;
  font-size: 11.5px;
}
.pstudio-page.is-simple .psimple-info .pqh-cell:last-child:nth-child(odd),
.pstudio-measure.is-simple-measure .psimple-info .pqh-cell:last-child:nth-child(odd) { grid-column: 1 / -1; }
.pstudio-page.is-simple .psimple-info .pqh-cell b,
.pstudio-measure.is-simple-measure .psimple-info .pqh-cell b { color: #8a6f55; font-size: 10.5px; font-weight: 850; }
.pstudio-page.is-simple .psimple-info .pqh-cell > span:not(.pqh-blank),
.pstudio-measure.is-simple-measure .psimple-info .pqh-cell > span:not(.pqh-blank) { font-weight: 800; }
.pstudio-page.is-simple .psimple-info .pqh-blank,
.pstudio-measure.is-simple-measure .psimple-info .pqh-blank { border-bottom: 0; }
.pstudio-page.is-simple .pq-question-row,
.pstudio-measure.is-simple-measure .pq-question-row { grid-template-columns: auto minmax(0, 1fr); gap: 6px; }
/* شماره روی خطِ اولِ متن می‌نشیند، نه بالای بلوک. با `align-items: start` هر دو
   ستون از یک y شروع می‌شوند، ولی سطرِ متن (line-height 2.12) از سطرِ شماره
   (1.45) بلندتر است و نیم‌فاصلهٔ بیشترش خطِ پایهٔ متن را ~۴px پایین‌تر می‌برد؛
   نتیجه شماره‌ای که روی خط ننشسته است. هم‌ترازیِ baseline خودِ گرید این را دقیق
   صفر می‌کند.
   سؤالِ تصویری و پاسخنامه بیرون‌اند: خطِ پایهٔ یک تصویر لبهٔ پایینِ آن است، پس
   با baseline شماره تا زیرِ شکل می‌افتد. */
.pstudio-page.is-simple .pq-block:not(.pq-visual-first):not(.pa-block) .pq-question-row,
.pstudio-measure.is-simple-measure .pq-block:not(.pq-visual-first):not(.pa-block) .pq-question-row {
  align-items: baseline;
}
.pstudio-page.is-simple .pq-block:not(.pq-visual-first):not(.pa-block) .pq-no-wrap,
.pstudio-measure.is-simple-measure .pq-block:not(.pq-visual-first):not(.pa-block) .pq-no-wrap {
  align-self: baseline;
}
/* شمارهٔ سؤالِ برگهٔ چاپ: همان قراردادِ دفترچه — عددِ ساده با فونتِ خودِ سؤال و
   یک خط کوتاه بعد از آن («۱-»)، نه چیپِ رنگیِ رابط. خط با border کشیده می‌شود
   نه با کاراکترِ «-»، چون در متنِ راست‌به‌چپ الگوریتم bidi آن را جابه‌جا می‌کند. */
.pstudio-page.is-simple .pq-no,
.pstudio-measure.is-simple-measure .pq-no {
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  display: inline-flex;
  direction: rtl;
  align-items: baseline;
  justify-content: flex-end;
  gap: 3px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #2c2721;
  /* خانوادهٔ ترکیبیِ «MK Question» عمداً «۰» را از وزیرمتن می‌خواند (صفرِ ب نازنین
     یک نقطه است) — ولی آن قرارداد فقط برای متنِ سؤال و گزینه‌هاست. در شمارهٔ
     سؤال همان جانشینی یعنی «۱۰» با «۱»ِ ب نازنین و «۰»ِ وزیرمتن نوشته شود و
     دو رقمِ یک عدد از دو فونت دربیایند. پس شماره خودِ ب نازنین را می‌گیرد —
     همان کاری که .pexam-no در دفترچهٔ کنکور می‌کند. */
  font-family: "B Nazanin", "BNazanin", "B Yekan", "Vazirmatn", Tahoma, sans-serif;
  font-size: calc(14px * var(--q-scale));
  font-weight: 700;
  /* هم‌ترازی با «سطرِ» متن (۲٫۱۲) شماره را تا وسطِ خط پایین می‌کشید و کنارِ سؤالِ
     تصویری خیلی افتاده دیده می‌شد؛ شماره باید نزدیکِ بالای بلوکِ سؤال بایستد. */
  line-height: 1.45;
  white-space: nowrap;
}
.pstudio-page.is-simple .pq-no::after,
.pstudio-measure.is-simple-measure .pq-no::after {
  content: "";
  width: 7px;
  flex: 0 0 7px;
  align-self: center;
  border-top: 1.5px solid currentColor;
}
.pstudio-page.is-simple .pq-body,
.pstudio-measure.is-simple-measure .pq-body { font-size: 14px; font-weight: 480; line-height: 2.12; }
.pstudio-page.is-simple .pq-option,
.pstudio-measure.is-simple-measure .pq-option { color: #35302a; font-size: 13.3px; line-height: 1.9; }
.pstudio-page.is-simple .pq-option b,
.pstudio-measure.is-simple-measure .pq-option b { color: inherit; }

/* پاسخنامهٔ تشریحی بدون کادر است: پاسخ‌ها پشتِ‌هم روی صفحه می‌آیند و مرزشان را
   جداکنندهٔ «آقای کنکور» می‌سازد، نه یک باکسِ دورِ هرکدام. کادرکشی هم صفحه را
   شلوغ می‌کرد و هم جای جداکننده را می‌گرفت. */
.pstudio-page.is-simple.is-answers .pa-block,
.pstudio-measure.is-simple-measure .pa-block {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
/* جداکننده باید به پاسخِ بعدی بچسبد، نه اینکه وسطِ یک فضای خالی شناور بماند.
   دو فاصله روی هم جمع می‌شدند: `--pq-gap` (۱۶px در قالب پاسخنامه) که به هر بلوکِ
   بعد از بلوکِ دیگر margin-top می‌داد، به‌علاوهٔ حاشیهٔ خودِ جداکننده. جمعش ۳۴px
   بالای خط می‌شد. حالا فاصلهٔ بین‌بلوکی صفر است و فقط حاشیهٔ کمِ خودِ جداکننده
   می‌ماند — چون خودِ خط، مرزِ دو پاسخ است و فاصلهٔ اضافه لازم ندارد. */
.pstudio-page.is-simple.is-answers .pstudio-page-inner > .pq-block + *,
.pstudio-measure.is-simple-measure .pstudio-page-inner > .pq-block + * { margin-top: 0; }
/* فاصله با padding داده می‌شود، نه margin. اندازه‌گیرِ صفحه‌بندی هر بلوک را داخل
   `.pstudio-mitem` که `overflow: hidden` دارد می‌سنجد، پس آنجا حاشیه جمع نمی‌شود
   ولی در صفحهٔ واقعی حاشیهٔ بالای جداکننده از `.pa-block` بیرون می‌زند و جمع
   می‌شود؛ نتیجه اینکه هر پاسخ ۸px بلندتر از واقعیت اندازه‌گیری می‌شد و صفحه
   زودتر «پر» اعلام می‌شد. padding هرگز جمع نمی‌شود و دو طرف یک عدد می‌دهند. */
.pstudio-page.is-simple.is-answers .pq-answer-divider,
.pstudio-measure.is-simple-measure .pq-answer-divider { margin: 0; padding: 8px 0; }
/* شمارهٔ سؤال در پاسخنامه چیپ می‌ماند، نه عددِ سادهٔ «۲-» دفترچه. قاعدهٔ
   `.pstudio-page.is-simple .pq-no` صفحهٔ پاسخنامه را هم می‌گرفت (چون هم
   is-simple است و هم is-answers) و چیپ را برمی‌داشت؛ اینجا برگردانده می‌شود.
   دفترچهٔ سؤال قراردادِ خشکِ چاپ را دارد، ولی پاسخنامه صفحهٔ خواندن است و
   می‌تواند رنگ و قاب داشته باشد. */
.pstudio-page.is-simple.is-answers .pa-block .pq-no,
.pstudio-measure.is-simple-measure .pa-block .pq-no {
  width: 24px;
  height: 24px;
  margin-inline: auto;
  padding: 0;
  display: grid;
  place-items: center;
  /* قاعدهٔ عددِ دفترچه `justify-content: flex-end` و `direction: rtl` می‌گذارد و
     هر دو روی گرید هم اثر دارند: تنها ستونِ گرید به لبه می‌چسبد و رقم از وسطِ
     چیپ درمی‌رود. place-items تنها *-items را می‌نشاند، نه *-content. */
  place-content: center;
  direction: inherit;
  gap: 0;
  border: 1px solid #f0d3b4;
  border-radius: 8px;
  background: #fff3e8;
  color: #9a5a1f;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 900;
  line-height: 1;
}
/* خطِ کوتاهِ بعد از عدد قراردادِ دفترچه است و داخل چیپ معنایی ندارد */
.pstudio-page.is-simple.is-answers .pa-block .pq-no::after,
.pstudio-measure.is-simple-measure .pa-block .pq-no::after { content: none; }
.pstudio-page.is-simple.is-answers .pq-answer-top,
.pstudio-measure.is-simple-measure .pq-answer-top { margin-bottom: 9px; }
.pstudio-page.is-simple.is-answers .pq-answer-chip,
.pstudio-measure.is-simple-measure .pq-answer-chip {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 10px;
  border: 1px solid #cfe6dd;
  border-radius: 9px;
  background: #eff8f5;
  color: #176e5c;
  font-size: 10.5px;
}
.pstudio-page.is-simple.is-answers .pa-block .pq-body,
.pstudio-measure.is-simple-measure .pa-block .pq-body {
  color: #302b25;
  font-size: 13.2px;
  font-weight: 450;
  line-height: 2.05;
}
.pstudio-page.is-simple.is-answers .pa-block .pq-meta-row,
.pstudio-measure.is-simple-measure .pa-block .pq-meta-row { margin-top: 4px; }
/* دُمِ بلوکِ پاسخ: آخرین پاراگرافِ متن حاشیهٔ پایین نگه می‌داشت و نیم‌فاصلهٔ
   سطرِ ۲٫۰۵ هم زیرِ آخرین خط جا می‌گذاشت. هرچه اینجا کم شود مستقیم به «چند پاسخ
   در یک صفحه جا می‌شود» تبدیل می‌شود. */
.pstudio-page.is-simple.is-answers .pa-block .pq-body > *:last-child,
.pstudio-measure.is-simple-measure .pa-block .pq-body > *:last-child,
.pstudio-page.is-simple.is-answers .pa-block .pq-body :last-child > p:last-child,
.pstudio-measure.is-simple-measure .pa-block .pq-body :last-child > p:last-child { margin-bottom: 0; }
.pstudio-page.is-simple .pq-block.with-line,
.pstudio-measure.is-simple-measure .pq-block.with-line { padding-bottom: 16px; border-bottom: 1px dashed #ddd3c7; }
.pstudio-page.is-simple .pq-section-title,
.pstudio-measure.is-simple-measure .pq-section-title { color: #315b73; }
.pstudio-page.is-simple .pq-section-title::before,
.pstudio-page.is-simple .pq-section-title::after,
.pstudio-measure.is-simple-measure .pq-section-title::before,
.pstudio-measure.is-simple-measure .pq-section-title::after { background: #d8e0e5; }
.pstudio-page.is-simple .pq-section-title span,
.pstudio-measure.is-simple-measure .pq-section-title span { border-color: #d8e0e5; background: #f5f9fb; }
/* شمارهٔ صفحهٔ امتحان نهایی، به‌صورت آخرین ردیف جدول و دقیقاً چسبیده به سؤال آخر */
.pstudio-final-footer {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  box-sizing: border-box;
  margin-top: 0;
  padding: 7px 10px;
  border: var(--pstudio-final-line, 1px) solid #2d2923;
  border-top: 0;
  background: #fff;
  text-align: center;
  color: #181512;
  font-size: 12.5px;
  font-weight: 900;
  z-index: 2;
}
/* برچسب‌های روی کادر: اسم مجموعه و برند «آقای کنکور» روی خطِ بالایی کادر می‌نشینند */
.pstudio-corner {
  position: absolute;
  z-index: 3;
  top: 30px;
  transform: translateY(-50%);
  max-width: 44%;
  padding: 2px 12px;
  background: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}
.pstudio-brand {
  inset-inline-end: 52px;
  color: #9a5a1f;
  letter-spacing: .2px;
}
.pstudio-set-name {
  inset-inline-start: 52px;
  color: #3f3a33;
}
.pstudio-measure {
  position: absolute;
  left: -10000px;
  top: 0;
  visibility: hidden;
  pointer-events: none;
}
.pstudio-measure .pstudio-mitem { overflow: hidden; }
.pstudio-empty { color: var(--muted); padding: 40px; }

/* سربرگ چاپ */
.pq-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 26px;
  border: 1px solid #e3d8c9;
  border-radius: 16px;
  padding: 16px 20px;
  background: linear-gradient(180deg, #fffdfa, #fbf8f2);
}
.pq-header .pqh-cell { display: flex; align-items: center; gap: 8px; font-size: 12.5px; min-height: 28px; }
.pq-header.align-right .pqh-cell { justify-content: flex-start; text-align: right; }
.pq-header.align-center .pqh-cell { justify-content: center; text-align: center; }
.pq-header.align-left .pqh-cell { justify-content: flex-end; text-align: left; }
.pq-header .pqh-cell.align-right { justify-content: flex-start; text-align: right; }
.pq-header .pqh-cell.align-center { justify-content: center; text-align: center; }
.pq-header .pqh-cell.align-left { justify-content: flex-end; text-align: left; }
.pq-header .pqh-cell b { font-weight: 900; white-space: nowrap; }
.pq-header .pqh-blank { flex: 1; border-bottom: 0; min-height: 18px; }
.pq-final-header {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  width: 100%;
  box-sizing: border-box;
  border: var(--pstudio-final-line, 1px) solid #2d2923;
  background: #fff;
}
.pq-final-header .pfh-cell {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 10px;
  border-inline-start: var(--pstudio-final-line, 1px) solid #2d2923;
  border-top: var(--pstudio-final-line, 1px) solid #2d2923;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}
.pq-final-header .pfh-cell:nth-child(-n+3) { border-top: 0; }
.pq-final-header .pfh-cell:nth-child(3n+1) { border-inline-start: 0; }
.pq-final-header .pfh-title {
  grid-column: span 1;
  font-size: 14px;
  font-weight: 950;
}
.pq-final-header .pfh-wide { grid-column: span 3; border-inline-start: 0; color: #9a5a1f; }
.pq-final-header .pfh-custom { color: #181512; }
.pq-final-header b { font-weight: 950; color: #181512; }
.pq-final-header .pfh-cell.align-right { justify-content: flex-start; text-align: right; }
.pq-final-header .pfh-cell.align-center { justify-content: center; text-align: center; }
.pq-final-header .pfh-cell.align-left { justify-content: flex-end; text-align: left; }

/* بلوک سؤال/پاسخ */
.pq-block { position: relative; break-inside: avoid; cursor: grab; }
.pq-block.with-line { border-bottom: 1px solid #d9d2c4; padding-bottom: 14px; }
.pq-block.dragging { opacity: .45; }
.pq-block.pq-drop-hint.before::before,
.pq-block.pq-drop-hint.after::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 3px;
  border-radius: 99px;
  background: var(--orange);
}
.pq-block.pq-drop-hint.before::before { top: -6px; }
.pq-block.pq-drop-hint.after::after { bottom: -6px; }
.pq-question-row {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
}
.pq-question-content { min-width: 0; }
.pq-section-title {
  break-inside: avoid;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #9a5a1f;
  font-size: 12px;
  font-weight: 950;
}
.pq-section-title::before,
.pq-section-title::after {
  content: "";
  height: 1px;
  flex: 1;
  background: #eadfd1;
}
.pq-section-title span {
  padding: 5px 12px;
  border: 1px solid #eadfd1;
  border-radius: 999px;
  background: #fff8ef;
}
.pstudio-page.is-final .pq-section-title {
  display: grid;
  grid-template-columns: var(--pstudio-final-side, 42px) minmax(0, 1fr) var(--pstudio-final-side, 42px);
  gap: 0;
  color: #181512;
  border-inline: var(--pstudio-final-line, 1px) solid #2d2923;
  border-bottom: var(--pstudio-final-line, 1px) solid #2d2923;
}
.pstudio-page.is-final .pq-section-title::before,
.pstudio-page.is-final .pq-section-title::after { display: none; }
.pstudio-page.is-final .pq-section-title span {
  grid-column: 1 / -1;
  border: 0;
  border-radius: 0;
  background: #f7f4ee;
  padding: 8px 12px;
  text-align: center;
}
.pq-no {
  width: 24px;
  height: 24px;
  margin-inline: auto;
  margin-top: 1px;
  display: grid;
  place-items: center;
  border: 1px solid #f0d3b4;
  border-radius: 8px;
  background: #fff3e8;
  color: #9a5a1f;
  font-weight: 900;
  font-size: 11.5px;
  line-height: 1;
  flex: none;
}
/* شناسنامهٔ سؤال: متنی (عین حالت امتحان نهایی)، بدون چیپ/پیل */
.pq-meta-row {
  display: block;
  direction: rtl;
  text-align: right;
  margin-top: 10px;
  color: #6c6355;
  line-height: 1.9;
  white-space: normal;
  overflow-wrap: anywhere;
}
.pq-meta-row i {
  font-style: normal;
  display: inline;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-size: 10.5px;
  font-weight: 800;
}
.pq-meta-row i + i::before { content: " | "; color: #b7aa99; }
.pq-body { font-size: 14px; line-height: 2.1; }
.pq-body .sq-content-image { width: 100%; height: auto; border-radius: 8px; }
.pq-block.pq-has-body-visual .pq-body .mkfig { max-width: 70%; }
.pq-block.pq-has-body-visual .pq-body .mkfig img {
  width: 100%;
  height: auto;
  max-height: 52mm;
  object-fit: contain;
}
/* سؤالِ تمام‌تصویری: صورت و گزینه‌ها هر دو داخل همان تصویرند، پس باید تمامِ عرضِ
   ستونِ متن را بگیرد. سقفِ ارتفاع فقط برای تصویرِ غیرعادیِ کشیده است تا یک سؤال
   کلِ صفحه را نبلعد؛ تصویرِ معمولی هرگز به آن نمی‌رسد. */
.pq-block.pq-has-body-visual .pq-body > .sq-content-image {
  width: 100%;
  max-height: 168mm;
  object-fit: contain;
}
.pq-side-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(27%, var(--pq-side-fig, 32%), 46%);
  align-items: start;
  gap: 5mm 9mm;
  font-size: 14px;
  line-height: 2.1;
  margin-top: 0;
  break-inside: avoid;
  page-break-inside: avoid;
}
.pq-side-layout.is-figure-start { grid-template-columns: clamp(27%, var(--pq-side-fig, 32%), 46%) minmax(0, 1fr); }
.pq-side-layout.is-figure-start .pq-side-figure { grid-column: 1; grid-row: 1; }
.pq-side-layout.is-figure-start .pq-side-options { grid-column: 2; grid-row: 1; }
.pq-side-options { min-width: 0; display: block; align-self: start; }
.pq-side-options .pq-options {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  gap: 0;
  margin-top: 0;
}
#pstudioPreview .pq-side-options .pq-options,
.pstudio-measure .pq-side-options .pq-options { margin-top: 0; }
.pq-side-options .pq-option { flex: none; min-height: 0; align-items: baseline; line-height: 2.1; }
.pq-side-figure { min-width: 0; display: grid; place-items: start center; }
.pq-side-figure .mkfig { width: 100% !important; max-width: 100%; margin: 0; }
.pq-side-figure .mkfig img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 58mm;
  object-fit: contain;
}
.pq-extra-space {
  border-bottom: 1px dashed #ded4c6;
  margin-top: 10px;
}
/* ابزار تنظیم فضای پاسخ (فقط حالت آزمون): با بردن موس روی شمارهٔ سؤال آشکار می‌شود */
.pq-no-wrap {
  position: relative;
  align-self: start;
  justify-self: center;
}
.pq-space-tools {
  display: grid;
  gap: 5px;
}
.pq-space-tools.is-hover {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 6;
  padding-top: 5px;
  transform: translateX(-50%) scale(.94);
  transform-origin: top center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .13s ease, transform .13s ease;
}
.pq-no-wrap:hover .pq-space-tools.is-hover,
.pq-space-tools.is-hover:hover,
.pq-space-tools.is-hover.is-pinned,
.pq-no-wrap:focus-within .pq-space-tools.is-hover {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) scale(1);
}
.pq-space-tools button {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid #cfc4b5;
  border-radius: 8px;
  background: #fff;
  color: #2d2923;
  font: inherit;
  font-size: 17px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 4px 10px rgba(50,39,29,.14);
  cursor: pointer;
}
.pq-space-tools button:hover {
  border-color: var(--orange);
  color: var(--orange);
}
.pq-final-block {
  width: 100%;
  box-sizing: border-box;
  border-inline: var(--pstudio-final-line, 1px) solid #2d2923;
  border-bottom: var(--pstudio-final-line, 1px) solid #2d2923;
  padding: 0;
  background: #fff;
}
/* اولین بلوکِ هر صفحه (وقتی جدول به صفحهٔ بعد می‌رود) خطِ بالایی خودش را می‌گیرد تا جدول باز نماند */
.pstudio-page.is-final .pstudio-page-inner > .pq-final-block:first-child,
.pstudio-page.is-final .pstudio-page-inner > .pq-section-title:first-child {
  border-top: var(--pstudio-final-line, 1px) solid #2d2923;
}
.pq-final-table-head {
  display: grid;
  grid-template-columns: var(--pstudio-final-side, 42px) minmax(0, 1fr) var(--pstudio-final-side, 42px);
  width: 100%;
  box-sizing: border-box;
  border: var(--pstudio-final-line, 1px) solid #2d2923;
  background: #f7f4ee;
  color: #181512;
  font-size: 12px;
  font-weight: 950;
  text-align: center;
}
.pq-final-table-head span {
  min-height: 34px;
  display: grid;
  place-items: center;
  padding: 5px;
  border-inline-end: var(--pstudio-final-line, 1px) solid #2d2923;
}
.pq-final-table-head span:last-child { border-inline-end: 0; }
.pq-final-header + .pq-final-table-head { border-top: 0; }
.pq-final-grid {
  display: grid;
  grid-template-columns: var(--pstudio-final-side, 42px) minmax(0, 1fr) var(--pstudio-final-side, 42px);
  align-items: stretch;
  min-height: 96px;
}
.pq-final-no,
.pq-mark {
  display: grid;
  justify-items: center;
  align-items: start;
  /* شماره و بارم به بالای سلول می‌چسبند تا کنارِ شروعِ متنِ سؤال بنشینند (هم‌ترازِ padding محتوا) */
  padding: 14px 4px 6px;
  border-inline-start: var(--pstudio-final-line, 1px) solid #2d2923;
  color: #181512;
  font-size: 12px;
  font-weight: 950;
}
.pq-mark { align-items: center; padding: 6px 4px; }
.pq-final-no { border-inline-start: 0; border-inline-end: var(--pstudio-final-line, 1px) solid #2d2923; }
.pq-final-grid .pq-question-content { padding: 14px 14px 12px; }
.pq-final-block .pq-meta-row {
  display: block;
  direction: rtl;
  text-align: right;
  padding: 0;
  margin-top: 8px;
  color: #6c6355;
  line-height: 1.9;
  white-space: normal;
  overflow-wrap: anywhere;
}
.pq-final-block .pq-meta-row i {
  display: inline;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-size: 10.5px;
  font-weight: 800;
}
.pq-final-block .pq-meta-row i + i::before { content: " | "; color: #b7aa99; }
/* چیدمانِ گزینه در دفترچهٔ چاپی همان قاعدهٔ صفحه است: کوتاه‌ها یک ردیفِ چهارتایی،
   متوسط‌ها دو ردیفِ دوتایی، متنِ بلند چهار ردیفِ تمام‌عرض، و چهار نمودار جدولِ ۲×۲. */
/* گزینه‌ها ادامهٔ مستقیم صورت سؤال‌اند و هیچ سطر خالی میان آن‌ها قرار نمی‌گیرد.
   فاصلهٔ ردیف‌های خودِ گزینه با lh تعریف می‌شود تا با تغییر فونت ثابت بماند. */
.pq-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; column-gap: 18px; row-gap: .35lh; margin-top: 0; font-size: 14px; line-height: 2.1; }
/* پیش‌نمایش و اندازه‌گیرِ مخفی باید همان فاصلهٔ صفرِ فایل PDF را صریحاً بگیرند؛
   وگرنه پیش‌نمایشِ باز یا یک override صفحه می‌تواند فاصلهٔ قدیمی را نشان دهد و
   ارتفاعی متفاوت از صفحه‌ای که برای PDF clone می‌شود اندازه بگیرد. */
#pstudioPreview .pq-options,
.pstudio-measure .pq-options { margin-top: 0; }
.pq-options.is-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pq-options.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pq-options.is-stack { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
.pq-option { display: flex; align-items: baseline; gap: 6px; font-size: 13.5px; line-height: 2.1; }
.pq-option > span { min-width: 0; line-height: 2.1; }
.pq-option > span > :first-child { margin-top: 0; }
.pq-option > span > :last-child { margin-bottom: 0; }
.pq-option > span > p { margin-block: 0; line-height: 2.1; }
.pq-option .katex-display { margin: 0; line-height: 2.1; }
.pq-option .mkfig { width: 100% !important; max-width: 100%; margin: 3px auto; }
.pq-option img { display: block; width: auto; max-width: 100%; height: auto; max-height: 36mm; margin: 0 auto; object-fit: contain; }
/* شمارهٔ گزینه در دفترچه سیاهِ ساده است — نه چیپ، نه رنگ، نه درشت.
   `inherit` یعنی هم‌وزنِ خودِ گزینه؛ در پاسخنامه که گزینهٔ صحیح ۸۰۰ می‌شود،
   شماره‌اش هم با آن هماهنگ می‌ماند. */
.pq-option b { font-weight: inherit; color: inherit; }
.pq-option.is-correct { color: #14775f; font-weight: 800; }
.pq-option.is-correct b { border-bottom: 2px solid #14775f; }
.pq-answer-line { margin-top: 10px; font-size: 12.5px; color: #14775f; font-weight: 800; }
.pq-answer-chip {
  font-size: 11.5px;
  font-weight: 800;
  color: #14775f;
  background: #e9f6f1;
  border-radius: 99px;
  padding: 4px 11px;
}
.pq-answer-top {
  min-height: 24px;
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.pa-block .pq-no { margin-top: 0; }
/* جداکنندهٔ تزئینی بین پاسخ‌های تشریحی؛ خط نازک اما کامل و بدون محوشدن در کناره‌ها */
.pq-answer-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 2px 0 18px;
  color: #9a5a1f;
  break-inside: avoid;
}
.pq-answer-divider .pad-line {
  flex: 1;
  height: 1.5px;
  max-width: none;
  border-radius: 99px;
  background: #9a5a1f;
  box-shadow: none;
}
.pq-answer-divider .pad-orn {
  flex: none;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  border: 1.5px solid #9a5a1f;
  border-radius: 2px;
  background: #fff8ef;
  box-shadow: 0 0 0 3px #fff;
}
.pq-answer-divider .pad-label {
  font-size: 11.5px;
  font-weight: 900;
  letter-spacing: .15px;
  white-space: nowrap;
  padding: 2px 10px 3px;
  border: 1px solid #d8a56f;
  border-radius: 999px;
  background: #fff8ef;
  line-height: 1.4;
}
/* روی اولین پاسخِ هر صفحه، جداکننده در بالای صفحه نیاید */
.pstudio-page-inner > .pa-block:first-child .pq-answer-divider { display: none; }
/* جداکنندهٔ چسبیده به عنوانِ بخش هم اگر اول صفحه افتاد، حذف شود */
.pstudio-page-inner > .pq-answer-divider:first-child { display: none; }
.pq-explain { margin-top: 10px; padding: 12px 14px; background: #f8f6f1; border-radius: 12px; font-size: 13px; line-height: 2; }
.pq-explain > b { display: block; margin-bottom: 6px; font-size: 12px; }
.pq-empty { color: #9a9385; }
.pstudio-page .sq-explanation-columns {
  border-color: #8f8980;
  border-radius: 0;
  margin-top: 4px;
  overflow: visible;
}
.pstudio-page .sq-explanation-column {
  gap: 7px;
  padding: 7px;
}
.pstudio-page .sq-explanation-column + .sq-explanation-column {
  border-inline-start: 1.25px solid #69645e;
}
.pstudio-page .sq-explanation-image .sq-content-image { border-radius: 0; }
.pa-block.answer-layout-vertical .pq-question-content { min-width: 0; }

@media (max-width: 720px) {
  .explanation-layout-picker { grid-template-columns: 1fr; }
  .explanation-layout-options { grid-template-columns: 1fr; }
}

/* پاسخنامه کلیدی */
.pstudio-card {
  border: 1px solid #e9dfd1;
  border-radius: 14px;
  background: linear-gradient(180deg, #fffdfa, #fff);
  padding: 12px;
  box-shadow: 0 8px 24px rgba(65,47,29,.05);
}
.pstudio-section-title {
  direction: rtl;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 7px;
  margin-bottom: 8px;
  border-bottom: 1px solid #eee6da;
}
.pstudio-section-title b {
  color: #9a5a1f;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .2px;
}
.pstudio-section-title span {
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}
.pkey-title {
  margin-bottom: 9px;
  padding-bottom: 8px;
  border-bottom: 1px solid #dcd4c9;
  color: #25211d;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.7;
  text-align: center;
}
.pkey-card {
  padding: 11px;
  border-color: #e3d8ca;
  border-radius: 14px;
  background: #fffdfa;
  box-shadow: 0 4px 14px rgba(47, 37, 25, .035);
}
.pkey-card .psheet-columns { gap: 5px; }
.pkey-card .psheet-col { gap: 3px; }
.pkey-card .psheet-group { gap: 0; padding: 2px; border-color: #e5dbcf; border-radius: 7px; background: #fff; }
.pkey-card .pbs-row { min-height: 16px; border-radius: 2px; padding: 0; font-size: 9px; }
.pkey-card .pbs-row b { height: 14px; border-radius: 0; background: transparent; }
.pkey-card .pbs-row i {
  height: 14px;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  /* رقمِ داخل حباب یک اندازه کوچک‌تر از شمارهٔ سؤال است و کمی بالاتر دیده می‌شود؛
     این پدینگ آن را پایین می‌آورد تا با شمارهٔ سمت راست هم‌سطح باشد.
     اندازه‌گیری‌شده (کرومیوم، همین قواعد): هر ۱px پدینگ = ۰٫۵px جابه‌جاییِ رقم.
     با ۰ کرسیِ دو رقم دقیقاً یکی است (اختلاف ۰٫۰۶px) و رقمِ حباب کمی بالا حس
     می‌شود؛ ۱px همان جبرانِ نیم‌پیکسلیِ لازم است. ۲px دو برابرِ لازم بود و رقم را
     پایین می‌انداخت. تست: test_print_output_contrast.mjs */
  padding: 1px 0 0;
  border-color: #bd8a61;
  border-radius: 3px;
  line-height: 1;
  text-align: center;
}
.pkey-card .pbs-row i.is-correct { border-color: #ad5b24; background: #ad5b24; }
/* پاسخنامه کلیدی: کارت تمامِ ارتفاع صفحه را می‌گیرد و ردیف‌های ستونِ پر (۵۰تایی) یکنواخت تا پایین کش می‌آیند */
.pstudio-page.is-key { height: 1123px; display: flex; flex-direction: column; }
.pstudio-page.is-key .pstudio-page-inner { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.pstudio-page.is-key .pkey-card { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.pstudio-page.is-key .pkey-card .psheet-columns { flex: 1; min-height: 0; align-items: stretch; }
.pstudio-page.is-key .pkey-card .psheet-col { grid-template-rows: repeat(5, minmax(0, 1fr)); }
.pstudio-page.is-key .pkey-card .psheet-group { grid-template-rows: repeat(10, minmax(0, 1fr)); }
.pstudio-page.is-key .pkey-card .pbs-row { min-height: 0; }
.pset-two.single { grid-template-columns: 1fr; }
.psheet-columns {
  direction: ltr;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  align-items: start;
}
.psheet-col {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.psheet-group {
  display: grid;
  gap: 1px;
  padding: 3px;
  border: 1px solid #e9dfd1;
  border-radius: 10px;
  background: #fffdfa;
  break-inside: avoid;
}
.pkey-grid { direction: ltr; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px 10px; }
.pkey-cell {
  direction: ltr;
  display: grid;
  grid-template-columns: 19px minmax(0, 1fr);
  align-items: center;
  gap: 3px;
  min-height: 15px;
  border-radius: 6px;
  padding: 1px;
  background: #fff;
  font-size: 8.5px;
}
.pkey-cell b {
  height: 13px;
  display: grid;
  place-items: center;
  border-radius: 4px;
  background: #f4f0ea;
  color: #6c6355;
  font-weight: 900;
}
.pkey-cell i {
  height: 13px;
  display: grid;
  place-items: center;
  border-radius: 4px;
  background: #e9f6f1;
  color: #14775f;
  font-style: normal;
  font-weight: 900;
}

/* پاسخبرگ خام */
.pbs-grid { direction: ltr; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px 14px; }
.pbs-row {
  direction: ltr;
  display: grid;
  grid-template-columns: 19px minmax(0, 1fr);
  align-items: center;
  gap: 3px;
  min-height: 15px;
  padding: 1px;
  border-radius: 6px;
  background: #fff;
  font-size: 8.5px;
}
.pbs-row b {
  height: 13px;
  display: grid;
  place-items: center;
  border-radius: 4px;
  background: #f4f0ea;
  color: #5e584f;
  text-align: center;
  font-weight: 900;
}
.pbs-row span {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2px;
}
.pbs-row i {
  min-width: 0;
  height: 13px;
  display: grid;
  place-items: center;
  border: 1px solid #b57949;
  border-radius: 999px;
  background: #fff;
  color: #2d2923;
  font-style: normal;
  font-size: 8px;
  font-weight: 800;
}
.pbs-row i.is-correct {
  border-color: #9a5a1f;
  background: #9a5a1f;
  color: #fff;
}

/* ===== پاسخبرگ هوشمند (آمادهٔ اسکن OMR) ===== */
.psheet-smart {
  position: relative;
  border: 1.5px solid #2d2923;
  border-radius: 6px;
  background: #fff;
  padding: 22px;
}
/* نشانگرهای گوشه: مربع‌های مشکیِ ثابت برای صاف‌کردن تصویر در اسکن */
.psheet-fid {
  position: absolute;
  width: 15px;
  height: 15px;
  background: #111;
}
.psheet-fid.tl { top: 7px; right: 7px; }      /* RTL: راست‌بالا */
.psheet-fid.tr { top: 7px; left: 7px; }
.psheet-fid.bl { bottom: 7px; right: 7px; }
.psheet-fid.br { bottom: 7px; left: 7px; }
.psheet-head {
  display: flex;
  align-items: stretch;
  gap: 16px;
  padding: 4px 14px 12px;
  margin-bottom: 12px;
  border-bottom: 2px solid #2d2923;
}
.psheet-head-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.psheet-title { font-size: 15px; font-weight: 950; color: #181512; }
.psheet-setname { font-size: 12.5px; font-weight: 800; color: #4a443c; }
.psheet-meta { display: flex; gap: 18px; font-size: 11px; color: #6c6355; font-weight: 700; }
.psheet-meta b { color: #181512; font-weight: 900; }
.psheet-userline {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin-top: 4px;
  font-size: 11.5px;
  font-weight: 800;
  color: #4a443c;
}
.psheet-userline .psheet-write { flex: 1; border-bottom: 1.5px dotted #8c8272; min-height: 17px; }
.psheet-qr {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.psheet-qr-box {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  border: 1.5px solid #2d2923;
  border-radius: 4px;
  background:
    repeating-linear-gradient(45deg, #f0ece5 0 4px, #fff 4px 8px);
  color: #9a938a;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 1px;
}
.psheet-qr small { font-size: 8.5px; color: #6c6355; font-weight: 700; }
.psheet-bubbles { margin-top: 2px; }

/* ===== پاسخبرگ هوشمند: hub دانلود/آپلود + بازبینی اسکن ===== */
.omr-hub { display: grid; gap: 14px; }
.omr-hub-lead { color: var(--muted); font-size: 13px; line-height: 1.9; margin: 0; }
.omr-hub-note { margin: -4px 0 0; color: var(--muted); font-size: 12px; }
.omr-hub-meta { display: flex; gap: 20px; font-size: 12.5px; color: var(--muted); }
.omr-hub-meta b { color: var(--ink); font-weight: 900; }
.omr-hub-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.omr-hub-status {
  padding: 10px 14px; border-radius: 12px; font-size: 12.5px; font-weight: 800;
  background: #f3f0e9; color: #6c6355;
}
.omr-hub-status[data-tone="ok"] { background: #eaf8f4; color: #168878; }
.omr-hub-status[data-tone="error"] { background: #fdeceb; color: #c24a3a; }
.omr-hub-status[data-tone="warn"] { background: #fff6df; color: #9a6a13; }

.omr-review { display: grid; gap: 12px; }
.omr-warn {
  padding: 11px 14px; border-radius: 12px; font-size: 12.5px; font-weight: 800;
  background: #fff6df; color: #9a6a13; border: 1px solid #f0d9a6;
}
.omr-review-hint { color: var(--muted); font-size: 12px; line-height: 1.8; }
.omr-result-summary {
  display: flex; flex-wrap: wrap; gap: 10px 16px;
  padding: 12px 14px; border-radius: 14px; background: #faf7f1; border: 1px solid #ece4d7;
  font-size: 13px; font-weight: 900;
}
.omr-result-summary .ok { color: #168878; }
.omr-result-summary .bad { color: #c24a3a; }
.omr-legend { display: flex; flex-wrap: wrap; gap: 7px 16px; font-size: 11.5px; color: var(--muted); font-weight: 700; }
.omr-legend span { display: inline-flex; align-items: center; gap: 6px; }
.omr-legend .dot { width: 10px; height: 10px; border-radius: 50%; }
.omr-legend .dot.ok { background: #3fae87; }
.omr-legend .dot.bad { background: #e0654f; }
.omr-legend .dot.na { background: #cdb9a1; }
.omr-legend .ring { width: 12px; height: 12px; border-radius: 50%; border: 2px solid #168878; box-sizing: border-box; }

/* شبکهٔ برگه‌مانند: باکس‌های ۱۰‌تایی در تا ۶ ستون (مثل خودِ پاسخبرگ) */
.omr-sheet-grid {
  direction: ltr;
  display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center;
  gap: 12px; max-height: 60vh; overflow: auto; overscroll-behavior: contain; padding: 2px;
}
.omr-col {
  direction: rtl;
  display: flex; flex-direction: column; gap: 12px;
  flex: 0 1 162px; min-width: 150px; max-width: 166px;
}
.omr-block { border: 1px solid #ead9c2; border-radius: 12px; background: #fffdfa; overflow: hidden; }
.omr-block-head {
  padding: 5px 10px; text-align: center; font-size: 11px; font-weight: 900;
  color: var(--orange); background: #fbf3e8; border-bottom: 1px solid #ead9c2;
}
.omr-line {
  direction: ltr;
  display: flex; align-items: center; gap: 6px; padding: 4px 8px;
}
.omr-block .omr-line:not(:last-child) { border-bottom: 1px solid #f4ecdf; }
.omr-no { flex: none; width: 22px; text-align: center; font-size: 11.5px; font-weight: 900; color: #5e584f; }
.omr-picks { direction: ltr; display: flex; gap: 5px; }
.omr-b {
  width: 24px; height: 24px; flex: none; box-sizing: border-box;
  display: grid; place-items: center; padding: 0; line-height: 1;
  border: 1.5px solid #d9cfbf; border-radius: 50%; background: #fff;
  color: #6a6154; font: inherit; font-size: 11.5px; font-weight: 800;
}
button.omr-b { cursor: pointer; transition: background .12s ease, border-color .12s ease, color .12s ease; }
button.omr-b:hover { border-color: var(--orange); }
.omr-b.on { background: #9a5a1f; border-color: #9a5a1f; color: #fff; }         /* انتخاب‌شده در بازبینی */

.omr-line.res {
  width: 100%; border: 0; border-inline-start: 3px solid transparent;
  padding-inline-start: 7px; border-radius: 8px; background: transparent;
  font: inherit; color: var(--ink); cursor: pointer; text-align: start;
}
.omr-line.res:hover { background: #fbf3e8; }
.omr-line.res.omr-correct { border-inline-start-color: #3fae87; }
.omr-line.res.omr-wrong { border-inline-start-color: #e0654f; }
.omr-line.res.omr-blank { border-inline-start-color: #d9cabb; }
.omr-line.res.omr-correct .omr-no { color: #168878; }
.omr-line.res.omr-wrong .omr-no { color: #c24a3a; }
.omr-line.res.omr-blank .omr-no { color: #a2917c; }
.omr-b.picked { background: #9a5a1f; border-color: #9a5a1f; color: #fff; }       /* گزینهٔ کاربر */
.omr-b.key { border-color: #168878; box-shadow: 0 0 0 1.5px #168878 inset; color: #168878; } /* گزینهٔ صحیح */
.omr-b.picked.key { background: #168878; border-color: #168878; color: #fff; box-shadow: none; }

.omr-review-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.omr-score { font-size: 12.5px; color: var(--muted); font-weight: 700; }
.omr-score b { font-weight: 900; }
.omr-score b.ok { color: #168878; }
.omr-score b.bad { color: #c24a3a; }
.omr-foot-btns { display: inline-flex; gap: 9px; }
@media (max-width: 900px) {
  .omr-sheet-grid { max-height: none; }
  .omr-col { max-width: none; }
}

/* ===== ماژول آزمون — فاز ۱ ===== */
.exam-head { margin-bottom: 4px; }
.exam-hub-tabs {
  display: flex; flex-wrap: wrap; gap: 6px; justify-content: center;
  width: fit-content; max-width: 100%;
  margin: 6px auto 18px; padding: 6px;
  border: 1px solid #eee5da; border-radius: 16px;
  background: #fffdfa;
  box-shadow: 0 12px 28px rgba(65,47,29,.06);
}
.exam-hub-tab {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 10px 20px;
  border: 0; border-radius: 11px; background: transparent;
  font: inherit; font-size: 13px; font-weight: 800; color: #6a6154;
  cursor: pointer;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease, transform .16s var(--ease-soft);
}
.exam-hub-tab svg { width: 16px; height: 16px; opacity: .7; transition: opacity .16s ease; }
.exam-hub-tab:hover { background: #fff5eb; color: var(--orange); }
.exam-hub-tab:hover svg { opacity: 1; }
.exam-hub-tab.on {
  background: var(--orange); color: #fff;
  box-shadow: 0 8px 18px rgba(255,95,31,.22);
}
.exam-hub-tab.on svg { opacity: 1; }
.exam-panel {
  display: grid; gap: 16px; padding: 18px;
  border: 1px solid #ece4d7; border-radius: 18px;
  background: rgba(255,255,255,.82); box-shadow: 0 16px 36px rgba(90,70,40,.06);
}
.exam-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.exam-panel-head h2 { margin: 0; font-size: 18px; }
.exam-panel-head p { margin: 4px 0 0; color: var(--muted); font-size: 12.5px; font-weight: 700; line-height: 1.9; }
.exam-empty { width: 100%; padding: 34px; }
.exam-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 16px; }
.exam-tab {
  padding: 8px 16px; border: 1px solid #e5dccb; border-radius: 999px; background: rgba(255,255,255,.72);
  font: inherit; font-size: 12.5px; font-weight: 800; color: #6a6154; cursor: pointer;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
}
.exam-tab:hover { border-color: var(--orange); }
.exam-tab.on { background: var(--orange); border-color: var(--orange); color: #fff; }
.exam-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 14px; }
.exam-card {
  display: grid; gap: 10px; align-content: start;
  padding: 16px; border: 1px solid #ece4d7; border-radius: 18px;
  background: rgba(255,255,255,.82); backdrop-filter: blur(8px);
  box-shadow: 0 10px 26px rgba(90, 70, 40, .06);
}
.exam-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.exam-card-head h3 { margin: 0; display: flex; align-items: center; gap: 7px; font-size: 14.5px; line-height: 1.7; }
.exam-code {
  flex: none; padding: 3px 9px; border-radius: 8px; background: #f6f1e7;
  color: #8a7c66; font-size: 11px; font-weight: 900;
}
.exam-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--muted); font-size: 11.5px; font-weight: 700; }
.exam-meta span { display: inline-flex; align-items: center; gap: 5px; }
.exam-meta .ui-icon, .exam-meta svg { width: 13px; height: 13px; }
.exam-state-row { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 14px; font-size: 12px; }
.exam-state { padding: 4px 11px; border-radius: 999px; background: #f1efe8; color: #6c6355; font-weight: 900; font-size: 11.5px; }
.exam-state.in_progress { background: #fff3e2; color: #b06010; }
.exam-state.done { background: #eaf8f4; color: #168878; }
.exam-remain, .exam-last-score { color: var(--muted); font-weight: 700; display: inline-flex; align-items: center; gap: 5px; }
.exam-remain svg { width: 13px; height: 13px; }
.exam-last-score b { color: var(--ink); }
.exam-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.exam-manage-list { display: grid; gap: 10px; }
.exam-manage-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center;
  padding: 14px; border: 1px solid #eee5d8; border-radius: 14px; background: #fff;
}
.exam-manage-main { display: grid; gap: 8px; min-width: 0; }
.exam-manage-title { display: flex; align-items: center; gap: 9px; min-width: 0; }
.exam-manage-title b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exam-manage-meta {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  color: var(--muted); font-size: 11.5px; font-weight: 700; line-height: 1.8;
}
.exam-manage-meta b { color: var(--ink); }
.exam-manage-stats { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; color: var(--muted); font-size: 12px; font-weight: 800; }
.exam-manage-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }

/* آزمون‌ساز */
.exam-builder { display: grid; gap: 14px; }
.exam-builder-step {
  display: inline-flex; align-items: center; gap: 8px; width: max-content;
  padding: 6px 12px; border-radius: 999px; background: #fff3e8; color: #a65518;
  font-size: 12px; font-weight: 900;
}
.exam-builder-step span {
  display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%;
  background: var(--orange); color: #fff; font-size: 11px;
}
.exam-src-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.exam-src {
  display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px;
  border: 1px solid #e5dccb; border-radius: 12px; background: #fff;
  font-size: 12.5px; font-weight: 800; color: #6a6154; cursor: pointer;
}
.exam-src.on { border-color: var(--orange); color: var(--ink); box-shadow: 0 0 0 1px var(--orange) inset; }
.exam-src input { accent-color: var(--orange); }
.exam-status-checks { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.exam-status-checks label, .exam-switches label {
  display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700; color: var(--ink); cursor: pointer;
}
.exam-status-checks input, .exam-switches input { accent-color: var(--orange); width: 15px; height: 15px; }
.exam-switches { display: flex; flex-wrap: wrap; gap: 10px 22px; padding: 12px 14px; border: 1px solid #ece4d7; border-radius: 12px; background: #fbf8f2; }
.exam-avail { font-size: 12px; color: var(--muted); font-weight: 700; }
.exam-avail b { color: var(--orange); }
.exam-checkline {
  display: flex; align-items: center; gap: 8px; padding: 12px 14px;
  border: 1px dashed #e0d6c6; border-radius: 12px; background: #fffaf3;
  font-size: 12.5px; font-weight: 800; color: var(--ink);
}
.exam-checkline input { width: 16px; height: 16px; accent-color: var(--orange); }
.exam-difficulty-preview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.exam-difficulty-preview span {
  display: grid; place-items: center; gap: 3px; padding: 10px 8px;
  border: 1px solid #ece4d7; border-radius: 12px; background: #fff; color: var(--muted);
  font-size: 11.5px; font-weight: 800; text-align: center;
}
.exam-difficulty-preview b { color: var(--ink); font-size: 16px; }
.exam-start-guide { display: grid; gap: 14px; }
.exam-start-card {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 16px; border: 1px solid #ece4d7; border-radius: 14px; background: #fff8ef;
}
.exam-start-card b { font-size: 15px; }
.exam-start-card span { color: #8a7c66; font-size: 12px; font-weight: 900; }
.exam-guide-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; color: var(--muted); font-size: 12px; font-weight: 800; }
.exam-guide-meta span { display: inline-flex; align-items: center; gap: 5px; }
.exam-start-guide p { margin: 0; line-height: 2.2; color: #5f574e; font-size: 13px; font-weight: 700; }
@media (max-width: 760px) {
  .exam-hub-tabs { width: 100%; }
  .exam-hub-tab { min-width: 0; flex: 1 1 45%; padding-inline: 10px; font-size: 12px; }
  .exam-panel-head, .exam-manage-row { grid-template-columns: 1fr; display: grid; }
  .exam-manage-actions { justify-content: flex-start; }
  .exam-difficulty-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* مدیریت آزمون‌ها: فیلتر کناری + ردیف‌های تک‌خطی + ترکیب */
.exam-manage-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 14px; align-items: start; }
/* نوار فیلتر مدیریت آزمون/مجموعه‌ها: همان تمِ نوار فیلتر بانک سؤال (sd-section) */
.exam-filter-side {
  display: grid; gap: 8px; align-content: start;
  position: sticky; top: 86px; max-height: calc(100vh - 120px); overflow: auto;
}
.exam-filter-side .qset-search { margin: 0; }
.emf-search {
  display: flex; align-items: center; gap: 7px; padding: 0 10px;
  border: 1px solid #eadfd1; border-radius: 10px; background: #fff; color: var(--muted);
}
.emf-search svg { width: 15px; height: 15px; flex: none; }
.emf-search input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font: inherit; font-size: 12px; font-weight: 800; padding: 9px 0; color: var(--ink); }
.emf-search:focus-within { border-color: #f2a562; box-shadow: 0 0 0 3px rgba(255,101,25,.1); }
/* شمارندهٔ فیلترهای فعالِ هر بخش (داخل عنوان sd-section) */
.emf-sel { display: inline-grid; place-items: center; min-width: 17px; height: 17px; padding: 0 5px; margin-inline-start: 5px; border-radius: 999px; background: var(--orange); color: #fff; font-style: normal; font-size: 10px; font-weight: 900; vertical-align: middle; }
/* جدولِ آزمون‌ها: هر داده دقیقاً زیر ستون خودش، وسط‌چین، تک‌ردیف بدون شکستن؛ در عرض کم اسکرول افقی */
.exam-rows { min-width: 0; overflow-x: auto; border: 1px solid #eee5da; border-radius: 14px; background: #fff; }
.exam-table {
  --exam-cols: minmax(88px, 1fr) 28px 44px 34px minmax(50px, 62px) 58px 60px 66px 166px;
  min-width: 0;
}
.exam-thead, .exam-tr {
  display: grid; grid-template-columns: var(--exam-cols); gap: 8px; align-items: center;
  padding: 0 12px;
}
.exam-thead {
  padding-block: 10px; background: #faf6ef; border-bottom: 1px solid #eee5da;
  font-size: 11px; font-weight: 900; color: #8a7c66; text-align: center;
}
.exam-thead .exam-th-name { text-align: start; }
.exam-tr { padding-block: 8px; border-bottom: 1px solid #f3ede3; background: #fff; transition: background .14s ease; }
.exam-tr:last-child { border-bottom: 0; }
.exam-tr:hover { background: #fffaf4; }
.exam-tr.pinned { background: linear-gradient(180deg, #fffaf5, #fff); box-shadow: inset 3px 0 0 var(--orange); }
.exam-td { min-width: 0; font-size: 11.5px; font-weight: 700; color: #4d463c; }
.exam-td.tc { text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exam-ai-count { display: inline-flex !important; align-items: center; justify-content: center; gap: 6px; overflow: visible; }
.exam-td-name { display: grid; gap: 2px; justify-items: start; overflow: hidden; }
.exam-name-line { display: flex; align-items: center; gap: 5px; min-width: 0; max-width: 100%; }
.exam-name-line > b { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--ink); }
.exam-name-sub { display: flex; align-items: center; gap: 5px; min-width: 0; max-width: 100%; overflow: hidden; }
.exam-name-sub > small { flex: none; color: var(--muted); font-size: 9.5px; font-weight: 800; }
.exam-chip {
  flex: none; display: inline-flex; align-items: center; gap: 3px; padding: 1px 6px;
  border-radius: 999px; font-style: normal; font-size: 9px; font-weight: 900;
}
.exam-chip svg { width: 10px; height: 10px; }
.exam-chip.merged { background: #eef4fd; color: #3568b8; }
.exam-chip.pin { background: #fff2e8; color: var(--orange); padding: 2px 4px; }
.exam-td-org { color: var(--muted); font-size: 11px; }
.exam-cwb { display: inline-flex; align-items: center; gap: 1px; font-variant-numeric: tabular-nums; font-size: 10.5px; }
.exam-cwb i { font-style: normal; color: #d8cfc0; }
.exam-cwb .c { color: #168878; } .exam-cwb .w { color: #c24a3a; } .exam-cwb .b { color: var(--muted); }
.exam-none-cell { color: #c2b7a4; font-weight: 900; }
.exam-td .exam-state { font-size: 10px; padding: 3px 9px; white-space: nowrap; }
.exam-td-actions { display: flex; align-items: center; justify-content: center; gap: 2px; row-gap: 3px; white-space: nowrap; flex-wrap: wrap; }
.exam-td-actions .primary-button { min-height: 0; height: 28px; padding: 0 10px; font-size: 10.5px; white-space: nowrap; box-shadow: none; }
.exam-report-btn {
  flex: none; padding: 4px 8px;
  border: 1px solid #f0dcc4; border-radius: 9px; background: #fff7ec; color: #b06010;
  font: inherit; font-size: 10.5px; font-weight: 800; cursor: pointer; white-space: nowrap;
  transition: background .14s ease, border-color .14s ease;
}
.exam-report-btn:hover { background: #ffefdc; border-color: #e8b877; }
.exam-iconbtn {
  flex: none; width: 24px; height: 24px; display: inline-grid; place-items: center;
  border: 1px solid #eadfd1; border-radius: 8px; background: #fff; color: #8a7c66; cursor: pointer;
  transition: border-color .14s ease, color .14s ease, background .14s ease;
}
.exam-iconbtn svg { width: 12px; height: 12px; }
.exam-iconbtn:hover { border-color: var(--orange); color: var(--orange); }
.exam-iconbtn.on { background: #fff2e8; border-color: #f0b487; color: var(--orange); }
.exam-iconbtn.danger:hover { background: #fdeceb; border-color: #f0ccc6; color: #c24a3a; }
.em-results { display: flex; flex-wrap: wrap; gap: 6px; }
.exam-merge { display: grid; gap: 12px; }
/* زیر ۱۲۰۰px سایدبار فیلتر بالای جدول می‌رود تا جدول بدون اسکرول افقی در یک صفحه جا شود */
@media (max-width: 900px) {
  .exam-manage-layout { grid-template-columns: 1fr; }
  .exam-filter-side { position: static; max-height: none; }
}

/* اجراکنندهٔ آزمون */
body.exam-open { overflow: hidden; }
.exam-runner {
  position: fixed; inset: 0; z-index: 90; display: flex; flex-direction: column;
  background: #f6f1e8;
}
.er-top {
  flex: none; display: flex; align-items: center; gap: 16px; padding: 12px 18px;
  background: rgba(255,255,255,.85); backdrop-filter: blur(10px);
  border-bottom: 1px solid #ece4d7;
}
.er-title { display: grid; min-width: 0; }
.er-title strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.er-title small { color: var(--muted); font-size: 10.5px; font-weight: 800; }
.er-stats { color: var(--muted); font-size: 12px; font-weight: 700; }
.er-stats b { color: var(--ink); }
.er-timer-mini {
  display: none; margin-inline-start: auto; padding: 6px 14px; border-radius: 12px;
  background: #2b2721; color: #fff; font-size: 14px; font-weight: 900; letter-spacing: 1px;
  font-variant-numeric: tabular-nums; direction: ltr;
}
.er-timer-mini.danger { background: #c24a3a; animation: er-pulse 1s ease infinite; }
@keyframes er-pulse { 50% { opacity: .75; } }
.er-top-actions { display: flex; gap: 9px; margin-inline-start: auto; }
.er-body { flex: 1; display: flex; gap: 16px; padding: 16px 18px; min-height: 0; }
.er-side { flex: none; width: 280px; display: flex; flex-direction: column; gap: 12px; min-height: 0; }
/* کارت اطلاعات آزمون: حلقهٔ زمان + مشخصات + دکمهٔ اتمام */
.er-info-card {
  display: grid; gap: 12px; padding: 14px;
  background: #fff; border: 1px solid #ece4d7; border-radius: 18px;
  box-shadow: 0 12px 26px rgba(90,70,40,.05);
}
.er-info-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13.5px; font-weight: 900; }
.er-eye {
  width: 30px; height: 30px; display: grid; place-items: center;
  border: 1px solid #eee5da; border-radius: 9px; background: #fffaf5; color: #8a7c66; cursor: pointer;
  transition: border-color .14s ease, color .14s ease;
}
.er-eye:hover { border-color: var(--orange); color: var(--orange); }
.er-eye.off { background: #f4efe7; color: #b0a48e; }
.er-eye svg { width: 15px; height: 15px; }
/* مخفی‌کردن زمان: عدد و حلقه محو/بلور می‌شوند ولی ساختار می‌ماند */
.er-ring.time-hidden svg { filter: blur(5px); opacity: .55; }
.er-ring.time-hidden .er-ring-text b,
.er-ring.time-hidden .er-ring-text em { filter: blur(7px); user-select: none; }
.er-timer-mini.time-hidden { filter: blur(5px); }
.er-info-body { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.er-info-rows { display: grid; gap: 12px; min-width: 0; }
.er-info-row { display: flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 800; color: #4d463c; min-width: 0; }
.er-info-row > span { min-width: 0; overflow-wrap: anywhere; line-height: 1.55; }
.er-info-row i {
  flex: none; width: 26px; height: 26px; display: grid; place-items: center;
  border-radius: 9px; background: #fff; border: 1.5px solid #f6c69b; color: var(--orange);
}
.er-info-row i svg { width: 14px; height: 14px; }
.er-ring { position: relative; flex: none; width: 108px; height: 108px; }
.er-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.er-ring-bg { fill: none; stroke: #f0ebe2; stroke-width: 7; }
.er-ring-fg {
  fill: none; stroke: var(--orange); stroke-width: 7.5; stroke-linecap: round;
  transition: stroke-dashoffset .9s linear, stroke .3s ease;
}
.er-ring-fg.danger { stroke: #c24a3a; }
.er-ring-tick { stroke: #fff; stroke-width: 3.5; stroke-linecap: round; }
.er-ring-text {
  position: absolute; inset: 0; display: grid; place-content: center; gap: 2px; text-align: center;
}
.er-ring-text b { font-size: 15px; font-weight: 900; font-variant-numeric: tabular-nums; direction: ltr; color: var(--orange); }
.er-ring-text b.danger { color: #c24a3a; }
.er-ring-text span { color: var(--muted); font-size: 9.5px; font-weight: 800; }
.er-ring-text em { color: var(--orange); font-size: 9px; font-weight: 900; font-style: normal; max-width: 76px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-inline: auto; }
.er-finish {
  width: 100%; padding: 13px; border: 0; border-radius: 999px;
  background: var(--orange); color: #fff; font: inherit; font-size: 15px; font-weight: 900;
  cursor: pointer; box-shadow: 0 10px 22px rgba(255,95,31,.22);
  transition: background .14s ease, transform .14s var(--ease-soft);
}
.er-finish:hover { background: #f05a18; transform: translateY(-1px); }
/* کارت ناوبری سؤال‌ها: شمارنده‌ها + باکسِ درس‌های هر دفترچه */
.er-nav-card {
  flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 10px; padding: 12px;
  background: #fff; border: 1px solid #ece4d7; border-radius: 18px;
  box-shadow: 0 12px 26px rgba(90,70,40,.05);
}
.er-nav-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; font-weight: 800; color: #4d463c; padding: 0 2px; }
.er-nav-head > span { display: inline-flex; align-items: center; gap: 6px; }
.er-nh-blank .d { width: 12px; height: 12px; border-radius: 50%; border: 1.5px solid #ddd3c1; background: #f4efe7; }
.er-nh-flag i { display: inline-grid; place-items: center; color: var(--orange); }
.er-nh-flag svg { width: 14px; height: 14px; }
.er-grid { display: flex; flex-direction: column; gap: 10px; overflow-y: auto; overscroll-behavior: contain; min-height: 0; }
.er-bk-box { border: 1px solid #ece4d7; border-radius: 14px; padding: 8px; display: grid; gap: 8px; }
.er-bk-box.locked { opacity: .68; }
.er-bk-box-h { font-size: 12px; font-weight: 900; color: #6a6154; padding: 2px 4px; }
.er-les-box { border: 1px solid #eee7db; border-radius: 14px; background: #fff; overflow: hidden; }
.er-les-head {
  width: 100%; display: flex; align-items: center; gap: 8px; padding: 11px 12px;
  border: 0; background: transparent; font: inherit; font-size: 13px; font-weight: 900; color: var(--ink);
  cursor: pointer;
}
.er-les-head small { color: var(--muted); font-size: 11.5px; font-weight: 800; margin-inline-start: auto; }
.er-les-head i { display: inline-grid; place-items: center; color: #b0a48e; transition: transform .18s ease; }
.er-les-head i svg { width: 15px; height: 15px; }
.er-les-box.open .er-les-head i { transform: rotate(180deg); }
.er-grid-row {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(40px, 1fr)); gap: 8px;
  padding: 4px 10px 12px;
}
.er-cell {
  position: relative; height: 38px; border: 0; border-radius: 11px; background: #f4f1ec;
  font: inherit; font-size: 12.5px; font-weight: 800; color: #6a6154; cursor: pointer;
  transition: background .12s ease, box-shadow .12s ease, color .12s ease;
}
.er-cell:hover { box-shadow: 0 0 0 1.5px var(--orange) inset; }
.er-cell.answered { background: #eaf8f4; color: #168878; }
.er-cell.current { background: #fff6ec; box-shadow: 0 0 0 2px var(--orange) inset; color: var(--ink); }
.er-cell.locked { opacity: .5; cursor: not-allowed; }
/* بج نشان‌دار: از لبهٔ بالای سلول شروع می‌شود؛ نرم و طبیعی مثل روبان کتاب */
.er-cell-bm {
  position: absolute; top: -1px; inset-inline-end: 5px; color: var(--orange);
  display: inline-grid; place-items: start center; pointer-events: none;
}
.er-cell-bm svg { width: 11px; height: 14px; }
.er-cell.flagged { background: #fff6ec; color: #b06010; }
.er-main { flex: 1; min-width: 0; overflow-y: auto; overscroll-behavior: contain; display: grid; gap: 14px; align-content: start; padding-bottom: 30px; }
.er-qhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.er-qno { font-size: 13px; font-weight: 900; color: var(--ink); }
.er-qhead-actions { display: inline-flex; gap: 8px; }
.er-flag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 13px; border: 1px solid #e5dccb; border-radius: 999px; background: #fff;
  font: inherit; font-size: 11.5px; font-weight: 800; color: #6a6154; cursor: pointer;
}
.er-flag svg { width: 13px; height: 13px; }
.er-flag.on { background: #fff3e2; border-color: #e8a33d; color: #b06010; }
/* دکمه‌های آیکونیِ سربرگ سؤال (نشان‌دار / چرک‌نویس) */
.er-iconbtn {
  width: 36px; height: 36px; display: inline-grid; place-items: center;
  border: 1px solid #e5dccb; border-radius: 11px; background: #fff;
  color: #8a7c66; cursor: pointer;
  transition: border-color .14s ease, background .14s ease, color .14s ease, transform .14s var(--ease-soft);
}
/* بدون بالاآمدنِ ترنسفورم: دکمه در بالای ناحیهٔ اسکرولِ سؤال است و لیفت باعث برش خوردنِ کادر می‌شد */
.er-iconbtn:hover { border-color: var(--orange); color: var(--orange); background: #fff8ef; }
.er-iconbtn svg { width: 17px; height: 17px; }
.er-iconbtn img.draw-pen-img { width: 18px; height: 18px; }
.er-iconbtn.on { background: #fff3e2; border-color: #e8a33d; color: #d07f14; }
.er-qno-num {
  display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 8px;
  border-radius: 11px; background: var(--orange); color: #fff; font-size: 15px; font-weight: 900;
}
/* پاسخبرگ آنلاینِ آزمون چاپی */
.er-sheet-hint { margin: 0; color: var(--muted); font-size: 12px; font-weight: 700; line-height: 2; }
.er-sheet-grid { background: #fff; border: 1px solid #d9d1c5; border-radius: 8px; padding: 12px; }
.er-sheet-grid.omr-sheet-grid { gap: 8px; }
.er-sheet-grid .omr-col { gap: 8px; flex-basis: 152px; min-width: 144px; max-width: 158px; }
.er-sheet-grid .omr-block { border-color: #d8d0c4; border-radius: 5px; background: #fff; }
.er-sheet-grid .omr-line { min-height: 30px; gap: 5px; padding: 3px 6px; }
.er-sheet-grid .omr-picks { flex: 1; justify-content: space-between; gap: 4px; }
.er-sheet-grid .omr-b {
  width: 23px;
  height: 23px;
  border-width: 1px;
  border-radius: 4px;
  background: #fff;
}
.er-sheet-grid .omr-b.on { box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); }
/* گزینه‌ها داخلِ همان کارتِ سؤال‌اند تا صورت سؤال، شکل و گزینه‌ها یک ورقهٔ
   یکپارچه باشند — مثل کارت سؤال در پنل کاربر. */
.er-question.detail-card { margin: 0; }
.er-question > .er-options,
.er-question > .sq-side-layout { margin-top: 14px; }
/* گزینه‌ها افقی کنار هم؛ متن بلند خودش به سطر بعد می‌شکند.
   گرید (نه flex) تا هر چهار کادر هم‌عرض و — با grid-auto-rows: 1fr — هم‌ارتفاع بمانند. */
.er-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; grid-auto-rows: 1fr; gap: 10px; }
/* گزینه‌های کوتاه: چهار ستون مساوی که تمام عرض سؤال را می‌گیرند. */
.er-options.is-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.er-options.is-row .er-opt { width: 100%; min-width: 0; justify-content: flex-start; padding: 8px 10px; }
.er-options.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.er-options.is-two .er-opt { width: 100%; min-width: 0; }
.er-options.is-stack { display: grid; grid-template-columns: minmax(0, 1fr); grid-auto-rows: max-content; }
.er-options.is-stack .er-opt { width: 100%; min-width: 0; }
.er-opt {
  width: 100%; min-width: 0;
  display: flex; align-items: center; gap: 10px; padding: 12px 14px; text-align: start;
  border: 1.5px solid #e5dccb; border-radius: 14px; background: #fff;
  font: inherit; font-size: 13px; line-height: 1.9; color: var(--ink); cursor: pointer;
  transition: border-color .12s ease, background .12s ease;
}
.er-opt:hover { border-color: var(--orange); }
.er-opt b {
  flex: none; width: 26px; height: 26px; display: grid; place-items: center;
  border: 1.5px solid #d9cfbf; border-radius: 50%; font-size: 12px; color: #6a6154;
}
.er-opt.on { border-color: var(--orange); background: #fff6ec; box-shadow: 0 0 0 1.5px var(--orange) inset; }
.er-opt.on b { background: var(--orange); border-color: var(--orange); color: #fff; }
.er-opt span { min-width: 0; }
.er-nav-btns { display: flex; justify-content: space-between; gap: 10px; }
@media (max-width: 860px) {
  .er-body { flex-direction: column; padding: 12px; }
  .er-side { width: 100%; order: 2; }
  .er-grid { max-height: 260px; }
  .er-main { order: 1; }
  .er-top { flex-wrap: wrap; gap: 8px 12px; padding: 10px 12px; }
  .er-timer-mini { display: block; }
  .er-stats { display: none; }
  .er-opt { min-width: 0; }
  .er-options.is-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .er-options.is-row .er-opt { min-width: 0; }
}

/* کارنامهٔ آزمون */
.exam-report-meta { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 12px; color: var(--muted); font-weight: 700; }
.exam-report-meta b { color: var(--ink); }
.exam-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(108px, 1fr)); gap: 9px; }
.exam-tile {
  display: grid; gap: 3px; place-items: center; padding: 13px 8px;
  border: 1px solid #ece4d7; border-radius: 14px; background: #fdfaf5; text-align: center;
}
.exam-tile b { font-size: 17px; font-weight: 900; color: var(--ink); font-variant-numeric: tabular-nums; }
.exam-tile span { font-size: 11px; color: var(--muted); font-weight: 700; }
.exam-tile.ok b { color: #168878; }
.exam-tile.bad b { color: #c24a3a; }
.exam-report-h { margin: 6px 0 0; font-size: 13.5px; }
.exam-lesson-table { border: 1px solid #ece4d7; border-radius: 14px; overflow: hidden; background: #fff; }
.exam-lesson-row {
  display: grid; grid-template-columns: minmax(120px, 1.6fr) repeat(5, minmax(46px, .55fr)) minmax(64px, .7fr);
  align-items: center; gap: 8px; padding: 9px 14px; font-size: 12px; font-weight: 800; text-align: center;
}
.exam-lesson-row:not(.head) { border-top: 1px solid #f2ebdf; }
.exam-lesson-row.head { background: #f8f3eb; color: #4a4036; font-size: 11.5px; font-weight: 900; }
.exam-lesson-name { text-align: start; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exam-lesson-row .ok { color: #168878; }
.exam-lesson-row .bad { color: #c24a3a; }
.omr-line.res.omr-answered { border-inline-start-color: #9a5a1f; }
@media (max-width: 640px) {
  .exam-lesson-row { grid-template-columns: minmax(90px, 1.4fr) repeat(5, minmax(34px, .55fr)) minmax(52px, .7fr); padding: 8px 9px; gap: 4px; font-size: 11px; }
}

/* ===== ویزارد ساخت آزمون شخصی ===== */
.exam-panel.exam-wizard { max-width: 860px; margin-inline: auto; }
@keyframes ew-in { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
.exam-wizard-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.exam-wizard-head h2 { margin: 0 0 4px; font-size: 16px; }
.exam-wizard-head p { margin: 0; color: var(--muted); font-size: 12.5px; line-height: 1.8; }
.exam-wizard-progress { flex: none; padding: 6px 12px; border-radius: 999px; background: #f6f1e7; color: #8a7c66; font-size: 12px; font-weight: 900; }
.exam-stepper { display: flex; align-items: center; gap: 4px; margin-bottom: 20px; flex-wrap: wrap; }
.exam-step { display: inline-flex; align-items: center; gap: 8px; }
.exam-step-num { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border-radius: 50%; background: #efe7db; color: #8a7c66; font-size: 12.5px; font-weight: 900; border: 2px solid transparent; transition: background .25s ease, color .25s ease, transform .25s ease; }
.exam-step.on .exam-step-num { transform: scale(1.12); }
.exam-step.on .exam-step-num { background: var(--orange); color: #fff; }
.exam-step.done .exam-step-num { background: #eaf8f4; color: #168878; }
.exam-step-label { font-size: 12.5px; font-weight: 800; color: #8a7c66; }
.exam-step.on .exam-step-label { color: var(--ink); }
.exam-step-line { flex: 1; min-width: 18px; height: 2px; background: #e5dccb; margin: 0 4px; border-radius: 2px; }
.exam-step-line.done { background: #9ed4c1; }
.exam-wizard-body { background: rgba(255,255,255,.72); border: 1px solid #ece4d7; border-radius: 18px; padding: 20px; }
.ew-step { display: grid; gap: 16px; animation: ew-in .3s ease; }
.ew-type-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ew-type { display: grid; gap: 5px; padding: 14px; border: 1.5px solid #e5dccb; border-radius: 14px; background: #fff; cursor: pointer; }
.ew-type.on { border-color: var(--orange); box-shadow: 0 0 0 1.5px var(--orange) inset; }
.ew-type input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.ew-type b { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; }
.ew-type b svg { width: 17px; height: 17px; }
.ew-type span { color: var(--muted); font-size: 12px; line-height: 1.7; }
.ew-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 6px; }
.ew-nav .primary-button svg, .ew-nav .secondary-button svg { width: 16px; height: 16px; }
.ew-booklets { display: grid; gap: 14px; }
.ew-booklet { border: 1px solid #ead9c2; border-radius: 16px; background: #fffdf9; padding: 14px; display: grid; gap: 10px; }
.ew-bk-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ew-bk-name { flex: 1; min-width: 120px; border: 1px solid #e5dccb; border-radius: 10px; padding: 8px 12px; font: inherit; font-weight: 800; background: #fff; }
.ew-bk-time { color: var(--muted); font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 5px; }
.ew-bk-time svg, .ew-bk-time b { color: var(--ink); }
.ew-bk-time svg { width: 14px; height: 14px; color: var(--muted); }
.ew-lesson-list { display: grid; gap: 8px; }
.ew-lesson-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid #efe7db; border-radius: 12px; background: #fff; flex-wrap: wrap; }
.ew-ls-ord { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 8px; background: #f1efe8; color: #6a6154; font-size: 12px; font-weight: 900; }
.ew-ls-name { flex: 1; min-width: 130px; border: 1px solid #e5dccb; border-radius: 10px; padding: 7px 10px; font: inherit; background: #fff; }
.ew-ls-time { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.ew-ls-time input { width: 64px; border: 1px solid #e5dccb; border-radius: 9px; padding: 6px 8px; font: inherit; text-align: center; }
.ew-ls-actions { display: inline-flex; gap: 5px; }
.ew-mini { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #e5dccb; border-radius: 9px; background: #fff; color: #6a6154; cursor: pointer; }
.ew-mini svg { width: 15px; height: 15px; }
.ew-mini:hover { border-color: var(--orange); }
.ew-mini.danger:hover { border-color: #c24a3a; color: #c24a3a; }
.ew-mini:disabled { opacity: .4; cursor: default; }
.ew-mini.danger { display: inline-flex; align-items: center; gap: 5px; width: auto; padding: 0 10px; font-size: 12px; font-weight: 700; }
.ew-add-lesson { display: inline-flex; align-items: center; gap: 6px; align-self: start; border: 1px dashed #d9cfbf; background: #fff; border-radius: 10px; padding: 8px 14px; font: inherit; font-size: 12.5px; font-weight: 700; color: var(--orange); cursor: pointer; }
.ew-add-lesson svg { width: 15px; height: 15px; }
.ew-add-booklet { align-self: start; }
.ew-empty { color: var(--muted); font-size: 12px; margin: 4px 0; }
.ew-lock { display: flex; gap: 10px; padding: 12px 14px; border: 1px solid #f0d9a6; border-radius: 12px; background: #fff9ec; cursor: pointer; }
.ew-lock input { accent-color: var(--orange); margin-top: 3px; }
.ew-lock span { display: grid; gap: 3px; }
.ew-lock b { font-size: 12.5px; } .ew-lock small { color: var(--muted); font-size: 11.5px; line-height: 1.7; }
.ew-total { padding: 12px 14px; border-radius: 12px; background: #faf7f1; border: 1px solid #ece4d7; font-size: 13px; font-weight: 800; }
.ew-total b { color: var(--orange); }
.ew-q-booklet { border: 1px solid #ece4d7; border-radius: 14px; padding: 12px 14px; display: grid; gap: 8px; margin-bottom: 12px; }
.ew-q-bk-title { font-weight: 900; font-size: 13px; }
.ew-q-lesson { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; border: 1px solid #efe7db; border-radius: 11px; background: #fff; flex-wrap: wrap; }
.ew-q-ls-main { display: grid; gap: 2px; } .ew-q-ls-main b { font-size: 13px; } .ew-q-ls-main span { color: var(--muted); font-size: 11.5px; }
.ew-q-ls-actions { display: inline-flex; gap: 6px; }
.ew-review-card { border: 1px solid #ead9c2; border-radius: 16px; background: #fffdf9; padding: 16px; }
.ew-review-title { font-size: 16px; font-weight: 900; margin-bottom: 10px; }
.ew-review-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px 18px; font-size: 12.5px; color: var(--muted); }
.ew-review-meta b { color: var(--ink); }
.ew-review-table { border: 1px solid #ece4d7; border-radius: 14px; overflow: hidden; background: #fff; }
.ew-review-row { display: grid; grid-template-columns: 1.2fr 1.4fr .6fr .8fr; gap: 8px; padding: 10px 14px; font-size: 12.5px; font-weight: 700; }
.ew-review-row:not(.head) { border-top: 1px solid #f2ebdf; }
.ew-review-row.head { background: #f8f3eb; font-weight: 900; color: #4a4036; }
.ew-review-note { color: var(--muted); font-size: 12px; }

/* پاپ‌آپ انتخاب سؤالِ درس */
.exam-picker { display: grid; gap: 12px; }
.exam-pick-sec { border: 1px solid #ece4d7; border-radius: 14px; padding: 12px 14px; display: grid; gap: 10px; animation: ew-in .26s ease; }
.exam-pick-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; }
.exam-pick-h > span { color: var(--muted); font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px; }
.exam-pick-h > span > small { color: #b0a38f; font-size: 10px; font-weight: 700; }
.exam-pick-h b { font-weight: 900; display: inline-flex; align-items: center; gap: 7px; }
.exam-pick-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ep-chip {
  display: inline-flex; align-items: center; gap: 5px;
  border: 1px solid #e5dccb; border-radius: 999px; background: #fff; padding: 6px 12px;
  font: inherit; font-size: 12px; font-weight: 700; color: #6a6154; cursor: pointer;
  transition: border-color .14s ease, background .14s ease, color .14s ease, transform .14s ease;
}
.ep-chip:hover { border-color: var(--orange); transform: translateY(-1px); }
.ep-chip svg { width: 12px; height: 12px; }
.ep-chip.on { background: var(--orange); border-color: var(--orange); color: #fff; }
.ep-chip.on i { display: inline-grid; place-items: center; opacity: .85; }
.ep-chip.on i svg { width: 11px; height: 11px; }
.ep-tag-mode { width: max-content; max-width: 100%; }
.ep-tag-choices { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 7px; }
.ep-tag-choice {
  min-width: 0; min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 9px;
  padding: 6px 9px; border: 1px solid #e7dece; border-radius: 10px; background: #fff;
  color: #665c4d; font: inherit; cursor: pointer; transition: border-color .14s ease, background .14s ease, transform .14s ease;
}
.ep-tag-choice:hover { border-color: #efad7d; background: #fff8f1; transform: translateY(-1px); }
.ep-tag-choice > span { min-width: 0; display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-tag-choice > span .ui-icon { width: 12px; height: 12px; color: var(--orange); flex: 0 0 auto; }
.ep-tag-choice > b { flex: 0 0 auto; min-width: 27px; padding: 3px 7px; border-radius: 7px; background: #f4efe7; color: #8b7658; font-size: 10.5px; font-weight: 900; text-align: center; }
.ep-tag-section .ew-prio-list { max-height: 230px; overflow: auto; overscroll-behavior: contain; }
.ep-topic-btn { align-self: start; }
.ep-src-tree { max-height: 240px; overflow: auto; overscroll-behavior: contain; border: 1px solid #efe7db; border-radius: 12px; padding: 6px 10px; background: #fff; }
.ep-basis { border: 1px solid #e5dccb; border-radius: 8px; padding: 4px 8px; font: inherit; font-size: 12px; background: #fff; }
.exam-pick-note { color: var(--muted); font-size: 11.5px; margin: 0; }
.ep-mode { margin-bottom: 4px; flex-wrap: wrap; }
.ep-order-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.ep-order-row > span { font-size: 12px; font-weight: 800; color: #6a6154; }
.ep-auto { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: flex-end; }
.ep-auto .ep-level-row { flex-basis: 100%; }
.ep-auto .ep-check { width: 100%; }
.ep-count { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700; }
.ep-count input { width: 90px; border: 1px solid #e5dccb; border-radius: 9px; padding: 7px 10px; font: inherit; text-align: center; }
.exam-picker-count { font-size: 12.5px; color: var(--muted); font-weight: 700; }
.exam-picker-count b { color: var(--ink); }
.ep-check { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: #6a6154; cursor: pointer; }
.ep-check input { accent-color: var(--orange); width: 15px; height: 15px; cursor: pointer; }
.ew-prio-note { flex: none; color: var(--muted); font-size: 11px; font-weight: 700; white-space: nowrap; }
.ew-prio-list.shuffled .ew-prio-rank { opacity: .3; }
/* باکس‌های هر موضوع: ۴ سطحِ افقی زیر نام موضوع (حالت دستی) */
.ep-topic-boxes { display: grid; gap: 10px; }
.ep-topic-box { border: 1px solid #efe7db; border-radius: 12px; background: #fff; padding: 10px 12px; display: grid; gap: 8px; animation: ew-in .26s ease; }
.ep-topic-box-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ep-topic-box-h b { font-size: 12.5px; font-weight: 900; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-topic-box-h span { flex: none; color: var(--muted); font-size: 11px; font-weight: 700; }
.ep-mini-diff { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.ep-mini-cell {
  display: grid; gap: 6px; justify-items: center; padding: 8px 6px;
  border: 1px solid #efe7db; border-radius: 10px; background: #fffdfa;
  transition: border-color .14s ease, box-shadow .14s ease;
}
.ep-mini-cell:focus-within { border-color: #f2a562; box-shadow: 0 0 0 3px rgba(255,101,25,.08); }
.ep-mini-cell span { font-size: 10.5px; font-weight: 800; }
.ep-mini-cell.level-1 span { color: #1aa58e; }
.ep-mini-cell.level-2 span { color: #b07d12; }
.ep-mini-cell.level-3 span { color: #d4631f; }
.ep-mini-cell.level-4 span { color: #d2434c; }
/* فیلد تعداد باید مثل یک باکسِ ورودی واضح دیده شود */
.ep-mini-cell input {
  width: 100%; border: 1px solid #e0d6c5; border-radius: 8px; background: #fff;
  outline: none; font: inherit; font-size: 12.5px; font-weight: 800; text-align: center; color: var(--ink);
  padding: 5px 4px;
  transition: border-color .14s ease, box-shadow .14s ease;
}
.ep-mini-cell input::placeholder { color: #c2b7a4; font-size: 10px; font-weight: 700; }
.ep-mini-cell input:focus { border-color: #f2a562; box-shadow: 0 0 0 3px rgba(255,101,25,.1); }
/* سهم هر موضوع در توزیع نسبتی (پیش‌نمایش) و ورودی تعداد هر موضوع */
.ep-alloc, .ep-topic-counts { display: grid; gap: 6px; width: 100%; }
.ep-alloc-row, .ep-topic-count {
  display: flex; align-items: center; gap: 10px; padding: 7px 12px;
  border: 1px solid #efe7db; border-radius: 11px; background: #fff;
}
.ep-alloc-row span, .ep-topic-count span { flex: 1; min-width: 0; font-size: 12.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-alloc-row small, .ep-topic-count small { flex: none; color: var(--muted); font-size: 11px; font-weight: 700; }
.ep-alloc-row b { flex: none; min-width: 30px; text-align: center; padding: 3px 8px; border-radius: 8px; background: #fbf3e8; color: var(--orange); font-size: 12.5px; font-weight: 900; font-variant-numeric: tabular-nums; }
.ep-topic-count input { flex: none; width: 64px; border: 1px solid #e5dccb; border-radius: 8px; padding: 5px 8px; font: inherit; font-size: 12.5px; font-weight: 800; text-align: center; }
.ep-topic-count input:focus { outline: none; border-color: #f2a562; box-shadow: 0 0 0 3px rgba(255,101,25,.08); }

/* فهرست‌های اولویت با درگ‌اند‌دراپ */
.ew-prio-title { font-size: 11.5px; font-weight: 800; color: #8a7c66; }
.ew-prio-list { display: grid; gap: 6px; }
.ew-prio-row {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px;
  border: 1px solid #efe7db; border-radius: 11px; background: #fff;
  transition: box-shadow .15s ease, border-color .15s ease, opacity .15s ease;
}
.ew-prio-row.dragging { opacity: .45; border-style: dashed; border-color: var(--orange); }
.ew-prio-rank { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 7px; background: #fbf3e8; color: var(--orange); font-size: 11px; font-weight: 900; }
.ew-prio-label { flex: 1; min-width: 0; font-size: 12.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ew-prio-x { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: #b09a82; cursor: pointer; }
.ew-prio-x:hover { background: #fdeceb; color: #c24a3a; }
.ew-prio-x svg { width: 12px; height: 12px; }
.ew-drag-handle { flex: none; width: 22px; display: grid; place-items: center; color: #cdbfa8; cursor: grab; touch-action: none; }
.ew-drag-handle:active { cursor: grabbing; color: var(--orange); }
.ew-grip { width: 15px; height: 15px; }

/* سطح دشواری ۵بخشی (سبز → قرمز) */
.ep-level-segs { display: flex; flex-wrap: wrap; gap: 6px; }
.ep-level-seg {
  flex: 1 1 auto; min-width: 86px; padding: 9px 10px;
  border: 1.5px solid #e5dccb; border-radius: 11px; background: #fff;
  font: inherit; font-size: 12px; font-weight: 800; color: #6a6154; cursor: pointer;
  transition: border-color .14s ease, background .14s ease, color .14s ease, transform .14s var(--ease-soft);
}
.ep-level-seg:hover { transform: translateY(-1px); }
.ep-level-seg.lv-1 { --lv: #1aa58e; }
.ep-level-seg.lv-2 { --lv: #7fae2c; }
.ep-level-seg.lv-3 { --lv: #d99a17; }
.ep-level-seg.lv-4 { --lv: #d4631f; }
.ep-level-seg.lv-5 { --lv: #d2434c; }
.ep-level-seg:hover { border-color: var(--lv); color: var(--lv); }
.ep-level-seg.on { background: var(--lv); border-color: var(--lv); color: #fff; box-shadow: 0 6px 14px rgba(0,0,0,.12); }
/* نوارِ درجهٔ دشواری ۱..۱۰۰ (سبز → نارنجی → قرمز) */
.ep-level-row { display: grid; gap: 7px; flex: 1; min-width: 250px; }
.ep-level-head { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; font-weight: 800; }
.ep-level-head b { font-size: 15px; font-variant-numeric: tabular-nums; }
.ep-level-tag { font-style: normal; font-size: 11px; font-weight: 800; margin-inline-start: 7px; }
.ep-level-row input[type=range] {
  -webkit-appearance: none; appearance: none; width: 100%; height: 9px; border-radius: 99px;
  background: #eee3d3; outline: none; cursor: pointer;
}
.ep-level-row input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 21px; height: 21px; border-radius: 50%;
  background: #fff; border: 3.5px solid var(--ep-c, var(--orange));
  box-shadow: 0 2px 7px rgba(60, 40, 20, .25); transition: transform .12s ease;
}
.ep-level-row input[type=range]::-webkit-slider-thumb:hover { transform: scale(1.12); }
.ep-level-row input[type=range]::-moz-range-thumb {
  width: 18px; height: 18px; border-radius: 50%; background: #fff;
  border: 3.5px solid var(--ep-c, var(--orange)); box-shadow: 0 2px 7px rgba(60, 40, 20, .25);
}
.ep-level-scale { display: flex; justify-content: space-between; font-size: 10.5px; font-weight: 700; color: var(--muted); direction: ltr; }
.ep-level-scale span:first-child { color: #2e9e6b; }
.ep-level-scale span:nth-child(2) { color: #d98324; }
.ep-level-scale span:last-child { color: #c2372a; }

/* حالت «آماری (درصد پاسخگویی)»: مبنای تکی + نوار بازهٔ دوسر */
.ep-stat { display: grid; gap: 12px; }
.ep-stat-seg.m-correct { --lv: #2f9e83; }
.ep-stat-seg.m-wrong { --lv: #d3603f; }
.ep-stat-seg.m-blank { --lv: #d7a72e; }
.ep-stat-rangebox { display: grid; gap: 4px; }
.ep-stat-vals { font-size: 12.5px; font-weight: 800; color: #6a6154; }
.ep-stat-vals b { color: var(--orange); font-variant-numeric: tabular-nums; }
.ep-stat-slider { position: relative; height: 36px; }
.ep-stat-track {
  position: absolute; top: 50%; left: 2px; right: 2px; height: 8px;
  transform: translateY(-50%); border-radius: 99px; background: #eee3d3;
}
.ep-stat-track i { position: absolute; top: 0; bottom: 0; border-radius: 99px; background: var(--orange); }
.ep-stat-slider input[type=range] {
  -webkit-appearance: none; appearance: none;
  position: absolute; top: 50%; left: 0; right: 0; width: 100%; margin: 0;
  transform: translateY(-50%); height: 8px; background: none; outline: none;
  pointer-events: none; /* فقط دستگیره‌ها کشیدنی‌اند تا دو نوارِ روی‌هم تداخل نکنند */
}
.ep-stat-slider input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; pointer-events: auto;
  width: 21px; height: 21px; border-radius: 50%; background: #fff;
  border: 3.5px solid var(--orange); box-shadow: 0 2px 7px rgba(60,40,20,.25);
  cursor: grab; transition: transform .12s ease;
}
.ep-stat-slider input[type=range]::-webkit-slider-thumb:hover { transform: scale(1.12); }
.ep-stat-slider input[type=range]::-webkit-slider-thumb:active { cursor: grabbing; }
.ep-stat-slider input[type=range]::-moz-range-thumb {
  pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; background: #fff;
  border: 3.5px solid var(--orange); box-shadow: 0 2px 7px rgba(60,40,20,.25); cursor: grab;
}

/* اجراکنندهٔ دفترچه‌ای */
.er-booklet-path { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-inline-start: 6px; }
.er-bk-step { padding: 4px 10px; border-radius: 999px; background: #f1efe8; color: #8a7c66; font-size: 11.5px; font-weight: 800; }
.er-bk-step.current { background: var(--orange); color: #fff; }
.er-bk-step.locked { opacity: .6; }
.er-bk-sep { color: var(--muted); }
.er-qlesson { margin-inline-start: 8px; padding: 2px 9px; border-radius: 999px; background: #fbf3e8; color: var(--orange); font-size: 11px; font-weight: 800; }
@media (max-width: 860px) {
  .ew-type-cards { grid-template-columns: 1fr; }
}

/* دانلود مستقیم دفترچهٔ آزمون: استودیو فقط برای چاپ ساخته می‌شود و روی صفحه دیده نمی‌شود */
@media screen {
  body.pstudio-direct .print-studio { opacity: 0; pointer-events: none; }
}

/* چاپ واقعی: فقط صفحه‌های A4 */
@media print {
  @page { size: A4; margin: 0; }
  body.pstudio-printing > *:not(.print-studio) { display: none !important; }
  body.pstudio-printing { overflow: visible !important; background: #fff !important; }
  body.pstudio-printing .print-studio { position: static; background: #fff; display: block; }
  body.pstudio-printing .pstudio-topbar,
  body.pstudio-printing .pstudio-busy,
  body.pstudio-printing .pstudio-skeleton,
  body.pstudio-printing .pstudio-side { display: none !important; }
  body.pstudio-printing .pq-space-tools { display: none !important; }
  body.pstudio-printing .pstudio-layout { display: block; }
  body.pstudio-printing .pstudio-preview { overflow: visible; padding: 0; gap: 0; display: block; }
  body.pstudio-printing .pstudio-page {
    width: 210mm;
    min-height: 296mm;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    page-break-after: always;
    padding: 15mm;
  }
  body.pstudio-printing .pstudio-page:last-child { page-break-after: auto; }
  body.pstudio-printing .pstudio-page.is-key { height: 296mm; }
  body.pstudio-printing .pstudio-final-footer { left: auto; right: auto; }
}

@media (max-width: 980px) {
  .pstudio-layout { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .pstudio-side { max-height: 42vh; border-inline-end: 0; border-bottom: 1px solid var(--line); }
  .pstudio-preview { padding: 16px 8px 50px; }
  .pstudio-page { transform-origin: top center; transform: scale(.62); margin-bottom: -400px; }
  /* سایدبار به ردیف بالا می‌رود؛ پیش‌نمایش و نشانهٔ لودینگ روی ردیف دوم می‌مانند */
  .pstudio-preview { grid-column: 1; grid-row: 2; }
  .pstudio-layout.no-side .pstudio-preview { grid-row: 1; }
  .pstudio-busy { grid-column: 1; grid-row: 2; padding: 16px 10px; }
  .pstudio-layout.no-side .pstudio-busy { grid-row: 1; }
  .pstudio-skeleton-page { transform-origin: top center; transform: scale(.62); margin-bottom: -400px; }
}

/* ===== پرداخت نهایی مدیریت آزمون، مجموعه سؤال و مراحل ۲/۳ سازنده ===== */
.exam-manage-layout {
  grid-template-columns: 236px minmax(0, 1fr);
  gap: 18px;
  direction: rtl;
}
.exam-filter-side {
  gap: 0;
  padding: 6px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(65,47,29,.045);
  scrollbar-width: none;
}
.exam-filter-side::-webkit-scrollbar { display: none; }
.exam-filter-title {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 10px 9px;
  border-bottom: 1px solid #f1efe9;
  margin-bottom: 5px;
  color: var(--ink);
  font-size: 12.5px;
}
.exam-filter-title > svg { width: 17px; height: 17px; color: var(--orange); }
.exam-filter-title strong { font-weight: 900; }
.exam-filter-side .emf-search,
.exam-filter-side .qset-search { margin: 4px 4px 6px; }
.exam-filter-side .qset-filter-clear { margin: 2px 8px 5px; }
.exam-filter-side > .sd-section:last-child { border-bottom: 0; }

/* هر گروه فیلتر یک کارت مستقل و واضح؛ مشترک بین مجموعه سؤال و مدیریت آزمون */
.exam-filter-side .sd-section,
.exam-filter-side > .sd-section:last-child {
  margin: 6px 4px;
  border: 1px solid #ece2d5;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 3px 12px rgba(67,49,30,.035);
  overflow: hidden;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s var(--ease-soft);
}
.exam-filter-side .sd-section:hover {
  border-color: #e5d3bf;
  box-shadow: 0 6px 16px rgba(67,49,30,.055);
}
.exam-filter-side .sd-section[open] {
  border-color: #efc49e;
  background: #fffaf5;
  box-shadow: 0 8px 20px rgba(210,112,32,.075);
}
.exam-filter-side .sd-section > summary {
  min-height: 43px;
  padding: 10px 11px;
  border-inline-start: 3px solid transparent;
  background: linear-gradient(180deg, #fff, #fefcf9);
  font-size: 12px;
  font-weight: 900;
}
.exam-filter-side .sd-section[open] > summary {
  border-inline-start-color: transparent;
  background: linear-gradient(135deg, #fff7ee, #fffdf9);
  color: #7d491e;
}
.exam-filter-side .sd-section > summary svg {
  width: 14px;
  height: 14px;
  padding: 2px;
  border-radius: 6px;
  background: #f5efe7;
  color: #9a8b76;
}
.exam-filter-side .sd-section[open] > summary svg {
  background: #ffe9d5;
  color: var(--orange);
}
.exam-filter-side .sd-section .sd-body {
  padding: 8px 9px 10px;
  border-top: 1px solid #f2e9de;
  background: rgba(255,255,255,.72);
}
.exam-filter-side .sd-check-group { gap: 4px; }
.exam-filter-side .sd-check {
  min-height: 35px;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: #fff;
  color: #62594d;
}
.exam-filter-side .sd-check:hover {
  border-color: #f0dcc7;
  background: #fff8f1;
  transform: translateX(-1px);
}
.exam-filter-side .sd-check.on {
  border-color: #f0c49d;
  background: #fff1e4;
  color: #98501a;
  box-shadow: inset 0 0 0 1px rgba(255,107,24,.035);
}
.exam-filter-side .sd-check b {
  min-width: 22px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 7px;
  background: #f5efe7;
  color: #8f816e;
  font-size: 10px;
}
.exam-filter-side .sd-check.on b { background: #ffdcbf; color: #a65318; }
.exam-filter-side .emf-sel {
  min-width: 18px;
  height: 18px;
  background: linear-gradient(135deg, #ff8138, var(--orange));
  box-shadow: 0 3px 8px rgba(255,107,24,.2);
}
.exam-filter-side .qset-filter-clear {
  margin: 7px 8px 5px;
  padding: 7px 9px;
  border-radius: 9px;
  background: #f8f3ec;
}
.exam-filter-side .qset-filter-clear:hover { background: #fff0e3; }

/* فاصلهٔ واقعی بین کارت‌ها؛ جلوگیری از یکپارچه دیده‌شدن فیلترها */
.exam-filter-side {
  gap: 7px;
  padding: 8px;
  background: #faf6ef;
  border-color: #e9dfd2;
}
.exam-filter-side .exam-filter-title {
  margin: 0;
  padding: 10px 11px;
  border: 1px solid #ece2d5;
  border-radius: 12px;
  background: #fff;
}
.exam-filter-side .emf-search,
.exam-filter-side .qset-search {
  margin: 0;
  border-color: #e8dccd;
  box-shadow: 0 2px 8px rgba(67,49,30,.025);
}
.exam-filter-side .sd-section,
.exam-filter-side > .sd-section:last-child {
  margin: 0;
  border-color: #e5d7c7;
  box-shadow: 0 4px 13px rgba(67,49,30,.045);
}
.exam-filter-side .sd-section[open] {
  border-color: #edba8b;
  box-shadow: 0 7px 18px rgba(210,112,32,.09);
}
.exam-filter-side .qset-filter-clear {
  width: 100%;
  justify-content: center;
  margin: 0;
  border: 1px solid #eadfd2;
  background: #fff;
}

.exam-table {
  --exam-cols: minmax(88px, 1fr) 28px 44px 34px minmax(50px, 62px) 58px 60px 66px 166px;
  min-width: 0;
}
.exam-thead,
.exam-tr { gap: 5px; padding-inline: 9px; }
.exam-thead { min-height: 45px; padding-block: 8px; font-size: 10px; }
.exam-tr { min-height: 54px; padding-block: 7px; }
.exam-tr:nth-child(odd) { background: #fffefa; }
.exam-tr:hover { background: #fff8f0; }
.exam-td-name { gap: 7px; }
.exam-td-name > b { font-size: 12.75px; }
.exam-td-actions { gap: 5px; direction: rtl; }
.exam-td-actions .primary-button { height: 30px; border-radius: 9px; padding-inline: 11px; }
.exam-iconbtn { width: 30px; height: 30px; border-radius: 9px; }
.exam-iconbtn svg { width: 14px; height: 14px; }
.exam-retake-icon { color: #168878; border-color: #cfe6df; background: #f4fbf8; }
.exam-retake-icon:hover { color: #087766; border-color: #91ccba; background: #eaf8f4; }
.exam-combine-icon { color: #456eaa; border-color: #d9e3f1; background: #f7faff; }
.exam-combine-icon:hover { color: #285d9f; border-color: #a9c3e4; background: #eef5ff; }
.exam-run-icon { color: #a96517; background: #fffaf1; }
.exam-report-btn {
  order: 99;
  height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 0 8px;
  border-radius: 8px;
  font-size: 10px;
}

.exam-panel.exam-wizard { max-width: 980px; }
.exam-wizard-body {
  padding: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,253,249,.78));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
.ew-step-intro {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border: 1px solid #eee3d7;
  border-radius: 15px;
  background: linear-gradient(135deg, #fffaf4, #fff);
}
.ew-step-intro-icon {
  flex: none;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: var(--orange);
  background: var(--orange-soft);
}
.ew-step-intro-icon svg { width: 20px; height: 20px; }
.ew-step-intro > div { display: grid; gap: 3px; min-width: 0; }
.ew-step-intro > div > b { font-size: 13.5px; font-weight: 900; }
.ew-step-intro > div > span { color: var(--muted); font-size: 11.5px; font-weight: 700; line-height: 1.7; }
.ew-step-intro > small {
  margin-inline-start: auto;
  flex: none;
  padding: 5px 9px;
  border-radius: 999px;
  background: #f7f1e8;
  color: #7e725f;
  font-size: 10.5px;
  font-weight: 900;
}
.ew-booklets { gap: 16px; }
.ew-booklet {
  gap: 13px;
  padding: 0;
  overflow: hidden;
  border-color: #e8dece;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(71,52,33,.045);
}
.ew-bk-head {
  display: grid;
  grid-template-columns: 34px minmax(160px, 1fr) auto auto auto;
  gap: 10px;
  padding: 12px 14px;
  background: #fbf8f3;
  border-bottom: 1px solid #eee7dc;
}
.ew-bk-index {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--orange);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}
.ew-bk-name-wrap,
.ew-ls-field { display: grid; gap: 4px; min-width: 0; }
.ew-bk-name-wrap > span,
.ew-ls-field > span,
.ew-ls-time > span:first-child {
  color: #8d806e;
  font-size: 9.5px;
  font-weight: 900;
}
.ew-bk-name {
  width: 100%;
  min-width: 0;
  padding: 6px 9px;
  border-color: transparent;
  background: rgba(255,255,255,.72);
}
.ew-bk-name:focus { outline: 0; border-color: #f2a562; background: #fff; box-shadow: 0 0 0 3px rgba(255,101,25,.08); }
.ew-bk-stat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 9px;
  border: 1px solid #e9e0d4;
  border-radius: 10px;
  background: #fff;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
  white-space: nowrap;
}
.ew-bk-stat svg { width: 13px; height: 13px; color: #9b8a72; }
.ew-bk-stat b { color: var(--ink); }
.ew-lesson-list { gap: 8px; padding: 0 14px; }
.ew-lesson-row {
  display: grid;
  grid-template-columns: 22px 28px minmax(160px, 1fr) 184px 34px;
  gap: 9px;
  min-height: 62px;
  padding: 8px 10px;
  border-color: #eee7dc;
  border-radius: 13px;
  background: #fffdfa;
}
.ew-ls-name { width: 100%; min-width: 0; height: 34px; padding-block: 5px; }
.ew-ls-time { display: grid; align-items: center; gap: 4px; color: inherit; }
.ew-time-input {
  height: 34px;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 0 8px;
  border: 1px solid #e5dccb;
  border-radius: 10px;
  background: #fff;
}
.ew-time-input:focus-within { border-color: #f2a562; box-shadow: 0 0 0 3px rgba(255,101,25,.08); }
.ew-time-input svg { width: 13px; height: 13px; color: #9b8a72; }
.ew-ls-time .ew-time-input input {
  width: 46px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
}
.ew-time-input small { margin-inline-start: auto; color: var(--muted); font-size: 10px; font-weight: 800; }
.ew-mini.icon-only { width: 32px; padding: 0; }
.ew-add-lesson { margin: 0 14px 14px; padding: 8px 13px; background: #fffaf5; }
.ew-add-booklet {
  width: 100%;
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1.5px dashed #ddcbb6;
  border-radius: 15px;
  background: rgba(255,250,245,.62);
  color: var(--orange);
  font: inherit;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s var(--ease-soft);
}
.ew-add-booklet:hover { border-color: var(--orange); background: #fff5ea; transform: translateY(-1px); }
.ew-add-booklet > svg { width: 19px; height: 19px; }
.ew-add-booklet > span { display: grid; gap: 1px; text-align: start; }
.ew-add-booklet b { font-size: 12.5px; font-weight: 900; }
.ew-add-booklet small { color: #9a8b77; font-size: 10px; font-weight: 700; }
.ew-total-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
  background: #f8f5ef;
}
.ew-total-grid > span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  border: 1px solid #ece4d7;
  border-radius: 11px;
  background: #fff;
  color: #746956;
  font-size: 11.5px;
  font-weight: 800;
}
.ew-total-grid svg { width: 14px; height: 14px; color: #9b8a72; }

.ew-q-booklet {
  padding: 0;
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(71,52,33,.04);
}
.ew-q-bk-title {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  background: #fbf8f3;
  border-bottom: 1px solid #eee7dc;
}
.ew-q-bk-title > div { display: grid; gap: 2px; min-width: 0; }
.ew-q-bk-title > div b { font-size: 12.75px; font-weight: 900; }
.ew-q-bk-title > div small { color: var(--muted); font-size: 10.5px; font-weight: 700; }
.ew-q-bk-title > em {
  margin-inline-start: auto;
  min-width: 34px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #fff2e8;
  color: var(--orange);
  font-style: normal;
  font-size: 11px;
  font-weight: 900;
}
.ew-q-lesson {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 62px;
  margin: 9px 12px;
  padding: 9px 10px;
  border-color: #eee7dc;
  background: #fffdfa;
}
.ew-q-lesson.ready { border-color: #cfe7df; background: #fbfffd; }
.ew-q-state {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #f4efe7;
  color: #a1937f;
}
.ew-q-lesson.ready .ew-q-state { background: #eaf8f4; color: #168878; }
.ew-q-state svg { width: 16px; height: 16px; }
.ew-q-ls-main span { display: flex; align-items: center; gap: 7px; }
.ew-q-ls-main span em { color: #9a5a1f; font-style: normal; font-weight: 900; }
.ew-q-ls-main span i { width: 3px; height: 3px; border-radius: 50%; background: #c6b9a6; }
.ew-pick-button { min-height: 34px; padding-block: 6px; font-size: 11px; }
.ew-question-total {
  display: grid;
  gap: 9px;
  padding: 13px 14px;
  border: 1px solid #eadfce;
  border-radius: 14px;
  background: #fbf8f3;
}
.ew-question-total > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ew-question-total > div > span { color: #6d6252; font-size: 12px; font-weight: 900; }
.ew-question-total > div > b { color: var(--orange); font-size: 15px; font-weight: 900; }
.ew-question-total > div > b small { color: var(--muted); font-size: 10.5px; }
.ew-question-progress { height: 7px; overflow: hidden; border-radius: 999px; background: #eae3d8; }
.ew-question-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ff8a43, var(--orange)); transition: width .25s ease; }

/* زیر ۱۲۰۰px سایدبار فیلتر بالای جدول می‌رود تا جدول بدون اسکرول افقی جا شود */
@media (max-width: 900px) {
  .exam-manage-layout { grid-template-columns: 1fr; }
  .exam-filter-side { position: static; max-height: none; }
}
@media (max-width: 900px) {
  .ew-bk-head { grid-template-columns: 34px minmax(140px, 1fr) auto auto; }
  .ew-bk-head > .ew-mini { grid-column: -2 / -1; }
  .ew-lesson-row { grid-template-columns: 22px 28px minmax(130px, 1fr) 160px 34px; }
}
@media (max-width: 680px) {
  .exam-wizard-body { padding: 14px; }
  .ew-step-intro { align-items: flex-start; }
  .ew-step-intro > small { display: none; }
  .ew-bk-head { grid-template-columns: 32px minmax(0, 1fr) auto; }
  .ew-bk-stat { grid-row: 2; }
  .ew-lesson-row { grid-template-columns: 20px 26px minmax(0, 1fr) 32px; }
  .ew-ls-time { grid-column: 3 / -1; width: 100%; }
  .ew-total-grid { grid-template-columns: 1fr; }
  .ew-q-lesson { grid-template-columns: 32px minmax(0, 1fr); }
  .ew-q-ls-actions { grid-column: 2; justify-content: flex-start; }
}

/* ===== تعامل جستجو و آیکون ترکیب ===== */
.qset-search,
.sbank-search input {
  transition: border-color .18s ease, box-shadow .2s ease, background .18s ease, transform .18s var(--ease-soft);
}
.qset-search:focus-within {
  border-color: #ee9a55;
  background: #fffdf9;
  box-shadow: 0 0 0 4px rgba(255,107,24,.11), 0 8px 20px rgba(80,55,28,.07);
  transform: translateY(-1px);
}
.qset-search > svg,
.qset-search .qset-search-icon { transition: color .18s ease, transform .2s var(--ease-pop); }
.qset-search:focus-within > svg,
.qset-search:focus-within .qset-search-icon { color: var(--orange); transform: scale(1.12) rotate(-7deg); }
.sbank-search-icon {
  position: absolute; inset-inline-start: 11px; top: 50%; z-index: 2;
  width: 17px; height: 17px; transform: translateY(-50%);
  fill: none; stroke: #8c8273; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  pointer-events: none; transition: color .18s ease, stroke .18s ease, transform .2s var(--ease-pop);
}
.sbank-search input { padding-inline-start: 36px; padding-inline-end: 12px; outline: 0; }
.sbank-search:focus-within input {
  border-color: #ee9a55; background: #fffdf9;
  box-shadow: 0 0 0 4px rgba(255,107,24,.11), 0 8px 20px rgba(80,55,28,.07);
  transform: translateY(-1px);
}
.sbank-search:focus-within .sbank-search-icon { stroke: var(--orange); transform: translateY(-50%) scale(1.12) rotate(-7deg); }
@keyframes examMergeNudge { 0%,100% { transform: scale(1); } 45% { transform: translateY(-1px) scale(1.16); } 70% { transform: translateY(0) scale(1.08); } }
#examMergeBtn svg,
.exam-combine-icon svg { transition: transform .2s var(--ease-pop), color .18s ease; transform-origin: center; }
#examMergeBtn:hover svg,
.exam-combine-icon:hover svg { animation: examMergeNudge .55s var(--ease-pop); color: var(--orange); }
.exam-run-date { display: inline-grid; justify-items: center; gap: 1px; font-size: 9.5px; font-weight: 800; color: #7d7263; white-space: nowrap; letter-spacing: .2px; line-height: 1.4; }
.exam-run-date small { font-size: 8.5px; font-weight: 700; color: #a99e8c; }
/* شرکت مجدد: چرخش کامل فلش هنگام هاور */
.exam-retake-icon svg, .exam-run-icon svg { transition: transform .55s cubic-bezier(.34,1.2,.64,1); transform-origin: center; }
.exam-retake-icon:hover svg, .exam-run-icon:hover svg:has(use[href="#icon-refresh"]) { transform: rotate(360deg); }
/* سنجاق: هاور روی حالت آزاد → ژست سنجاق‌شدن؛ روی حالت سنجاق‌شده → تکان کوچک آزادشدن */
.exam-iconbtn[data-exam-pin] svg { transition: transform .3s var(--ease-pop); transform-origin: 62% 38%; }
.exam-iconbtn[data-exam-pin]:not(.on):hover svg { transform: rotate(-38deg) scale(1.12); }
.exam-iconbtn[data-exam-pin].on:hover svg { transform: rotate(14deg) scale(1.08); }
.exam-chip.attempts { background: #eaf8f4; color: #147b6b; direction: ltr; font-size: 10px; }

/* ===== انتخاب شرکت مجدد و تاریخچهٔ کارنامه‌ها ===== */
.exam-retake-modal, .exam-attempt-picker { display: grid; gap: 14px; }
.exam-retake-note, .exam-attempt-picker-head {
  padding: 12px 14px; border: 1px solid #eee3d7; border-radius: 13px;
  background: #fbf8f3; color: #706654; font-size: 12.5px; font-weight: 750;
}
.exam-retake-choices, .exam-attempt-list { display: grid; gap: 9px; }
.exam-retake-choice {
  width: 100%; display: grid; grid-template-columns: 42px minmax(0,1fr) 18px; align-items: center; gap: 11px;
  padding: 13px; border: 1px solid #e8dfd2; border-radius: 15px; background: #fff; color: var(--ink);
  font: inherit; text-align: start; cursor: pointer; transition: transform .18s var(--ease-soft), border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.exam-retake-choice:hover { transform: translateY(-2px); border-color: #efb27e; box-shadow: 0 10px 24px rgba(91,61,28,.08); background: #fffaf5; }
.exam-retake-choice.featured { border-color: #efc49e; background: #fffaf4; }
.exam-retake-choice > i { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: #f4efe7; color: #8a7c66; }
.exam-retake-choice.featured > i { background: #ffe9d5; color: var(--orange); }
.exam-retake-choice > i svg { width: 19px; height: 19px; }
.exam-retake-choice > span { display: grid; gap: 4px; }
.exam-retake-choice b { font-size: 13px; font-weight: 900; }
.exam-retake-choice small { color: var(--muted); font-size: 11px; line-height: 1.7; }
.exam-retake-choice > svg { width: 16px; height: 16px; color: #b1a591; }
.exam-attempt-picker-head { display: flex; align-items: center; justify-content: space-between; }
.exam-attempt-picker-head em { padding: 4px 10px; border-radius: 999px; background: #eaf8f4; color: #147b6b; font-style: normal; font-weight: 900; direction: ltr; }
.exam-attempt-row {
  display: grid; grid-template-columns: 34px minmax(0,1fr) auto 18px; align-items: center; gap: 10px;
  padding: 11px 12px; border: 1px solid #e9e0d4; border-radius: 13px; background: #fff; color: var(--ink); font: inherit; text-align: start; cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .16s var(--ease-soft);
}
.exam-attempt-row:hover { border-color: #efb27e; background: #fffaf4; transform: translateY(-1px); }
.exam-attempt-index { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: var(--orange); color: #fff; font-size: 12px; font-weight: 900; }
.exam-attempt-main, .exam-attempt-score { display: grid; gap: 3px; }
.exam-attempt-main b { font-size: 12.5px; }.exam-attempt-main small,.exam-attempt-score small { color: var(--muted); font-size: 10.5px; }
.exam-attempt-score { text-align: center; }.exam-attempt-score b { color: var(--orange); font-size: 15px; }
.exam-attempt-row > svg { width: 15px; height: 15px; color: #b1a591; }

/* ===== کارنامهٔ جامع ===== */
.rr-modal-head { align-items: center; }
.rr-modal-head > div:first-child { display: grid; gap: 3px; }
.rr-modal-head > div:first-child > span { color: var(--muted); font-size:12.5px; font-weight: 750; }
.rr-head-actions { display: flex; align-items: center; gap: 8px; }
.rr-attempt-select { display: flex; align-items: center; gap: 6px; padding: 3px 5px 3px 8px; border: 1px solid #e7ddd0; border-radius: 10px; background: #fffaf5; cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
/* حالت تعاملی روی کلِ کادر (نه فقط قسمت select) */
.rr-attempt-select:hover, .rr-attempt-select:focus-within { border-color: var(--orange); box-shadow: 0 0 0 2px #f8d6ac; background: #fffdf9; }
.rr-attempt-select > span { padding: 3px 7px; border-radius: 7px; background: #eaf8f4; color: #147b6b; font-size:12px; font-weight: 900; direction: ltr; }
.rr-attempt-select select {
  flex: 1;
  min-width: 0;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size:13px;
  font-weight: 800;
  cursor: pointer;
}
.rr-attempt-select::after {
  content: "";
  width: 7px;
  height: 7px;
  flex: none;
  border-inline-end: 1.7px solid currentColor;
  border-block-end: 1.7px solid currentColor;
  color: #6f675c;
  transform: rotate(45deg) translateY(-2px);
  pointer-events: none;
}
.rr-report-shell { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 14px; padding: 14px; background: #f8f5ef; min-height: 590px; }
.rr-tabs { position: sticky; top: 0; align-self: start; display: grid; gap: 6px; padding: 7px; border: 1px solid #e9dfd2; border-radius: 16px; background: #fff; box-shadow: 0 8px 22px rgba(70,51,31,.05); }
.rr-tabs button {
  display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 9px 10px; border: 0; border-radius: 11px; background: transparent; color: #776c5b;
  font: inherit; font-size:13px; font-weight: 850; text-align: start; cursor: pointer; transition: background .16s ease, color .16s ease, transform .16s var(--ease-soft);
}
.rr-tabs button:hover { background: #fff7ef; color: #9a5a1f; transform: translateX(-1px); }
.rr-tabs button.on { background: var(--orange); color: #fff; box-shadow: 0 8px 16px rgba(255,107,24,.18); }
.rr-tabs svg { width: 16px; height: 16px; }
.rr-report-content { min-width: 0; animation: ew-in .24s ease; }
.rr-overview,.rr-analysis,.rr-questions,.rr-answers,.rr-sheet,.rr-charts { display: grid; gap: 13px; }
.rr-info-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.rr-info-grid article { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 11px; border: 1px solid #e9dfd2; border-radius: 13px; background: #fff; }
.rr-info-grid article > i { flex: none; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: #fff0e3; color: var(--orange); }
.rr-info-grid article > i svg { width: 16px; height: 16px; }
.rr-info-grid article > span { min-width: 0; display: grid; gap: 3px; font-size:13px; font-weight: 900; }
.rr-info-grid article small { color: var(--muted); font-size:11.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rr-note { display:flex; align-items:center; gap:8px; padding:11px 13px; border:1px solid #efd9ae; border-radius:12px; background:#fff9ec; color:#846326; font-size:13px; font-weight:800; }.rr-note svg{width:16px;height:16px}
.rr-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 15px; border:1px solid #e9dfd2; border-radius:14px; background:#fff; }.rr-section-head h3{margin:0 0 3px;font-size:15px}.rr-section-head p{margin:0;color:var(--muted);font-size:12.5px;line-height:1.7}.rr-legend{display:flex;gap:6px}.rr-legend span{padding:4px 8px;border-radius:999px;font-size:11.5px;font-weight:900}.rr-legend .ok{background:#eaf8f4;color:#168878}.rr-legend .bad{background:#fdeceb;color:#c24a3a}.rr-legend .blank{background:#f1eee8;color:#847968}
.rr-tree { display:grid; gap:8px; }.rr-tree-node{border:1px solid #e6dccf;border-radius:13px;background:#fff;overflow:hidden}.rr-tree-node>summary{display:flex;align-items:center;gap:10px;padding:10px 12px;cursor:pointer;list-style:none}.rr-tree-node>summary::-webkit-details-marker{display:none}.rr-tree-node[open]>summary{background:#fff8f0;border-bottom:1px solid #eee1d3}.rr-tree-node>summary>svg{width:14px;height:14px;color:#9c8b73;transition:transform .18s ease}.rr-tree-node[open]>summary>svg{transform:rotate(180deg)}.rr-tree-name{display:flex;align-items:center;gap:8px;min-width:120px}.rr-tree-name>i{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#f4efe7;color:#8c7f6d;font-style:normal;font-size:12px;font-weight:900}.rr-tree-name>span{display:grid;gap:1px}.rr-tree-name small{color:var(--muted);font-size:10.5px;font-weight:800}.rr-tree-name b{font-size:13px}.rr-tree-metrics{margin-inline-start:auto;display:flex;align-items:center;justify-content:flex-end;gap:4px;flex-wrap:wrap}.rr-metric{padding:3px 6px;border-radius:7px;background:#f4f1eb;color:#776d5e;font-size:10.5px;font-weight:750;white-space:nowrap}.rr-metric b{font-size:12px}.rr-metric.ok{background:#eaf8f4;color:#168878}.rr-metric.bad{background:#fdeceb;color:#c24a3a}.rr-metric.percent{background:#fff0e3;color:#a85b1b}.rr-metric.rank{background:#eef3fc;color:#4268a5}.rr-tree-children{display:grid;gap:7px;padding:8px 10px 10px;background:#fdfbf8}.rr-tree-node.depth-1{margin-inline-start:9px}.rr-tree-node.depth-2{margin-inline-start:18px}.rr-tree-node.depth-3,.rr-tree-node.depth-4,.rr-tree-node.depth-5{margin-inline-start:26px}
.rr-questions{display:grid!important;grid-template-columns:272px minmax(0,1fr);gap:10px;align-items:start}.rr-qmain{display:grid;gap:9px;min-width:0}.rr-qside{position:sticky;top:0;border:1px solid #e6dccf;border-radius:14px;background:#fff;overflow:hidden}.rrft-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;background:#f7f3ed;border-bottom:1px solid #eee1d3;color:#756a5a;font-size:10.5px;font-weight:900}.rrft-head button{border:1px solid #eadfd2;border-radius:8px;background:#fff;color:#786d5e;font:inherit;font-size:9px;font-weight:850;padding:4px 8px;cursor:pointer}.rr-filter-tree{max-height:58vh;overflow:auto;padding:7px}.rrft-row{display:flex;align-items:center;padding-inline-start:calc(var(--rrft-depth,0)*13px)}.rrft-caret{width:20px;height:26px;flex:none;display:grid;place-items:center;border:0;background:transparent;color:#9c8b73;cursor:pointer}.rrft-caret svg{width:11px;height:11px;transform:rotate(90deg);transition:transform .15s ease}.rrft-caret.open svg{transform:rotate(0deg)}.rrft-caret.hidden{visibility:hidden}.rrft-pick{flex:1;min-width:0;display:flex;align-items:center;gap:7px;padding:4px 7px;border:0;border-radius:9px;background:transparent;color:var(--ink);font:inherit;cursor:pointer;text-align:start}.rrft-pick:hover{background:#faf5ee}.rrft-check{width:15px;height:15px;flex:none;display:grid;place-items:center;border:1.5px solid #d6cab8;border-radius:5px;background:#fff}.rrft-row.on .rrft-check{background:var(--orange);border-color:var(--orange)}.rrft-row.on .rrft-check::after{content:"";width:7px;height:4px;border:1.6px solid #fff;border-top:0;border-inline-end:0;transform:rotate(-45deg) translateY(-1px)}.rrft-row.implied .rrft-check{background:#fde8d5;border-color:#f3cba4}.rrft-row.on>.rrft-pick{background:#fff3e6}.rrft-info{display:grid;min-width:0}.rrft-info small{color:var(--muted);font-size:8px;font-weight:800}.rrft-info b{font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rrft-cnt{margin-inline-start:auto;flex:none;padding:2px 6px;border-radius:7px;background:#f4f1eb;color:#776d5e;font-size:8.5px;font-weight:850}.rrft-row.on .rrft-cnt{background:#fff;color:#a85b1b}.rrft-chips{display:flex;flex-wrap:wrap;gap:6px}.rrft-chips button{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border:1px solid #f3cba4;border-radius:999px;background:#fff3e6;color:#a85b1b;font:inherit;font-size:9.5px;font-weight:850;cursor:pointer}.rrft-chips button small{color:#c98d54;font-size:8px}.rrft-chips button svg{width:10px;height:10px}.rr-analysis-tree{border:1px solid #e6dccf;border-radius:14px;background:#fff;padding:9px 8px;overflow-x:auto}.rra-row{display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:10px}.rra-row[data-rra-open]{cursor:pointer}.rra-row[data-rra-open]:hover{background:#faf5ee}.rra-row.open>.rrft-caret svg{transform:rotate(0deg)}.rra-name{flex:1;min-width:0}.rra-name b{font-size:11px}.rra-row .rr-tree-metrics{flex:none;margin-inline-start:auto;display:grid;grid-auto-flow:column;grid-auto-columns:var(--rra-col,66px);align-items:center;gap:4px}.rra-row .rr-metric{text-align:center;padding-inline:3px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rra-row .rr-metric b{font-size:11.5px}.rra-children{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s cubic-bezier(.33,1,.68,1)}.rra-children.open{grid-template-rows:1fr}.rra-kids{overflow:hidden;min-height:0;margin-inline-start:17px;padding-inline-start:6px;border-inline-start:1px dashed #e9decd;opacity:0;transform:translateY(-5px);transition:opacity .26s ease,transform .32s cubic-bezier(.33,1,.68,1)}.rra-children.open>.rra-kids{opacity:1;transform:none}.rrft-children{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s cubic-bezier(.33,1,.68,1)}.rrft-children.open{grid-template-rows:1fr}.rrft-kids{overflow:hidden;min-height:0;opacity:0;transform:translateY(-5px);transition:opacity .26s ease,transform .32s cubic-bezier(.33,1,.68,1)}.rrft-children.open>.rrft-kids{opacity:1;transform:none}.rr-question-count{color:var(--muted);font-size:12.5px;font-weight:800}.rr-question-table{border:1px solid #e5dccf;border-radius:14px;overflow:auto;background:#fff}.rr-qrow{min-width:790px;display:grid;grid-template-columns:52px 128px 56px minmax(230px,1.7fr) 80px;align-items:center;gap:7px;padding:9px 10px;border:0;border-top:1px solid #f0e8dd;background:#fff;color:var(--ink);font:inherit;font-size:12.5px;text-align:center;width:100%}.rr-question-table:has(.rr-qrow>span:nth-child(7)) .rr-qrow{grid-template-columns:48px 118px 52px minmax(200px,1.5fr) 72px 100px 80px}.rr-qrow.head{position:sticky;top:0;z-index:2;border-top:0;background:#f7f3ed;color:#756a5a;font-weight:900}.rr-qrow:not(.head){cursor:pointer;transition:background .14s ease}.rr-qrow:not(.head):hover{background:#fffaf4}.rr-qrow.correct{box-shadow:inset -3px 0 #1aa58e}.rr-qrow.wrong{box-shadow:inset -3px 0 #ef5f4e}.rr-qrow.blank{box-shadow:inset -3px 0 #c9c0b2}.rr-qrow>span{min-width:0;display:flex;align-items:center;justify-content:center;gap:4px}.rr-qrow>span:first-child{display:grid}.rr-qrow>span:first-child b{font-size:14.5px}.rr-qrow small{color:var(--muted);font-size:10.5px}.rr-qopts i{width:24px;height:24px;display:grid;place-items:center;border:1px solid #ddd3c5;border-radius:8px;font-style:normal}.rr-qopts i.key{border-color:#6bc7aa;color:#168878}.rr-qopts i.picked{background:#f2eee7;box-shadow:inset 0 0 0 2px #8d806f}.rr-qopts i.key.picked{background:#1aa58e;color:#fff;box-shadow:none}.rr-path{display:grid!important;justify-content:start!important;justify-items:start;text-align:start;gap:2px}.rr-path b,.rr-path small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rr-path small{font-size:11px}.rr-qrow.head .rr-path{font-weight:900}.rr-cohort{position:relative;padding:4px 7px;border-radius:8px;background:#eef4fd;color:#4268a5;font-weight:900}.rr-cohort em{position:absolute;inset-block-end:calc(100% + 7px);inset-inline-start:50%;width:210px;padding:9px;border:1px solid #d8e2f0;border-radius:10px;background:#fff;box-shadow:0 12px 26px rgba(40,56,79,.16);color:#514a40;font-style:normal;font-size:11px;line-height:1.8;text-align:start;opacity:0;pointer-events:none;transform:translateX(50%) translateY(4px);transition:.15s;z-index:6}.rr-cohort:hover em,.rr-cohort:focus em{opacity:1;transform:translateX(50%) translateY(0)}.rr-empty{padding:40px;text-align:center;color:var(--muted);font-size:13.5px}
.rr-answers{gap:12px}.rr-answer-wrap{display:grid;gap:7px}.rr-answer-ctx{display:flex;align-items:center;gap:8px}.rr-answer-ctx b{font-size:13.5px}.rr-answer-ctx small{color:var(--muted);font-size:12px;font-weight:800}.rr-answers .sq-item{margin:0}.rr-answer-card{border:1px solid #e5dccf;border-radius:15px;background:#fff;overflow:hidden}.rr-answer-card header{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#faf7f2;border-bottom:1px solid #ede4d8}.rr-answer-card header>b{font-size:13.5px}.rr-answer-card header>small{color:var(--muted);font-size:11.5px}.rr-answer-card header>button{margin-inline-start:auto;display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;color:var(--orange);font:inherit;font-size:12px;font-weight:900;cursor:pointer}.rr-answer-card header>button svg{width:12px;height:12px}.rr-status{padding:4px 8px;border-radius:999px;font-size:11px;font-weight:900}.rr-status.correct{background:#eaf8f4;color:#168878}.rr-status.wrong{background:#fdeceb;color:#c24a3a}.rr-status.blank{background:#f1eee8;color:#847968}.rr-answer-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(230px,.7fr);gap:12px;padding:13px}.rr-explanation{padding:11px;border:1px solid #eee3d7;border-radius:12px;background:#fffaf5;font-size:13px;line-height:1.9}.rr-explanation>b{display:block;margin-bottom:7px;color:#168878}
.rr-sheet-legend{display:flex;gap:7px;flex-wrap:wrap}.rr-sheet-legend span{padding:4px 8px;border-radius:999px;font-size:11px;font-weight:900}.rr-sheet-legend .correct{background:#eaf8f4;color:#168878}.rr-sheet-legend .wrong{background:#fdeceb;color:#c24a3a}.rr-sheet-legend .blank{background:#f1eee8;color:#847968}.rr-sheet-legend .key{background:#fff0e3;color:#a85b1b}.rr-answer-sheet{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:7px}.rr-sheet-cell{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:6px;padding:6px 8px;border:1px solid #e5dccf;border-radius:10px;background:#fff;color:var(--ink);font:inherit;cursor:pointer}.rr-sheet-cell.correct{border-color:#bfe3d8;background:#fbfffd}.rr-sheet-cell.wrong{border-color:#f1ccc7;background:#fffdfd}.rr-sheet-cell.blank{background:#faf8f4}.rr-sheet-cell>b{font-size:13px}.rr-sheet-cell>span{display:flex;gap:4px;justify-content:flex-end}.rr-sheet-cell i{width:23px;height:23px;display:grid;place-items:center;border:1px solid #ded4c6;border-radius:50%;font-style:normal;font-size:11px}.rr-sheet-cell i.key{border-color:#1aa58e;color:#168878}.rr-sheet-cell i.picked{background:#8c8172;color:#fff}.rr-sheet-cell i.key.picked{background:#1aa58e;color:#fff}
.rr-charts{gap:12px}.rr-chart-card{padding:14px;border:1px solid #e5dccf;border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(70,51,31,.04)}.rr-chart-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.rr-chart-head>div:first-child{display:grid;gap:3px}.rr-chart-head b{font-size:14px}.rr-chart-head span{color:var(--muted);font-size:11.5px}.rr-time-legend{display:flex;align-items:center;gap:9px}.rr-time-legend span{display:inline-flex;align-items:center;gap:4px}.rr-time-legend i{width:8px;height:8px;border-radius:3px}.rr-time-legend .correct i{background:#1aa58e}.rr-time-legend .wrong i{background:#ef5f4e}.rr-time-legend .blank i{background:#e3a53d}.rr-time-lessons{display:grid;gap:12px}.rr-time-lesson{min-width:0;padding:11px 12px 0;border:1px solid #eee4d7;border-radius:13px;background:#fdfbf8;overflow:hidden}.rr-time-lesson>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 2px 9px}.rr-time-lesson>header>div{display:flex;align-items:center;gap:7px}.rr-time-lesson>header b{font-size:13px}.rr-time-lesson>header span{padding:3px 7px;border-radius:999px;background:#fff0e3;color:#a85b1b;font-size:10.5px;font-weight:900}.rr-time-lesson>header small{color:var(--muted);font-size:11px;font-weight:750}.rr-time-chart{direction:ltr;height:190px;display:flex;align-items:flex-end;gap:4px;padding:18px 8px 0;border-bottom:1px solid #dfd5c7;background:linear-gradient(180deg,#fff,#fdfaf6);overflow-x:auto}.rr-time-bar{flex:1;min-width:12px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;padding:0;border:0;background:transparent;cursor:pointer}.rr-time-bar i{display:block;width:100%;max-width:22px;min-height:5px;border-radius:5px 5px 2px 2px;background:#c9c0b2;transition:transform .15s ease,filter .15s ease}.rr-time-bar.correct i{background:#1aa58e}.rr-time-bar.wrong i{background:#ef5f4e}.rr-time-bar.blank i{background:#e3a53d}.rr-time-bar:hover i{filter:brightness(.94);transform:scaleX(1.12)}.rr-time-bar b{font-size:10px;color:#7e7465}.rr-chart-switches{display:flex!important;flex-direction:row!important;gap:10px!important}.rr-chart-switches label{display:flex;align-items:center;gap:5px;color:#675e50;font-size:11px;font-weight:800}.rr-chart-switches input{accent-color:var(--orange)}.rr-chart-switches i{width:8px;height:8px;border-radius:50%}.rr-chart-switches i.answered{background:#ef8b3b}.rr-chart-switches i.correct{background:#1aa58e}.rr-line-chart{direction:ltr;width:100%;height:230px;overflow:visible}.rr-line-chart .grid{fill:none;stroke:#eee6dc;stroke-width:1}.rr-line-chart .series{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;transition:opacity .18s ease}.rr-line-chart .series.answered{stroke:#ef8b3b}.rr-line-chart .series.correct{stroke:#1aa58e}.rr-line-chart .series.hidden{opacity:0}.rr-line-chart text{font-size:12px;fill:#8d8273;text-anchor:middle}.rr-difficulty-chart{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}.rr-diff-gauge{display:grid;gap:9px;padding:13px;border:1px solid color-mix(in srgb,var(--rr-diff-color) 22%,#e8ded1);border-radius:15px;background:linear-gradient(180deg,color-mix(in srgb,var(--rr-diff-color) 5%,#fff),#fff);box-shadow:0 7px 18px rgba(62,48,34,.04)}.rr-diff-gauge>header{display:flex;align-items:center;justify-content:space-between;gap:10px}.rr-diff-gauge>header b{font-size:13.5px}.rr-diff-gauge>header strong{color:var(--rr-diff-color);font-size:19px;font-weight:950}.rr-semi-gauge{position:relative;width:min(190px,90%);height:98px;margin:2px auto 0;overflow:hidden}.rr-semi-gauge::before{content:"";position:absolute;inset:0 auto auto 0;width:100%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 270deg,var(--rr-diff-color) 0 calc(var(--rr-diff-rate)*1.8deg),#ece8e2 0 180deg,transparent 0)}.rr-semi-gauge::after{content:"";position:absolute;inset:20px 20px auto;width:calc(100% - 40px);aspect-ratio:1;border-radius:50%;background:#fff}.rr-semi-gauge>i{position:absolute;z-index:2;inset:auto auto 3px 50%;width:40%;height:2px;border-radius:2px;background:var(--rr-diff-color);transform-origin:left center;transform:rotate(calc(180deg + var(--rr-diff-rate)*1.8deg));box-shadow:0 1px 2px rgba(0,0,0,.12)}.rr-semi-gauge>span{position:absolute;z-index:3;inset:auto auto 0 calc(50% - 5px);width:10px;height:10px;border:3px solid var(--rr-diff-color);border-radius:50%;background:#fff}.rr-semi-gauge small{position:absolute;z-index:3;bottom:0;color:#877c6e;font-size:10px;font-weight:800}.rr-semi-gauge .start{left:0}.rr-semi-gauge .end{right:0}.rr-diff-gauge>p{margin:0;color:#756a5b;font-size:11.5px;font-weight:800;text-align:center}.rr-diff-gauge>footer{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding-top:9px;border-top:1px solid #eee6dc}.rr-diff-gauge>footer span{display:flex;align-items:center;justify-content:center;gap:4px;color:#746a5c;font-size:10.5px;font-weight:750}.rr-diff-gauge>footer span>i{width:6px;height:6px;border-radius:50%}.rr-diff-gauge>footer .ok>i{background:#1aa58e}.rr-diff-gauge>footer .bad>i{background:#ef5f4e}.rr-diff-gauge>footer .blank>i{background:#c9c0b2}.rr-diff-gauge>footer b{font-size:12px}
@media(max-width:900px){.rr-report-shell{grid-template-columns:1fr}.rr-tabs{position:static;display:flex;overflow:auto}.rr-tabs button{flex:none}.rr-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rr-questions{grid-template-columns:1fr}.rr-qside{position:static}.rr-filter-tree{max-height:250px}.rr-answer-sheet{grid-template-columns:repeat(2,minmax(160px,1fr))}.rr-answer-body{grid-template-columns:1fr}}
@media(max-width:560px){.rr-report-shell{padding:9px;min-height:0}.rr-tabs button span{display:none}.rr-tabs button{min-width:40px;justify-content:center}.rr-info-grid{grid-template-columns:1fr}.rr-filter-tree{max-height:210px}.rr-answer-sheet{grid-template-columns:1fr}.rr-tree-node.depth-1,.rr-tree-node.depth-2,.rr-tree-node.depth-3,.rr-tree-node.depth-4,.rr-tree-node.depth-5{margin-inline-start:5px}.rr-tree-node>summary{align-items:flex-start;flex-wrap:wrap}.rr-tree-metrics{width:100%;justify-content:flex-start}.rra-row{flex-wrap:wrap}.rra-kids{margin-inline-start:8px;padding-inline-start:4px}.rr-attempt-select{display:none}.exam-attempt-row{grid-template-columns:32px minmax(0,1fr) 16px}.exam-attempt-score{grid-column:2}.rr-chart-head{flex-direction:column}.rr-time-chart{overflow-x:auto}.rr-time-bar{min-width:12px}}

/* جزئیات تعاملی نمودار زمان و پاسخبرگِ چاپی */
.rr-time-chart { display: grid; grid-template-columns: repeat(var(--rr-time-capacity), minmax(28px,36px)); justify-content: start; align-items: end; gap: 8px; height: 196px; padding: 44px 15px 4px; overflow-x: auto; overflow-y: hidden; }
.rr-time-bar { position: relative; min-width: 0; width: 100%; }
.rr-time-bar i { width: min(22px,100%); }
.rr-time-tooltip { position: absolute; z-index: 7; left: 50%; bottom: 27px; min-width: 148px; display: grid; gap: 5px; padding: 9px 10px; border: 1px solid #ded4c7; border-radius: 10px; background: rgba(255,255,255,.98); box-shadow: 0 10px 22px rgba(54,40,25,.16); color: #574c3e; font-size:11px; text-align: start; direction: rtl; opacity: 0; pointer-events: none; transform: translate(-50%,6px); transition: opacity .14s ease, transform .14s ease; }
.rr-time-tooltip::after { content:""; position:absolute; inset:auto auto -5px 50%; width:8px; height:8px; border-right:1px solid #ded4c7; border-bottom:1px solid #ded4c7; background:#fff; transform:translateX(-50%) rotate(45deg); }
.rr-time-tooltip>strong { color: var(--ink); font-size:12px; }.rr-time-tooltip>span { display:flex; align-items:center; justify-content:space-between; gap:9px; }.rr-time-tooltip small { color:var(--muted); font-size:10.5px; }.rr-time-tooltip b { color:var(--ink); font-size:11.5px; }.rr-time-tooltip>.correct{color:#168878}.rr-time-tooltip>.wrong{color:#c24a3a}.rr-time-tooltip>.blank{color:#867b6c}.rr-time-bar:hover .rr-time-tooltip,.rr-time-bar:focus-visible .rr-time-tooltip { opacity: 1; transform: translate(-50%,0); }.rr-time-bar:focus-visible { outline: 2px solid #ee9a55; outline-offset: 3px; border-radius: 7px; }

.rr-sheet { display: grid; gap: 11px; }.rr-sheet-summary { display:flex; align-items:stretch; gap:7px; direction:rtl; }.rr-sheet-summary>span { flex:1; display:grid; gap:3px; padding:9px 10px; border:1px solid #e8dfd2; border-radius:10px; background:#fff; text-align:center; }.rr-sheet-summary small { color:var(--muted); font-size:10.5px; font-weight:800; }.rr-sheet-summary b { color:#665c4e; font-size:15px; font-weight:950; }.rr-sheet-summary .correct{background:#f5fdfa;border-color:#cfe8df}.rr-sheet-summary .correct b{color:#168878}.rr-sheet-summary .wrong{background:#fff9f8;border-color:#f1d4cf}.rr-sheet-summary .wrong b{color:#c24a3a}.rr-sheet-summary .blank{background:#fbfaf7}.rr-answer-sheet { direction:ltr; display:grid; grid-template-columns:repeat(auto-fill,minmax(158px,186px)); gap:8px; align-items:start; padding:2px; }.rr-sheet-column { overflow:hidden; border:1px solid #d8d0c4; border-radius:5px; background:#fff; box-shadow:none; }.rr-sheet-question { width:100%; display:grid; grid-template-columns:26px repeat(4,1fr); align-items:center; gap:4px; min-height:31px; padding:4px 6px; border:0; border-top:1px dashed #ded7cc; background:#fff; color:var(--ink); font:inherit; cursor:pointer; text-align:center; transition:background .14s ease,transform .14s ease; }.rr-sheet-question:first-of-type { border-top:0; }.rr-sheet-question:hover { background:#fff9f2; }.rr-sheet-question:focus-visible { position:relative; z-index:2; outline:2px solid #ee9a55; outline-offset:-2px; }.rr-sheet-question>b { font-size:12px; font-weight:950; }.rr-sheet-question>i { width:20px; height:20px; justify-self:center; display:grid; place-items:center; border:1px solid #cfc6ba; border-radius:4px; background:#fff; color:#776c5d; font-size:10px; font-style:normal; font-weight:850; }.rr-sheet-question .key { border-color:#d99a31; color:#9b6818; box-shadow:inset 0 0 0 1px #fff7e9; }.rr-sheet-question.correct .picked { border-color:#1aa58e; background:#1aa58e; color:#fff; box-shadow:none; }.rr-sheet-question.wrong .picked { border-color:#ef5f4e; background:#ef5f4e; color:#fff; box-shadow:none; }.rr-sheet-question.blank { background:#fcfbf9; }.rr-sheet-question.blank>i { opacity:.82; }
@media(max-width:760px){.rr-sheet-summary{flex-wrap:wrap}.rr-sheet-summary>span{min-width:calc(50% - 4px)}}@media(max-width:480px){.rr-time-chart{grid-template-columns:repeat(var(--rr-time-capacity),30px)}}

/* ===== نمودار زمانِ هر سؤال (بازطراحی) + تولتیپ شناورِ مرکزی جلوی صفحه ===== */
.rr-time-card { position: relative; }
.rr-time-scroll { overflow-x: auto; overflow-y: visible; border-bottom: 1px solid #e6dcce; border-radius: 0 0 4px 4px; background: linear-gradient(180deg,#fffdfa,#fbf7f1); }
.rr-time-chart { display: grid; grid-template-columns: repeat(var(--rr-time-capacity), minmax(14px,1fr)); grid-auto-rows: 150px; justify-content: stretch; align-items: end; column-gap: 4px; row-gap: 12px; width: 100%; min-width: max-content; height: auto; padding: 16px 14px 8px; overflow: visible; background: none; border: 0; }
.rr-time-bar { position: relative; height: 150px; min-width: 0; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.rr-time-bar i { display: block; width: 100%; max-width: 20px; min-height: 6px; border-radius: 6px 6px 3px 3px; background: linear-gradient(180deg,#d3cabb,#c2b8a7); transition: transform .16s ease, filter .16s ease, box-shadow .16s ease; }
.rr-time-bar.correct i { background: linear-gradient(180deg,#33c0a6,#159683); }
.rr-time-bar.wrong i { background: linear-gradient(180deg,#f5745f,#e04b39); }
.rr-time-bar.blank i { background: linear-gradient(180deg,#eab861,#dd9a34); }
.rr-time-bar b { font-size:10px; color: #8b8071; font-weight: 800; }
.rr-time-bar:hover i, .rr-time-bar:focus-visible i { filter: brightness(1.03); transform: translateY(-2px) scaleX(1.06); box-shadow: 0 6px 14px rgba(70,50,29,.16); }
.rr-time-bar:focus-visible { outline: 0; }
.rr-time-float { position: absolute; z-index: 40; top: 0; left: 0; min-width: 118px; display: grid; gap: 4px; padding: 8px 10px; border: 1px solid #e6dcce; border-radius: 11px; background: rgba(255,255,255,.99); box-shadow: 0 12px 28px rgba(54,40,25,.2); color: #574c3e; font-size:11px; text-align: start; direction: rtl; opacity: 0; pointer-events: none; transform: translateY(3px) scale(.9); transform-origin: bottom center; transition: opacity .15s ease, transform .17s cubic-bezier(.34,1.3,.64,1); }
.rr-time-float.on { opacity: 1; transform: translateY(0) scale(1); }
.rr-time-float strong { color: var(--ink); font-size:12.5px; }
.rr-time-float .rr-tf-badge { justify-self: start; padding: 1px 8px; border-radius: 999px; font-size:10.5px; font-weight: 900; }
.rr-tf-badge.correct { background: #e8f7f2; color: #147c6b; } .rr-tf-badge.wrong { background: #fdecea; color: #c8452f; } .rr-tf-badge.blank { background: #f4efe6; color: #8a7c5f; }
.rr-time-float .rr-tf-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.rr-time-float .rr-tf-row small { color: var(--muted); font-size:10.5px; } .rr-time-float .rr-tf-row b { color: var(--ink); font-size:12px; }

/* ===== نمودار زیرمجموعه‌ای «مشاهده شده / پاسخ داده / درست زده» در طول آزمون ===== */
.rr-timeline-wrap { position: relative; }
.rr-area-chart { direction: ltr; width: 100%; height: 240px; overflow: visible; display: block; }
.rr-area-chart .grid { fill: none; stroke: #efe7dc; stroke-width: 1; }
.rr-area-chart .rr-area { stroke: none; transition: opacity .2s ease; }
.rr-area-chart .rr-area.seen { fill: url(#rr-tl-seen-fill); }
.rr-area-chart .rr-area.answered { fill: url(#rr-tl-answered-fill); }
.rr-area-chart .rr-area.correct { fill: url(#rr-tl-correct-fill); }
.rr-area-chart .rr-edge { fill: none; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; transition: opacity .2s ease; }
.rr-area-chart .rr-edge.seen { stroke: #858c92; } .rr-area-chart .rr-edge.answered { stroke: #e0761f; } .rr-area-chart .rr-edge.correct { stroke: #12907b; }
.rr-area-chart .rr-area.hidden, .rr-area-chart .rr-edge.hidden { opacity: 0; }
.rr-area-chart text { font-size:12px; fill: #9a8f7f; text-anchor: middle; }
/* اعداد دقیقهٔ نمودار تجمعی: HTML جدا از SVG تا با کشیده‌شدن SVG (preserveAspectRatio:none) دفرمه نشوند */
.rr-bh-xlabels { position: relative; height: 15px; margin-top: -21px; direction: ltr; pointer-events: none; }
.rr-bh-xlabels span {
  position: absolute; top: 0; transform: translateX(-50%);
  font-size:12px; font-weight: 700; color: #9a8f7f; line-height: 1; white-space: nowrap;
}
.rr-tl-cursor line { stroke: #b7ab98; stroke-width: 1.2; stroke-dasharray: 3 3; }
.rr-tl-cursor circle { stroke: #fff; stroke-width: 2; }
.rr-tl-cursor circle.seen { fill: #858c92; } .rr-tl-cursor circle.answered { fill: #e0761f; } .rr-tl-cursor circle.correct { fill: #12907b; }
.rr-tl-cursor circle.off { display: none; }
.rr-tl-hit { cursor: crosshair; }
.rr-tl-tip { position: absolute; z-index: 40; top: 6px; left: 0; min-width: 150px; display: grid; gap: 4px; padding: 9px 11px; border: 1px solid #e6dcce; border-radius: 12px; background: rgba(255,255,255,.99); box-shadow: 0 12px 28px rgba(54,40,25,.2); color: #574c3e; direction: rtl; text-align: start; opacity: 0; pointer-events: none; transform: translateY(-4px) scale(.94); transform-origin: top center; transition: opacity .15s ease, transform .16s cubic-bezier(.34,1.3,.64,1); }
.rr-tl-tip.on { opacity: 1; transform: translateY(0) scale(1); }
.rr-tl-tip strong { color: var(--ink); font-size:12.5px; margin-bottom: 1px; }
.rr-tl-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; font-size:11px; }
.rr-tl-row small { color: var(--muted); display: inline-flex; align-items: center; gap: 5px; }
.rr-tl-row small::before { content: ""; width: 8px; height: 8px; border-radius: 3px; background: #c9c0b2; }
.rr-tl-row.seen small::before { background: #858c92; } .rr-tl-row.answered small::before { background: #e0761f; } .rr-tl-row.correct small::before { background: #12907b; }
.rr-tl-row b { color: var(--ink); font-size:12.5px; font-weight: 900; }
.rr-tl-row.rate { border-top: 1px dashed #eee3d5; padding-top: 4px; margin-top: 1px; }
.rr-tl-row.rate small::before { display: none; }
.rr-chart-switches i.seen { background: #858c92; }

/* آمار درختی فشرده‌تر: جا برای میانگین زمان هر گره */
.rr-metric.avg { background:#eef3fc; color:#4268a5; }

/* ===== ریزتنظیم لیست آزمون‌ها و مرحله دوم سازنده شخصی ===== */
/* ستون‌ها کشسان و کوچک‌شونده‌اند تا کل جدول بدون اسکرول افقی در عرض موجود جا شود */
.exam-table {
  /* فشرده‌شده تا کل جدول بدون اسکرول افقی جا شود: درست/غلط/نزده و تاریخ (دوخطی) باریک‌تر */
  --exam-cols:
    minmax(90px, 1.2fr)
    minmax(26px, .3fr)
    minmax(40px, .46fr)
    minmax(32px, .38fr)
    minmax(54px, .74fr)
    minmax(56px, .66fr)
    minmax(58px, .68fr)
    minmax(52px, .6fr)
    /* با افزوده‌شدن آیکون «آزمون مشابه»، کف ستون باید جای ۶ آیکون + دکمهٔ کارنامه
       را داشته باشد؛ وگرنه محتوا سرریز می‌کند و کارنامه به لبهٔ ردیف می‌چسبد */
    minmax(226px, .9fr);
  /* ستون آخر نباید max-content باشد: هر ردیف یک گرید مستقل است و عرضِ وابسته به محتوا
     در هر ردیف متفاوت حل می‌شود و سلول‌ها را نسبت به سرستون‌ها جابه‌جا می‌کند */
  width: 100%;
  min-width: 0;
}
.exam-thead,
.exam-tr {
  grid-template-columns: var(--exam-cols);
  column-gap: 7px;
  padding-inline: 12px;
}
.exam-thead {
  min-height: 48px;
  font-size: 10px;
}
/* سرستون‌ها نباید ستون را گشاد کنند؛ در تنگنا سه‌نقطه می‌شوند */
.exam-thead > span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exam-tr {
  min-height: 62px;
  padding-block: 9px;
}
.exam-td-name {
  align-content: center;
  gap: 5px;
}
.exam-name-line > b {
  font-size: 13px;
}
.exam-name-sub > small {
  font-size: 10px;
}
.exam-td-org {
  color: #655b4d;
  font-size: 11.2px;
  font-weight: 850;
  line-height: 1.65;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: normal;
}
.exam-cwb {
  justify-content: center;
}
.exam-td-actions {
  justify-content: center;
  gap: 3px;
  flex-wrap: nowrap; /* همهٔ اجزای فعالیت‌ها همیشه در یک ردیف */
}
/* آیکون‌ها فشرده‌تر تا با دکمهٔ کارنامه در ستون فعالیت‌ها (۱۹۰px) جا شوند */
.exam-td-actions .exam-iconbtn { width: 25px; height: 25px; }
.exam-td-actions .exam-iconbtn svg { width: 13px; height: 13px; }
.exam-td-actions .primary-button { height: 26px; padding-inline: 9px; font-size: 10px; }
.exam-td-actions .primary-button,
.exam-report-btn,
.exam-iconbtn {
  box-shadow: 0 3px 10px rgba(73, 52, 30, .035);
}

.ew-booklet {
  border-radius: 16px;
}
.ew-bk-head {
  grid-template-columns: 40px minmax(240px, 1fr) max-content max-content max-content;
  align-items: end;
  gap: 12px;
  padding: 16px 18px 14px;
}
.ew-bk-index {
  width: 38px;
  height: 38px;
  border-radius: 13px;
  font-size: 15px;
}
.ew-bk-name-wrap {
  align-self: end;
}
.ew-bk-name-wrap > span,
.ew-ls-field > span,
.ew-ls-time > span:first-child {
  margin-inline-start: 4px;
  font-size: 10.5px;
  font-weight: 700;
  color: #9a8c78;
}
.ew-bk-name {
  height: 44px;
  padding: 0 14px;
  border: 1px solid #e8ddce;
  border-radius: 13px;
  background: #fff;
  font-size: 14px;
  font-weight: 650;
  box-shadow: 0 6px 16px rgba(69, 50, 29, .035);
}
.ew-bk-stat {
  height: 36px;
  padding: 0 13px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 750;
}
.ew-bk-stat b { font-weight: 850; }
.ew-lesson-list {
  gap: 12px;
  padding: 12px 18px 0;
}
.ew-lesson-row {
  display: grid;
  grid-template-columns: 72px minmax(240px, 1fr) minmax(158px, 190px) 42px;
  align-items: end;
  gap: 12px;
  min-height: 82px;
  padding: 13px 14px;
  border-color: #eadfce;
  border-radius: 16px;
  background: linear-gradient(180deg, #fff, #fffdf9);
  box-shadow: 0 8px 20px rgba(70, 50, 29, .035);
}
.ew-ls-order {
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  align-self: end;
  border: 1px solid #e8ddcd;
  border-radius: 13px;
  background: #f7f3ed;
}
.ew-ls-order .ew-drag-handle {
  width: 18px;
}
.ew-ls-order .ew-grip {
  width: 14px;
  height: 14px;
}
.ew-ls-ord {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: #fff;
  color: #6d6253;
  box-shadow: inset 0 0 0 1px #ece3d7;
}
.ew-ls-field,
.ew-ls-time {
  gap: 7px;
}
.ew-ls-name,
.ew-time-input {
  height: 44px;
  border-radius: 13px;
  border-color: #e3d7c8;
  background: #fff;
  box-shadow: 0 5px 14px rgba(69, 50, 29, .03);
}
.ew-ls-name {
  padding-inline: 12px;
  font-size: 13.5px;
  font-weight: 650;
}
.ew-time-input {
  padding-inline: 11px;
}
.ew-time-input svg {
  width: 15px;
  height: 15px;
}
.ew-ls-time .ew-time-input input {
  width: 56px;
  font-size: 14px;
  font-weight: 650;
}
.ew-time-input small {
  font-size: 11px;
}
.ew-mini.danger.icon-only {
  width: 44px;
  height: 44px;
  align-self: end;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #e8ddce;
  border-radius: 13px;
  background: #fff;
  color: #9a8b78;
}
.ew-mini.danger.icon-only svg { width: 16px; height: 16px; }
.ew-mini.danger.icon-only:hover {
  border-color: #eab3a8;
  background: #fff5f3;
  color: #c24a3a;
  transform: translateY(-1px);
}
.ew-add-lesson {
  width: calc(100% - 36px);
  min-height: 46px;
  justify-content: center;
  margin: 2px 18px 16px;
  border-radius: 14px;
  background: #fffaf5;
  border-color: #dfccb5;
  font-size: 13px;
  font-weight: 900;
}
.ew-add-lesson:hover {
  background: #fff4e9;
  border-color: var(--orange);
}

@media (max-width: 900px) {
  .ew-bk-head {
    grid-template-columns: 38px minmax(0, 1fr) max-content max-content;
  }
  .ew-bk-head > .ew-mini {
    grid-column: auto;
  }
  .ew-lesson-row {
    grid-template-columns: 68px minmax(160px, 1fr) minmax(145px, 170px) 42px;
  }
}
@media (max-width: 680px) {
  .ew-bk-head {
    grid-template-columns: 38px minmax(0, 1fr) max-content;
  }
  .ew-bk-stat {
    grid-row: auto;
  }
  .ew-lesson-row {
    grid-template-columns: 62px minmax(0, 1fr) 42px;
    align-items: end;
  }
  .ew-ls-field {
    grid-column: 2;
  }
  .ew-ls-time {
    grid-column: 2 / 4;
    grid-row: 2;
    width: 100%;
  }
  .ew-lesson-row > .ew-mini {
    grid-column: 3;
    grid-row: 1;
  }
}

/* ===== کارنامه v88: جهت صحیح، تیک استاندارد و نتیجهٔ درس‌به‌درس ===== */
.rr-overview,
.rr-info-grid,
.rr-info-grid article,
.rr-info-grid article > span,
.rr-info-grid article small {
  direction: rtl;
  text-align: right;
}
.rr-info-grid article { justify-content: flex-start; }
.rr-info-grid article > span { flex: 1; }
.rr-info-grid article small { display: block; unicode-bidi: plaintext; }
.rrft-row.on .rrft-check::after {
  content: "";
  width: 4px;
  height: 8px;
  border: 0 solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) translate(-1px, -1px);
  transform-origin: center;
}
.rr-lesson-results { display: grid; gap: 10px; }
.rr-booklet-result {
  overflow: hidden;
  border: 1px solid #e6dccf;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 7px 18px rgba(62, 48, 34, .035);
}
.rr-booklet-result > header {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 50px;
  padding: 8px 12px;
  border-bottom: 1px solid #eee3d6;
  background: linear-gradient(180deg, #fffaf4, #fbf6ef);
}
.rr-booklet-result > header > i {
  width: 30px;
  height: 30px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #fff0e3;
  color: var(--orange);
}
.rr-booklet-result > header > i svg { width: 15px; height: 15px; }
.rr-booklet-result > header > div { display: grid; gap: 1px; }
.rr-booklet-result > header small { color: var(--muted); font-size:10.5px; font-weight: 800; }
.rr-booklet-result > header b { font-size:13px; }
.rr-booklet-result > header > span {
  margin-inline-start: auto;
  padding: 4px 8px;
  border-radius: 999px;
  background: #fff;
  color: #8a7259;
  font-size:11px;
  font-weight: 900;
}
@media (max-width: 700px) {
  .rr-lesson-results .rr-section-head { align-items: flex-start; }
  .rr-booklet-result > header { padding-inline: 9px; }
}

/* ===== بودجهٔ زمانی دفترچه‌ها: یک نوار برای هر دفترچه با سهم زمانی هر درس ===== */
.rr-timebudget { position: relative; display: grid; gap: 10px; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.rr-timebudget > .rr-section-head > span { flex: none; white-space: nowrap; color: #8a7259; font-size:11.5px; font-weight: 900; }
.rr-tb-card { overflow: hidden; border: 1px solid #e6dccf; border-radius: 15px; background: #fff; box-shadow: 0 7px 18px rgba(62,48,34,.035); }
.rr-tb-card > header { display: flex; align-items: center; gap: 9px; min-height: 50px; padding: 8px 12px; border-bottom: 1px solid #eee3d6; background: linear-gradient(180deg,#fffaf4,#fbf6ef); }
.rr-tb-card > header > i { width: 30px; height: 30px; flex: none; display: grid; place-items: center; border-radius: 9px; background: #fff0e3; color: var(--orange); }
.rr-tb-card > header > i svg { width: 15px; height: 15px; }
.rr-tb-card > header > div:not(.rr-tb-sum) { display: grid; gap: 1px; }
.rr-tb-card > header small { color: var(--muted); font-size:10.5px; font-weight: 800; }
.rr-tb-card > header b { font-size:13px; }
.rr-tb-sum { margin-inline-start: auto; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.rr-tb-sum > span { display: grid; gap: 1px; padding: 4px 9px; border: 1px solid #efe5d8; border-radius: 10px; background: #fff; text-align: center; }
.rr-tb-sum > span b { color: #6d6153; font-size:12.5px; font-weight: 950; direction: ltr; }
.rr-tb-sum > .rest b { color: #8d8375; }
.rr-tb-sum > .over { border-color: #f1d4cf; background: #fff9f8; }
.rr-tb-sum > .over b { color: #c8452f; }
.rr-tb-bar { display: flex; align-items: stretch; gap: 2px; height: 34px; margin: 12px 12px 0; padding: 3px; border-radius: 11px; background: #f6f2ec; direction: rtl; }
.rr-tb-seg { flex: 1 1 0; min-width: 5px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.rr-tb-seg > i { display: block; width: 100%; height: 100%; border-radius: 7px; background: var(--rr-tb-color, #c9c0b2); transition: filter .16s ease, transform .16s ease; }
.rr-tb-seg.unused > i { background: repeating-linear-gradient(135deg,#e2dbd1 0 6px,#d8d0c4 6px 12px); }
.rr-tb-seg:hover > i, .rr-tb-seg:focus-visible > i { filter: brightness(1.06); transform: scaleY(1.1); }
.rr-tb-seg:focus-visible { outline: 0; }
.rr-tb-legend { display: flex; flex-wrap: wrap; gap: 6px 12px; padding: 10px 12px 12px; }
.rr-tb-legend span { display: inline-flex; align-items: center; gap: 5px; color: #6f6558; font-size:11px; font-weight: 800; }
.rr-tb-legend i { width: 9px; height: 9px; flex: none; border-radius: 3px; background: var(--rr-tb-color, #c9c0b2); }
.rr-tb-legend .unused i { background: repeating-linear-gradient(135deg,#e2dbd1 0 4px,#d8d0c4 4px 8px); }
.rr-tb-legend b { color: var(--ink); font-size:11.5px; font-weight: 900; }
.rr-tb-float { position: absolute; z-index: 40; top: 0; left: 0; min-width: 158px; display: grid; gap: 4px; padding: 8px 10px; border: 1px solid #e6dcce; border-radius: 11px; background: rgba(255,255,255,.99); box-shadow: 0 12px 28px rgba(54,40,25,.2); color: #574c3e; font-size:11px; text-align: start; direction: rtl; opacity: 0; pointer-events: none; transform: translateY(3px) scale(.92); transform-origin: bottom center; transition: opacity .15s ease, transform .17s cubic-bezier(.34,1.3,.64,1); }
.rr-tb-float.on { opacity: 1; transform: translateY(0) scale(1); }
.rr-tb-float strong { color: var(--ink); font-size:12.5px; }
.rr-tb-float .rr-tb-swatch { width: 26px; height: 4px; border-radius: 999px; background: var(--rr-tb-color, #c9c0b2); }
.rr-tb-float .rr-tf-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.rr-tb-float .rr-tf-row small { color: var(--muted); font-size:10.5px; }
.rr-tb-float .rr-tf-row b { color: var(--ink); font-size:12px; direction: ltr; unicode-bidi: plaintext; }
/* درست/غلط/نزده: اعداد هم‌ترتیبِ برچسب (راست‌به‌چپ) و رنگی، تا با bidi جابه‌جا نشوند */
.rr-tb-float .rr-tf-score b { direction: rtl; unicode-bidi: isolate; display: inline-flex; align-items: center; gap: 3px; }
.rr-tb-float .rr-tf-score b i { font-style: normal; font-weight: 900; font-size:12.5px; padding: 1px 5px; border-radius: 6px; }
.rr-tb-float .rr-tf-score b i.ok { background: #eaf8f4; color: #168878; }
.rr-tb-float .rr-tf-score b i.bad { background: #fdeceb; color: #c24a3a; }
.rr-tb-float .rr-tf-score b i.blank { background: #f6f2ea; color: #9a8a6d; }
.rr-tb-float .rr-tf-score b em { font-style: normal; color: #c3b8a6; font-size:11px; }
@media (max-width: 700px) {
  .rr-tb-card > header { flex-wrap: wrap; padding-inline: 9px; }
  .rr-tb-sum { margin-inline-start: 0; width: 100%; }
  .rr-tb-sum > span { flex: 1; }
  .rr-tb-bar { margin-inline: 9px; }
}

/* ===== وضعیت کلی کارنامه: کارت‌های اطلاعات یک‌دست، کاشی‌های آماری و جدول درس‌به‌درس ===== */
.rr-overview,
.rr-ov-info,
.rr-ov-stats,
.rr-lesson-results,
.rr-booklet-result {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
/* رنگ‌بندی یک‌دست کارت‌ها و کاشی‌ها بر پایهٔ تم سایت */
.rr-ov-info article,
.rr-ov-stats article { --tone: #b3540f; --tone-soft: #fff0e3; }
.rr-overview .tone-teal { --tone: #168878; --tone-soft: #eaf8f4; }
.rr-overview .tone-blue { --tone: #4268a5; --tone-soft: #eef3fc; }
.rr-overview .tone-yellow { --tone: #a97925; --tone-soft: #fbf1df; }
.rr-overview .tone-red { --tone: #c24a3a; --tone-soft: #fdeceb; }
.rr-overview .tone-purple { --tone: #7458b8; --tone-soft: #f2edff; }
.rr-overview .tone-gray { --tone: #847968; --tone-soft: #f1eee8; }
.rr-overview .tone-ink { --tone: #4a443b; --tone-soft: #f4f1eb; }

.rr-ov-info { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.rr-ov-info article {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 72px;
  padding: 12px 14px;
  border: 1px solid #e8dfd3;
  border-radius: 15px;
  background: linear-gradient(145deg, #fff, #fdfbf8);
  box-shadow: 0 7px 20px rgba(58, 43, 27, .035);
  transition: transform .18s var(--ease-soft), border-color .18s ease, box-shadow .18s ease;
}
.rr-ov-info article::after {
  content: "";
  position: absolute;
  inset-block: 20px;
  inset-inline-start: 0;
  width: 3px;
  border-radius: 3px;
  background: var(--tone);
  opacity: .35;
  transition: inset-block .24s var(--ease-soft), width .24s var(--ease-soft), opacity .2s ease, box-shadow .24s ease;
}
.rr-ov-info article:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--tone) 32%, #e8dfd3); box-shadow: 0 10px 24px rgba(58, 43, 27, .06); }
.rr-ov-info article:hover::after { inset-block: 8px; width: 4.5px; opacity: 1; box-shadow: 2px 0 12px color-mix(in srgb, var(--tone) 45%, transparent); }
.rr-ov-info article > i {
  flex: none;
  width: 37px;
  height: 37px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--tone-soft);
  color: var(--tone);
  transition: transform .18s var(--ease-soft);
}
.rr-ov-info article:hover > i { transform: translateY(-1px) scale(1.05); }
.rr-ov-info article > i svg { width: 16px; height: 16px; }
.rr-ov-info article > div { min-width: 0; display: grid; gap: 2px; }
.rr-ov-info article small { color: var(--muted); font-size:10.5px; font-weight: 800; }
.rr-ov-info article b { overflow: hidden; color: #302b25; font-size:13px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.rr-ov-info article span { overflow: hidden; color: #8a7f70; font-size:11px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; unicode-bidi: plaintext; }

.rr-ov-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 8px; }
.rr-ov-stats article {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 62px;
  padding: 10px;
  border: 1px solid #e8dfd3;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff, #fdfbf8);
  box-shadow: 0 6px 16px rgba(61, 45, 28, .025);
  transition: transform .18s var(--ease-soft), border-color .18s ease, box-shadow .18s ease;
}
.rr-ov-stats article:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--tone) 32%, #e8dfd3); box-shadow: 0 9px 20px rgba(61, 45, 28, .055); }
.rr-ov-stats article > i {
  flex: none;
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--tone-soft);
  color: var(--tone);
}
.rr-ov-stats article > i svg { width: 14px; height: 14px; }
.rr-ov-stats article > div { min-width: 0; display: grid; gap: 1px; }
.rr-ov-stats article small { color: var(--muted); font-size:10.5px; font-weight: 800; line-height: 1.45; }
.rr-ov-stats article b { color: #302b25; font-size:16px; font-weight: 950; unicode-bidi: plaintext; }
.rr-ov-stats article span { color: #988d7d; font-size:9.5px; font-weight: 750; white-space: nowrap; }
.rr-ov-stats article.hero { grid-column: span 2; border-color: #f0cfae; background: linear-gradient(135deg, #fff5ec, #fff); }
.rr-ov-stats article.hero > i.rr-ov-ring {
  position: relative;
  width: 47px;
  height: 47px;
  border-radius: 50%;
  background: conic-gradient(var(--orange) calc(var(--rr-p) * 1%), #f3e2d0 0);
  box-shadow: 0 5px 13px rgba(255, 107, 24, .16);
}
.rr-ov-stats article.hero > i.rr-ov-ring::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: #fff;
  box-shadow: inset 0 0 0 1px #f6ece1;
}
.rr-ov-stats article.hero b { color: #b3540f; font-size:22px; }

.rr-lesson-section-head > span { flex: none; padding: 5px 10px; border-radius: 999px; background: #fff0e3; color: #a85b1b; font-size:11px; font-weight: 900; }
.rr-booklet-result { border-radius: 17px; box-shadow: 0 9px 24px rgba(62, 48, 34, .045); }
.rr-booklet-result > header { min-height: 57px; display: grid; grid-template-columns: max-content minmax(0, 1fr); align-items: center; padding: 9px 13px; background: linear-gradient(120deg, #fff8f1, #fdfbf8); }
.rr-booklet-result > header > .rr-booklet-summary { min-width: 0; margin-inline-start: auto; display: flex; align-items: center; justify-content: flex-end; gap: 5px; white-space: nowrap; }
.rr-booklet-result > header .rr-booklet-summary > span { display: inline-flex; align-items: center; gap: 3px; padding: 4px 8px; border: 1px solid #ebe2d7; border-radius: 8px; background: #fff; color: #7a6f61; font-size:10.5px; font-weight: 750; }
.rr-booklet-summary > span b { color: #332e28; font-size:11.5px; }
.rr-booklet-summary > strong { min-width: 48px; padding: 5px 9px; border-radius: 9px; background: #fff0e3; color: #a85b1b; font-size:13px; font-weight: 950; text-align: center; }

/* جدول نتیجهٔ درس‌به‌درس */
.rr-lt-wrap { overflow-x: auto; background: #fff; }
.rr-lt { width: 100%; min-width: 640px; border-collapse: collapse; font-size:12.5px; }
.rr-lt th, .rr-lt td { padding: 8px 9px; text-align: center; white-space: nowrap; vertical-align: middle; }
.rr-lt thead th { border-bottom: 1px solid #eee3d6; background: #f7f4ef; color: #7b7061; font-size:11px; font-weight: 900; }
.rr-lt thead th.ok { color: #168878; }
.rr-lt thead th.bad { color: #c24a3a; }
.rr-lt thead th.blank { color: #a97925; }
.rr-lt thead th.percent { color: #a85b1b; }
.rr-lt thead th.rank { color: #4268a5; }
.rr-lt th.lesson, .rr-lt td.lesson { min-width: 150px; padding-inline-start: 13px; text-align: start; }
.rr-lt tbody tr { transition: background .14s ease; }
.rr-lt tbody tr:nth-child(even) { background: #fdfbf8; }
.rr-lt tbody tr:hover { background: #fffaf5; }
.rr-lt tbody td { border-top: 1px solid #f3ece2; }
.rr-lt tbody tr:first-child td { border-top: 0; }
.rr-lt td.lesson i {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  margin-inline-end: 8px;
  border-radius: 8px;
  background: #f4efe7;
  color: #8a7d6c;
  vertical-align: middle;
}
.rr-lt td.lesson i svg { width: 13px; height: 13px; }
.rr-lt td.lesson b { font-size:13px; font-weight: 900; vertical-align: middle; }
.rr-lt-num {
  display: inline-grid;
  place-items: center;
  min-width: 36px;
  min-height: 25px;
  padding: 2px 8px;
  border-radius: 8px;
  background: #f4f1eb;
  color: #5c5546;
  font-size:13px;
  font-weight: 900;
}
.rr-lt-num.ok { background: #eaf8f4; color: #168878; }
.rr-lt-num.bad { background: #fdeceb; color: #c24a3a; }
.rr-lt-num.blank { background: #fff6da; color: #a97925; }
.rr-lt-num.rank { background: #eef3fc; color: #4268a5; }
.rr-lt td.rank, .rr-lt td.time { color: #9b917f; }
.rr-lt td.time { font-weight: 850; font-size:12.5px; color: #756a5b; unicode-bidi: plaintext; }
.rr-lt td.percent { min-width: 96px; }
.rr-lt-percent { display: grid; gap: 4px; min-width: 84px; }
.rr-lt-percent b { font-size:13.5px; font-weight: 950; }
.rr-lt-percent.high b { color: #168878; }
.rr-lt-percent.mid b { color: #a85b1b; }
.rr-lt-percent.low b { color: #c24a3a; }
.rr-lt-percent em { display: block; height: 5px; overflow: hidden; border-radius: 999px; background: #eee9e2; }
.rr-lt-percent em > i { display: block; width: calc(var(--rr-p) * 1%); height: 100%; border-radius: inherit; }
.rr-lt-percent.high em > i { background: linear-gradient(90deg, #26ae95, #5bc5b2); }
.rr-lt-percent.mid em > i { background: linear-gradient(90deg, #ed8a2c, #f3ac60); }
.rr-lt-percent.low em > i { background: linear-gradient(90deg, #e05a48, #ef8273); }
.rr-lt tfoot td { border-top: 2px solid #eadfd0; background: #fbf8f3; }
.rr-lt tfoot td.lesson i { background: #fff0e3; color: #a85b1b; }
.rr-lt tfoot td.lesson b { color: #7a5c33; font-size:12.5px; }
/* ردیف «جمع آزمون» زیر همهٔ دفترچه‌ها */
.rr-exam-total { border-color: #ecd3b6; }
.rr-exam-total .rr-lt thead th { background: #f9f2e8; }
.rr-exam-total .rr-lt tfoot td { border-top: 1px solid #f0e2cf; background: #fff6ec; }

@media (max-width: 900px) {
  .rr-ov-info { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .rr-booklet-result > header { grid-template-columns: max-content minmax(0, 1fr); gap: 6px; padding-inline: 9px; }
  .rr-booklet-summary { gap: 3px; }
  .rr-booklet-result > header .rr-booklet-summary > span { padding-inline: 5px; }
  .rr-booklet-summary > strong { min-width: 42px; padding-inline: 6px; }
}
@media (max-width: 560px) {
  .rr-ov-info { grid-template-columns: 1fr; }
  .rr-ov-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rr-ov-stats article.hero { grid-column: 1 / -1; }
}

/* ===== صفحهٔ مستقل کارنامه + مودال‌های متناسب با محتوا (v90) ===== */
.modal.compact { width: min(620px, 94vw); }
.modal.compact-wide { width: min(780px, 95vw); }
.modal.compact .modal-body,
.modal.compact-wide .modal-body { padding-inline: 22px; }
.modal.compact-wide .exam-merge { padding-block: 18px; }

.rr-report-page {
  width: min(1440px, 100%);
  margin-inline: auto;
  display: grid;
  gap: 12px;
  padding-bottom: 22px;
}
.rr-report-page-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 15px 17px;
  border: 1px solid #e7ddd0;
  border-radius: 18px;
  background: linear-gradient(135deg, #fffaf4, #fff);
  box-shadow: 0 9px 24px rgba(70, 51, 31, .055);
}
.rr-report-back {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid #e6d9ca;
  border-radius: 12px;
  background: #fff;
  color: #756a5b;
  font: inherit;
  font-size:12.5px;
  font-weight: 850;
  cursor: pointer;
  transition: border-color .16s ease, color .16s ease, transform .16s ease;
}
.rr-report-back:hover { border-color: #efb27e; color: var(--orange); transform: translateX(2px); }
.rr-report-back svg { width: 15px; height: 15px; }
.rr-report-title { min-width: 0; display: grid; gap: 2px; }
.rr-report-title > span { color: var(--orange); font-size:11.5px; font-weight: 900; }
.rr-report-title h1 { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size:21px; }
.rr-report-title small { color: var(--muted); font-size:12px; font-weight: 750; }
.rr-report-page .rr-head-actions { justify-content: flex-end; flex-wrap: wrap; }
.rr-report-page-tabs {
  position: sticky;
  top: 10px;
  z-index: 12;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px;
  overflow-x: auto;
  border-color: #e3d7c8;
  border-radius: 15px;
  box-shadow: 0 9px 24px rgba(65, 46, 27, .08);
}
.rr-report-page-tabs button {
  min-width: 128px;
  flex: 1 0 auto;
  justify-content: center;
  min-height: 43px;
  white-space: nowrap;
}
.rr-report-page-tabs button:hover { transform: translateY(-1px); }
.rr-report-page-body {
  min-height: 560px;
  padding: 14px;
  border: 1px solid #e7ddd0;
  border-radius: 18px;
  background: #f8f5ef;
}
.rr-report-page-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid #e9dfd2;
  border-radius: 13px;
  background: #fff;
}
.rr-report-missing { min-height: 60vh; place-items: center; }
.rr-report-missing > div {
  max-width: 430px;
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 30px;
  border: 1px solid #e8ddcf;
  border-radius: 18px;
  background: #fff;
  text-align: center;
}
.rr-report-missing svg { width: 38px; height: 38px; color: var(--orange); }
.rr-report-missing h2, .rr-report-missing p { margin: 0; }
.rr-report-missing p { color: var(--muted); font-size:13px; line-height: 1.9; }
@media (max-width: 900px) {
  .rr-report-page-head { grid-template-columns: auto minmax(0, 1fr); }
  .rr-report-page .rr-head-actions { grid-column: 1 / -1; justify-content: stretch; }
  .rr-report-page .rr-head-actions > * { flex: 1; }
  .rr-report-page-tabs { top: 6px; }
}
@media (max-width: 560px) {
  .rr-report-page { gap: 8px; }
  .rr-report-page-head { padding: 11px; gap: 9px; border-radius: 14px; }
  .rr-report-back span { display: none; }
  .rr-report-back { width: 40px; padding: 0; justify-content: center; }
  .rr-report-title h1 { font-size:17px; }
  .rr-report-page-tabs { border-radius: 12px; }
  .rr-report-page-tabs button { min-width: 112px; }
  .rr-report-page-tabs button span { display: inline; }
  .rr-report-page-body { padding: 8px; border-radius: 14px; }
  .modal.compact, .modal.compact-wide { width: 100vw; max-height: 100vh; height: 100vh; border-radius: 0; }
}

/* ===== اشتراک‌گذاری آزمون (لینک + کد یکتا) ===== */
.exam-head-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.exam-iconbtn.exam-share-icon.on {
  background: #2a9d8f; border-color: #2a9d8f; color: #fff;
  box-shadow: 0 3px 10px rgba(42, 157, 143, .32);
}
.exam-iconbtn.exam-share-icon.on:hover { background: #24897d; }
.exam-iconbtn.exam-share-icon:not(.on):hover svg { transform: scale(1.12) rotate(-8deg); }
.exam-iconbtn.exam-share-icon svg { transition: transform .22s ease; }
.exam-chip.shared { background: #e7f5f2; color: #1f7f73; border-color: #bfe5df; }
.exam-share-body .omr-hub-lead { margin-top: 0; }
.exam-share-state {
  display: flex; align-items: flex-start; gap: 9px; padding: 11px 13px; border-radius: 12px;
  font-size: 12.5px; line-height: 1.9; margin-bottom: 13px;
}
.exam-share-state .ui-icon { flex: 0 0 auto; margin-top: 4px; }
.exam-share-state.on { background: #e7f5f2; color: #17695f; border: 1px solid #bfe5df; }
.exam-share-state.off { background: #fdefe7; color: #a04d1c; border: 1px solid #f3d3bb; }
.exam-share-row { display: flex; gap: 8px; align-items: stretch; }
.exam-share-row input { flex: 1 1 auto; min-width: 0; }
.exam-share-row .secondary-button, .exam-share-row .primary-button { flex: 0 0 auto; white-space: nowrap; }
.exam-share-code {
  flex: 1 1 auto; display: grid; place-items: center; padding: 10px 12px;
  background: #fff8ee; border: 1.5px dashed var(--orange, #e8722a); border-radius: 12px;
  font-size: 21px; font-weight: 900; letter-spacing: 2.5px; color: #b25419;
  user-select: all;
}
.exam-share-actions { display: flex; gap: 9px; align-items: center; justify-content: flex-end; flex-wrap: wrap; margin-top: 14px; }
.exam-share-actions .ghost-button.danger { color: #c0392b; border-color: #ecc4bd; }
.exam-share-actions .ghost-button.danger:hover { background: #fdf0ee; }
.exam-share-head { display: grid; gap: 3px; margin-bottom: 12px; }
.exam-share-head > b { font-size: 16px; }
.exam-share-head > small { color: #9a8c78; font-size: 12px; }
.exam-share-grid { margin-bottom: 12px; }
.exam-share-budget {
  display: grid; gap: 5px; padding: 10px 12px; max-height: 240px; overflow-y: auto;
  background: #fbf7f0; border: 1px solid #eee3d2; border-radius: 12px;
}
.exam-share-bk { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; padding-top: 7px; }
.exam-share-bk:first-child { padding-top: 0; }
.exam-share-bk > span { color: #9a8c78; font-size: 11.5px; }
.exam-share-ls {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center;
  background: #fff; border: 1px solid #efe6d7; border-radius: 9px; padding: 6px 10px; font-size: 12px;
}
.exam-share-ls small { color: #9a8c78; font-size: 11px; white-space: nowrap; }
/* ===== همگام‌سازی مجموعهٔ اشتراکی + تاریخچهٔ تغییرات ===== */
.qset-sync-share-row { align-items: center; }
.qset-sync-share-row .exam-pick-note { flex: 1 1 auto; margin: 0; }
.qset-sync-history { margin-bottom: 4px; }
.qset-sync-list {
  display: grid; gap: 6px; padding: 10px 12px; max-height: 300px; overflow-y: auto;
  background: #fbf7f0; border: 1px solid #eee3d2; border-radius: 12px;
}
.qset-sync-item {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 9px; align-items: center;
  background: #fff; border: 1px solid #efe6d7; border-radius: 10px; padding: 7px 10px; font-size: 12.5px; line-height: 1.9;
}
.qset-sync-item > i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 8px; flex: 0 0 auto; }
.qset-sync-item > i .ui-icon { width: 14px; height: 14px; }
.qset-sync-item.add > i { background: #e7f5f2; color: #1f7f73; }
.qset-sync-item.remove > i { background: #fdf0ee; color: #c0392b; }
.qset-sync-item > small { color: #9a8c78; font-size: 10.5px; white-space: nowrap; }
.qset-sync-text b { font-weight: 800; }
.qset-sync-q {
  display: inline-block; padding: 1px 7px; margin: 0 2px; border-radius: 7px; cursor: pointer;
  background: #fff8ee; border: 1px dashed var(--orange, #e8722a); color: #b25419;
  font-size: 11.5px; font-weight: 800; letter-spacing: .4px; font-family: inherit;
}
.qset-sync-q:hover:not(:disabled) { background: #ffefdb; }
.qset-sync-q:disabled { cursor: default; opacity: .55; border-style: solid; border-color: #ddd2c0; color: #9a8c78; background: #f7f2e9; }
.qset-sync-summary { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
/* گزینهٔ «همگام‌سازی با اعضا» هنگام فعال‌سازی اشتراک‌گذاری */
.qset-share-sync-opt {
  display: flex; gap: 10px; align-items: flex-start; cursor: pointer;
  padding: 12px 13px; margin: 4px 0 2px; border-radius: 12px;
  background: #f7faf9; border: 1px solid #d7e8e3;
}
.qset-share-sync-opt input { margin-top: 3px; width: 17px; height: 17px; flex: 0 0 auto; accent-color: #2a9d8f; cursor: pointer; }
.qset-share-sync-opt > span { display: grid; gap: 3px; }
.qset-share-sync-opt b { font-size: 12.8px; color: #1f6f63; }
.qset-share-sync-opt small { font-size: 11.3px; line-height: 1.85; color: #6d7c78; }
@media (max-width: 640px) {
  .qset-sync-item { grid-template-columns: auto minmax(0, 1fr); }
  .qset-sync-item > small { grid-column: 2; justify-self: start; }
  .qset-sync-share-row { flex-direction: column; align-items: stretch; }
}
/* کارت نتایج جمعی در کارنامه */
.rr-shared-card {
  display: grid; gap: 12px; padding: 14px 15px;
  background: linear-gradient(135deg, #f4fbf9, #fdfaf4); border: 1px solid #cfe8e2; border-radius: 14px;
}
.rr-shared-card.solo {
  grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px;
  font-size:14px; line-height: 1.9; color: #4c6a63;
}
.rr-shared-card.solo .ui-icon { width: 22px; height: 22px; color: #2a9d8f; }
.rr-shared-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rr-shared-head .ui-icon { color: #2a9d8f; }
.rr-shared-head b { font-size:15px; }
.rr-shared-head span { color: #8fa39d; font-size:13px; }
.rr-shared-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 9px; }
.rr-shared-tiles article {
  display: grid; gap: 3px; place-items: center; text-align: center;
  background: #fff; border: 1px solid #e4ded2; border-radius: 12px; padding: 10px 8px;
}
.rr-shared-tiles article span { font-size:13px; color: #9a8c78; font-weight: 700; }
.rr-shared-tiles article b { font-size:20px; }
.rr-shared-tiles article small { font-size:12.5px; color: #b3a790; }
.rr-shared-tiles article.hero { background: #2a9d8f; border-color: #2a9d8f; }
.rr-shared-tiles article.hero span, .rr-shared-tiles article.hero small { color: #d8efeb; }
.rr-shared-tiles article.hero b { color: #fff; }
.rr-shared-table { display: grid; border: 1px solid #e4ded2; border-radius: 12px; overflow: hidden; background: #fff; }
.rr-shared-row {
  display: grid; grid-template-columns: 52px minmax(0, 1fr) 90px 76px; gap: 8px; align-items: center;
  padding: 8px 12px; font-size:14px; border-top: 1px solid #f1ebe0;
}
.rr-shared-row.head { background: #faf6ee; color: #9a8c78; font-size:13px; font-weight: 800; border-top: 0; }
.rr-shared-row.me { background: #fff6ec; box-shadow: inset 3px 0 0 var(--orange, #e8722a); font-weight: 700; }
.rr-shared-row > span:first-child, .rr-shared-row > span:nth-child(3), .rr-shared-row > span:last-child { text-align: center; }
.rr-shared-name { display: flex; align-items: center; gap: 6px; min-width: 0; }
.rr-shared-name small { color: #b3a790; }
.rr-shared-name em {
  font-style: normal; font-size:12px; font-weight: 800; color: #fff;
  background: var(--orange, #e8722a); border-radius: 20px; padding: 1px 8px;
}
.rr-shared-more { padding: 7px 12px; font-size:13px; color: #9a8c78; border-top: 1px dashed #eee3d2; text-align: center; }
@media (max-width: 560px) {
  .exam-share-row { flex-direction: column; }
  .rr-shared-row { grid-template-columns: 38px minmax(0, 1fr) 64px 60px; padding-inline: 9px; }
}

/* اشتراک‌گذاری مجموعه‌سوال: حالت فعال آیکون روی کارت + دکمهٔ صفحهٔ جزئیات */
.qset-card-action.qset-share-icon.on {
  background: #2a9d8f; border-color: #2a9d8f; color: #fff;
  box-shadow: 0 3px 9px rgba(42, 157, 143, .3);
}
.qset-card-action.qset-share-icon.on:hover { background: #24897d; }
.qset-card-action.qset-share-icon:not(.on):hover svg { transform: scale(1.12) rotate(-8deg); }
.qset-card-action.qset-share-icon svg { transition: transform .22s ease; }
.secondary-button.qset-share-on {
  background: #e7f5f2; border-color: #bfe5df; color: #1f7f73;
}
.secondary-button.qset-share-on:hover { background: #d7efe9; }
/* لینک همگام‌سازی: وقتی فعال است آبی می‌شود (مثل اشتراک‌گذاری که سبز می‌شود) */
.qset-card-action.qset-sync-icon.on {
  background: #2563eb; border-color: #2563eb; color: #fff;
  box-shadow: 0 3px 9px rgba(37, 99, 235, .3);
}
.qset-card-action.qset-sync-icon.on:hover { background: #1d4fd0; }
.qset-card-action.qset-sync-icon:not(.on):hover svg { transform: scale(1.12) rotate(10deg); }
.qset-card-action.qset-sync-icon svg { transition: transform .22s ease; }
.secondary-button.qset-sync-on {
  background: #eef4ff; border-color: #c4d7f7; color: #2059c4;
}
.secondary-button.qset-sync-on:hover { background: #e0ecff; }

/* ===== نمودار فعالیت مدیران (نمای کلیِ مدیر اصلی) ===== */
.admin-activity-panel .aa-subtitle { display:block; font-size:11.5px; color:var(--muted); font-weight:500; margin-top:3px; }
#adminActivityBody, #questionTrendBody { padding: 4px 16px 16px; }
.aa-controls { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; margin:6px 0 12px; }
.aa-seg { display:inline-flex; background:#f4f1ec; border:1px solid #e8e0d3; border-radius:12px; padding:3px; gap:2px; }
.aa-seg button {
  border:0; background:transparent; cursor:pointer; font:inherit; font-size:12.5px; font-weight:600;
  color:#8a7f6d; padding:6px 14px; border-radius:9px; transition:all .16s ease; white-space:nowrap;
}
.aa-seg button:hover { color:#5f5647; }
.aa-seg button.on { background:#fff; color:var(--orange,#e8722a); box-shadow:0 2px 6px rgba(0,0,0,.08); }
.aa-seg.metric button.on { color:#1f7f73; }
.aa-summary { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; margin-bottom:8px; font-size:12.5px; }
.aa-sum { display:inline-flex; align-items:center; gap:5px; color:#5f5647; }
.aa-sum b { font-size:15px; color:#2c261d; }
.aa-sum .ui-icon { width:16px; height:16px; }
.aa-sum.c .ui-icon { color:#2a78d6; }
.aa-sum.r .ui-icon { color:#1baf7a; }
.aa-sum.muted { color:var(--muted); margin-inline-start:auto; }
/* نمودار */
.aa-chart-wrap { position:relative; width:100%; }
.aa-chart { width:100%; height:auto; display:block; overflow:visible; }
.aa-chart .aa-grid { stroke:#ece6db; stroke-width:1; }
.aa-chart .aa-ytick, .aa-chart .aa-xtick { fill:#a89c88; font-size:11px; font-family:inherit; }
.aa-chart .aa-ytick { text-anchor:end; }
.aa-chart .aa-xtick { text-anchor:middle; }
.aa-chart .aa-series path { transition:opacity .15s ease; }
.aa-chart .aa-cur-line { stroke:#c9beac; stroke-width:1.2; stroke-dasharray:4 4; }
.aa-tip {
  position:absolute; top:6px; z-index:40; min-width:180px; max-width:280px;
  background:#fff; border:1px solid #ece4d6; border-radius:13px; box-shadow:0 12px 30px rgba(60,45,20,.18);
  padding:10px 12px; pointer-events:none; opacity:0; transform:translateY(-4px); transition:opacity .13s ease, transform .13s ease;
}
.aa-tip.on { opacity:1; transform:translateY(0); }
.aa-tip > strong { display:block; font-size:12.5px; color:#2c261d; margin-bottom:8px; padding-bottom:7px; border-bottom:1px solid #f2ece1; }
.aa-tip-row { display:grid; grid-template-columns:26px 1fr auto; gap:8px; align-items:center; padding:4px 0; }
.aa-tip-av { width:26px; height:26px; border-radius:50%; overflow:hidden; background:#eee; }
.aa-tip-av img, .aa-tip-av svg { width:100%; height:100%; object-fit:cover; }
.aa-tip-name { display:flex; align-items:center; gap:6px; font-size:12px; font-weight:650; color:#3a332a; min-width:0; }
.aa-tip-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.aa-tip-name i { width:9px; height:9px; border-radius:3px; flex:0 0 auto; }
.aa-tip-vals { display:inline-flex; align-items:baseline; gap:3px; white-space:nowrap; }
.aa-tip-vals b { font-size:12.5px; color:#b3a68f; font-weight:700; }
.aa-tip-vals b.on { color:#2c261d; font-size:14px; }
.aa-tip-vals small { font-size:9.5px; color:#b3a68f; margin-inline-end:3px; }
.aa-tip-empty { font-size:12px; color:var(--muted); }
.aa-hit { cursor:crosshair; }
.aa-drill-hint { margin:6px 0 2px; padding:8px 10px; border:1px dashed #dfd5c6; border-radius:10px; color:#9b907f; background:#fcfaf6; font-size:9.5px; font-weight:700; text-align:center; }
.aa-drill { margin:8px 0 2px; padding:10px 12px 8px; border:1px solid #e7dfd3; border-radius:13px; background:#fcfaf7; }
.aa-drill > header { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }
.aa-drill > header > div { display:flex; align-items:baseline; gap:8px; }
.aa-drill > header b { color:#4a4237; font-size:11px; font-weight:900; }
.aa-drill > header small { color:#9e9485; font-size:8.5px; font-weight:700; }
.aa-drill > header button { display:grid; place-items:center; width:24px; height:24px; padding:0; border:0; border-radius:7px; color:#968b7b; background:#eee9e2; cursor:pointer; }
.aa-drill > header button .ui-icon { width:13px; height:13px; }
.aa-drill-bars { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(17px,1fr); align-items:end; gap:4px; min-height:83px; direction:ltr; }
.aa-drill-day { position:relative; display:grid; grid-template-rows:14px 55px 13px; align-items:end; justify-items:center; min-width:0; }
.aa-drill-day > b { color:#6f6558; font-size:7.5px; font-weight:850; }
.aa-drill-day > i { display:block; width:min(70%,18px); min-width:5px; border-radius:4px 4px 2px 2px; background:linear-gradient(180deg,#58aa8b,#27785f); transition:filter .14s ease; }
.aa-drill-day > small { overflow:hidden; max-width:100%; color:#9d9385; font-size:7px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.aa-drill-day:hover > i { filter:brightness(.88); }
.aa-drill-tip { position:absolute; bottom:75px; left:50%; z-index:30; display:none; width:max-content; min-width:125px; max-width:220px; transform:translateX(-50%); padding:7px 9px; border:1px solid #e5dccf; border-radius:9px; background:#fff; box-shadow:0 9px 24px rgba(60,45,20,.16); direction:rtl; }
.aa-drill-day:hover .aa-drill-tip { display:grid; gap:3px; }
.aa-drill-tip > strong { padding-bottom:4px; border-bottom:1px solid #eee7dc; color:#4d4439; font-size:9px; }
.aa-drill-tip > span { display:flex; align-items:center; justify-content:space-between; gap:14px; color:#357a65; font-size:8px; }
.aa-drill-tip > span b { overflow:hidden; max-width:145px; color:#6d6355; text-overflow:ellipsis; white-space:nowrap; }
.aa-drill-tip > em { color:#aaa092; font-size:8px; font-style:normal; }
/* راهنما = دکمه‌های کم/زیادکردن مدیرها */
.aa-legend-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.aa-legend {
  display:inline-flex; align-items:center; gap:8px; cursor:pointer; font:inherit; text-align:start;
  background:#faf7f1; border:1px solid #ece4d6; border-radius:12px; padding:6px 10px 6px 8px; transition:all .15s ease;
}
.aa-legend:hover { border-color:#d9cdb8; background:#fff; }
.aa-legend.off { opacity:.42; filter:saturate(.5); }
.aa-legend.empty { cursor:default; opacity:.5; }
.aa-legend-sw { width:11px; height:11px; border-radius:4px; flex:0 0 auto; }
.aa-legend.off .aa-legend-sw { background:#c3bbac !important; }
.aa-legend-av { width:28px; height:28px; border-radius:50%; overflow:hidden; background:#eee; flex:0 0 auto; }
.aa-legend-av img, .aa-legend-av svg { width:100%; height:100%; object-fit:cover; }
.aa-legend-main { display:flex; flex-direction:column; line-height:1.35; min-width:0; }
.aa-legend-main b { font-size:12.5px; color:#2c261d; font-weight:650; }
.aa-legend-main small { font-size:10.5px; color:#9a8c78; }
.aa-legend-nums { display:inline-flex; gap:4px; margin-inline-start:4px; }
.aa-legend-nums i { font-style:normal; font-size:11px; font-weight:800; border-radius:7px; padding:2px 7px; }
.aa-legend-nums i.c { background:#e7f0fc; color:#2a78d6; }
.aa-legend-nums i.r { background:#e4f6ef; color:#178a63; }
.aa-legend-empty { font-size:12px; color:var(--muted); }

/* ===== تحلیل چرخهٔ کاری و هیت‌مپ مدیران ===== */
.admin-performance-panel { margin-top:18px; }
.ap-card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr)); gap:14px; padding:2px 16px 18px; }
.ap-card { padding:16px; border:1px solid #e9e0d3; border-radius:18px; background:linear-gradient(155deg,#fff 0%,#fcfaf6 100%); box-shadow:0 8px 24px rgba(79,60,32,.055); min-width:0; }
.admin-performance-panel > .ap-card { margin:2px 16px 18px; }
.ap-card > header { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-bottom:12px; border-bottom:1px solid #eee7dc; }
.ap-person { display:flex; align-items:center; gap:9px; min-width:0; }
.ap-person .avatar { width:38px; height:38px; flex:0 0 38px; }
.ap-person > div { display:grid; gap:2px; min-width:0; }
.ap-person b { overflow:hidden; color:#332c23; font-size:13.5px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
.ap-person small { color:#988d7c; font-size:10px; font-weight:700; }
.ap-active,.ap-setup { flex:0 0 auto; padding:4px 8px; border-radius:999px; font-size:9.5px; font-weight:850; }
.ap-active { color:#23735d; background:#e8f5ef; }
.ap-setup { color:#a76b16; background:#fff3d9; }
.ap-card section { margin-top:13px; }
.ap-card section > h4 { display:flex; align-items:center; gap:5px; margin:0 0 7px; color:#6d6254; font-size:10.5px; font-weight:850; }
.ap-card section > h4 .ui-icon { width:14px; height:14px; color:#cc762e; }
.ap-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.ap-metrics.reviewer-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
.ap-metric { display:grid; align-content:start; gap:2px; min-height:67px; padding:9px; border:1px solid #eee7dc; border-radius:12px; background:#fff; }
.ap-metric.creator { background:#fff8ee; border-color:#f2dfc3; }
.ap-metric.reviewer { background:#eef9f5; border-color:#d2ebe2; }
.ap-metric small { overflow:hidden; color:#918777; font-size:8.5px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.ap-metric b { color:#322b23; font-size:15px; font-weight:950; white-space:nowrap; }
.ap-metric span { color:#aaa093; font-size:7.8px; font-weight:700; line-height:1.4; }
.ap-heat-section { padding-top:11px; border-top:1px solid #eee7dc; }
.ap-heat-title { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:7px; }
.ap-heat-title b { color:#5d5449; font-size:10px; font-weight:900; }
.ap-heat-title small { color:#aaa094; font-size:8px; font-weight:700; }
.ap-heatmap { display:grid; grid-template-columns:14px minmax(0,1fr); align-items:start; gap:5px; direction:ltr; }
.ap-heat-days { display:grid; grid-template-rows:repeat(7,9px); gap:3px; color:#aaa094; font-size:6.5px; font-weight:800; text-align:center; line-height:9px; }
.ap-heat-scroll { min-width:0; overflow-x:auto; overflow-y:visible; padding:1px 1px 28px; margin-bottom:-27px; scrollbar-width:thin; }
.ap-heat-grid { display:grid; grid-template-rows:repeat(7,9px); grid-auto-flow:column; grid-auto-columns:9px; gap:3px; width:max-content; min-width:100%; justify-content:end; }
.ap-heat-grid > i,.ap-heat-legend i { position:relative; display:block; width:9px; height:9px; border-radius:3px; background:#f0ece5; }
.ap-heat-grid > i.blank { visibility:hidden; }
.ap-heat-grid > i[data-level="1"],.ap-heat-legend i[data-level="1"] { background:#d9eee5; }
.ap-heat-grid > i[data-level="2"],.ap-heat-legend i[data-level="2"] { background:#add8c6; }
.ap-heat-grid > i[data-level="3"],.ap-heat-legend i[data-level="3"] { background:#75b99e; }
.ap-heat-grid > i[data-level="4"],.ap-heat-legend i[data-level="4"] { background:#3b9274; }
.ap-heat-grid > i[data-level="5"],.ap-heat-legend i[data-level="5"] { background:#176650; }
.ap-heat-cell { cursor:default; outline:none; }
.ap-heat-cell:hover,.ap-heat-cell:focus-visible { z-index:5; box-shadow:0 0 0 2px #fff,0 0 0 3px #45866f; }
.ap-heat-cell > span { position:absolute; bottom:16px; left:50%; z-index:20; display:none; width:max-content; max-width:210px; transform:translateX(-50%); padding:7px 9px; border:1px solid #e7ddcf; border-radius:9px; background:#fff; box-shadow:0 9px 23px rgba(60,45,20,.17); direction:rtl; text-align:right; }
.ap-heat-cell:hover > span,.ap-heat-cell:focus-visible > span { display:grid; gap:1px; }
.ap-heat-cell > span b { color:#443c32; font-size:9px; font-style:normal; }
.ap-heat-cell > span strong { color:#27755f; font-size:10px; font-style:normal; }
.ap-heat-cell > span small { color:#958a7b; font-size:7.5px; font-style:normal; white-space:nowrap; }
.ap-heat-legend { display:flex; align-items:center; justify-content:flex-end; gap:3px; margin-top:5px; color:#aaa094; font-size:7px; font-weight:700; direction:ltr; }
.admin-first-login-note > div,.auth-security-note { display:grid; gap:3px; padding:10px 12px; border:1px solid #cfe7dc; border-radius:11px; color:#286f5b; background:#edf8f3; }
.admin-first-login-note b,.auth-security-note { font-size:11px; font-weight:850; }
.admin-awaiting-password { display:block; margin-top:3px; color:#a76b16; font-size:8.5px; font-weight:800; white-space:nowrap; }
.admin-first-login-note b { display:flex; align-items:center; gap:5px; }
.admin-first-login-note small { color:#708b80; font-size:9.5px; font-weight:700; }
.auth-security-note { grid-template-columns:auto 1fr; align-items:center; margin:0 0 12px; line-height:1.8; }
.auth-security-note .ui-icon { width:16px; height:16px; }

/* بخش‌های مدیریت حساب در مودال ویرایش مدیر (تعلیق + دسترسی‌ها) */
.am-block { margin-top:16px; padding:13px 14px; border:1px solid #f0ebe2; border-radius:13px; background:#fdfbf8; }
.am-block h3 { display:flex; align-items:center; gap:6px; margin:0 0 10px; color:#332c24; font-size:11.5px; font-weight:900; }
.am-block h3 .ui-icon { width:15px; height:15px; }
.am-toggle { display:grid; grid-template-columns:auto 1fr; align-items:start; gap:9px; padding:10px 12px; border:1px solid #f0ebe2; border-radius:11px; background:#fff; cursor:pointer; }
.am-toggle input { width:16px; height:16px; margin-top:2px; accent-color:#c2554c; cursor:pointer; }
.am-toggle b { display:block; color:#332c24; font-size:11px; font-weight:850; }
.am-toggle small { display:block; margin-top:3px; color:#8f8577; font-size:9.5px; font-weight:700; line-height:1.7; }
.am-toggle.on { border-color:#f0cdc7; background:#fdf4f2; }
.am-toggle.on b { color:#a8443c; }
.am-access-empty { margin:0; padding:11px 12px; border:1px dashed #e7e0d4; border-radius:11px; color:#aaa093; font-size:10px; font-weight:700; text-align:center; }
.am-access-list { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
.am-access-list li { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 11px; border:1px solid #f0ebe2; border-radius:11px; background:#fff; }
.am-access-copy { display:flex; align-items:center; gap:8px; min-width:0; }
.am-access-copy b { overflow:hidden; color:#332c24; font-size:11px; font-weight:850; text-overflow:ellipsis; white-space:nowrap; }
.am-access-copy small { color:#aaa093; font-size:9px; font-weight:700; white-space:nowrap; }
.am-access-add { margin-top:9px; }
.am-access-copy .access-lesson-chips { flex:0 1 auto; }

/* انتخابگر «بخش + دامنه»: نقشِ پوشه‌محور انتخابگر پوشه می‌گیرد و نقشِ درس‌محور چیپ درس.
   حالت درس‌محور ستونی می‌شود چون شبکهٔ درس‌ها به تمام عرض نیاز دارد. */
.access-scope-picker { display:grid; grid-template-columns:minmax(110px,.8fr) minmax(0,1.6fr) auto; gap:8px; align-items:start; }
.access-scope-picker select { min-width:0; }
.access-scope-picker.lesson-mode { display:flex; flex-direction:column; align-items:stretch; }
.access-scope-picker.lesson-mode > button { align-self:flex-start; }
.access-lesson-hint { margin:0 0 7px; color:#8f8577; font-size:9.5px; font-weight:700; line-height:1.7; }
.access-lesson-grid { display:flex; flex-wrap:wrap; gap:6px; max-height:150px; overflow-y:auto; padding:8px; border:1px solid #f0ebe2; border-radius:11px; background:#fff; }
.access-lesson-opt { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border:1px solid #f0ebe2; border-radius:999px; background:#fbf9f5; color:#665c4e; cursor:pointer; font-size:10px; font-weight:800; }
/* ورودی چک‌باکس داخل مودال قاعدهٔ ارتفاع ۴۴px فرم را می‌گیرد؛ اینجا صریح بازنویسی می‌شود */
.access-lesson-grid .access-lesson-opt input[type="checkbox"] {
  flex:0 0 auto; width:13px; min-width:13px; height:13px; min-height:13px; margin:0; padding:0; accent-color:var(--primary);
}
.access-lesson-opt:has(input:checked) { border-color:#c9b9f7; background:#f3eeff; color:#4a3a86; }
.access-lesson-chips { display:inline-flex; flex-wrap:wrap; gap:4px; min-width:0; }
.access-lesson-chips b { padding:2px 8px; border-radius:999px; background:#f3eeff; color:#4a3a86; font-size:9.5px; font-weight:850; }
@media (max-width:640px) { .access-scope-picker, .access-scope-picker.lesson-mode { grid-template-columns:1fr; } }

/* ===== رتبه‌بندی مدیران (amx) — کارت‌محور، شمارش یکتای هر سؤال ===== */
.amx-panel { overflow:hidden; }
.amx-panel .panel-header { flex-wrap:wrap; }
.amx-loading { display:flex; align-items:center; justify-content:center; gap:9px; padding:38px 18px; color:#a3907a; font-size:12.5px; font-weight:800; }
.amx-loading .ui-icon { width:17px; height:17px; animation:amx-spin 1.5s linear infinite; }
@keyframes amx-spin { to { transform:rotate(360deg); } }

.amx-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:15px 19px 4px; }
.amx-tile { display:flex; align-items:center; gap:11px; min-width:0; padding:13px 14px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(180deg,#fff,#fcfaf6); }
.amx-tile .ui-icon { flex:0 0 auto; width:19px; height:19px; color:#c2a271; }
.amx-tile > span { display:grid; gap:1px; min-width:0; }
.amx-tile b { color:#2c261e; font-size:19px; font-weight:950; line-height:1.2; }
.amx-tile small { color:#8d8375; font-size:11px; font-weight:800; }
.amx-tile i { overflow:hidden; color:#a99e8e; font-size:9.5px; font-style:normal; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }

.amx-sort { display:flex; flex-wrap:wrap; gap:6px; padding:14px 19px 10px; }
.amx-sort button { padding:7px 14px; border:1px solid #e8e0d4; border-radius:999px; color:#7d7466; background:#fff; font-size:12px; font-weight:800; cursor:pointer; transition:.16s; }
.amx-sort button:hover { border-color:#d8c9ae; color:#4f4739; }
.amx-sort button[aria-selected="true"] { border-color:#2c261e; color:#fff; background:#2c261e; }

.amx-list { display:grid; gap:10px; padding:4px 19px 19px; }
.amx-card { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:#fff; transition:box-shadow .18s,border-color .18s; }
.amx-card:hover { border-color:#e0d5c2; box-shadow:0 8px 22px rgba(48,40,28,.06); }
.amx-card.open { border-color:#d9cdb6; box-shadow:0 10px 26px rgba(48,40,28,.075); }
.amx-head { display:grid; grid-template-columns:auto minmax(150px,1.35fr) auto minmax(0,2.1fr) auto; align-items:center; gap:14px; padding:13px 15px; }

.amx-rank { display:grid; place-items:center; gap:0; width:38px; height:44px; border-radius:12px; color:#8d8477; background:#f6f3ed; }
.amx-rank b { font-size:14px; font-weight:950; }
.amx-rank .ui-icon { width:13px; height:13px; margin-bottom:-1px; }
.amx-rank.top-1 { color:#8a5c05; background:linear-gradient(180deg,#ffeaa4,#ffdd7a); }
.amx-rank.top-2 { color:#5f6b76; background:linear-gradient(180deg,#edf1f4,#dde4e9); }
.amx-rank.top-3 { color:#93542c; background:linear-gradient(180deg,#f6dcc7,#eec7a8); }

.amx-identity { display:flex; align-items:center; gap:10px; min-width:0; }
.amx-identity .avatar { flex:0 0 auto; width:44px; height:44px; }
.amx-identity > span { display:grid; gap:2px; min-width:0; }
.amx-identity strong { overflow:hidden; color:#332c24; font-size:14px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
.amx-identity > span > small { overflow:hidden; color:#a1978a; font-size:10px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.amx-tags { display:flex; flex-wrap:wrap; align-items:center; gap:5px; margin-top:2px; }
.amx-tags .badge { padding:3px 8px; font-size:9px; }
.amx-tags i { color:#a49a8c; font-size:9.5px; font-style:normal; font-weight:750; white-space:nowrap; }
.amx-tags em { color:#b0761c; font-size:9.5px; font-style:normal; font-weight:850; }

/* جدول مدیران: هر ردیف دقیقاً همان ستون‌های ردیف‌های دیگر را دارد و داخل هر
   ستون هم سه سطر ثابت (عنوان / مقدار / توضیح) زیر هم می‌نشیند، پس عناصر هم‌نام
   در همهٔ ردیف‌ها هم‌تراز می‌مانند. */
.amx-manager-scroll { overflow-x:auto; scrollbar-width:thin; }
/* ۹ ستون با کف باریک، بدون gap و با پدینگ کم، تا کل ردیف در یک صفحه جا شود و
   نوار اسکرول افقی زیر کارت‌ها ظاهر نشود. */
.amx-manager-row { display:grid; grid-template-columns:minmax(160px,1.5fr) minmax(96px,.9fr) minmax(92px,.75fr) minmax(86px,.78fr) minmax(50px,.46fr) repeat(4,minmax(82px,.92fr)) 72px; align-items:stretch; gap:0; min-width:872px; padding:9px 12px; }
.amx-manager-cell { display:grid; grid-template-rows:13px 24px 13px; align-content:center; justify-items:center; gap:2px; min-width:0; min-height:54px; padding-inline:7px; text-align:center; border-inline-start:1px solid #f0ebe2; }
.amx-manager-cell:first-child { border-inline-start:0; }
.amx-manager-cell > small { align-self:center; overflow:hidden; color:#aaa093; font-size:8.5px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.amx-manager-cell > b { display:flex; align-items:center; justify-content:center; max-width:100%; overflow:hidden; color:#332c24; font-size:11.5px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
.amx-manager-cell > i { align-self:center; overflow:hidden; color:#aaa093; font-size:8.5px; font-style:normal; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
/* آواتار هر سه سطر ستون نام را می‌گیرد تا جای خالی کنارش پر و خودش درشت شود */
.amx-manager-person { grid-template-columns:auto minmax(0,1fr); grid-template-areas:"av label" "av value" "av note"; column-gap:10px; justify-items:stretch; text-align:start; }
.amx-manager-avatar { grid-area:av; align-self:center; }
.amx-manager-person > small { grid-area:label; }
.amx-manager-person > b { grid-area:value; display:block; font-size:12.5px; }
.amx-manager-person > i { grid-area:note; }
.amx-manager-person .avatar { width:44px; height:44px; flex:0 0 44px; place-items:center; }
.amx-manager-person .avatar > .avatar-img,.amx-manager-person .avatar > .avatar-empty { width:100%; height:100%; object-fit:cover; display:block; }
.amx-manager-uid { color:#8f8577; }
.amx-manager-uid bdi { font-weight:850; }
.amx-manager-cell .badge { width:max-content; max-width:100%; padding:2px 7px; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.amx-manager-metric > b { font-size:13.5px; }
/* در نمایشگر باریک که ردیف ناچار اسکرول می‌خورد، دکمه‌ها از دید خارج نشوند */
.amx-manager-row .amx-tools { position:sticky; inset-inline-end:0; z-index:2; align-self:stretch; align-items:center; justify-self:end; gap:2px; padding-inline:8px 0; background:linear-gradient(to right,#fff 74%,rgba(255,255,255,0)); }
.amx-manager-card.suspended { opacity:.72; }
.amx-manager-card.suspended .amx-manager-person > b { text-decoration:line-through; text-decoration-color:#d0857f; }

.amx-score { display:grid; justify-items:center; gap:4px; --amx-tone:#c2a271; }
.amx-score[data-tone="high"] { --amx-tone:#1aa392; }
.amx-score[data-tone="mid"] { --amx-tone:#d9a52b; }
.amx-score[data-tone="low"] { --amx-tone:#d78a6a; }
.amx-ring { position:relative; display:grid; place-items:center; width:54px; height:54px; border-radius:50%; background:conic-gradient(var(--amx-tone) var(--amx-ring,0%),#f0ece4 0); }
.amx-ring::after { position:absolute; inset:5px; border-radius:50%; background:#fff; content:""; }
.amx-ring b { position:relative; z-index:1; color:#2f2820; font-size:13px; font-weight:950; letter-spacing:-.2px; }
.amx-score small { color:#a1978a; font-size:9px; font-weight:800; }

.amx-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; min-width:0; margin:0; padding:0; list-style:none; }
.amx-kpis li { display:grid; gap:1px; min-width:0; padding:8px 9px; border:1px solid #f0ebe2; border-radius:11px; background:#fcfaf7; text-align:center; }
.amx-kpis b { overflow:hidden; color:#2f2820; font-size:15px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
.amx-kpis span { color:#8b8173; font-size:10px; font-weight:800; }
.amx-kpis small { overflow:hidden; color:#aaa093; font-size:9px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }

.amx-tools { display:flex; align-items:center; gap:4px; }
.amx-tools .row-action { width:30px; height:30px; margin:0; }
.amx-expand { display:grid; place-items:center; width:30px; height:30px; border:1px solid #e8e0d4; border-radius:9px; color:#8b8173; background:#fff; cursor:pointer; transition:.16s; }
.amx-expand:hover { border-color:#d3c4a8; color:#40382d; }
.amx-expand .ui-icon { width:15px; height:15px; transition:transform .2s; }
.amx-expand[aria-expanded="true"] { border-color:#2c261e; color:#fff; background:#2c261e; }
.amx-expand[aria-expanded="true"] .ui-icon { transform:rotate(180deg); }

.amx-detail { display:grid; gap:12px; padding:2px 15px 15px; border-top:1px dashed #ebe4d8; margin-top:2px; padding-top:14px; }
.amx-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.amx-detail-grid.single { grid-template-columns:minmax(0,1fr); }
.amx-detail-grid.single .amx-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:22px; }
.amx-side { padding:13px 14px; border:1px solid #f0ebe2; border-radius:14px; background:#fcfaf7; }
.amx-side h4,.amx-breakdown h4 { display:flex; align-items:center; gap:6px; margin:0 0 9px; color:#4b4337; font-size:12px; font-weight:900; }
.amx-side h4 .ui-icon,.amx-breakdown h4 .ui-icon { width:15px; height:15px; color:#c2a271; }
.amx-stats { display:grid; gap:1px; margin:0; padding:0; list-style:none; }
.amx-stats li { display:grid; grid-template-columns:1fr auto; align-items:baseline; gap:4px 10px; padding:7px 0; border-bottom:1px solid #f2ede4; }
.amx-stats li:last-child { border-bottom:0; }
.amx-stats li > span { color:#877d6f; font-size:11.5px; font-weight:750; }
.amx-stats li > b { color:#2f2820; font-size:13.5px; font-weight:900; text-align:left; white-space:nowrap; }
.amx-stats li > small { grid-column:1 / -1; margin-top:-3px; color:#a89e90; font-size:9.5px; font-weight:700; }

.amx-breakdown { padding:13px 14px; border:1px solid #f0ebe2; border-radius:14px; background:#fff; }
.amx-bar { display:grid; grid-template-columns:minmax(120px,auto) 1fr auto; align-items:center; gap:10px; padding:5px 0; }
.amx-bar > span { display:flex; align-items:baseline; gap:5px; color:#7f7568; font-size:11.5px; font-weight:800; }
.amx-bar > span i { color:#b3a998; font-size:9px; font-style:normal; font-weight:700; }
.amx-bar > em { position:relative; display:block; height:8px; border-radius:99px; background:#ece5da; }
.amx-bar > em::after { position:absolute; inset-block:0; inset-inline-start:0; width:var(--amx-bar,0%); border-radius:99px; background:linear-gradient(-90deg,#efa94f,#1aa392); content:""; }
.amx-bar > b { min-width:26px; color:#2f2820; font-size:12.5px; font-weight:900; text-align:left; }
.amx-breakdown p { margin:9px 0 0; color:#a1978a; font-size:10px; font-weight:700; line-height:1.8; }

.amx-self .amx-head { grid-template-columns:auto minmax(150px,1.3fr) auto minmax(0,2fr); }

@media (max-width:1180px) {
  .amx-head { grid-template-columns:auto minmax(140px,1fr) auto auto; grid-template-areas:"rank identity score tools" "kpis kpis kpis kpis"; }
  .amx-head > .amx-rank { grid-area:rank; }
  .amx-head > .amx-identity { grid-area:identity; }
  .amx-head > .amx-score { grid-area:score; }
  .amx-head > .amx-kpis { grid-area:kpis; }
  .amx-head > .amx-tools { grid-area:tools; }
  .amx-self .amx-head { grid-template-columns:auto minmax(140px,1fr) auto; grid-template-areas:"rank identity score" "kpis kpis kpis"; }
}
@media (max-width:820px) {
  .amx-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .amx-detail-grid { grid-template-columns:1fr; }
  .amx-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .amx-bar { grid-template-columns:1fr auto; grid-template-areas:"label value" "track track"; }
  .amx-bar > span { grid-area:label; }
  .amx-bar > em { grid-area:track; }
  .amx-bar > b { grid-area:value; }
}
@media (max-width:640px) {
  .amx-summary,.amx-sort,.amx-list { padding-inline:11px; }
  .amx-head { grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"rank identity score" "kpis kpis kpis" "tools tools tools"; gap:10px; padding:11px; }
  .amx-self .amx-head { grid-template-areas:"rank identity score" "kpis kpis kpis"; }
  .amx-rank { width:32px; height:38px; }
  .amx-identity { gap:8px; }
  .amx-identity .avatar { width:38px; height:38px; }
  .amx-score { justify-items:end; }
  .amx-ring { width:46px; height:46px; }
  .amx-ring b { font-size:12px; }
  .amx-score small { display:none; }
  .amx-tile i { white-space:normal; }
  .amx-tools { justify-content:flex-end; padding-top:2px; border-top:1px solid #f4efe6; }
  .amx-detail { padding-inline:11px; }
  .amx-detail-grid.single .amx-stats { grid-template-columns:minmax(0,1fr); }
  .amx-sort { gap:5px; }
  .amx-sort button { padding:6px 11px; font-size:11px; }
}

/* هیت‌مپ تمام‌عرض مدیران؛ هر پله ۲۰ فعالیت و سطح آخر از ۱۰۰ به بالا */
.ap-full-panel { margin-top:18px; overflow:hidden; }
.ap-heat-empty { padding:34px; }
.ap-admin-heatmap-card.ap-full-panel { overflow:visible; }
.ap-admin-heatmap-card > header { align-items:center; }
.ap-admin-heatmap-card > header > div:first-child { min-width:0; }
.ap-admin-heatmap-card > header > div:first-child small { overflow:hidden; max-width:min(560px,52vw); text-overflow:ellipsis; white-space:nowrap; }
.ap-admin-heat-tools { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.ap-admin-heat-select { display:flex; align-items:center; gap:6px; color:#8a8176; font-size:8.5px; font-weight:800; }
.ap-admin-heat-select select { min-width:165px; height:31px; padding:3px 8px; border:1px solid #e1d8cc; border-radius:8px; color:#5d5449; background:#fff; font:inherit; font-size:9px; font-weight:750; outline:none; }
.ap-admin-heat-tip .created i { background:#df7a32; }
.ap-admin-heat-tip .approved i { background:#2f9e83; }
@media (max-width:640px) {
  .ap-admin-heatmap-card > header { align-items:flex-start; }
  .ap-admin-heatmap-card > header > div:first-child { display:grid; gap:1px; }
  .ap-admin-heatmap-card > header > div:first-child small { max-width:48vw; }
  .ap-admin-heat-tools { align-items:flex-end; flex-direction:column-reverse; }
  .ap-admin-heat-select span { display:none; }
  .ap-admin-heat-select select { min-width:135px; max-width:42vw; }
}
@media (max-width:640px) {
  .aa-controls { gap:8px; }
  .aa-seg button { padding:6px 10px; font-size:12px; }
  .aa-legend { flex:1 1 100%; }
}

/* ===== نمودار روند رشد سؤال‌ها (فیلتر پایه/رشته + سری‌های مخزن/پنل) ===== */
/* سه ناحیهٔ روشن: بازهٔ زمانی راست، فیلتر پایه/رشته وسط، نوع رشد چپ */
.qt-controls {
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(300px,auto) minmax(220px,1fr);
  align-items:start;
  gap:14px 20px;
  direction:rtl;
}
.qt-gran-wrap { justify-self:start; }
.qt-mode-wrap { justify-self:end; }
.qt-gran-wrap,.qt-mode-wrap { display:flex; align-items:center; }
.question-trend-panel .qt-filters { display:flex; flex-direction:column; align-items:center; gap:7px; min-width:0; justify-self:center; }
.question-trend-panel .qt-filter-group { justify-content:center; }
.qt-filter-group { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.qt-filter-label { font-size:11.5px; font-weight:700; color:#9a8c78; margin-inline-end:2px; min-width:34px; }
.qt-chip {
  border:1px solid #e8e0d3; background:#faf7f1; cursor:pointer; font:inherit; font-size:12px; font-weight:600;
  color:#7a6f5d; padding:5px 12px; border-radius:20px; transition:all .15s ease;
}
.qt-chip:hover { border-color:#d9cdb8; color:#5f5647; }
.qt-chip.on { background:var(--orange,#e8722a); border-color:var(--orange,#e8722a); color:#fff; box-shadow:0 2px 7px rgba(232,114,42,.28); }
.qt-dot { display:inline-block; width:9px; height:9px; border-radius:3px; margin-inline-end:2px; vertical-align:middle; }
.aa-tip-row.qt-tip-row { grid-template-columns:1fr auto; }
.aa-tip-row.qt-tip-row b { font-size:13.5px; color:#2c261d; }
.qt-legend .aa-legend-main small { color:#8a7f6d; }
@media (max-width:640px) {
  .qt-filter-label { min-width:100%; margin-bottom:-2px; }
}
@media (max-width:980px) {
  .qt-controls { grid-template-columns:1fr 1fr; }
  .question-trend-panel .qt-filters { grid-column:1 / -1; grid-row:2; width:100%; }
  .qt-gran-wrap { grid-column:1; grid-row:1; justify-self:start; }
  .qt-mode-wrap { grid-column:2; grid-row:1; justify-self:end; }
}
@media (max-width:640px) {
  .qt-controls { grid-template-columns:1fr; }
  .qt-gran-wrap,.qt-mode-wrap,.question-trend-panel .qt-filters { grid-column:1; width:100%; justify-self:stretch; }
  .qt-gran-wrap { grid-row:1; }
  .question-trend-panel .qt-filters { grid-row:2; }
  .qt-mode-wrap { grid-row:3; }
  .qt-gran-wrap .aa-seg,.qt-mode-wrap .aa-seg { width:100%; }
  .qt-gran-wrap .aa-seg button,.qt-mode-wrap .aa-seg button { flex:1; }
}

/* ===== بانک آزمون: درخت پوشه‌ها + انتخاب + بودجه‌بندی + ساخت ===== */
.exam-bank .exam-panel-head { margin-bottom: 6px; }
.eb-layout { align-items: start; }
.eb-side .eb-topic-btn { width: 100%; justify-content: center; margin-top: 4px; }
.eb-active-toggle { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 3px 8px; cursor: pointer; background: #faf7f1; border: 1px solid #ece4d6; border-radius: 11px; padding: 9px 11px; margin: 8px 0 2px; }
.eb-active-toggle input { grid-row: span 2; width: 17px; height: 17px; accent-color: #1baf7a; cursor: pointer; }
.eb-active-toggle span { font-size: 12.5px; font-weight: 650; color: #2c261d; }
.eb-active-toggle small { font-size: 10.5px; color: #9a8c78; }
.eb-side-note { font-size: 11.5px; color: var(--muted); line-height: 1.9; margin: 10px 2px 0; }
.eb-topic-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 8px; }
.eb-topic-chip { display: inline-flex; align-items: center; gap: 5px; background: #eef3fc; color: #3a5fa0; border: 1px solid #d3e0f5; border-radius: 20px; padding: 4px 6px 4px 11px; font-size: 11.5px; font-weight: 600; }
.eb-topic-chip button { border: 0; background: none; cursor: pointer; color: inherit; display: inline-flex; padding: 0; opacity: .7; }
.eb-topic-chip button:hover { opacity: 1; }
.eb-topic-chip .ui-icon { width: 13px; height: 13px; }
.eb-main { min-width: 0; }
/* درخت */
.eb-tree { display: grid; gap: 3px; border: 0; border-radius: 0; background: transparent; padding: 0 4px; overflow: visible; }
.eb-node { min-width: 0; }
/* همان بازشدن نرمِ درخت تحلیل پاسخ‌گویی: ارتفاع، محوشدن و خط راهنمای نقطه‌چین */
.eb-children-anim { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .32s cubic-bezier(.33,1,.68,1); }
.eb-children-anim.open { grid-template-rows: 1fr; }
.eb-children { min-height: 0; overflow: hidden; margin-inline-start: 18px; padding-inline-start: 7px; border-inline-start: 1px dashed #e9decd; opacity: 0; transform: translateY(-5px); transition: opacity .26s ease, transform .32s cubic-bezier(.33,1,.68,1); }
.eb-children-anim.open > .eb-children { opacity: 1; transform: none; }
.eb-row { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 0; min-height: 42px; position: relative; }
.eb-row:hover { background: transparent; }
/* شاخه‌ها (پوشه‌های میانی): پررنگ‌تر تا سلسله‌مراتب پیدا باشد */
.eb-branch > .eb-name > b { font-weight: 800; }
.eb-branch.open,
.eb-branch.open:hover { background: transparent; }
.eb-branch.open > .eb-caret { background: transparent; color: #9a8c78; }
.eb-branch > .eb-badges,
.eb-branch > .eb-check-sp { display: none; }
/* آزمون‌های آماده: کارت‌مانند و برجسته */
.eb-exam { background: #fcfbf7; border: 1px solid #f0e7d6; margin-block: 3px; }
.eb-exam:hover { background: #fdf6ec; border-color: #e6d6bf; }
.eb-pending { opacity: .72; }
.eb-row.picked { background: transparent; border-color: #f0e7d6; box-shadow: none; }
.eb-caret { border: 0; background: transparent; cursor: pointer; width: 20px; height: 24px; border-radius: 0; display: inline-grid; place-items: center; color: #9a8c78; flex: 0 0 auto; }
.eb-caret:hover { background: transparent; color: #7f7465; }
.eb-caret .ui-icon { width: 15px; height: 15px; transform: rotate(90deg); transition: transform .18s ease; }
.eb-caret.open { transform: none; }
.eb-caret.open .ui-icon { transform: rotate(0); }
.eb-caret-sp, .eb-check-sp { width: 24px; flex: 0 0 auto; }
.eb-check { display: inline-grid; place-items: center; width: 24px; flex: 0 0 auto; cursor: pointer; }
.eb-check input { width: 17px; height: 17px; accent-color: #8a7f6d; cursor: pointer; }
.eb-name { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; cursor: default; }
.eb-row [data-eb-toggle].eb-name, .eb-caret[data-eb-toggle] { cursor: pointer; }
.eb-title-line { min-width: 0; display: flex; align-items: baseline; gap: 9px; }
.eb-title-line > b { font-size: 13px; font-weight: 700; color: #2c261d; flex: 0 0 auto; }
.eb-branch-count { margin-inline-start: 5px; color: #a89b87; font-size: 9.5px; font-weight: 650; }
.eb-title-line > small, .eb-title-line > .eb-path { min-width: 0; color: #aa9d88; font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eb-path, .eb-pick-topics, .eb-stage-topics { display: inline-flex; align-items: center; gap: 4px; direction: rtl; }
.eb-path > span, .eb-pick-topics > span, .eb-stage-topics > span { white-space: nowrap; }
.eb-path-sep { direction: ltr; unicode-bidi: isolate; color: #aa9d88; font-style: normal; line-height: 1; }
.eb-path-break { color: #c4b8a5; margin-inline: 2px; }
.eb-branch > .eb-name .eb-title-line > b { font-weight: 800; }
.eb-badges { display: inline-flex; gap: 5px; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; }
.eb-badge { font-size: 10.5px; font-weight: 700; border-radius: 8px; padding: 3px 8px; white-space: nowrap; }
.eb-badge.exams { background: #e7f5f2; color: #1f7f73; }
.eb-badge.qs { background: #f1ece1; color: #8a7048; }
.eb-badge.pending { background: #fdefe7; color: #b26a2a; }
.eb-badge.match { background: #eef3fc; color: #3a5fa0; }
.eb-join { border: 0; background: var(--orange, #e8722a); color: #fff; cursor: pointer; border-radius: 9px; padding: 6px 11px; font-size: 11.5px; font-weight: 700; display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; white-space: nowrap; transition: background .15s ease; }
.eb-join:hover { background: #d5641f; }
.eb-join .ui-icon { width: 13px; height: 13px; }
/* نتایج فیلتر موضوعی */
.eb-results { display: grid; gap: 8px; }
.eb-results-head { font-size: 12px; color: var(--muted); margin-bottom: 2px; }
.eb-result { display: flex; align-items: center; gap: 9px; background: #fff; border: 1px solid #ece4d6; border-radius: 12px; padding: 9px 12px; transition: box-shadow .12s ease; }
.eb-result:hover { box-shadow: 0 3px 10px rgba(60,45,20,.08); }
.eb-result.picked { background: #fff5e9; box-shadow: inset 3px 0 0 var(--orange, #e8722a); }
.eb-result-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.eb-result-main b { font-size: 13px; color: #2c261d; }
.eb-result-main small { font-size: 10.5px; color: #b3a790; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* خلاصهٔ انتخاب */
.eb-summary { margin-top: 14px; border: 1px solid #e7dfd0; border-radius: 14px; background: linear-gradient(135deg, #fdfaf4, #fbf7ef); padding: 13px 14px; }
.eb-summary-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.eb-summary-head b { font-size: 13.5px; color: #2c261d; }
.eb-clear { border: 0; background: none; cursor: pointer; color: #c0392b; font: inherit; font-size: 12px; font-weight: 600; }
.eb-picks { display: grid; gap: 7px; margin-bottom: 12px; }
.eb-pick-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto 28px; align-items: center; gap: 10px; background: #fff; border: 1px solid #ece4d6; border-radius: 11px; padding: 9px; min-width: 0; }
.eb-pick-rank { width: 25px; height: 25px; border-radius: 8px; display: grid; place-items: center; background: #f4efe7; color: #7c6f5d; font-size: 11px; }
.eb-pick-title { min-width: 0; display: flex; align-items: center; gap: 12px; overflow: hidden; }
.eb-pick-name { min-width: 0; max-width: 36%; flex: 0 1 auto; align-self: center; color: #2c261d; font-size: 12px; font-weight: 850; line-height: 1.55; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eb-pick-title > .eb-path { min-width: 0; flex: 1 1 auto; justify-content: flex-start; color: #b3a790; font-size: 9.8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eb-pick-topics { min-width: 0; max-width: 100%; justify-content: flex-start; overflow: hidden; color: #8f826e; font-size: 10.5px; white-space: nowrap; }
.eb-pick-topic-group { min-width: 0; max-width: 100%; display: inline-flex; align-items: center; gap: 5px; overflow: hidden; }
.eb-pick-topic-group > b { max-width: 105px; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #80623d; font-size: 10.5px; }
.eb-pick-topic-group > em { flex: 0 0 auto; color: #b09f88; font-style: normal; }
.eb-pick-chapters { min-width: 0; display: inline-flex; align-items: center; gap: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eb-pick-chapters i { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; }
.eb-pick-chapters u { color: #c5b8a5; text-decoration: none; }
.eb-pick-count { font-size: 10.5px; color: #8a7048; font-weight: 700; white-space: nowrap; }
.eb-pick-row button { border: 0; background: #f4f1ec; cursor: pointer; width: 26px; height: 26px; border-radius: 7px; display: inline-grid; place-items: center; color: #9a8c78; }
.eb-pick-row button:hover { background: #ecd9cc; color: #b23; }
.eb-pick-row button .ui-icon { width: 12px; height: 12px; }
.eb-budget { background: #fff; border: 1px solid #efe6d7; border-radius: 12px; padding: 10px 12px; margin-bottom: 12px; }
.eb-budget-title { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: #6f6353; margin-bottom: 8px; }
.eb-budget-title small { color: #b3a790; font-weight: 500; }
.eb-budget-title .ui-icon { width: 15px; height: 15px; color: var(--orange, #e8722a); }
.eb-budget-row { display: grid; grid-template-columns: minmax(0, 1fr) 146px 28px; align-items: center; gap: 9px; padding: 6px 0; font-size: 12.5px; border-top: 1px dashed #f2ece1; position: relative; white-space: nowrap; }
.eb-budget-row:first-of-type { border-top: 0; }
.eb-budget-row b { color: #2c261d; }
.eb-budget-main { min-width: 0; width: 100%; display: inline-flex; align-items: center; gap: 12px; overflow: hidden; }
.eb-budget-path { min-width: 0; display: inline-flex; align-items: center; gap: 5px; overflow: hidden; direction: rtl; white-space: nowrap; }
.eb-budget-path i { min-width: 0; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-weight: 650; color: #50483d; }
.eb-budget-path em { display: inline-grid; color: #b5a68f; font-style: normal; font-size: 13px; line-height: 1; direction: ltr; }
.eb-budget-source { min-width: 0; max-width: 34%; display: inline-flex; align-items: center; gap: 4px; color: #a0917b; font-size: 9.5px; overflow: hidden; white-space: nowrap; }
.eb-budget-source b { flex: 0 0 auto; color: #a46b43; font-size: 9.5px; }
.eb-budget-source i { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; }
.eb-budget-actions { width: 146px; display: grid; grid-template-columns: 90px 48px; align-items: center; gap: 8px; flex: 0 0 146px; white-space: nowrap; }
.eb-budget-detail-wrap { width: 90px; display: inline-flex; align-items: center; position: relative; flex: 0 0 90px; }
.eb-budget-detail-btn { width: 100%; border: 1px solid #eadfce; background: #fbf8f2; color: #806f58; border-radius: 8px; padding: 3px 8px; font: inherit; font-size: 9.5px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.eb-budget-detail-btn:hover, .eb-budget-detail-btn[aria-expanded="true"] { border-color: #efb68e; background: #fff3e9; color: #c86020; }
.eb-budget-popover { position: absolute; z-index: 12; inset-block-start: calc(100% + 7px); inset-inline-start: auto; inset-inline-end: 0; width: min(310px, 78vw); max-height: min(320px, 55vh); overflow: auto; display: grid; gap: 5px; padding: 9px; border: 1px solid #e7dccb; border-radius: 11px; background: #fff; box-shadow: 0 12px 30px rgba(61,45,24,.14); }
.eb-budget-popover::before { content: ""; position: absolute; inset-block-start: -5px; inset-inline-start: auto; inset-inline-end: 18px; width: 9px; height: 9px; background: #fff; border-left: 1px solid #e7dccb; border-top: 1px solid #e7dccb; transform: rotate(45deg); }
.eb-budget-popover-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.eb-budget-popover-head { padding-bottom: 5px; border-bottom: 1px solid #f0e9dd; }
.eb-budget-popover-head strong { font-size: 10.5px; color: #4f463a; }
.eb-budget-popover-head button { border: 0; background: #f5f1ea; color: #8d8170; width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; cursor: pointer; }
.eb-budget-popover-head .ui-icon { width: 11px; height: 11px; }
.eb-budget-section { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto 24px; align-items: center; gap: 7px; padding: 3px 2px; }
.eb-budget-section i { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-size: 10.5px; color: #675c4e; }
.eb-budget-section b { flex: 0 0 auto; font-size: 9.5px; color: #9a7652; background: #f6f0e7; border-radius: 7px; padding: 2px 6px; }
.eb-budget-remove, .eb-budget-section-remove { border: 0; background: #f7f2eb; color: #a28e75; border-radius: 7px; width: 26px; height: 26px; display: inline-grid; place-items: center; cursor: pointer; }
.eb-budget-section-remove { width: 24px; height: 24px; }
.eb-budget-remove:hover, .eb-budget-section-remove:hover { background: #fde9e5; color: #bf4b3d; }
.eb-budget-remove .ui-icon, .eb-budget-section-remove .ui-icon { width: 12px; height: 12px; }
.eb-budget-count { width: 48px; text-align: center; white-space: nowrap; font-size: 11px; }
.eb-budget-empty { margin: 4px 0 8px; padding: 9px 10px; border-radius: 9px; background: #fff4ea; color: #9a633d; font-size: 11px; }
.eb-budget-excluded { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-top: 8px; margin-top: 5px; border-top: 1px dashed #eee5d7; }
.eb-budget-excluded-label { color: #9b8e7b; font-size: 10px; font-weight: 700; white-space: nowrap; }
.eb-budget-excluded-list { min-width: 0; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.eb-budget-excluded-list button { max-width: 210px; border: 1px solid #eddcd2; background: #fff8f4; color: #a46247; border-radius: 8px; padding: 3px 7px; display: inline-flex; align-items: center; gap: 4px; font: inherit; font-size: 9.5px; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eb-budget-excluded-list button:hover { border-color: #e5aa88; color: #c15720; }
.eb-budget-excluded-list .ui-icon { width: 11px; height: 11px; flex: 0 0 auto; }
.eb-build { width: 100%; justify-content: center; }
.eb-build:disabled { opacity: .55; cursor: not-allowed; }
/* مودالِ ساخت */
.exam-bank-build { display: grid; gap: 14px; }
.exam-bank-build > .field { margin: 0; }
.eb-build-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.eb-delivery-field { margin: 0; }
.eb-delivery-field .seg-group { width: max-content; padding: 3px; }
.eb-delivery-field .seg { min-width: 72px; padding: 8px 14px; }
.eb-add-booklet { margin-bottom: 1px; }
.eb-booklet-list { display: grid; gap: 8px; }
.eb-booklet-card { display: grid; grid-template-columns: 30px minmax(0, 1fr) 118px 32px; align-items: end; gap: 9px; padding: 9px; border: 1px solid #eadfce; border-radius: 12px; background: #fdfbf7; }
.eb-booklet-card .field { margin: 0; }
.eb-booklet-card .field label { font-size: 10px; margin-bottom: 4px; }
.eb-booklet-card input { height: 38px; padding-block: 7px; }
.eb-booklet-index { width: 28px; height: 38px; border-radius: 9px; display: grid; place-items: center; background: #fff0e4; color: #d36520; }
.eb-booklet-time input { text-align: center; }
.eb-booklet-card .row-action { margin-bottom: 2px; }
.eb-stage-assignments { display: grid; gap: 7px; }
.eb-stage-row { display: grid; grid-template-columns: 20px 28px minmax(118px, auto) minmax(0, 1fr) auto 150px; align-items: center; gap: 10px; padding: 9px 10px; }
.eb-stage-name { align-self: center; margin-block-start: 3px; color: #2c261d; font-size: 12px; font-weight: 850; line-height: 1.55; }
.eb-stage-paths { min-width: 0; display: grid; align-content: center; gap: 5px; }
.eb-stage-paths > small { min-width: 0; color: #aea18c; font-size: 9.6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eb-stage-paths .eb-path, .eb-stage-paths .eb-stage-topics { justify-content: flex-start; }
.eb-stage-booklet { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px; }
.eb-stage-booklet > span { color: #9c8e79; font-size: 9.8px; }
.eb-stage-booklet select { min-width: 0; height: 36px; padding: 6px 9px; border: 1px solid #e2d8c8; border-radius: 9px; background: #fff; font: inherit; font-size: 11px; }
@media (max-width: 760px) {
  .eb-row { flex-wrap: wrap; }
  .eb-badges { width: 100%; justify-content: flex-start; padding-inline-start: 56px; }
  .eb-join { margin-inline-start: 56px; }
  .eb-build-toolbar { align-items: stretch; flex-direction: column; }
  .eb-add-booklet { align-self: stretch; justify-content: center; }
  .eb-booklet-card { grid-template-columns: 30px minmax(0, 1fr) 32px; }
  .eb-booklet-time { grid-column: 2; }
  .eb-stage-row { grid-template-columns: 20px 28px minmax(0, 1fr) auto; }
  .eb-stage-name { grid-column: 3; }
  .eb-stage-paths { grid-column: 3 / 5; }
  .eb-stage-booklet { grid-column: 3 / 5; }
  .eb-pick-row { grid-template-columns: 28px minmax(0, 1fr) auto 28px; }
  .eb-pick-title { gap: 7px; }
  .eb-pick-name { max-width: 48%; }
  .eb-budget-row { grid-template-columns: minmax(0, 1fr) 132px 28px; }
  .eb-budget-actions { width: 132px; grid-template-columns: 80px 44px; flex-basis: 132px; }
  .eb-budget-detail-wrap { width: 80px; flex-basis: 80px; }
  .eb-budget-count { width: 44px; }
  .eb-budget-path i { max-width: 120px; }
  .eb-budget-source { display: none; }
  .eb-budget-popover { width: min(238px, calc(100vw - 32px)); }
}

/* ===== سیستم پاداش و جریمهٔ ددلاین (نمای کلی) و صف بازبینی ===== */
.dl-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 14px;
  padding: 14px 16px;
}
.dl-card {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  background: var(--panel-soft);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dl-card.dl-timec-warn { border-color: #f0d98a; }
.dl-card.dl-timec-danger, .dl-card.dl-timec-over { border-color: #f0b3b3; }
.dl-card.dl-st-blocked { background: var(--red-soft); border-color: #f0b3b3; }
.dl-card.dl-st-completed { background: var(--panel); }
.dl-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.dl-card-title { display: flex; gap: 8px; align-items: flex-start; min-width: 0; }
.dl-card-title svg { width: 18px; height: 18px; color: var(--muted); flex-shrink: 0; margin-top: 2px; }
.dl-card-title b { display: block; font-size: 13.5px; }
.dl-card-title small { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }

/* رنگِ متنیِ باندها و وضعیت‌ها */
.dl-reward { color: var(--teal); }
.dl-penalty { color: var(--red); }
.dl-neutral { color: var(--muted); }
.dl-blocked { color: var(--red); }
.dl-done { color: var(--blue); }
.dl-neg { color: var(--red); }
.dl-timec-ok { color: var(--teal); }
.dl-timec-warn { color: var(--yellow); }
.dl-timec-danger, .dl-timec-over { color: var(--red); }

/* چیپِ وضعیت */
.dl-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  background: var(--panel);
  border: 1px solid var(--line);
}
.dl-badge.dl-reward, .dl-badge.dl-timec-ok { background: var(--teal-soft); border-color: transparent; }
.dl-badge.dl-penalty, .dl-badge.dl-blocked, .dl-badge.dl-timec-danger, .dl-badge.dl-timec-over { background: var(--red-soft); border-color: transparent; }
.dl-badge.dl-timec-warn { background: var(--yellow-soft); border-color: transparent; }
.dl-badge.dl-done { background: var(--blue-soft); border-color: transparent; }
.dl-badge.dl-neutral { background: var(--panel-soft); }

/* نوارِ زمانی (RTL — از راست پر می‌شود) */
.dl-track { position: relative; display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: var(--line); }
.dl-zone { height: 100%; width: 25%; }
.dl-zone.reward { background: rgba(26, 163, 146, 0.22); }
.dl-zone.neutral { background: rgba(70, 118, 232, 0.16); }
.dl-zone.pen1 { background: rgba(217, 165, 43, 0.24); }
.dl-zone.pen2 { background: rgba(222, 90, 90, 0.24); }
.dl-fill { position: absolute; inset-block: 0; inset-inline-start: 0; opacity: 0.92; }
.dl-marker { position: absolute; inset-block: -3px; width: 3px; border-radius: 2px; background: var(--ink); box-shadow: 0 0 0 2px var(--panel-soft); }
.dl-scale { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--muted); }

.dl-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.dl-metric { background: var(--panel); border: 1px solid var(--line); border-radius: 9px; padding: 6px 4px; text-align: center; }
.dl-metric small { display: block; color: var(--muted); font-size: 10px; margin-bottom: 2px; }
.dl-metric b { font-size: 12px; }

.dl-projection { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 12px; padding: 7px 2px 2px; border-top: 1px dashed var(--line); }
.dl-proj-amt { font-weight: 800; font-size: 13px; }
.dl-tiers { display: flex; flex-wrap: wrap; gap: 5px; }
.dl-tier { font-size: 10px; padding: 3px 7px; border-radius: 7px; background: var(--panel); border: 1px solid var(--line); color: var(--muted); }
.dl-tier.reward { background: var(--teal-soft); color: #12796b; border-color: transparent; }
.dl-tier.pen { background: var(--red-soft); color: #b64b4b; border-color: transparent; }

.dl-result { font-size: 12px; border-radius: 10px; padding: 9px 11px; display: flex; flex-direction: column; gap: 3px; }
.dl-result.dl-reward-bg { background: var(--teal-soft); }
.dl-result.dl-penalty-bg { background: var(--red-soft); }
.dl-result.dl-neutral-bg { background: var(--panel); border: 1px solid var(--line); }
.dl-settle-hint { color: var(--muted); font-size: 11px; }

.dl-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.dl-actions .secondary-button, .dl-actions .ghost-button { flex: 1; justify-content: center; font-size: 12px; }

/* مدتِ انتظار در صف بازبینی */
.review-wait { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.review-wait-time { font-size: 12px; white-space: nowrap; }
.review-wait .dl-badge { font-size: 10px; padding: 2px 7px; }

@media (max-width: 640px) {
  .dl-grid { grid-template-columns: 1fr; }
}

/* ===== تفکیکِ درآمد، پاداش و جریمه داخل هر میلهٔ پرداخت ===== */
.reward-legend { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; padding: 4px 16px 12px; font-size: 12px; }
.reward-legend .rl-item { display: inline-flex; align-items: center; gap: 6px; }
.reward-legend .rl-item.muted { color: var(--muted); font-size: 11px; }
.reward-legend .rl-swatch { width: 11px; height: 11px; border-radius: 3px; display: inline-block; flex: 0 0 11px; }
.reward-legend .rl-swatch.base { background: var(--chart-income-color, #ef8b43); }
.reward-legend .rl-swatch.pos { background: var(--teal); }
.reward-legend .rl-swatch.neg {
  background: repeating-linear-gradient(45deg, transparent 0 2px, rgba(217,108,100,.6) 2px 4px);
  border: 1px solid #d96c64;
}

/* ===== کنترل‌های مودالِ پاداش/جریمه ===== */
.rj-toggle { display: flex; gap: 8px; }
.rj-opt { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 9px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; font-weight: 600; background: var(--panel); }
.rj-opt input { display: none; }
.rj-opt.on { border-color: var(--orange); background: var(--orange-soft); color: var(--orange); }
.rj-selall { display: flex; align-items: center; gap: 8px; font-weight: 600; margin-bottom: 8px; cursor: pointer; }
.rj-admin-grid { display: grid; grid-template-columns: 1fr; gap: 6px; max-height: 240px; overflow-y: auto; }
.rj-admin { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.rj-admin.on { border-color: var(--teal); background: var(--teal-soft); }
.rj-admin-main { display: flex; align-items: center; gap: 8px; }
.rj-admin b { font-size: 11px; color: var(--muted); white-space: nowrap; }
.rj-total { margin-top: 12px; padding: 9px 11px; border-radius: 10px; background: var(--panel-soft); border: 1px solid var(--line); font-weight: 700; font-size: 12.5px; text-align: center; }

/* ===== صفحه‌بندی گزارش فعالیت ===== */
.pagination .page-gap { padding: 0 4px; color: var(--muted); align-self: center; }

/* ===== جدول‌های مدیریت پرداخت‌ها: جا شدن در باکس بدون اسکرول افقی ===== */
.pm-fit { overflow-x: hidden; }
.pm-table { width: 100%; min-width: 0; table-layout: fixed; font-size: 11.5px; }
.pm-table th, .pm-table td { white-space: normal; overflow-wrap: anywhere; word-break: break-word; padding: 8px 6px; vertical-align: middle; }
.pm-table .question-cell { gap: 6px; }
.pm-table .question-cell .avatar, .pm-table .question-cell img { width: 24px; height: 24px; flex: 0 0 24px; }
.pm-table .question-cell strong { font-size: 11.5px; line-height: 1.3; }
.pm-table .badge { white-space: normal; }
.pm-pay-btn { padding: 6px 10px; font-size: 11px; white-space: nowrap; }
.pm-table .row-action { width: 28px; height: 28px; }
/* عرضِ ستون‌ها متناسب با محتوا تا همه‌چیز داخل باکس بماند */
.pm-perf col, .pm-adj col, .pm-paid col, .pm-pending col { }
.pm-pending .pm-col-manager { width: 18%; }
.pm-pending .pm-col-amount { width: 13%; }
.pm-pending .pm-col-count { width: 9%; }
.pm-pending .pm-col-card { width: 17%; }
.pm-pending .pm-col-sheba { width: 20%; }
.pm-pending .pm-col-date { width: 13%; }
.pm-pending .pm-col-action { width: 10%; }
.pm-pending th, .pm-pending td { text-align: center; }
.pm-pending th:first-child, .pm-pending td:first-child { text-align: right; }
.pm-pending td:first-child .question-cell { justify-content: flex-start; }
.pm-bank-value {
  display: inline-block;
  direction: ltr;
  unicode-bidi: isolate;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-size: 10.5px;
  letter-spacing: .02em;
}
.pm-sheba-value { font-size: 9.5px; }
.pm-date-value { display: inline-block; white-space: nowrap; font-size: 10.5px; }
.pm-action-cell { text-align: center !important; }
.pm-perf th:nth-child(1), .pm-perf td:nth-child(1) { width: 18%; }
.pm-perf th:nth-child(2), .pm-perf td:nth-child(2) { width: 9%; }
.pm-perf th:nth-child(3), .pm-perf td:nth-child(3),
.pm-perf th:nth-child(4), .pm-perf td:nth-child(4) { width: 8%; text-align: center; }
.pm-perf th:last-child, .pm-perf td:last-child { width: 6%; }
.pm-adj th:nth-child(1), .pm-adj td:nth-child(1) { width: 18%; }
.pm-adj th:nth-child(4), .pm-adj td:nth-child(4) { width: 26%; }
.pm-adj th:last-child, .pm-adj td:last-child { width: 6%; }
.pm-paid th:nth-child(1), .pm-paid td:nth-child(1) { width: 22%; }
/* «تاریخچهٔ تسویه‌های من» هم باید کامل داخل کادر بنشیند، بدون اسکرول افقی */
.pm-mysettle th, .pm-mysettle td { text-align: center; }
.pm-mysettle th:first-child, .pm-mysettle td:first-child { text-align: right; }
.pm-mysettle th:nth-child(1), .pm-mysettle td:nth-child(1) { width: 20%; }
.pm-mysettle th:nth-child(2), .pm-mysettle td:nth-child(2) { width: 12%; }
.pm-mysettle th:nth-child(3), .pm-mysettle td:nth-child(3) { width: 16%; }
.pm-mysettle th:nth-child(4), .pm-mysettle td:nth-child(4),
.pm-mysettle th:nth-child(5), .pm-mysettle td:nth-child(5) { width: 19%; }
.pm-mysettle th:last-child, .pm-mysettle td:last-child { width: 14%; }
.pm-mysettle .receipt-thumb { display: inline-block; vertical-align: middle; }

/* موبایل: به‌جای فشرده‌کردن، جدول‌ها اسکرول افقی داشته باشند (مثل جدول‌های پیش‌فرض) */
@media (max-width: 720px) {
  .pm-fit { overflow-x: auto; }
  .pm-table { table-layout: auto; min-width: 820px; font-size: 11px; }
  .pm-table th, .pm-table td { width: auto !important; padding: 10px 12px; word-break: normal; overflow-wrap: normal; white-space: normal; }
  .pm-table .question-cell strong { font-size: 12px; }
  .pm-pending .pm-bank-value { font-size: 10.5px; }
}

/* ===== هم‌ترازیِ جدول‌های مالی =====
   `.pm-table` پدینگ افقی سلول را از ۱۴px به ۶px می‌آورد تا ستون‌ها جا شوند؛ نتیجه این بود
   که ستون اول و آخر (مثلاً «مبلغ») عملاً به لبهٔ پنل می‌چسبید در حالی که عنوان پنل ۱۹px
   تورفتگی دارد. فقط دو لبهٔ بیرونی تورفتگی می‌گیرند تا فشردگیِ بین ستون‌ها حفظ شود.
   بعد از مدیاکوئری موبایل می‌آید تا شورتهندِ `padding` آنجا این دو را پاک نکند. */
.pm-table th:first-child, .pm-table td:first-child { padding-inline-start: 16px; }
.pm-table th:last-child, .pm-table td:last-child { padding-inline-end: 16px; }

/* یک قرارداد واحد برای همهٔ جدول‌های «مدیریت پرداخت‌ها»: ستون‌های متنی از ابتدای سطر،
   بقیه (عدد، مبلغ، تاریخ، وضعیت، دکمه) وسط‌چین. پیش‌تر فقط pm-pending وسط‌چین بود و سه
   جدول دیگر راست‌چین، برای همین ستون‌های هم‌نام در جدول‌های پشت‌سرهم زیر هم نمی‌افتادند. */
.pm-perf th, .pm-perf td,
.pm-adj th, .pm-adj td,
.pm-paid th, .pm-paid td { text-align: center; }
.pm-perf th:nth-child(1), .pm-perf td:nth-child(1),
.pm-perf th:nth-child(2), .pm-perf td:nth-child(2),
.pm-adj th:nth-child(1), .pm-adj td:nth-child(1),
.pm-adj th:nth-child(4), .pm-adj td:nth-child(4),
.pm-paid th:nth-child(1), .pm-paid td:nth-child(1) { text-align: start; }
.pm-perf td:first-child .question-cell,
.pm-adj td:first-child .question-cell,
.pm-paid td:first-child .question-cell { justify-content: flex-start; }
/* ستون دکمهٔ عملیات ۶٪ بود و با تورفتگیِ لبه جا نمی‌شد */
.pm-perf th:last-child, .pm-perf td:last-child,
.pm-adj th:last-child, .pm-adj td:last-child { width: 9%; }

/* ===== دفترِ درآمد/پاداش/جریمه (صفحهٔ درآمد و تسویه) ===== */
.ledger-summary { display: flex; flex-wrap: wrap; gap: 10px; padding: 12px 16px 4px; }
.ledger-summary .ls-chip { display: inline-flex; flex-direction: column; gap: 2px; padding: 8px 12px; border-radius: 11px; font-size: 11px; color: var(--muted); border: 1px solid var(--line); background: var(--panel-soft); min-width: 110px; }
.ledger-summary .ls-chip b { font-size: 13px; color: var(--ink); }
.ledger-summary .ls-chip.income b { color: var(--teal); }
.ledger-summary .ls-chip.reward b { color: var(--teal); }
.ledger-summary .ls-chip.penalty b { color: var(--red); }
.ledger-summary .ls-chip.net { background: var(--orange-soft); border-color: transparent; }
.ledger-tabs { display: flex; gap: 8px; flex-wrap: wrap; padding: 8px 16px 12px; }
.ledger-tab { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); font-size: 12px; font-weight: 600; cursor: pointer; color: var(--muted); }
.ledger-tab.on { background: var(--orange-soft); border-color: transparent; color: var(--orange); }
.ledger-cat { display: inline-block; padding: 2px 9px; border-radius: 7px; font-size: 10.5px; background: var(--panel-soft); border: 1px solid var(--line); color: var(--muted); }
.ledger-cat.income { background: var(--teal-soft); color: #12796b; border-color: transparent; }
.ledger-cat.reward { background: var(--teal-soft); color: #12796b; border-color: transparent; }
.ledger-cat.penalty { background: var(--red-soft); color: #b64b4b; border-color: transparent; }
.pm-ledger th:nth-child(1), .pm-ledger td:nth-child(1) { width: 15%; }
.pm-ledger th:nth-child(2), .pm-ledger td:nth-child(2) { width: 53%; }
.pm-ledger th:nth-child(3), .pm-ledger td:nth-child(3) { width: 16%; }
.pm-ledger th:nth-child(4), .pm-ledger td:nth-child(4) { width: 16%; }
/* همان قرارداد جدول‌های پرداخت: تاریخ و شرح متنی‌اند، دسته و مبلغ وسط ستون خودشان */
.pm-ledger th, .pm-ledger td { text-align: center; }
.pm-ledger th:nth-child(1), .pm-ledger td:nth-child(1),
.pm-ledger th:nth-child(2), .pm-ledger td:nth-child(2) { text-align: start; }

/* ===== ایجاد سؤال: چیدمان فشرده و متمرکز ===== */
.question-page {
  width: min(1450px, 100%);
  margin-inline: auto;
}
.question-page-head {
  align-items: center;
  margin-bottom: 14px;
}
.question-page-head h1 { font-size: 23px; margin: 3px 0; }
.question-page-head p { font-size: 10px; }
.question-head-actions { gap: 7px; }
.question-head-actions .secondary-button { min-height: 36px; padding: 7px 14px; }
.question-page-layout { grid-template-columns: minmax(0, 1fr) 190px; gap: 14px; }
.question-form-main { gap: 12px; }
.question-form-section {
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  padding: 16px;
  border-radius: 15px;
  box-shadow: 0 5px 18px rgba(46,39,29,.025);
}
.question-structure-section { padding-top: 16px; }
.section-number { width: 30px; height: 30px; border-radius: 9px; font-size: 12px; }
.section-content > h2 { font-size: 16px; margin-bottom: 2px; }
.section-content > p { margin-bottom: 12px; font-size: 9px; }
.question-form-nav { top: 82px; padding: 9px; border-radius: 14px; box-shadow: 0 8px 24px rgba(46,39,29,.06); }
.question-form-nav > button { padding: 6px; }
.question-form-nav > button span { width: 22px; height: 22px; }
.folder-context { margin-top: 7px; padding-top: 9px; }
.media-editor { margin: 8px 0 12px; border-radius: 12px; }
.media-editor-head { min-height: 44px; padding: 7px 10px; }
.media-editor-head strong { font-size: 12px; }
.media-editor-head small { font-size: 8px; margin-top: 1px; }
.media-editor-head .secondary-button { min-height: 32px; padding: 6px 10px; font-size: 10px; border-radius: 9px; }
.media-drop {
  min-height: 68px;
  margin: 8px;
  padding: 11px 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 10px;
  background: #fdfbf7;
}
.media-drop-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: var(--orange);
  background: var(--orange-soft);
  flex: 0 0 auto;
}
.media-drop-icon .ui-icon { width: 17px; height: 17px; }
.media-drop > span:last-child { display: flex; flex-direction: column; gap: 2px; text-align: start; }
.media-drop strong { color: #5f5649; font-size: 10.5px; }
.media-drop small { color: var(--muted); font-size: 8px; }
.question-page .media-list { padding: 0 8px 8px; gap: 7px; }
.question-save-bar { padding: 9px 11px; border-radius: 14px; }
.question-save-bar .primary-button,
.question-save-bar .secondary-button { min-height: 36px; padding: 7px 13px; }

/* ===== ویرایشگر حرفه‌ای برش تصویر ===== */
.modal.crop-editor-modal {
  width: min(1460px, calc(100vw - 24px));
  height: min(900px, calc(100dvh - 24px));
  max-height: calc(100dvh - 24px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border-radius: 20px;
}
.crop-editor-modal .modal-head,
.crop-editor-modal .modal-footer { position: static; }
.crop-modal-head { padding: 12px 16px; }
.crop-modal-head > div { min-width: 0; }
.crop-modal-head h2 { font-size: 15px; }
.crop-modal-head p { margin: 2px 0 0; color: var(--muted); font-size: 8.5px; }
.crop-editor-modal > .modal-body { min-height: 0; overflow: hidden; padding: 10px; }
.crop-editor-modal .crop-layout {
  height: 100%;
  min-height: 0;
  grid-template-columns: minmax(0, 1fr) 238px;
  gap: 10px;
}
.crop-editor-modal .crop-workspace {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}
.crop-editor-modal .crop-stage {
  min-height: 0;
  height: auto;
  overflow: hidden;
  padding: 12px;
  border-radius: 12px;
  background-size: 14px 14px;
}
.crop-editor-modal .crop-stage canvas {
  max-width: 100%;
  max-height: 100%;
  box-shadow: 0 12px 36px rgba(20,17,12,.2);
}
.crop-editor-modal .crop-stage canvas.drawing-selection { cursor: crosshair !important; }
.crop-editor-modal .crop-help {
  min-height: 30px;
  margin: 6px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 5px 12px;
  font-size: 8px;
}
.crop-editor-modal .crop-help span { white-space: nowrap; }
.crop-editor-modal .crop-controls {
  min-height: 0;
  max-height: 100%;
  overflow: auto;
  scrollbar-width: none;
  gap: 8px;
  padding: 10px;
  border-radius: 12px;
  background: #fcfbf8;
}
.crop-editor-modal .crop-controls::-webkit-scrollbar { display: none; }
.crop-control-block { padding-bottom: 8px; border-bottom: 1px solid #eee7dc; }
.crop-control-block:last-of-type { border-bottom: 0; }
.crop-editor-modal .crop-section-title { margin-bottom: 5px; font-size: 8.5px; letter-spacing: 0; }
.crop-editor-modal .pixel-info-card { padding: 7px 8px; border-radius: 8px; }
.crop-editor-modal .pixel-info-card.accent { background: #fff6ee; border-color: #f3d5bd; }
.crop-editor-modal .pixel-info-card .pcard-label { font-size: 7.5px; }
.crop-editor-modal .pixel-info-card .pcard-value { font-size: 10px; }
.crop-editor-modal .pixel-input-field label { font-size: 8px; }
.crop-editor-modal .pixel-input-field input { height: 32px; font-size: 11px; }
.crop-editor-modal .aspect-lock-btn { height: 32px; width: 28px; }
.crop-hidden-values { display: none; }
.crop-preset-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.crop-preset-grid button,
.crop-editor-modal .crop-toolbar button {
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: #716858;
  font: inherit;
  font-size: 8.5px;
  cursor: pointer;
}
.crop-preset-grid button:hover,
.crop-preset-grid button.selected,
.crop-editor-modal .crop-toolbar button:hover,
.crop-editor-modal .crop-toolbar button.active {
  color: #d65d16;
  border-color: #efb184;
  background: #fff3e9;
}
.crop-editor-modal .crop-toolbar { gap: 4px; }
.crop-editor-modal .crop-toolbar-primary button { font-weight: 750; }
.crop-editor-modal .crop-alt-field { margin: 0; }
.crop-editor-modal .crop-alt-field label { font-size: 8.5px; }
.crop-editor-modal .crop-alt-field input { height: 32px; font-size: 9px; }
.crop-editor-modal .modal-footer { padding: 9px 14px; }
.crop-editor-modal .modal-footer button { min-height: 36px; }

/* آمار سبک داشبورد هنگام ورود */
/* ارتفاع تقریباً برابر خودِ نمودار است تا هنگام تعویض بازه، پنل جمع نشود و صفحه نپرد */
.dashboard-analytics-loading {
  min-height: 430px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--muted);
}
.dashboard-analytics-loading.failed span { animation: none; opacity: .3; }
.dashboard-analytics-loading .link-button {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: var(--orange);
  cursor: pointer;
  text-decoration: underline;
}
.dashboard-analytics-loading span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--orange);
  animation: dashboardPulse 1s ease-in-out infinite;
}
.dashboard-analytics-loading span:nth-child(2) { animation-delay: .12s; }
.dashboard-analytics-loading span:nth-child(3) { animation-delay: .24s; }
.dashboard-analytics-loading small { margin-inline-start: 5px; font-size: 12px; }
@keyframes dashboardPulse { 0%, 100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }

@media (max-width: 1100px) {
  .crop-editor-modal .crop-layout { grid-template-columns: minmax(0, 1fr) 220px; }
}
@media (max-width: 820px) {
  .modal.crop-editor-modal { width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .crop-editor-modal > .modal-body { overflow: auto; }
  .crop-editor-modal .crop-layout { height: auto; grid-template-columns: 1fr; }
  .crop-editor-modal .crop-workspace { height: 58dvh; }
  .crop-editor-modal .crop-controls { max-height: none; overflow: visible; }
}

/* ═══════════ آمار تجمیعی سؤال (مودال آمار) ═══════════ */
.qstat-tabs {
  display: flex;
  gap: 6px;
  padding: 0 22px;
  border-bottom: 1px solid var(--line);
  background: #fffdfa;
}
.qstat-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  padding: 11px 12px 10px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color .15s ease, border-color .15s ease;
}
.qstat-tab .ui-icon { width: 15px; height: 15px; }
.qstat-tab:hover { color: var(--ink); }
.qstat-tab.on { color: var(--orange); border-bottom-color: var(--orange); }
.qstat-modal-body { background: var(--panel-soft); }
.qstat-pane { position: relative; display: grid; gap: 14px; }
.qstat-loading {
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--muted);
}
.qstat-loading span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--orange);
  animation: dashboardPulse 1s ease-in-out infinite;
}
.qstat-loading span:nth-child(2) { animation-delay: .12s; }
.qstat-loading span:nth-child(3) { animation-delay: .24s; }
.qstat-loading small { margin-inline-start: 5px; font-size: 10px; }
.qstat-empty {
  min-height: 140px;
  display: grid;
  place-items: center;
  align-content: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  padding: 18px;
}

/* شناسنامهٔ سؤال: کد + مسیرها (جمع‌وجور، مشابه چیپ موضوع روی کارت) */
.qstat-idcard {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px 16px;
  align-items: start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
}
.qstat-code {
  display: grid;
  gap: 3px;
  justify-items: center;
  background: #f8f3eb;
  border-radius: 11px;
  padding: 9px 14px;
}
.qstat-code span { font-size: 9.5px; font-weight: 800; color: var(--muted); }
.qstat-code b { font-size: 13px; letter-spacing: .4px; color: var(--ink); }
.qstat-paths { display: grid; gap: 7px; min-width: 0; }
.qstat-path-group { display: grid; gap: 2px; min-width: 0; }
.qstat-path-group > i {
  font-style: normal;
  font-size: 9px;
  font-weight: 900;
  color: #b3894a;
}
.qstat-path-row {
  font-size: 10.5px;
  font-weight: 700;
  color: #6f6a60;
  line-height: 1.9;
  overflow-wrap: anywhere;
}
.qstat-path-row.muted { color: var(--muted); opacity: .75; }

/* شبکهٔ کارت‌های نمودار */
.qstat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.qstat-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px 16px 16px;
  min-width: 0;
}
.qstat-card.wide { grid-column: 1 / -1; }
.qstat-card h3 { margin: 0; font-size: 12.5px; font-weight: 900; color: var(--ink); }
.qstat-card .qstat-h-mid { margin-top: 18px; }
.qstat-sub { margin: 3px 0 12px; font-size: 10px; color: var(--muted); font-weight: 700; }

/* دونات میزان استفاده */
.qstat-donut-wrap {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}
.qstat-donut { position: relative; width: 158px; flex: none; }
.qstat-donut svg { width: 100%; display: block; }
.qstat-donut-seg {
  stroke-width: 18;
  cursor: pointer;
  transition: stroke-width .18s var(--ease-soft, ease), filter .18s ease;
}
.qstat-donut-seg:hover { stroke-width: 24; filter: brightness(1.07) saturate(1.1); }
.qstat-donut-center {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 2px;
  pointer-events: none;
}
.qstat-donut-center b { font-size: 21px; color: var(--ink); line-height: 1; }
.qstat-donut-center span { font-size: 9.5px; font-weight: 800; color: var(--muted); }
.qstat-donut-legend { display: grid; gap: 7px; min-width: 0; }
.qstat-legend-row {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 10.5px;
  font-weight: 800;
  color: #5d594f;
}
.qstat-legend-row i { width: 9px; height: 9px; border-radius: 3px; flex: none; }
.qstat-legend-row b { margin-inline-start: auto; color: var(--ink); font-size: 11.5px; }

/* حضور در آزمون‌ها / مجموعه‌ها */
.qstat-presence {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  margin-top: 13px;
}
.qstat-presence-cell {
  border: 1px dashed #e4ddcf;
  border-radius: 11px;
  background: #fffdf8;
  padding: 9px 10px;
  display: grid;
  justify-items: center;
  gap: 2px;
  transition: transform .15s var(--ease-soft, ease), border-color .15s ease;
}
.qstat-presence-cell:hover { transform: translateY(-2px); border-color: #dcc9a6; }
.qstat-presence-cell b { font-size: 17px; color: var(--ink); line-height: 1.1; }
.qstat-presence-cell span { font-size: 9.5px; font-weight: 800; color: var(--muted); }

/* چیپ‌های درصد اولین پاسخ */
.qstat-first { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.qstat-first-chip {
  border-radius: 12px;
  padding: 11px 8px 9px;
  display: grid;
  justify-items: center;
  gap: 2px;
  transition: transform .15s var(--ease-soft, ease);
}
.qstat-first-chip:hover { transform: translateY(-2px); }
.qstat-first-chip b { font-size: 17px; line-height: 1.1; }
.qstat-first-chip span { font-size: 9.5px; font-weight: 800; }
.qstat-first-chip.correct { background: #e9f8f2; color: #2f9e83; }
.qstat-first-chip.wrong { background: #fdeee9; color: #d3603f; }
.qstat-first-chip.blank { background: #fbf3df; color: #b5891f; }
.qstat-note { margin: 8px 0 0; font-size: 9.5px; color: var(--muted); font-weight: 700; }

/* میانگین زمان پاسخ‌گویی */
.qstat-time { display: grid; gap: 9px; margin-top: 2px; }
.qstat-time-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 74px;
  align-items: center;
  gap: 10px;
}
.qstat-time-kind { font-size: 10.5px; font-weight: 900; }
.qstat-time-kind.correct { color: #2f9e83; }
.qstat-time-kind.wrong { color: #d3603f; }
.qstat-time-kind.blank { color: #b5891f; }
.qstat-time-track {
  height: 12px;
  border-radius: 7px;
  background: #f1efe8;
  overflow: hidden;
}
.qstat-time-track span {
  display: block;
  height: 100%;
  width: var(--w, 0%);
  border-radius: 7px;
  transition: filter .15s ease;
}
.qstat-time-track span:hover { filter: brightness(1.08); }
.qstat-time-track span.correct { background: #2f9e83; }
.qstat-time-track span.wrong { background: #d3603f; }
.qstat-time-track span.blank { background: #d7a72e; }
.qstat-time-value { font-size: 11px; font-weight: 800; color: var(--ink); text-align: left; direction: ltr; }

/* نمودار میله‌ای گزینه‌ها */
.qstat-bars {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  align-items: end;
  padding-top: 18px;
}
.qstat-bar-group { display: grid; justify-items: center; gap: 7px; min-width: 0; }
.qstat-bar-pair {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  height: 156px;
}
.qstat-bar {
  position: relative;
  width: 24px;
  height: var(--h, 0%);
  min-height: 3px;
  border-radius: 6px 6px 2px 2px;
  transition: filter .15s ease, transform .15s var(--ease-soft, ease);
  cursor: pointer;
}
.qstat-bar:hover { filter: brightness(1.08); transform: translateY(-2px); }
.qstat-bar b {
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 9px;
  font-weight: 800;
  color: var(--muted);
  white-space: nowrap;
}
.qstat-bar.correct { background: #2f9e83; }
.qstat-bar.wrong { background: #d3603f; }
.qstat-bar.blank { background: #d7a72e; }
.qstat-bar.other { opacity: .42; }
.qstat-bar-label { font-size: 10px; font-weight: 800; color: var(--muted); white-space: nowrap; }
.qstat-bar-label.is-correct { color: #2f9e83; }
.qstat-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 13px;
  font-size: 9.5px;
  font-weight: 800;
  color: var(--muted);
}
.qstat-chart-legend span { display: inline-flex; align-items: center; gap: 5px; }
.qstat-swatch { width: 9px; height: 9px; border-radius: 3px; display: inline-block; }
.qstat-swatch.solid { background: #8b8578; }
.qstat-swatch.faded { background: #8b8578; opacity: .4; }

/* نمودار مسیر پاسخ‌گویی پس از اولین مواجهه (میله‌های انباشته) */
.qstat-flow {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  align-items: end;
  height: 265px;
  padding: 6px 20px 0;
}
.qstat-flow-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  min-width: 0;
}
.qstat-flow-pct { font-size: 11.5px; font-weight: 900; color: var(--ink); margin-bottom: 5px; }
.qstat-flow-bar {
  width: min(74px, 100%);
  height: var(--bh, 0%);
  display: flex;
  flex-direction: column-reverse;
  border-radius: 8px 8px 3px 3px;
  overflow: hidden;
  background: #f1efe8;
}
.qstat-flow-seg {
  display: block;
  height: var(--h, 0%);
  min-height: 3px;
  cursor: pointer;
  transition: filter .15s ease;
}
.qstat-flow-seg:hover { filter: brightness(1.12); }
.qstat-flow-seg.correct { background: #2f9e83; }
.qstat-flow-seg.wrong { background: #d3603f; }
.qstat-flow-seg.blank { background: #d7a72e; }
.qstat-flow-seg.none { background: #cfd2d9; }
.qstat-flow-label { margin-top: 8px; font-size: 11px; font-weight: 900; }
.qstat-flow-label.correct { color: #2f9e83; }
.qstat-flow-label.wrong { color: #d3603f; }
.qstat-flow-label.blank { color: #b5891f; }
.qstat-flow-col small { margin-top: 2px; font-size: 9px; font-weight: 700; color: var(--muted); }

/* ردیف اطلاعات پایانی: ورود به بانک / آخرین استفاده / برچسب‌ها */
.qstat-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.qstat-meta-cell {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 13px;
  display: grid;
  gap: 4px;
  align-content: start;
}
.qstat-meta-cell > span { font-size: 9.5px; font-weight: 900; color: var(--muted); }
.qstat-meta-cell > b { font-size: 12px; color: var(--ink); }
.qstat-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.qstat-tags i {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  color: #7c5b22;
  background: #fbf3df;
  border-radius: 7px;
  padding: 3px 8px;
}

/* تولتیپ شناور نمودارها */
.qstat-tooltip {
  position: absolute;
  z-index: 30;
  width: max-content;
  max-width: calc(100% - 24px);
  transform: translate(-50%, -100%);
  background: #2b2823;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.9;
  padding: 7px 11px;
  border-radius: 9px;
  box-shadow: 0 10px 26px rgba(35, 28, 18, .28);
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease;
  text-align: center;
  direction: rtl;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.qstat-tooltip.on { opacity: 1; }

@media (max-width: 760px) {
  .qstat-grid { grid-template-columns: 1fr; }
  .qstat-idcard { grid-template-columns: 1fr; }
  .qstat-code { justify-self: start; }
  .qstat-donut-wrap { grid-template-columns: 1fr; justify-items: center; }
  .qstat-donut-legend { width: 100%; }
  .qstat-meta { grid-template-columns: 1fr; }
  .qstat-flow { gap: 12px; padding-inline: 4px; }
  .qstat-bar { width: 17px; }
  .qstat-bar-pair { gap: 3px; height: 130px; }
  .qstat-tabs { padding: 0 12px; overflow-x: auto; }
}

/* ═══════════ ضریب دشواری رتبه‌محور (۰..۱۰) ═══════════ */
.qdiff-analysis {
  position: relative;
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 18px;
  border: 1px solid #e7dfd2;
  border-radius: 16px;
  background: linear-gradient(150deg, #fff 0%, #fdfaf6 100%);
  box-shadow: 0 8px 24px rgba(50, 38, 21, .035);
}
.qdiff-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.qdiff-kicker { display: block; margin-bottom: 4px; color: #a86627; font-size: 10px; font-weight: 900; }
.qdiff-head h3 { margin: 0; color: var(--ink); font-size: 16px; font-weight: 950; }
.qdiff-head p { margin: 5px 0 0; color: var(--muted); font-size: 10.5px; line-height: 1.8; }
.qdiff-index {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-width: 104px;
  padding: 9px 12px;
  border: 1px solid #e9e2d7;
  border-radius: 13px;
  background: rgba(255,255,255,.9);
  text-align: center;
}
.qdiff-index small { color: #837c72; font-size: 9.5px; font-weight: 800; }
.qdiff-index strong {
  font-family: "Vazirmatn", Tahoma, sans-serif;
  font-size: 29px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
}
.qdiff-index span { font-size: 9.5px; font-weight: 850; }
.qdiff-index.qdiff-band-veasy { border-color: #b8dfd2; background: #eaf8f3; }
.qdiff-index.qdiff-band-veasy strong, .qdiff-index.qdiff-band-veasy span { color: #197a65; }
.qdiff-index.qdiff-band-easy { border-color: #c8dfbd; background: #f0f8ec; }
.qdiff-index.qdiff-band-easy strong, .qdiff-index.qdiff-band-easy span { color: #4e7d3e; }
.qdiff-index.qdiff-band-medium { border-color: #ecd69e; background: #fff9e7; }
.qdiff-index.qdiff-band-medium strong, .qdiff-index.qdiff-band-medium span { color: #987019; }
.qdiff-index.qdiff-band-hard { border-color: #efcfb6; background: #fff4ec; }
.qdiff-index.qdiff-band-hard strong, .qdiff-index.qdiff-band-hard span { color: #b46329; }
.qdiff-index.qdiff-band-vhard { border-color: #ecc0b9; background: #fff0ed; }
.qdiff-index.qdiff-band-vhard strong, .qdiff-index.qdiff-band-vhard span { color: #bd4438; }
.qdiff-index.qdiff-band-unknown { border-color: #e2ddd4; background: #f7f6f3; }
.qdiff-index.qdiff-band-unknown strong, .qdiff-index.qdiff-band-unknown span { color: #8e877d; }
.qdiff-alert {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid;
  border-radius: 11px;
  font-size: 10.5px;
  font-weight: 750;
  line-height: 1.8;
}
.qdiff-alert svg { width: 17px; height: 17px; flex: none; }
.qdiff-alert.warn { color: #876311; border-color: #ebd8a7; background: #fff9e8; }
.qdiff-alert.neutral { color: #626d76; border-color: #d9e0e4; background: #f4f7f8; }
/* نوار ۰..۱۰: در RTL مبدأ (۰) سمت راست است، پس گرادیان به چپ سخت‌تر می‌شود */
.qdiff-scale { padding: 4px 8px 0; }
.qdiff-track {
  position: relative;
  height: 12px;
  margin-top: 22px;
  border-radius: 999px;
  background: linear-gradient(to left, #cfe9dd 0%, #dfeccb 25%, #f6e6b4 50%, #f3d3b2 75%, #eec0b8 100%);
}
.qdiff-marker {
  position: absolute;
  top: 50%;
  transform: translate(50%, -50%);
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #7a6a55;
  box-shadow: 0 2px 7px rgba(60, 45, 25, .28);
}
.qdiff-marker b {
  position: absolute;
  bottom: calc(100% + 6px);
  padding: 2px 7px;
  border-radius: 999px;
  color: #fff;
  background: #7a6a55;
  font-size: 10px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.qdiff-pin {
  position: absolute;
  top: -6px;
  transform: translateX(50%);
  width: 3px;
  height: 24px;
  border-radius: 2px;
  cursor: help;
}
.qdiff-pin.percent { background: #2f7fa8; }
.qdiff-pin.time { background: #9a5aa8; }
.qdiff-parts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.qdiff-parts > article {
  min-width: 0;
  min-height: 76px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 9px 11px;
  border: 1px solid #e9e2d7;
  border-radius: 13px;
  background: rgba(255,255,255,.9);
}
.qdiff-parts small { color: #837c72; font-size: 9.5px; font-weight: 800; }
.qdiff-parts strong { margin-top: 3px; color: #2d2924; font-size: 16px; font-weight: 950; line-height: 1.25; }
.qdiff-parts span { margin-top: 3px; color: #8e877d; font-size: 8.8px; font-weight: 700; line-height: 1.55; }
.qdiff-parts span b { color: #5f574c; font-variant-numeric: tabular-nums; }
.qdiff-confidence.confidence-high { border-color: #c7dfd5; background: #f1f9f5; }
.qdiff-confidence.confidence-medium { border-color: #e6d5ab; background: #fffaf0; }
.qdiff-confidence.confidence-low { border-color: #e8c9c2; background: #fff5f2; }
@media (max-width: 720px) {
  .qdiff-analysis { padding: 14px; }
  .qdiff-head { flex-direction: column; }
  .qdiff-index { align-self: flex-start; }
  .qdiff-parts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* نشان‌گر ضریب دشواری روی ریلِ کارت سؤال */
.sq-diff-index {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  margin-top: 2px;
  padding: 3px 9px;
  border: 1px solid #e2ddd4;
  border-radius: 999px;
  background: #fff;
  cursor: help;
}
.sq-diff-index b { font-size: 12px; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1.3; }
.sq-diff-index i { color: #98918a; font-size: 8.5px; font-style: normal; font-weight: 800; }
.sq-diff-index.qdiff-band-veasy { border-color: #b8dfd2; background: #eaf8f3; }
.sq-diff-index.qdiff-band-veasy b { color: #197a65; }
.sq-diff-index.qdiff-band-easy { border-color: #c8dfbd; background: #f0f8ec; }
.sq-diff-index.qdiff-band-easy b { color: #4e7d3e; }
.sq-diff-index.qdiff-band-medium { border-color: #ecd69e; background: #fff9e7; }
.sq-diff-index.qdiff-band-medium b { color: #987019; }
.sq-diff-index.qdiff-band-hard { border-color: #efcfb6; background: #fff4ec; }
.sq-diff-index.qdiff-band-hard b { color: #b46329; }
.sq-diff-index.qdiff-band-vhard { border-color: #ecc0b9; background: #fff0ed; }
.sq-diff-index.qdiff-band-vhard b { color: #bd4438; }
.sq-diff-index.qdiff-band-unknown b { color: #9a938b; }

/* ═══════════ ضریب تمیز توانایی‌محور ═══════════ */
.qdisc-analysis {
  --qdisc-green: #268e78;
  --qdisc-red: #d45d46;
  --qdisc-gold: #ca961f;
  position: relative;
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 18px;
  border: 1px solid #e7dfd2;
  border-radius: 16px;
  background: linear-gradient(150deg, #fff 0%, #fffcf7 100%);
  box-shadow: 0 8px 24px rgba(50, 38, 21, .035);
}
.qdisc-head,
.qdisc-section-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.qdisc-kicker {
  display: block;
  margin-bottom: 4px;
  color: #a86627;
  font-size: 10px;
  font-weight: 900;
}
.qdisc-head h3,
.qdisc-section-title h4 { margin: 0; color: var(--ink); font-size: 16px; font-weight: 950; }
.qdisc-head p,
.qdisc-section-title p { margin: 5px 0 0; color: var(--muted); font-size: 10.5px; line-height: 1.8; }
.qdisc-updated {
  flex: none;
  padding: 6px 10px;
  border: 1px solid #eadfce;
  border-radius: 999px;
  color: #827667;
  background: #fffaf2;
  font-size: 9.5px;
  font-weight: 800;
}
.qdisc-alert {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid;
  border-radius: 11px;
  font-size: 10.5px;
  font-weight: 750;
  line-height: 1.8;
}
.qdisc-alert svg { width: 17px; height: 17px; flex: none; }
.qdisc-alert.danger { color: #a8382f; border-color: #f0c5bd; background: #fff0ed; }
.qdisc-alert.warn { color: #876311; border-color: #ebd8a7; background: #fff9e8; }
.qdisc-alert.neutral { color: #626d76; border-color: #d9e0e4; background: #f4f7f8; }
.qdisc-summary {
  display: grid;
  grid-template-columns: 1.05fr repeat(4, minmax(0, 1fr));
  gap: 9px;
}
.qdisc-summary > article {
  min-width: 0;
  min-height: 76px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 9px 11px;
  border: 1px solid #e9e2d7;
  border-radius: 13px;
  background: rgba(255,255,255,.9);
}
.qdisc-summary small { color: #837c72; font-size: 9.5px; font-weight: 800; }
.qdisc-summary strong { margin-top: 3px; color: #2d2924; font-size: 18px; font-weight: 950; line-height: 1.1; }
.qdisc-summary span { margin-top: 3px; color: #8e877d; font-size: 8.8px; font-weight: 700; line-height: 1.45; }
.qdisc-summary span b { color: inherit; }
.qdisc-summary .qdisc-index { border-color: #ead8c3; background: #fff8ee; }
.qdisc-summary .qdisc-index strong {
  font-family: "Vazirmatn", Tahoma, sans-serif;
  font-size: 29px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
  letter-spacing: 0;
}
.qdisc-index.qdisc-band-excellent { border-color: #b8dfd2; background: #eaf8f3; }
.qdisc-index.qdisc-band-excellent strong,
.qdisc-index.qdisc-band-excellent span { color: #197a65; }
.qdisc-index.qdisc-band-good { border-color: #c8dfbd; background: #f0f8ec; }
.qdisc-index.qdisc-band-good strong,
.qdisc-index.qdisc-band-good span { color: #4e7d3e; }
.qdisc-index.qdisc-band-acceptable { border-color: #ecd69e; background: #fff9e7; }
.qdisc-index.qdisc-band-acceptable strong,
.qdisc-index.qdisc-band-acceptable span { color: #987019; }
.qdisc-index.qdisc-band-weak,
.qdisc-index.qdisc-band-none { border-color: #efcfb6; background: #fff4ec; }
.qdisc-index.qdisc-band-weak strong,
.qdisc-index.qdisc-band-none strong,
.qdisc-index.qdisc-band-weak span,
.qdisc-index.qdisc-band-none span { color: #b46329; }
.qdisc-index.qdisc-band-suspicious { border-color: #ecc0b9; background: #fff0ed; }
.qdisc-index.qdisc-band-suspicious strong,
.qdisc-index.qdisc-band-suspicious span { color: #bd4438; }
.qdisc-confidence.confidence-high { border-color: #c7dfd5; background: #f1f9f5; }
.qdisc-confidence.confidence-medium { border-color: #e6d5ab; background: #fffaf0; }
.qdisc-confidence.confidence-low { border-color: #e8c9c2; background: #fff5f2; }
.qdisc-section-title { margin-top: 3px; padding-top: 3px; }
.qdisc-distributions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.qdisc-dist-card {
  --qdisc-color: #74808a;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e8e1d7;
  border-radius: 13px;
  background: #fff;
}
.qdisc-dist-card.correct { --qdisc-color: #2f9e83; }
.qdisc-dist-card.wrong { --qdisc-color: #d3603f; }
.qdisc-dist-card.blank { --qdisc-color: #c99720; }
.qdisc-dist-card > header,
.qdisc-dist-card > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
}
.qdisc-dist-card > header { border-bottom: 1px solid #f0ebe3; }
.qdisc-dist-card > header span { display: inline-flex; align-items: center; gap: 6px; color: #504a42; font-size: 10.5px; font-weight: 900; }
.qdisc-dist-card > header i { width: 9px; height: 9px; border-radius: 3px; background: var(--qdisc-color); }
.qdisc-dist-card > header b { color: var(--qdisc-color); font-size: 10px; }
.qdisc-dist-card > footer { border-top: 1px solid #f0ebe3; color: #8c857b; font-size: 8.8px; font-weight: 700; }
.qdisc-dist-card > footer b { color: var(--qdisc-color); font-size: 10px; }
.qdisc-dist-chart { width: 100%; height: auto; display: block; overflow: visible; color: var(--qdisc-color); }
.qdisc-axis { stroke: #d9d3ca; stroke-width: 1; }
.qdisc-axis-label { fill: #9d9589; font: 9px Vazirmatn, sans-serif; }
.qdisc-dist-area { fill: color-mix(in srgb, var(--qdisc-color) 14%, transparent); }
.qdisc-dist-line { fill: none; stroke: var(--qdisc-color); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.qdisc-hist-bar { fill: color-mix(in srgb, var(--qdisc-color) 28%, transparent); cursor: crosshair; transition: fill .15s ease; }
.qdisc-hist-bar:hover { fill: color-mix(in srgb, var(--qdisc-color) 55%, transparent); }
.qdisc-mean-line { stroke: var(--qdisc-color); stroke-width: 1.4; stroke-dasharray: 4 3; cursor: help; }
.qdisc-dist-empty { min-height: 176px; display: grid; place-items: center; padding: 18px; color: var(--muted); font-size: 9.5px; text-align: center; }
.qdisc-trend-card { min-width: 0; padding: 14px; border: 1px solid #e8e1d7; border-radius: 13px; background: #fff; }
.qdisc-trend-wrap { margin-top: 8px; }
.qdisc-trend { width: 100%; height: auto; display: block; overflow: visible; }
.qdisc-zero-line { stroke: #cfcbc4; stroke-width: 1; stroke-dasharray: 5 4; }
.qdisc-trend-area { fill: rgba(223, 107, 43, .10); }
.qdisc-trend-line { fill: none; stroke: #df6b2b; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.qdisc-trend-point { fill: #fff; stroke: #df6b2b; stroke-width: 2.4; cursor: help; transition: r .15s ease, fill .15s ease; }
.qdisc-trend-point:hover { r: 6; fill: #fff0e6; }
.qdisc-trend-empty { min-height: 105px; display: grid; place-items: center; color: var(--muted); font-size: 10px; }
/* ضریب واقعی در ریل کارت سؤال */
.sq-disc-band { font-style: normal; font-size: 8.5px; font-weight: 900; color: #9a5a1f; }
.sq-rail-disc.is-pending { color: #8d8b86; background: #f7f6f2; }
.sq-rail-disc.is-pending b,
.sq-rail-disc.is-pending .sq-disc-band { color: #aaa59c; }
.sq-rail-disc.qdisc-band-excellent { background: #eef9f5; }
.sq-rail-disc.qdisc-band-excellent b,
.sq-rail-disc.qdisc-band-excellent .sq-disc-band { color: #207d69; }
.sq-rail-disc.qdisc-band-good { background: #f3f9ef; }
.sq-rail-disc.qdisc-band-good b,
.sq-rail-disc.qdisc-band-good .sq-disc-band { color: #557e43; }
.sq-rail-disc.qdisc-band-acceptable { background: #fff9e9; }
.sq-rail-disc.qdisc-band-acceptable b,
.sq-rail-disc.qdisc-band-acceptable .sq-disc-band { color: #9b7218; }
.sq-rail-disc.qdisc-band-weak,
.sq-rail-disc.qdisc-band-none { background: #fff5ed; }
.sq-rail-disc.qdisc-band-weak b,
.sq-rail-disc.qdisc-band-none b,
.sq-rail-disc.qdisc-band-weak .sq-disc-band,
.sq-rail-disc.qdisc-band-none .sq-disc-band { color: #bb652c; }
.sq-rail-disc.qdisc-band-suspicious { background: #fff0ed; }
.sq-rail-disc.qdisc-band-suspicious b,
.sq-rail-disc.qdisc-band-suspicious .sq-disc-band { color: #bd4438; }

/* ═══════════ جایگاه کاربر در درس‌ها ═══════════ */
.sp-subjects-page { display: grid; gap: 14px; }
.sp-subject-layout {
  display: grid;
  grid-template-columns: 224px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.sp-subject-list {
  display: grid;
  gap: 7px;
  max-height: 680px;
  overflow: auto;
  padding: 5px;
  border: 1px solid #e7ded1;
  border-radius: 15px;
  background: #f8f5ef;
  scrollbar-width: thin;
}
.sp-subject-pick {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 48px;
  gap: 6px;
  padding: 7px 9px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #514b43;
  background: transparent;
  font: inherit;
  text-align: start;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.sp-subject-pick:hover { border-color: #e2d1bd; background: #fff; transform: translateY(-1px); }
.sp-subject-pick.active { border-color: #e2a67f; background: #fff; box-shadow: 0 6px 14px rgba(100, 69, 36, .07); }
.sp-subject-pick.ineligible { opacity: .62; }
.sp-subject-pick span { min-width: 0; }
.sp-subject-pick b,
.sp-subject-pick small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-subject-pick b { font-size: 11px; font-weight: 900; }
.sp-subject-pick small { margin-top: 1px; color: #979087; font-size: 8.5px; line-height: 1.35; }
.sp-subject-pick > strong { direction: ltr; color: #ca6026; font-size: 12px; font-weight: 950; }
.sp-subject-panel { position: relative; min-width: 0; padding: 20px; overflow: hidden; }
.sp-subject-standing-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee6da;
}
.sp-subject-standing-head h2 { margin: 4px 0 0; color: #d96329; font-size: 34px; font-weight: 950; line-height: 1; }
.sp-subject-standing-head p { margin: 7px 0 0; color: #827b71; font-size: 10px; line-height: 1.8; }
.sp-subject-rank {
  min-width: 148px;
  display: grid;
  justify-items: center;
  gap: 3px;
  padding: 12px 15px;
  border: 1px solid #d8e4dd;
  border-radius: 13px;
  background: #f2f9f5;
}
.sp-subject-rank small { color: #748078; font-size: 9px; font-weight: 800; }
.sp-subject-rank strong { color: #297e68; font-size: 22px; font-weight: 950; }
.sp-subject-rank span { padding: 3px 7px; border-radius: 999px; font-size: 8px; font-weight: 850; }
.sp-subject-rank span.high { color: #267663; background: #dcefe7; }
.sp-subject-rank span.medium { color: #896719; background: #f8eecf; }
.sp-subject-rank span.low { color: #a65346; background: #f8e0db; }
.sp-subject-score-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  margin: 14px 0;
}
.sp-subject-score-grid.personal-only { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sp-subject-score-grid article {
  min-width: 0;
  padding: 10px;
  border: 1px solid #ebe4d9;
  border-radius: 10px;
  background: #faf8f4;
  text-align: center;
}
.sp-subject-score-grid small { display: block; min-height: 28px; color: #8b847a; font-size: 8.5px; line-height: 1.65; }
.sp-subject-score-grid strong { display: block; margin-top: 3px; color: #37322c; font-size: 16px; font-weight: 950; }
.sp-subject-score-grid .correct strong { color: #248771; }
.sp-subject-score-grid .wrong strong { color: #c9503f; }
.sp-subject-score-grid .blank strong { color: #a77a16; }
.sp-exam-subject-trend {
  position: relative;
  min-width: 0;
  margin: 16px 0 14px;
  padding: 20px 20px 14px;
  border: 1px solid #dde8e2;
  border-radius: 15px;
  background: linear-gradient(180deg, #fbfefc 0%, #fff 100%);
  overflow: visible;
}
.sp-exam-subject-trend > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 3px 14px; }
.sp-exam-subject-trend > header > div { min-width: 0; }
.sp-exam-subject-trend > header span { display: block; color: #668074; font-size: 11px; font-weight: 850; }
.sp-exam-subject-trend > header h3 { margin: 4px 0 0; overflow: hidden; color: #343d38; font-size: 17px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.sp-exam-subject-trend > header > small { flex: none; padding: 6px 11px; border-radius: 9px; color: #39735f; background: #e8f5ee; font-size: 11.5px; font-weight: 850; white-space: nowrap; }
.sp-exam-trend-chart-wrap { max-width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: #d7d0c7 transparent; }
/* viewBox هم‌اندازهٔ پهنای واقعیِ کارت ساخته می‌شود، پس مقیاس ۱ است و چیزی وا نمی‌رود؛
   width:100% تضمین می‌کند کل کادر پر شود و کنارِ نمودار فضای خالی نماند. */
.sp-exam-trend-chart { width: 100%; min-width: 760px; height: auto; display: block; overflow: visible; font-family: inherit; }
.sp-exam-trend-grid line { stroke: #ebe7e0; stroke-width: 1; vector-effect: non-scaling-stroke; }
.sp-exam-trend-grid.zero line { stroke: #cfc7bb; stroke-dasharray: 4 4; }
.sp-exam-trend-grid text { fill: #8d857b; font-size: 11.5px; font-weight: 800; text-anchor: end; }
.sp-exam-trend-line { fill: none; stroke: #36896f; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.sp-exam-trend-x { fill: #6f675e; font-size: 13px; font-weight: 850; text-anchor: middle; direction: rtl; }
.sp-exam-trend-point { outline: none; cursor: pointer; }
.sp-exam-trend-point .hit { fill: transparent; }
.sp-exam-trend-point .dot { fill: #fff; stroke: #2f8d75; stroke-width: 3; transition: r .14s ease, fill .14s ease; vector-effect: non-scaling-stroke; }
.sp-exam-trend-point:hover .dot,
.sp-exam-trend-point:focus .dot,
.sp-exam-trend-point.active .dot { r: 9px; fill: #2f8d75; stroke: #fff; }
.sp-exam-subject-trend > footer { padding: 8px 3px 0; color: #8b8378; font-size: 11px; font-weight: 750; line-height: 1.9; }
.sp-exam-trend-tip {
  position: absolute;
  z-index: 25;
  width: min(390px, calc(100% - 16px));
  display: grid;
  gap: 8px;
  padding: 13px 14px;
  border: 1px solid #d7cec2;
  border-radius: 12px;
  color: #4d463f;
  background: rgba(255,255,255,.985);
  box-shadow: 0 14px 32px rgba(61, 47, 31, .18);
  opacity: 0;
  pointer-events: auto;
  transform: translateY(4px);
  transition: opacity .12s ease, transform .12s ease;
}
.sp-exam-trend-tip.on { opacity: 1; transform: translateY(0); }
.sp-exam-trend-tip[hidden] { display: none; }
.sp-exam-trend-tip > a { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #246e59; font-size: 13.5px; font-weight: 950; text-decoration: none; }
.sp-exam-trend-tip > a:hover { color: #c85c23; }
.sp-exam-trend-tip > a svg { width: 16px; height: 16px; flex: none; }
.sp-exam-trend-tip > time { margin-top: -4px; color: #958b80; font-size: 10.5px; }
.sp-exam-trend-score { display: flex; align-items: baseline; gap: 10px; }
.sp-exam-trend-score strong { direction: ltr; color: #d66027; font-size: 21px; font-weight: 950; }
.sp-exam-trend-score span { color: #81786e; font-size: 11px; font-weight: 800; }
.sp-exam-trend-counts { display: flex; flex-wrap: wrap; gap: 6px; }
.sp-exam-trend-counts span { padding: 4px 9px; border-radius: 999px; font-size: 11px; font-weight: 850; }
.sp-exam-trend-counts .correct { color: #267a67; background: #e8f5f0; }
.sp-exam-trend-counts .wrong { color: #b95042; background: #fff0ed; }
.sp-exam-trend-counts .blank { color: #9a721d; background: #fff7df; }
.sp-exam-trend-rank { display: flex; gap: 6px; padding-top: 7px; border-top: 1px solid #eee8df; }
.sp-exam-trend-rank span { flex: 1; display: flex; align-items: center; justify-content: space-between; padding: 6px 9px; border-radius: 8px; color: #746b62; background: #f7f4ef; font-size: 10.5px; font-weight: 800; }
.sp-exam-trend-rank b { color: #3d6557; font-size: 12px; }
.sp-exam-trend-tip ul { display: grid; gap: 4px; margin: 0; padding: 8px 0 0; border-top: 1px solid #eee8df; list-style: none; }
.sp-exam-trend-tip li { display: grid; grid-template-columns: minmax(0, 1fr) auto 46px; align-items: center; gap: 9px; padding: 6px 9px; border-radius: 9px; background: #faf8f5; }
.sp-exam-trend-tip li > div { min-width: 0; }
.sp-exam-trend-tip li b,
.sp-exam-trend-tip li small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-exam-trend-tip li b { color: #3c3730; font-size: 11.5px; line-height: 1.45; }
.sp-exam-trend-tip li small { margin-top: 1px; color: #999087; font-size: 10px; line-height: 1.5; }
.sp-exam-trend-tip li > span { color: #746c63; font-size: 10.5px; font-weight: 800; white-space: nowrap; }
.sp-exam-trend-tip li > strong { direction: ltr; color: #3e775f; font-size: 12px; font-weight: 950; text-align: left; }
.sp-exam-trend-tip li.no-book { display: block; color: #8d8479; font-size: 11px; text-align: center; }
.sp-exam-subject-empty { min-height: 112px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 18px; color: #7f776d; text-align: start; }
.sp-exam-subject-empty > svg { width: 28px; height: 28px; flex: none; color: #6d9987; }
.sp-exam-subject-empty b,
.sp-exam-subject-empty span { display: block; }
.sp-exam-subject-empty b { color: #4c4640; font-size: 14px; }
.sp-exam-subject-empty span { margin-top: 5px; font-size: 11px; line-height: 1.8; }
/* ── روند پاسخگویی ماه‌به‌ماه (تب «روند پاسخگویی» پروفایل) ────────────────── */
.sat-panel { position: relative; min-width: 0; display: grid; gap: 14px; }
.sat-card {
  position: relative;
  min-width: 0;
  padding: 20px 20px 14px;
  border: 1px solid #dde8e2;
  border-radius: 15px;
  background: linear-gradient(180deg, #fbfefc 0%, #fff 100%);
  overflow: visible;
}
.sat-card > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 3px 14px; }
.sat-card > header > div { min-width: 0; }
.sat-card > header span { display: block; color: #668074; font-size: 11px; font-weight: 850; }
.sat-card > header h3 { margin: 4px 0 0; overflow: hidden; color: #343d38; font-size: 17px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.sat-card > header > small { flex: none; padding: 6px 11px; border-radius: 9px; color: #39735f; background: #e8f5ee; font-size: 11.5px; font-weight: 850; white-space: nowrap; }
.sat-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.sat-summary article {
  min-width: 0;
  padding: 13px 12px;
  border: 1px solid #ebe4d9;
  border-radius: 10px;
  background: #faf8f4;
  text-align: center;
}
.sat-summary small { display: block; color: #8b847a; font-size: 12px; line-height: 1.7; }
.sat-summary strong { display: block; margin-top: 5px; color: #37322c; font-size: 23px; font-weight: 950; }
.sat-summary .up strong { color: #248771; }
.sat-summary .down strong { color: #c9503f; }
.sat-chart-wrap { max-width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: #d7d0c7 transparent; }
.sat-chart { width: 100%; min-width: 760px; height: auto; display: block; overflow: visible; font-family: inherit; }
.sat-grid line { stroke: #ebe7e0; stroke-width: 1; vector-effect: non-scaling-stroke; }
.sat-grid.zero line { stroke: #cfc7bb; stroke-dasharray: 4 4; }
.sat-grid text { fill: #8d857b; font-size: 11.5px; font-weight: 800; text-anchor: end; }
.sat-area { fill: rgba(47, 141, 117, .09); stroke: none; }
.sat-line { fill: none; stroke: #36896f; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.sat-x text { fill: #6f675e; font-size: 13px; font-weight: 850; text-anchor: middle; direction: rtl; }
.sat-x text.count { fill: #a49a8e; font-size: 11px; font-weight: 800; }
.sat-point { outline: none; cursor: pointer; }
.sat-point .hit { fill: transparent; }
.sat-point .dot { fill: #fff; stroke: #2f8d75; stroke-width: 3; transition: r .14s ease, fill .14s ease; vector-effect: non-scaling-stroke; }
.sat-point:hover .dot,
.sat-point:focus .dot,
.sat-point.active .dot { r: 9px; fill: #2f8d75; stroke: #fff; }
.sat-card > footer { padding: 8px 3px 0; color: #8b8378; font-size: 11px; font-weight: 750; line-height: 1.9; }
.sat-empty { display: flex; align-items: center; gap: 11px; padding: 16px 10px 20px; color: #8d8479; }
.sat-empty svg { width: 34px; height: 34px; flex: none; color: #bdb4a8; }
.sat-empty b { display: block; color: #4c4640; font-size: 14px; }
.sat-empty span { display: block; margin-top: 5px; font-size: 11px; line-height: 1.8; }
.sat-tip {
  position: absolute;
  z-index: 6;
  width: min(390px, 94%);
  display: grid;
  gap: 8px;
  padding: 13px 14px;
  border: 1px solid #e3dbcd;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 16px 34px rgba(58, 48, 36, .17);
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .14s ease, transform .14s ease;
  pointer-events: auto;
}
.sat-tip.on { opacity: 1; transform: translateY(0); }
.sat-tip[hidden] { display: none; }
.sat-tip-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.sat-tip-title { color: #246e59; font-size: 13.5px; font-weight: 950; }
.sat-tip-main { display: flex; align-items: baseline; gap: 6px; }
.sat-tip-main strong { color: #d96329; font-size: 21px; font-weight: 950; line-height: 1; }
.sat-tip-main small { color: #8b837a; font-size: 11px; font-weight: 800; }
.sat-tip-counts { display: flex; flex-wrap: wrap; gap: 6px; }
.sat-tip-counts span { padding: 4px 9px; border-radius: 999px; font-size: 11px; font-weight: 850; }
.sat-tip-counts .correct { color: #248771; background: #e2f2ec; }
.sat-tip-counts .wrong { color: #c04a39; background: #f8e3df; }
.sat-tip-counts .blank { color: #96700f; background: #f7eed4; }
.sat-tip-sub { padding-top: 7px; border-top: 1px solid #eee8df; color: #8b837a; font-size: 10.5px; font-weight: 850; }
/* بدون اسکرول: پنجره باید یکجا و کامل دیده شود؛ ماهِ پرفصل دو ستونه می‌شود. */
.sat-tip ul { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.sat-tip.wide { width: min(680px, 96%); }
.sat-tip.wide ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 8px; }
.sat-tip { overflow: auto; scrollbar-width: thin; }
.sat-tip li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px 46px;
  align-items: center;
  gap: 9px;
  padding: 6px 9px;
  border-radius: 9px;
  background: #faf8f5;
}
.sat-tip li.other { background: #f4f1ec; }
.sat-tip li > div { min-width: 0; }
.sat-tip li b,
.sat-tip li small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sat-tip li b { color: #3c3730; font-size: 11.5px; line-height: 1.45; }
.sat-tip li b em { color: #9a9288; font-size: 10.5px; font-style: normal; font-weight: 750; }
.sat-tip li small { margin-top: 1px; color: #999087; font-size: 10px; line-height: 1.5; }
.sat-share { position: relative; display: block; height: 17px; border-radius: 6px; background: #ece7df; overflow: hidden; }
/* از لبهٔ آغازِ متن پر می‌شود (در RTL یعنی از راست) تا هم‌جهت با خواندن باشد. */
.sat-share i { position: absolute; inset-block: 0; inset-inline-start: 0; display: block; border-radius: 5px; background: linear-gradient(to left, #58ab8f, #2f8d75); }
.sat-share b { position: relative; display: block; padding-top: 3px; color: #35302a; font-size: 10px; font-weight: 850; text-align: center; }
.sat-count { color: #746c63; font-size: 11px; font-weight: 800; white-space: nowrap; }
.sat-tip li > strong { direction: ltr; color: #3e775f; font-size: 12px; font-weight: 950; text-align: left; }
.sat-tip li.empty { display: block; color: #8d8479; font-size: 11px; text-align: center; }
.sp-bell-wrap {
  position: relative;
  min-width: 0;
  margin-top: 4px;
  padding: 10px 10px 4px;
  border: 1px solid #e9e1d5;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff 0%, #fffcf7 100%);
  isolation: isolate;
}
.sp-bell-caption { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px 15px; padding: 4px 8px 2px; color: #817a70; font-size: 9px; font-weight: 800; }
.sp-bell-caption span { display: inline-flex; align-items: center; gap: 5px; }
.sp-bell-caption i { width: 9px; height: 9px; border-radius: 3px; }
.sp-bell-caption .below i { background: #2f9e83; }
.sp-bell-caption .equal i { background: #dd8a3b; }
.sp-bell-caption .above i { background: #d6a33a; }
.sp-bell-chart { width: 100%; height: auto; display: block; overflow: visible; }
.sp-bell-axis { stroke: #cfc8bd; stroke-width: 1.2; }
.sp-bell-area { transition: opacity .16s ease, filter .16s ease; }
.sp-bell-area.below { fill: rgba(47, 158, 131, .28); }
.sp-bell-area.above { fill: rgba(214, 163, 58, .24); }
.sp-bell-line { fill: none; stroke: #4e524f; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.sp-bell-wrap[data-hover-side="below"] .sp-bell-area.below { opacity: 1; filter: saturate(1.2); }
.sp-bell-wrap[data-hover-side="below"] .sp-bell-area.above { opacity: .28; }
.sp-bell-wrap[data-hover-side="above"] .sp-bell-area.above { opacity: 1; filter: saturate(1.2); }
.sp-bell-wrap[data-hover-side="above"] .sp-bell-area.below { opacity: .28; }
.sp-bell-user line { stroke: #e36829; stroke-width: 2.2; stroke-dasharray: 5 4; }
.sp-bell-user circle { fill: #e36829; stroke: #fff; stroke-width: 3; }
.sp-bell-user text { fill: #c7521b; font: 900 11px Vazirmatn, sans-serif; paint-order: stroke; stroke: #fff; stroke-width: 4px; stroke-linejoin: round; }
.sp-bell-tick line { stroke: #cfc8bd; }
.sp-bell-tick text { fill: #91897e; font: 9px Vazirmatn, sans-serif; }
.sp-bell-cursor line { stroke: #5c6370; stroke-width: 1.4; stroke-dasharray: 3 3; }
.sp-bell-cursor circle { fill: #fff; stroke: #4d5862; stroke-width: 2; }
.sp-bell-hit { cursor: crosshair; touch-action: none; outline: none; }
.sp-bell-hit:focus-visible { stroke: #e36829; stroke-width: 2; stroke-dasharray: 5 4; }
.sp-bell-tip {
  position: absolute;
  z-index: 12;
  width: min(220px, calc(100% - 12px));
  padding: 9px 11px;
  border: 1px solid #dcd3c6;
  border-radius: 10px;
  color: #554e45;
  background: rgba(255,255,255,.97);
  box-shadow: 0 12px 28px rgba(49, 37, 23, .17);
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity .12s ease, transform .12s ease;
}
.sp-bell-tip.on { opacity: 1; transform: translateY(0); }
.sp-bell-tip strong { display: block; margin-bottom: 5px; color: #d35e25; font-size: 14px; }
.sp-bell-tip span { display: flex; justify-content: space-between; gap: 8px; padding: 2px 0; font-size: 8.5px; }
.sp-bell-tip span b { color: #34302b; }
.sp-bell-tip small { display: block; margin-top: 5px; padding-top: 5px; border-top: 1px solid #eee7de; color: #90887e; font-size: 8px; }
.sp-bell-axis-title { margin-top: -9px; padding-bottom: 4px; color: #938b80; font-size: 8.5px; font-weight: 800; text-align: center; }
.sp-standing-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.sp-standing-summary article { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 11px; border: 1px solid; border-radius: 11px; }
.sp-standing-summary article > span { width: 33px; height: 33px; flex: none; display: grid; place-items: center; border-radius: 9px; }
.sp-standing-summary svg { width: 16px; height: 16px; }
.sp-standing-summary small,
.sp-standing-summary strong { display: block; }
.sp-standing-summary small { color: inherit; opacity: .72; font-size: 8px; }
.sp-standing-summary strong { margin-top: 2px; font-size: 16px; font-weight: 950; }
.sp-standing-summary .below { color: #267a67; border-color: #c8e3da; background: #eef9f5; }
.sp-standing-summary .below > span { background: #d7efe7; }
.sp-standing-summary .equal { color: #a35e24; border-color: #ead5bf; background: #fff7ee; }
.sp-standing-summary .equal > span { background: #f7e6d5; }
.sp-standing-summary .above { color: #98701a; border-color: #ebddaf; background: #fff9e8; }
.sp-standing-summary .above > span { background: #f6ebc8; transform: rotate(180deg); }
.sp-subject-method { margin: 10px 0 0; padding: 9px 11px; border-radius: 9px; color: #7f786e; background: #f7f4ef; font-size: 8.5px; line-height: 1.85; }
.sp-subject-rank.is-private { border-color: #e5ded3; background: #f8f6f2; }
.sp-subject-rank.is-private strong { color: #8d857a; }
.sp-cohort-private {
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  margin-top: 4px;
  padding: 26px;
  border: 1px dashed #dfd5c8;
  border-radius: 14px;
  color: #686159;
  background: #faf8f4;
  text-align: start;
}
.sp-cohort-private > span { width: 46px; height: 46px; flex: none; display: grid; place-items: center; border-radius: 13px; color: #8b7461; background: #eee8df; }
.sp-cohort-private svg { width: 21px; height: 21px; }
.sp-cohort-private h3 { margin: 0 0 5px; color: #403a34; font-size: 12px; }
.sp-cohort-private p { max-width: 570px; margin: 0; color: #847c72; font-size: 9.5px; line-height: 1.9; }
.sp-subject-ineligible,
.sp-subject-no-chart,
.sp-subject-empty,
.sp-subject-error,
.sp-subject-loading {
  min-height: 330px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 26px;
  text-align: center;
}
.sp-subject-ineligible > span,
.sp-subject-no-chart > span,
.sp-subject-empty > span,
.sp-subject-error > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: #b25a29; background: #fff0e5; }
.sp-subject-ineligible svg,
.sp-subject-no-chart svg,
.sp-subject-empty svg,
.sp-subject-error svg { width: 22px; height: 22px; }
.sp-subject-ineligible h3,
.sp-subject-no-chart h3,
.sp-subject-empty h2,
.sp-subject-error h2,
.sp-subject-loading h2 { margin: 0; color: #332e28; font-size: 15px; }
.sp-subject-ineligible p,
.sp-subject-no-chart p,
.sp-subject-empty p,
.sp-subject-error p,
.sp-subject-loading p { max-width: 510px; margin: 0; color: #898177; font-size: 9.5px; line-height: 1.9; }
.sp-subject-loading > div { display: flex; gap: 5px; }
.sp-subject-loading > div span { width: 8px; height: 8px; border-radius: 50%; background: #df6b2b; animation: dashboardPulse 1s infinite ease-in-out; }
.sp-subject-loading > div span:nth-child(2) { animation-delay: .12s; }
.sp-subject-loading > div span:nth-child(3) { animation-delay: .24s; }

@media (max-width: 1120px) {
  .qdisc-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .qdisc-distributions { grid-template-columns: 1fr 1fr; }
  .qdisc-dist-card.blank { grid-column: 1 / -1; }
  .sp-subject-score-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sp-subject-score-grid.personal-only { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .qdisc-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qdisc-distributions { grid-template-columns: 1fr; }
  .qdisc-dist-card.blank { grid-column: auto; }
  .sp-subject-layout { grid-template-columns: 1fr; }
  .sp-subject-list { grid-auto-flow: column; grid-auto-columns: minmax(160px, 44vw); overflow-x: auto; overflow-y: hidden; max-height: none; }
  .sp-subject-pick { min-height: 52px; }
  .sp-subject-panel { padding: 16px; }
  .sat-card { padding: 13px 13px 9px; }
  .sat-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .qdisc-analysis { padding: 13px; }
  .qdisc-head,
  .qdisc-section-title { flex-direction: column; }
  .qdisc-updated { align-self: flex-start; }
  .qdisc-summary { grid-template-columns: 1fr; }
  .qdisc-summary > article { min-height: 74px; }
  .sp-subject-standing-head { align-items: flex-start; flex-direction: column; }
  .sp-subject-rank { width: 100%; }
  .sp-subject-score-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sp-cohort-private { align-items: flex-start; padding: 18px; }
  .sp-standing-summary { grid-template-columns: 1fr; }
  .sp-bell-caption { justify-content: flex-start; }
  .sp-bell-user text { font-size: 9px; }
}

/* ═══════════ مدل چاپ کنکوریِ آزمون: جلد دفترچه + سربرگ صفحه + کادر محاسبات ═══════════ */
.pstudio-page.pexam-cover-page { padding: 57px; }
.pexam-cover {
  height: 1000px; /* کمی کمتر از ارتفاع مفید A4 (چاپ: 296mm − 2×15mm ≈ 1005px) تا جلد به صفحهٔ دوم سر نخورد */
  display: flex;
  flex-direction: column;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #1c2732;
  --pexam-ink: #214f75;
  --pexam-accent: #ff681d;
  --pexam-soft: #fff3e9;
  /* خطوط جلد: هم‌رنگِ کادرهای اصلی (شمارهٔ دفترچه و جدول دروس) تا در چاپ سیاه‌وسفید
     و روی کاغذ هم واضح دربیایند؛ خطوط داخلی یک پله روشن‌تر تا کادر شلوغ نشود. */
  --pexam-line: #214f75;
  --pexam-line-in: #5c81a1;
  --pexam-line-warm: #b4713c;
}
.pexam-cover::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 430px;
  height: 430px;
  top: 165px;
  left: 50%;
  transform: translateX(-50%);
  border: 42px double rgba(33, 79, 117, .035);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(255, 104, 29, .025), 0 0 0 86px rgba(33, 79, 117, .018);
  pointer-events: none;
}
.pexam-cover-head {
  display: grid;
  /* دو ستون کناری مساویِ ۱fr و برندِ auto در وسط تا لوگوی «آقای کنکور» دقیقاً وسط صفحه بیفتد؛
     هر باکس با عرض ثابت به لبهٔ بیرونیِ خودش می‌چسبد و تعادل حفظ می‌شود. */
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: stretch;
}
.pexam-cover-bookno {
  width: 122px;
  justify-self: start;
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 0;
  align-content: stretch;
  overflow: hidden;
  border: 1.5px solid var(--pexam-line);
  border-radius: 16px;
  text-align: center;
  background: #fff;
}
.pexam-cover-bookno span,
.pexam-cover-bookno b {
  display: grid;
  place-items: center;
  padding: 6px 4px;
  font-size: 10.5px;
  font-weight: 900;
  color: var(--pexam-ink);
}
.pexam-cover-bookno span + span { border-top: 1px solid var(--pexam-line-in); }
.pexam-cover-bookno b {
  min-height: 42px;
  border-top: 1px solid var(--pexam-line-in);
  background: var(--pexam-ink);
  color: #fff;
  font-size: 27px;
  line-height: 1;
}
.pexam-cover-brand {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 2px;
  min-height: 108px;
}
.pexam-brand-mark {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  margin-bottom: 3px;
  background: linear-gradient(145deg, var(--pexam-accent), #e6530a);
  box-shadow: 0 8px 18px rgba(255, 104, 29, .18);
}
.pexam-brand-mark svg { width: 42px; height: 42px; fill: none; stroke: #fff; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.pexam-cover-brand > b { font-size: 16px; font-weight: 950; color: var(--pexam-ink); }
.pexam-cover-brand > small { font-size: 9.5px; color: #667481; font-weight: 700; }
.pexam-cover-info {
  position: relative;
  overflow: hidden;
  width: 200px;
  justify-self: end;
  border: 1.5px solid var(--pexam-line);
  border-radius: 16px;
  padding: 12px 16px 12px 12px;
  display: grid;
  gap: 6px;
  align-content: center;
  text-align: right;
  font-size: 11px;
  font-weight: 700;
  background: linear-gradient(135deg, #f8fbfd, #fff);
  color: #4e5e6a;
}
.pexam-cover-info > b { font-size: 13px; font-weight: 950; color: var(--pexam-ink); }
.pexam-cover-hero {
  position: relative;
  margin-top: 22px;
  padding: 20px 24px 18px;
  border: 1.6px solid var(--pexam-line);
  border-radius: 22px;
  background: linear-gradient(125deg, rgba(239, 248, 253, .96), rgba(255, 250, 246, .98));
  text-align: center;
  box-shadow: 0 9px 22px rgba(33, 79, 117, .07);
}
.pexam-cover-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 13px;
  border-radius: 999px;
  background: #fff;
  color: #758491;
  font-size: 10px;
  font-weight: 850;
}
.pexam-cover-title {
  margin-top: 7px;
  padding: 2px 12px;
  text-align: center;
}
.pexam-cover-title h1 { margin: 0; color: var(--pexam-ink); font-size: 20px; font-weight: 950; line-height: 1.75; }
.pexam-cover-group {
  margin: 5px auto 0;
  color: #526675;
  font-size: 12.5px;
  font-weight: 900;
  text-align: center;
}
.pexam-cover-stats {
  width: min(470px, 100%);
  margin: 14px auto 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.pexam-cover-stats > span {
  min-height: 42px;
  display: grid;
  place-items: center;
  gap: 1px;
  padding: 6px 8px;
  border: 1.2px solid var(--pexam-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .88);
}
.pexam-cover-stats small { color: #7a8790; font-size: 9px; font-weight: 800; }
.pexam-cover-stats b { color: var(--pexam-ink); font-size: 12px; font-weight: 950; }
.pexam-cover-table {
  margin-top: 24px;
  border: 1.5px solid var(--pexam-line);
  border-radius: 15px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 18px rgba(33, 79, 117, .06);
}
.pexam-crow {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) 96px 84px 84px 122px;
  align-items: stretch;
}
.pexam-crow > span {
  padding: 8px 10px;
  font-size: 11.5px;
  font-weight: 700;
  text-align: center;
  border-inline-start: 1px solid var(--pexam-line-in);
  border-top: 1px solid var(--pexam-line-in);
  display: grid;
  place-items: center;
  min-height: 34px;
}
.pexam-crow > span:first-child { border-inline-start: 0; }
.pexam-crow.head > span {
  border-top: 0;
  border-color: rgba(255, 255, 255, .34);
  background: var(--pexam-ink);
  color: #fff;
  font-weight: 900;
  font-size: 11px;
}
.pexam-crow .pexam-c-title { font-weight: 900; }
.pexam-cover-notes {
  margin-top: 20px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.pexam-note {
  border: 1.2px solid var(--pexam-line-warm);
  border-radius: 999px;
  padding: 7px 20px;
  font-size: 11px;
  font-weight: 900;
  background: var(--pexam-soft);
  color: #7a482c;
}
.pexam-cover-foot {
  margin-top: auto;
  border: 1.2px solid var(--pexam-line);
  border-radius: 12px;
  padding: 8px 12px;
  text-align: center;
  font-size: 9.5px;
  font-weight: 700;
  color: #60717e;
  background: #f7fafc;
}

/* خروجی PDF دفترچه روی Quartz/Preview/Safari: حذف لایه‌های نیمه‌شفاف و
   پس‌زمینه‌های ترکیبی که در macOS به شکل کادر نارنجی/خاکستری ظاهر می‌شوند. */
body.pdf-export .pstudio-page.pexam-cover-page .pexam-cover,
body.pdf-export .pstudio-page.pexam-page {
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
body.pdf-export .pstudio-page.pexam-cover-page .pexam-cover::before { display: none; }
body.pdf-export .pstudio-page.pexam-cover-page .pexam-brand-mark {
  background: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  isolation: isolate;
}
body.pdf-export .pstudio-page.pexam-cover-page .pexam-cover-info,
body.pdf-export .pstudio-page.pexam-cover-page .pexam-cover-hero,
body.pdf-export .pstudio-page.pexam-cover-page .pexam-cover-stats > span,
body.pdf-export .pstudio-page.pexam-cover-page .pexam-cover-table,
body.pdf-export .pstudio-page.pexam-cover-page .pexam-note,
body.pdf-export .pstudio-page.pexam-cover-page .pexam-cover-foot,
body.pdf-export .pstudio-page.pexam-cover-page .pexam-crow:not(.head) > span {
  background: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  isolation: isolate;
}
body.pdf-export .pstudio-page.pexam-cover-page .pexam-crow.head > span {
  background: #214f75 !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}
body.pdf-export .pstudio-page.pexam-page .pq-no-wrap {
  background: #fff !important;
  box-shadow: none !important;
  filter: none !important;
  isolation: isolate;
}

/* صفحات سؤال مدل کنکوری: سربرگ سادهٔ «نام آزمون | درس ....... صفحه N» */
.pstudio-page.pexam-page {
  padding-top: 88px;
  display: flex;
  flex-direction: column;
}
.pexam-page .pstudio-page-inner { flex: 0 0 auto; }
.pexam-page-head {
  position: absolute;
  top: 38px;
  right: 57px;
  left: 57px;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 8px;
  border-bottom: 1.5px solid #17140f;
}
.pexam-page-head b {
  font-size: 12px;
  font-weight: 900;
  color: #17140f;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pexam-page-head b i { font-style: normal; color: #8b8578; padding-inline: 3px; }
.pexam-page-head > span { font-size: 11px; font-weight: 900; color: #17140f; flex: none; }

/* کادر «محل انجام محاسبات» پایین صفحات دروس محاسباتی */
.pexam-calc {
  position: absolute;
  right: 57px;
  left: 57px;
  bottom: 220px;
  margin: 0;
  min-height: 0;
  border-top: 1.8px solid #17140f;
  z-index: 2;
  pointer-events: none;
}
.pexam-calc > span {
  display: block;
  width: max-content;
  margin: -13px auto 0;
  background: #f2efe9;
  border: 1px solid #55503f;
  border-radius: 2px;
  padding: 4px 30px;
  font-size: 10.5px;
  font-weight: 900;
  color: #17140f;
}

/* فونت شمارهٔ سؤال دفترچهٔ کنکوری (B Yekan؛ اگر نصب بود از سیستم، وگرنه از فایل سایت) */
@font-face {
  font-family: "B Yekan";
  src: local("B Yekan"), local("BYekan"), url("/assets/fonts/BYekan.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
/* شمارهٔ سؤال مدل کنکوری: خط کوتاه و کنترل‌شده کنار عدد، مستقل از الگوریتم bidi */
.pexam-no {
  width: auto;
  height: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  display: inline-flex;
  direction: rtl;
  align-items: baseline;
  justify-content: flex-end;
  gap: 3px;
  color: #17140f;
  font-family: "B Nazanin", "BNazanin", "B Yekan", "Vazirmatn", Tahoma, sans-serif;
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.75;
  min-width: 27px;
  white-space: nowrap;
}
.pexam-no b { font: inherit; }
.pexam-no::after {
  content: "";
  width: 7px;
  flex: 0 0 7px;
  align-self: center;
  border-top: 1.5px solid currentColor;
}
.pexam-qblock .pq-question-row { align-items: flex-start; }
/* همان هم‌ترازیِ خطِ پایه که در قالب ساده توضیح داده شد؛ اینجا اختلاف بیشتر است
   چون شماره فونت و اندازهٔ خودش را دارد و سطرش (1.75) از سطرِ متن کوتاه‌تر است. */
.pexam-qblock:not(.pq-visual-first) .pq-question-row { align-items: baseline; }

/* ═══ خروجی PDF/چاپ: تمِ مستقل برای هر نوع خروجی ═══
   دفترچهٔ کنکوری تم سرمه‌ای خودش را حفظ می‌کند. پاسخ تشریحی رنگی می‌ماند،
   سؤال ساده از سرمه‌ای/نارنجیِ تیرهٔ چاپ‌امن استفاده می‌کند و کلید پرکنتراست می‌ماند. */
body.pdf-export .pstudio-page,
body.pstudio-printing .pstudio-page {
  text-rendering: geometricPrecision;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

/* سؤال‌های قالب ساده: هویت سایت، اما با رنگ‌هایی که در grayscale هم تیره و خوانا می‌مانند. */
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key),
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) { color: #171b1e !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key)::before,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key)::before {
  border-color: #536b7a !important;
  border-width: 1.5px;
  box-shadow: inset 0 0 0 4px #f6f8f9 !important;
}
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-page-head,
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-page-footer,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-page-head,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-page-footer { border-color: #536b7a !important; color: #394851 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-title,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-title { border-color: #899ca8 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) :is(.psimple-brand b,.psimple-count b,.psimple-site),
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) :is(.psimple-brand b,.psimple-count b,.psimple-site) { color: #173e58 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) :is(.psimple-brand small,.psimple-title small,.psimple-count small,.psimple-page-no),
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) :is(.psimple-brand small,.psimple-title small,.psimple-count small,.psimple-page-no) { color: #554f48 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-logo,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-logo { background: #fff1e7 !important; color: #a94714 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-info,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-info {
  border-color: #667b88 !important;
  background: #667b88 !important;
  box-shadow: none !important;
}
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-info .pqh-cell,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-info .pqh-cell { background: #fff !important; color: #20272b !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-info .pqh-cell b,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .psimple-info .pqh-cell b { color: #7f401c !important; }
/* شمارهٔ سؤال دیگر چیپ نیست؛ عددِ ساده فقط باید در چاپ سیاه‌وسفید هم پررنگ بماند. */
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-no,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-no { color: #171b1e !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-block.with-line,
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-extra-space,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-block.with-line,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-extra-space { border-color: #737b80 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title { color: #173e58 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title::before,
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title::after,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title::before,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title::after { height: 1.5px; background: #718894 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title span,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-section-title span { border-color: #718894 !important; background: #f5f9fb !important; color: #173e58 !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-option b,
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) .pq-option b { color: inherit !important; }
body.pdf-export .pstudio-page.is-simple:not(.is-answers):not(.is-key) :is(.pq-body table,.pq-body th,.pq-body td,.sq-explanation-columns,.sq-explanation-column + .sq-explanation-column),
body.pstudio-printing .pstudio-page.is-simple:not(.is-answers):not(.is-key) :is(.pq-body table,.pq-body th,.pq-body td,.sq-explanation-columns,.sq-explanation-column + .sq-explanation-column) { border-color: #465761 !important; }

/* پاسخ تشریحی: رنگی، نرم و هم‌خانواده با سایت؛ این قالب معمولاً برای مطالعه/ارسال دیجیتال است.
   کادرِ دورِ هر پاسخ در خروجی هم برداشته شد تا با صفحه یکی باشد؛ مرزِ پاسخ‌ها
   جداکنندهٔ «آقای کنکور» است. */
body.pdf-export .pstudio-page.is-simple.is-answers .pq-answer-chip,
body.pstudio-printing .pstudio-page.is-simple.is-answers .pq-answer-chip { border: 1px solid #9ecfc0 !important; background: #e8f6f1 !important; color: #146b59 !important; }
body.pdf-export .pstudio-page.is-simple.is-answers .pq-answer-divider,
body.pstudio-printing .pstudio-page.is-simple.is-answers .pq-answer-divider { color: #8a4f1a !important; }
body.pdf-export .pstudio-page.is-simple.is-answers .pad-line,
body.pstudio-printing .pstudio-page.is-simple.is-answers .pad-line { background: #8a4f1a !important; }
body.pdf-export .pstudio-page.is-simple.is-answers .pad-orn,
body.pstudio-printing .pstudio-page.is-simple.is-answers .pad-orn { border-color: #8a4f1a !important; background: #fff8ef !important; }
body.pdf-export .pstudio-page.is-simple.is-answers .pad-label,
body.pstudio-printing .pstudio-page.is-simple.is-answers .pad-label { border: 1px solid #c8945f !important; background: #fff8ef !important; }

/* استودیوی دفترچهٔ آزمون: بدون سایدبار تنظیمات */
.pstudio-layout.no-side { grid-template-columns: 1fr; }

/* هنگام تولید PDF: اسکیل موبایل خنثی شود تا بوم با ابعاد واقعی گرفته شود */
body.pstudio-exporting .pstudio-page {
  transform: none !important;
  margin-bottom: 24px !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ═══ نمودار «نرخ پاسخ‌گویی تجمعی در طول آزمون» ═══ */
.rr-area-chart .rr-edge.wrong { stroke: #cf4b32; }
.rr-area-chart .rr-edge.blank { stroke: #d7a72e; }
.rr-tl-cursor circle.wrong { fill: #cf4b32; }
.rr-tl-cursor circle.blank { fill: #d7a72e; }
.rr-chart-switches label i.wrong { background: #cf4b32; }
.rr-chart-switches label i.blank { background: #d7a72e; }
.rr-tl-row.wrong small { color: #b2452f; }
.rr-tl-row.blank small { color: #a8831f; }
.rr-bh-tip { min-width: 210px; max-width: 268px; }
.rr-bh-tip.pinned { pointer-events: auto; border-color: #e8b98a; box-shadow: 0 14px 34px rgba(54,40,25,.28); }
.rr-bh-sep { display: block; height: 1px; margin: 3px 0 1px; background: #efe6d8; }
.rr-bh-min-title { font-size:11.5px !important; color: #9a8b74 !important; }
.rr-bh-visits { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.rr-bh-visits > small { font-size:11px; color: #9a8b74; font-weight: 800; flex: none; }
.rr-bh-chiprow { display: inline-flex; gap: 3px; flex-wrap: wrap; }
.rr-bh-chip {
  min-width: 20px; height: 20px; padding: 0 5px;
  border: 1px solid #ecdfcc; border-radius: 6px; background: #fff8ee;
  color: #9a5a1f; font: inherit; font-size:11.5px; font-weight: 900; cursor: pointer;
  transition: border-color .12s ease, background .12s ease;
}
.rr-bh-chip:hover { border-color: var(--orange); background: #fff2e3; }
/* سؤالی که از دقیقهٔ قبل باز مانده: رویداد تازه‌ای ندارد، پس کم‌رنگ‌تر و خط‌چین */
.rr-bh-chip.carry { border-style: dashed; background: #fffdf9; color: #b08a5c; }
.rr-bh-act { display: flex; align-items: center; gap: 5px; font-size:11.5px; font-weight: 700; color: #574c3e; }
.rr-bh-act > span { flex: 1 1 auto; min-width: 0; }
.rr-bh-res { flex: none; font-style: normal; font-size:10.5px; font-weight: 900; padding: 1px 6px; border-radius: 6px; }
.rr-bh-res.correct { background: #e9f8f2; color: #12907b; }
.rr-bh-res.wrong { background: #fdeee9; color: #c24a3a; }
.rr-bh-res.blank { background: #fbf3df; color: #a8831f; }
.rr-bh-more, .rr-bh-none { font-size:11px; color: #9a8b74; font-weight: 700; }
.rr-bh-hint { font-size:10.5px; color: #b3a68f; font-weight: 700; border-top: 1px dashed #efe6d8; padding-top: 4px; margin-top: 2px; }
.rr-bhq-status { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.rr-bhq-status .rr-bhq-time { display: inline-flex; align-items: center; gap: 5px; font-size:13px; color: var(--muted); font-weight: 700; }
.rr-bhq-status .rr-bhq-time svg { width: 13px; height: 13px; }
.rr-bhq-options .sq-ans-opt { cursor: default; }
/* آزمون‌ساز */
.professional-exam-wizard { border-top: 3px solid var(--orange); }
.professional-exam-wizard.pro-wide { max-width: 1220px; }
.pro-stepper { overflow-x: auto; padding: 6px 3px 8px; }
.pro-stepper .exam-step { min-width: 96px; }
/* نوع برگزاری: هر سه کارت در یک ردیف */
.pro-type-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pro-type-cards .ew-type b svg { width: 19px; height: 19px; color: var(--orange); }
/* زمان‌بندی: تاریخ و ساعت کنار هم (چپ‌به‌راست: اول تاریخ بعد ساعت) با پاپ‌آپ */
.pro-schedule-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 2px 0; }
.pro-date-box { padding: 13px 14px; border: 1px solid #ead9c2; border-radius: 15px; background: #fffdf9; }
.pro-date-box.on { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 107, 24, .08); }
.pro-date-box > label { display: block; color: var(--muted); font-size: 11.5px; font-weight: 800; margin-bottom: 8px; }
.pro-dt-row { display: flex; gap: 8px; }
.pro-dt-cell { position: relative; flex: 1; min-width: 0; }
.pro-dt-cell:first-child { flex: 1.25; }
.pro-dt-btn { width: 100%; min-height: 46px; display: flex; align-items: center; gap: 9px; border: 1px solid #e3d7c8; border-radius: 12px; background: #fff; color: var(--ink); padding: 6px 11px; font: inherit; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease; }
.pro-dt-btn:hover { border-color: #f2a562; }
.pro-dt-btn.open { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 107, 24, .1); }
.pro-dt-btn svg { width: 17px; height: 17px; flex: none; color: var(--orange); }
.pro-dt-btn > span { display: grid; gap: 1px; text-align: left; }
.pro-dt-btn small { color: var(--muted); font-size: 9.5px; font-weight: 800; }
.pro-dt-btn b { font-size: 13px; font-weight: 800; white-space: nowrap; }
.pro-pop { position: absolute; top: calc(100% + 8px); left: 0; z-index: 40; min-width: 100%; background: #fff; border: 1px solid #ead9c2; border-radius: 15px; box-shadow: 0 18px 42px rgba(70, 50, 29, .16); padding: 10px; animation: ew-in .18s ease; }
.pro-cal-pop { width: 300px; max-width: min(340px, 86vw); direction: rtl; background: transparent; border: 0; box-shadow: none; padding: 0; }
.pro-dt-cell:last-child .pro-pop { left: auto; right: 0; }
.pro-calendar { width: 100%; max-width: none; margin: 0; }
.pro-time-pop { width: 216px; }
.tp-preview { display: flex; align-items: baseline; justify-content: center; gap: 3px; padding: 4px 0 9px; border-bottom: 1px dashed #ecdfcd; margin-bottom: 8px; }
.tp-preview b { font-size: 19px; font-weight: 900; color: var(--ink); }
.tp-preview i { font-style: normal; color: var(--muted); font-weight: 900; }
.tp-preview small { margin-inline-start: 7px; color: var(--muted); font-size: 9.5px; font-weight: 800; }
.tp-cols { display: flex; gap: 8px; }
.tp-col { flex: 1; min-width: 0; display: grid; gap: 5px; }
.tp-col-label { text-align: center; color: var(--muted); font-size: 10px; font-weight: 800; }
.tp-scroll { height: 178px; overflow-y: auto; display: grid; gap: 3px; padding: 3px; border: 1px solid #f1e8da; border-radius: 11px; background: #fffdf9; scrollbar-width: thin; }
.tp-cell { border: 0; border-radius: 8px; background: transparent; padding: 6px 4px; font: inherit; font-size: 12.5px; font-weight: 700; color: var(--ink); cursor: pointer; }
.tp-cell:hover { background: #fff0e3; }
.tp-cell.on { background: var(--orange); color: #fff; font-weight: 900; }
/* ضریب درس در ردیف درس (ویزارد آزمون‌ساز): ستون اختصاصی بدون سرریز */
.professional-exam-wizard .ew-lesson-row { grid-template-columns: 72px minmax(170px, 1fr) minmax(132px, 158px) minmax(108px, 126px) 42px; }
.ew-ls-coef { display: grid; gap: 7px; min-width: 0; }
.ew-ls-coef > span:first-child { font-size: inherit; color: inherit; margin: 0; }
.ew-ls-coef .ew-time-input { height: 44px; border-radius: 13px; border-color: #e3d7c8; background: #fff; box-shadow: 0 5px 14px rgba(69, 50, 29, .03); padding-inline: 11px; }
.ew-ls-coef .ew-time-input input { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; box-shadow: none; text-align: center; font: inherit; font-size: 14px; font-weight: 650; }
.ew-ls-coef .ew-time-input svg { color: #9b8a72; width: 15px; height: 15px; }
/* زمان و ضریب: برچسب و محتوای باکس وسط‌چین */
.professional-exam-wizard .ew-ls-time > span:first-child,
.professional-exam-wizard .ew-ls-coef > span:first-child { text-align: center; }
.professional-exam-wizard .ew-ls-time .ew-time-input,
.professional-exam-wizard .ew-ls-coef .ew-time-input { justify-content: center; }
.professional-exam-wizard .ew-ls-time .ew-time-input input { width: 40px; flex: none; text-align: center; }
.professional-exam-wizard .ew-time-input small { margin-inline-start: 2px; }
/* مرحلهٔ پیش‌نمایش: فهرست ترتیب در کنار + کارت واقعی سؤال‌ها (مثل مجموعه سوال) */
.pro-preview-layout { display: grid; grid-template-columns: minmax(196px, 236px) minmax(0, 1fr); gap: 14px; align-items: start; }
.pro-preview-side { position: sticky; top: 82px; max-height: calc(100vh - 100px); overflow: auto; border: 1px solid #ead9c2; border-radius: 16px; background: #fffdf9; padding: 9px; scrollbar-width: none; }
.pro-preview-side::-webkit-scrollbar { display: none; }
.pro-preview-side-inner { display: grid; gap: 8px; }
.pro-ord-booklet { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 12px; background: #fff4e9; border: 1px solid #f2ddc4; }
.pro-ord-booklet > div { display: flex; flex-direction: column; }
.pro-ord-booklet b { font-size: 12.5px; }
.pro-ord-booklet small { color: var(--muted); font-size: 10px; }
.pro-ord-lesson-head { display: flex; flex-direction: column; gap: 7px; padding: 8px 4px 0; }
.pro-ord-lesson-head > div { display: flex; flex-direction: column; }
.pro-ord-lesson-head b { font-size: 12.5px; }
.pro-ord-lesson-head small { color: var(--muted); font-size: 10px; }
.pro-ord-lesson-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.pro-ord-lesson-actions button { display: inline-flex; align-items: center; gap: 4px; min-height: 27px; padding: 3px 9px; border: 1px solid #e5d8c6; border-radius: 8px; background: #fff; color: #7a5c39; font: inherit; font-size: 10px; font-weight: 800; cursor: pointer; }
.pro-ord-lesson-actions button:hover { border-color: var(--orange); color: var(--orange); }
.pro-ord-lesson-actions button svg { width: 12px; height: 12px; }
.pro-question-order { display: grid; gap: 5px; }
.pro-question-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto auto; align-items: center; gap: 6px; padding: 6px 7px; border: 1px solid #efe7db; border-radius: 10px; background: #fff; cursor: grab; transition: border-color .15s ease, box-shadow .15s ease; }
.pro-question-row:hover { border-color: #f0c396; box-shadow: 0 4px 12px rgba(70, 50, 29, .05); }
.pro-question-row.dragging { opacity: .45; cursor: grabbing; }
.pro-question-row.missing { border-color: #e5b1aa; background: #fff4f2; }
.pro-question-row > b { font-size: 11px; color: #fff; background: var(--orange); border-radius: 7px; width: 22px; height: 22px; display: grid; place-items: center; }
.pro-row-main { display: flex; flex-direction: column; min-width: 0; gap: 1px; }
.pro-row-main strong { font-size: 10.5px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-question-row small { color: var(--muted); font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-question-row > button { border: 0; background: transparent; color: #9a8b78; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; padding: 2px; }
.pro-question-row > button.danger:hover { color: #c34f4f; }
.pro-question-row > button svg { width: 13px; height: 13px; }
.pro-question-move { display: inline-flex; gap: 2px; }
.pro-question-move button { flex: none; width: 23px; height: 23px; display: inline-flex; align-items: center; justify-content: center; padding: 0; line-height: 0; border: 1px solid #e9dfd1; border-radius: 6px; background: #fff; color: var(--orange); cursor: pointer; }
.pro-question-move button:disabled { opacity: .3; cursor: default; }
.pro-question-move svg { display: block; width: 12px; height: 12px; margin: 0; transform: none; }
/* پنل روش‌های افزودن (خودکار/سطحی/آماری) در حالت انتخاب از بانک */
.exam-add-panel { display: grid; gap: 12px; }
.exam-add-panel .ep-level-segs { display: flex; flex-wrap: wrap; gap: 6px; }
.exam-add-row { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; }
.exam-add-row > label { display: grid; gap: 6px; font-size: 11.5px; font-weight: 800; color: #7a5c39; }
.exam-add-row input { width: 130px; height: 40px; border: 1px solid #e3d7c8; border-radius: 11px; padding: 0 12px; font: inherit; text-align: center; background: #fff; }
.exam-add-row input:focus { outline: 0; border-color: var(--orange); }
/* فیلتر حذف تکراری‌ها (سایدبار حالت انتخاب) */
.epx-search { width: 100%; height: 36px; border: 1px solid #e3d7c8; border-radius: 10px; padding: 0 11px; font: inherit; font-size: 11.5px; background: #fff; margin-bottom: 8px; }
.epx-search:focus { outline: 0; border-color: var(--orange); }
.epx-group-title { display: block; margin: 7px 0 4px; color: var(--muted); font-size: 10px; font-weight: 900; }
.epx-code { font-style: normal; color: var(--muted); font-size: 9px; font-weight: 700; }
.exam-pick-mode .qset-add-tabs .seg { font-size: 10.5px; padding: 5px 10px; }
/* مرحلهٔ انتشار: افقی، ولی هر مشخصه یک واحد یکپارچه (وسط آیتم شکسته نمی‌شود) */
.professional-exam-wizard .ew-review-meta.pro-review-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; }
.professional-exam-wizard .ew-review-meta.pro-review-meta > span { display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; }
/* فاصلهٔ نمودار فعالیت مدیران از پنل بالایی در نمای کلی */
.admin-activity-panel { margin-top: 18px; }
/* هم‌قدکردن سر دفترچه با باکس‌های درس/زمان/ضریب */
.ew-bk-head { align-items: end; }
.ew-bk-head .ew-bk-index { margin-block-end: 7px; }
.ew-bk-name { height: 44px; padding: 0 12px; border: 1px solid #e3d7c8; border-radius: 13px; background: #fff; box-shadow: 0 5px 14px rgba(69, 50, 29, .03); }
.ew-bk-stat { height: 44px; padding: 0 13px; border-radius: 13px; }
.ew-bk-head > .ew-mini { width: 44px; height: 44px; border-radius: 13px; }
/* هم‌قدکردن دکمه‌های «انتخاب/ویرایش سؤال» و حذف در مرحلهٔ انتخاب سؤال */
.ew-q-ls-actions { align-items: center; }
.ew-q-ls-actions .ew-pick-button { min-height: 40px; }
.ew-q-ls-actions .ew-mini.danger { width: 40px; height: 40px; padding: 0; display: grid; place-items: center; border-radius: 11px; }
.epx-note { margin: 0 0 8px; color: var(--muted); font-size: 10.5px; line-height: 1.8; }
.epx-on { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 8px; padding: 4px 10px; border-radius: 999px; background: #fff0e3; color: #9a5a1f; font-size: 10.5px; font-weight: 800; }
.pro-preview-cards { display: grid; gap: 14px; min-width: 0; }
.pro-cards-booklet-head { display: flex; align-items: center; gap: 9px; padding: 10px 13px; border: 1px solid #f2ddc4; border-radius: 13px; background: #fff4e9; font-weight: 900; }
.pro-missing-card .omr-warn { margin: 8px 0 0; }
/* مرحلهٔ مخاطبان */
.pro-audience-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 2px; }
.pro-audience-mode { position: relative; display: flex; flex-direction: column; gap: 5px; padding: 14px; border: 1.5px solid #e5dccb; border-radius: 14px; background: #fff; cursor: pointer; }
.pro-audience-mode.on { border-color: var(--orange); box-shadow: 0 0 0 1.5px var(--orange) inset; background: #fffdf9; }
.pro-audience-mode.disabled { opacity: .5; cursor: not-allowed; }
.pro-audience-mode input { position: absolute; opacity: 0; }
.pro-audience-mode b { font-size: 13px; }
.pro-audience-mode span { color: var(--muted); line-height: 1.8; font-size: 11px; }
.pro-student-picker { border: 1px solid #ead9c2; border-radius: 15px; background: #fffdf9; overflow: hidden; }
.pro-student-picker-head { display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; background: #fff4e9; border-bottom: 1px solid #f2ddc4; font-size: 12.5px; }
.pro-student-picker-head b { color: var(--orange); }
.pro-student-tools { display: grid; gap: 8px; padding: 11px 14px; border-bottom: 1px dashed #ecdfcd; }
.pro-aud-search { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border: 1px solid #e3d7c8; border-radius: 12px; background: #fff; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.pro-aud-search:hover { border-color: #f2a562; }
.pro-aud-search:focus-within { border-color: var(--orange); box-shadow: 0 7px 18px rgba(255, 107, 24, .13); transform: translateY(-1px); }
.pro-aud-search svg { width: 15px; height: 15px; color: var(--muted); flex: none; transition: color .18s ease, transform .18s ease; }
.pro-aud-search:focus-within svg { color: var(--orange); transform: scale(1.12); }
.pro-aud-search input, .pro-aud-search input:focus { flex: 1; min-width: 0; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent; font: inherit; }
.pro-aud-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.pro-aud-chips small { color: var(--muted); font-size: 10.5px; font-weight: 800; }
.pro-aud-chip { border: 1px solid #e5d8c6; border-radius: 999px; background: #fff; padding: 5px 12px; font: inherit; font-size: 11px; font-weight: 800; color: #7a5c39; cursor: pointer; transition: all .15s ease; }
.pro-aud-chip:hover { border-color: var(--orange); }
.pro-aud-chip.on { background: var(--orange); border-color: var(--orange); color: #fff; }
.pro-aud-hint { margin: 0; color: var(--muted); font-size: 10.5px; line-height: 1.9; }
.pro-aud-bulk { display: flex; flex-wrap: wrap; gap: 7px; }
.pro-aud-bulk .secondary-button { min-height: 33px; padding: 5px 12px; font-size: 11px; }
.pro-student-list { max-height: 330px; overflow: auto; scrollbar-width: thin; }
.pro-student-list > label { display: flex; align-items: center; gap: 9px; padding: 9px 14px; border-bottom: 1px solid #f3ecdf; cursor: pointer; }
.pro-student-list > label:last-child { border-bottom: 0; }
.pro-student-list > label:hover { background: #fffaf4; }
.pro-student-list > label input { accent-color: var(--orange); }
.pro-student-list > label > span:not(.avatar) { display: flex; flex-direction: column; min-width: 0; }
.pro-student-list > label small { color: var(--muted); }
.pro-student-list > label em { margin-inline-start: auto; flex: none; font-style: normal; font-size: 10px; font-weight: 800; color: #7a5c39; background: #fff4e9; border: 1px solid #f2ddc4; padding: 3px 9px; border-radius: 999px; }
.pro-student-list > label em.muted { color: var(--muted); background: #f7f5f0; border-color: #ebe6db; }
.pro-student-list .exam-pick-note { padding: 12px 14px; margin: 0; }
/* تالار آزمون: تاگل روشن/خاموش */
.pro-hall-card { border: 1.5px solid #e5dccb; border-radius: 15px; background: #fff; padding: 14px; }
.pro-hall-card.on { border-color: var(--orange); background: #fffdf9; }
.pro-hall-toggle { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.pro-hall-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.pro-switch { flex: none; width: 42px; height: 24px; margin-top: 2px; border-radius: 999px; background: #e6ded1; position: relative; transition: background .2s ease; }
.pro-switch::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, .18); transition: transform .2s ease; }
.pro-hall-toggle input:checked + .pro-switch { background: var(--orange); }
.pro-hall-toggle input:checked + .pro-switch::after { transform: translateX(-18px); }
.pro-hall-text { display: grid; gap: 3px; }
.pro-hall-text b { font-size: 13px; }
.pro-hall-text small { color: var(--muted); font-size: 11.5px; line-height: 1.8; }
.pro-hall-settings { margin-top: 12px; padding: 13px 14px; border: 1px dashed #ecdfcd; border-radius: 13px; background: #fffaf4; }
.pro-hall-settings h3 { margin: 0 0 9px; font-size: 12px; }
.pro-hall-settings > label { display: flex; gap: 9px; margin: 8px 0; cursor: pointer; }
.pro-hall-settings > label input { accent-color: var(--orange); }
.pro-hall-settings > label span { display: flex; flex-direction: column; }
.pro-hall-settings small { color: var(--muted); }
/* حالت انتخاب سؤال از بانک برای آزمون‌ساز */
.exam-pick-mode { position: sticky; top: 74px; z-index: 25; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px 14px; box-shadow: 0 10px 26px rgba(70, 50, 29, .08); }
.exam-pick-mode .qset-bank-title { grid-column: 1; grid-row: 1; }
.exam-pick-mode .exam-pick-counter { grid-column: 2; grid-row: 1; justify-self: center; }
.exam-pick-mode > .primary-button { grid-column: 3; grid-row: 1; justify-self: end; }
.exam-pick-foot { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 9px 12px; border-top: 1px dashed #f0d7c2; padding-top: 10px; }
.exam-pick-counter { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 800; color: #7a5c39; background: #fff; border: 1px solid #f0d7c2; border-radius: 999px; padding: 6px 13px; }
.exam-pick-counter b { color: var(--orange); }
.exam-pick-counter i { width: 1px; height: 14px; background: #ecd9c4; }
.sbank-chip.is-static { cursor: default; }
.admin-exam-pick { margin-top: 4px; }
@media (max-width: 980px) {
  .pro-preview-layout { grid-template-columns: 1fr; }
  .pro-preview-side { position: static; max-height: 320px; }
}
@media (max-width: 900px) {
  .professional-exam-wizard .ew-lesson-row { grid-template-columns: 68px minmax(130px, 1fr) minmax(118px, 140px) minmax(92px, 108px) 42px; }
}
@media (max-width: 760px) {
  .pro-type-cards { grid-template-columns: 1fr; }
  .pro-schedule-grid { grid-template-columns: 1fr; }
  .pro-audience-modes { grid-template-columns: 1fr; }
  .exam-pick-mode { position: static; }
  .pro-dt-row { flex-direction: column; }
  .pro-dt-cell:last-child .pro-pop { right: auto; left: 0; }
}
@media (max-width: 640px) {
  /* نوار انتخاب سؤال در موبایل: عنوان، شمارنده، دکمه و تب‌ها زیر هم */
  .exam-pick-mode { grid-template-columns: 1fr; }
  .exam-pick-mode .exam-pick-counter { grid-column: 1; grid-row: 2; justify-self: center; }
  .exam-pick-mode > .primary-button { grid-column: 1; grid-row: 3; justify-self: stretch; }
  .exam-pick-foot { grid-row: 4; }
  .exam-pick-mode .qset-add-tabs { display: flex; flex-wrap: wrap; justify-content: center; max-width: 100%; }
}
@media (max-width: 680px) {
  .professional-exam-wizard .ew-lesson-row { grid-template-columns: 62px minmax(0, 1fr) minmax(0, 1fr) 42px; }
  .professional-exam-wizard .ew-ls-field { grid-column: 2 / 4; }
  .professional-exam-wizard .ew-ls-time { grid-column: 2; grid-row: 2; width: 100%; }
  .professional-exam-wizard .ew-ls-coef { grid-column: 3; grid-row: 2; }
  .professional-exam-wizard .ew-lesson-row > .ew-mini { grid-column: 4; grid-row: 1; }
}
.pro-hall-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(260px,1fr)); gap: 12px; padding: 14px; }
.pro-hall-grid article { border: 1px solid var(--line); border-radius: 15px; padding: 13px; background: var(--surface); }
.pro-hall-grid article header { display: flex; gap: 9px; align-items: center; }
.pro-hall-grid article header > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #f1edff; color: #6d5bd0; }
.pro-hall-grid article header div { display: flex; flex-direction: column; }
.pro-hall-grid article > div { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.pro-hall-grid article > div span { font-size: 10px; padding: 5px 8px; background: var(--surface-soft,#f6f6f6); border-radius: 999px; }
.pro-direct-picker { border: 1px solid var(--line); border-radius: 13px; max-height: 420px; overflow: auto; }
.pro-direct-head { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; padding: 10px 12px; background: var(--surface); border-bottom: 1px solid var(--line); }
.pro-direct-picker > label { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 9px; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.pro-direct-picker > label > span { display: flex; flex-direction: column; }
.pro-direct-picker > label > button { border: 0; background: transparent; color: #6d5bd0; }
.exam-picker-context { position: sticky; top: -18px; z-index: 5; margin: -4px -2px 14px; padding: 12px; border: 1px solid #dcd5f7; border-radius: 14px; background: rgba(250,248,255,.97); box-shadow: 0 8px 24px rgba(75,61,145,.09); backdrop-filter: blur(8px); }
.exam-picker-context-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 9px; }
.exam-picker-context-head > div { display: flex; flex-direction: column; gap: 2px; }
.exam-picker-context-head span,.exam-picker-context-head strong { color: var(--muted); font-size: 10px; }
.exam-picker-context-head b { font-size: 13px; color: #4e3fa8; }
.exam-picker-context-booklets { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; }
.exam-picker-context-booklets article { flex: 0 0 min(310px,85vw); border: 1px solid #e7e1f8; border-radius: 10px; background: var(--surface); overflow: hidden; }
.exam-picker-context-booklets article > header { display: flex; align-items: center; gap: 7px; padding: 7px 9px; background: #f4f1ff; }
.exam-picker-context-booklets article > header > span { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 7px; background: #6d5bd0; color: #fff; font-size: 10px; }
.exam-picker-context-booklets article > header > div { display: flex; flex-direction: column; }
.exam-picker-context-booklets article > header small { color: var(--muted); font-size: 9px; }
.exam-picker-context-booklets article > div { display: flex; flex-wrap: wrap; gap: 5px; padding: 7px; }
.exam-picker-context-booklets article > div button { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; font-size: 10px; cursor: pointer; }
.exam-picker-context-booklets article > div button b { min-width: 18px; padding: 1px 4px; border-radius: 999px; background: #eeeaf9; color: #5b4ab5; text-align: center; }
.exam-picker-context-booklets article > div button.on { border-color: #6d5bd0; background: #f3efff; color: #4e3fa8; box-shadow: 0 0 0 2px rgba(109,91,208,.08); }
.user-educator-section { margin-top: 16px; padding: 12px; border: 1px solid #ddd6f5; border-radius: 14px; background: #faf8ff; }
.user-educator-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 9px; }
.user-educator-head h3 { margin: 0 0 3px; font-size: 12px; }
.user-educator-head p { margin: 0; max-width: 520px; color: var(--muted); font-size: 10px; line-height: 1.8; }
.user-educator-head > span { flex: none; padding: 4px 8px; border-radius: 999px; background: #ece7fb; color: #5c4bb5; font-size: 10px; font-weight: 900; }
.user-educator-picker { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; max-height: 250px; overflow: auto; }
.user-educator-picker > label { display: grid; grid-template-columns: auto auto minmax(0,1fr); align-items: center; gap: 7px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); cursor: pointer; }
.user-educator-picker > label.on { border-color: #7767ce; background: #f3f0ff; }
.user-educator-picker > label > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.user-educator-picker small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-educator-picker small i { font-style: normal; }
.pro-analytics { display: grid; gap: 14px; }
.pro-analysis-scopes { position: sticky; top: -18px; z-index: 3; width: max-content; max-width: 100%; padding: 6px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.96); box-shadow: 0 7px 20px rgba(52,43,95,.07); }
.pro-analysis-tiles { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; }
.pro-analysis-tiles article { display: grid; gap: 5px; padding: 13px; border: 1px solid #ded8f2; border-radius: 13px; background: linear-gradient(145deg,#fbfaff,#f4f1ff); }
.pro-analysis-tiles span { color: var(--muted); font-size: 10px; }
.pro-analysis-tiles b { color: #5142a8; font-size: 20px; }
.pro-analysis-state { min-height: 220px; display: grid; place-items: center; align-content: center; gap: 9px; color: var(--muted); text-align: center; }
.pro-analysis-state > svg { width: 36px; height: 36px; color: #7a69d2; }
.pro-analysis-state p { margin: 0; }
.pro-analysis-state.error > svg { color: #bd594a; }
.pro-analysis-empty { padding: 22px 14px; color: var(--muted); text-align: center; font-size: 11px; }
.pro-analysis-section { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--surface); }
.pro-analysis-section > h3 { margin: 0; padding: 11px 13px; border-bottom: 1px solid var(--line); background: var(--surface-soft,#fafafa); font-size: 12px; }
.pro-analysis-table { overflow-x: auto; }
.pro-analysis-table > div { min-width: 650px; display: grid; grid-template-columns: 55px minmax(160px,1.5fr) 110px 90px 110px; gap: 8px; align-items: center; padding: 9px 12px; border-bottom: 1px solid var(--line); font-size: 10.5px; text-align: center; }
.pro-analysis-table.lessons > div { grid-template-columns: minmax(150px,1fr) 65px 65px 100px 100px 100px; }
.pro-analysis-table > div:last-child { border-bottom: 0; }
.pro-analysis-table > div.head { background: #f6f3ff; color: #6253ad; font-weight: 900; }
.pro-analysis-table > div > span:nth-child(2) { display: flex; flex-direction: column; min-width: 0; }
.pro-analysis-table small { color: var(--muted); }
.pro-question-stats { display: grid; grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap: 8px; padding: 10px; }
.pro-question-stats article { border: 1px solid var(--line); border-radius: 11px; overflow: hidden; }
.pro-question-stats header { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 7px; align-items: center; padding: 8px 10px; background: #faf8ff; }
.pro-question-stats header small { overflow: hidden; text-overflow: ellipsis; color: var(--muted); }
.pro-question-stats header strong { color: #188679; }
.pro-question-stats article > div { display: flex; flex-wrap: wrap; gap: 5px; padding: 8px; }
.pro-question-stats article > div span { padding: 4px 7px; border-radius: 7px; background: var(--surface-soft,#f5f5f5); color: var(--muted); font-size: 9.5px; }
.pro-question-stats article > div .ok { background: #eaf8f3; color: #188679; }
.pro-question-stats article > div .bad { background: #fceeea; color: #bd5041; }
.pro-sheet-manager { display: grid; gap: 12px; }
.pro-sheet-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 12px; border: 1px solid #ded8f2; border-radius: 13px; background: #faf8ff; }
.pro-sheet-head p { margin: 0; font-weight: 800; }
.pro-sheet-head > span { display: flex; flex-wrap: wrap; gap: 7px; }
.pro-sheet-list { display: grid; gap: 6px; max-height: 420px; overflow: auto; }
.pro-sheet-list > div { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 11px; }
.pro-sheet-list > div > span { display: flex; flex-direction: column; min-width: 0; }
.pro-sheet-list small { color: var(--muted); }
.pro-sheet-review { display: grid; gap: 8px; padding: 10px; border: 1px solid #d7eadf; border-radius: 13px; background: #f6fcf9; }
.pro-sheet-review-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.pro-sheet-review-head > div { display: flex; flex-direction: column; }
.pro-sheet-review-head small { color: var(--muted); }
.pro-sheet-review > article { padding: 9px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.pro-sheet-review > article > header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.pro-sheet-review > article > header > span { display: flex; flex-direction: column; }
.pro-sheet-answer-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(72px,1fr)); gap: 5px; max-height: 260px; overflow: auto; }
.pro-sheet-answer-grid label { display: flex; align-items: center; justify-content: space-between; gap: 4px; padding: 4px 6px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft,#fafafa); }
.pro-sheet-answer-grid select { min-width: 38px; border: 0; background: transparent; font: inherit; }
.exam-window-state { display: inline-flex; max-width: 160px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.exam-window-state.upcoming { color: #8a681d; }
.exam-window-state.closed { color: #a04e4e; }
@media (max-width: 820px) {
  .pro-schedule-grid,.pro-audience-modes { grid-template-columns: 1fr; }
  .pro-question-row { grid-template-columns: 22px minmax(0,1fr) auto auto; }
  .pro-question-move { grid-column: 3; grid-row: 1; }
  .pro-question-row > button { grid-column: auto; font-size: 0; }
  .pro-preview-lesson-head { align-items: flex-start; flex-direction: column; }
  .exam-picker-context { top: -12px; }
  .exam-picker-context-head { align-items: flex-start; flex-direction: column; }
  .user-educator-picker { grid-template-columns: 1fr; }
  .pro-analysis-tiles { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pro-sheet-head,.pro-sheet-review-head { align-items: stretch; flex-direction: column; }
  .pro-sheet-list > div { grid-template-columns: auto minmax(0,1fr); }
  .pro-sheet-list > div > button { grid-column: 1 / -1; }
}

/* ===== شک‌دار حین آزمون + کارنامهٔ تفسیری ===== */
/* رنگ شک: بنفش سایت (#7458b8) تا از نارنجیِ نشان‌دار کاملاً جدا باشد */
.er-nh-doubt i { display: inline-grid; place-items: center; color: #7458b8; }
.er-nh-doubt svg { width: 14px; height: 14px; }
.er-iconbtn.er-doubt-btn:hover { border-color: #8f6cd0; color: #7458b8; }
.er-iconbtn.er-doubt-btn.on { background: #f2edff; border-color: #9b7fd8; color: #7458b8; }
.er-cell.doubted { box-shadow: inset 0 0 0 1.5px #b9a3e3; }
.er-cell.doubted.current { box-shadow: 0 0 0 2px var(--orange) inset, inset 0 0 0 3.5px #b9a3e3; }
.er-cell-doubt {
  position: absolute; top: -5px; inset-inline-start: -5px; width: 14px; height: 14px;
  display: grid; place-items: center; border-radius: 50%; background: #7458b8; color: #fff;
  font-size: 8.5px; font-style: normal; font-weight: 900; pointer-events: none;
  box-shadow: 0 0 0 1.5px #fff;
}
.er-doubt-row {
  display: grid; gap: 8px; padding: 11px 13px;
  border: 1px dashed #c9b8e8; border-radius: 13px; background: #faf8ff;
}
.er-doubt-q { display: flex; align-items: center; gap: 7px; color: #63489c; font-size: 12px; font-weight: 900; }
.er-doubt-q svg { width: 16px; height: 16px; flex: none; }
.er-doubt-opts { display: flex; flex-wrap: wrap; gap: 7px; }
.er-doubt-opt {
  min-width: 36px; height: 31px; padding: 0 11px;
  border: 1px solid #d9cdf0; border-radius: 9px; background: #fff;
  font: inherit; font-size: 11.5px; font-weight: 900; color: #63489c; cursor: pointer;
  transition: border-color .14s ease, background .14s ease, color .14s ease, transform .14s var(--ease-soft);
}
.er-doubt-opt:hover { border-color: #8f6cd0; transform: translateY(-1px); }
.er-doubt-opt.on { background: #7458b8; border-color: #7458b8; color: #fff; }
.er-doubt-row > small { color: #8b7fae; font-size: 9.5px; font-weight: 700; line-height: 1.9; }

/* پاسخبرگ کارنامه: نشانهٔ سؤال شک‌دار + گزینهٔ شکِ سؤال‌های نزده */
.rr-sheet-summary .doubted { background: #faf8ff; border-color: #ddd2f0; }
.rr-sheet-summary .doubted b { color: #7458b8; }
.rr-sheet-legend .doubted { background: #f2edff; color: #63489c; }
.rr-sheet-legend .doubt-lean { background: #fff; color: #63489c; box-shadow: inset 0 0 0 1.5px #b9a3e3; }
.rr-sheet-question.doubted { background: #fdfcff; }
.rr-sheet-question.doubted > b { position: relative; }
.rr-sheet-doubt {
  position: absolute; top: -7px; inset-inline-end: -9px; width: 12px; height: 12px;
  display: grid; place-items: center; border-radius: 50%; background: #7458b8; color: #fff;
  font-size:9.5px; font-style: normal; font-weight: 900; line-height: 1;
}
.rr-sheet-question > i.doubt-lean { border: 1.5px dashed #8f6cd0; color: #63489c; background: #f7f4fe; }

/* کارنامهٔ تفسیری */
.rr-interpretive { display: grid; gap: 13px; }
.rr-interpretive .tone-teal { --tone: #168878; --tone-soft: #eaf8f4; }
.rr-interpretive .tone-red { --tone: #c24a3a; --tone-soft: #fdeceb; }
.rr-interpretive .tone-yellow { --tone: #a97925; --tone-soft: #fbf1df; }
.rr-interpretive .tone-purple { --tone: #7458b8; --tone-soft: #f2edff; }
.rr-int-empty svg { width: 40px; height: 40px; color: #b9a3e3; }
/* کاشی‌های تفسیری: تک‌ردیفهٔ فشرده — آیکون + عنوان + عدد در یک خط، بدون جملهٔ زیرین */
.rr-int-tiles article { min-height: 0; gap: 7px; padding: 8px 11px; }
.rr-int-tiles article > i { width: 27px; height: 27px; }
.rr-int-tiles article > i svg { width: 14px; height: 14px; }
.rr-int-tiles article > small { flex: 1; min-width: 0; color: #6a6154; font-size:12px; font-weight: 850; line-height: 1.4; }
.rr-int-tiles article > b { flex: none; color: #302b25; font-size:17px; font-weight: 950; unicode-bidi: plaintext; }
.rr-int-compose {
  display: grid; gap: 10px; padding: 13px 15px;
  border: 1px solid #e8dfd3; border-radius: 15px; background: linear-gradient(145deg, #fff, #fdfbf8);
}
.rr-int-compose > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.rr-int-compose > header b { color: #302b25; font-size:13.5px; font-weight: 950; }
.rr-int-compose > header span { color: #988d7d; font-size:11.5px; font-weight: 750; }
.rr-int-bar { display: flex; gap: 2px; height: 16px; border-radius: 999px; overflow: hidden; }
.rr-int-bar i { display: block; min-width: 8px; transition: filter .15s ease; }
.rr-int-bar i:hover { filter: brightness(1.12); }
.rr-int-bar .ok { background: #1aa58e; }
.rr-int-bar .bad { background: #ef5f4e; }
.rr-int-bar .missed { background: #e0a52e; }
.rr-int-bar .saved { background: #5b83c4; }
.rr-int-bar .none { background: #c9c0b2; }
.rr-int-legend { display: flex; flex-wrap: wrap; gap: 7px 13px; }
.rr-int-legend span { display: inline-flex; align-items: center; gap: 5px; color: #6a6154; font-size:11.5px; font-weight: 850; }
.rr-int-legend span i { width: 9px; height: 9px; border-radius: 3px; }
.rr-int-legend .ok i { background: #1aa58e; }
.rr-int-legend .bad i { background: #ef5f4e; }
.rr-int-legend .missed i { background: #e0a52e; }
.rr-int-legend .saved i { background: #5b83c4; }
.rr-int-legend .none i { background: #c9c0b2; }
.rr-int-legend span b { color: #302b25; }
.rr-int-block { display: grid; gap: 10px; padding: 13px 15px; border: 1px solid #e8dfd3; border-radius: 16px; background: #fffdfb; }
.rr-int-block-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 9px; border-bottom: 1px dashed #e5dccb; }
.rr-int-block-head b { color: #302b25; font-size:14px; font-weight: 950; }
.rr-int-block-head span { color: #988d7d; font-size:11.5px; font-weight: 800; }
.rr-int-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.rr-int-card { --int-tone: #847968; --int-soft: #f1eee8; display: grid; gap: 9px; align-content: start; padding: 11px 13px; border: 1px solid #e8dfd3; border-radius: 13px; background: #fff; }
.rr-int-card.ok { --int-tone: #168878; --int-soft: #eaf8f4; }
.rr-int-card.bad { --int-tone: #c24a3a; --int-soft: #fdeceb; }
.rr-int-card.missed { --int-tone: #a97925; --int-soft: #fbf1df; }
.rr-int-card.saved { --int-tone: #4268a5; --int-soft: #eef3fc; }
.rr-int-card > header { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.rr-int-card > header b { color: var(--int-tone); font-size:13px; font-weight: 950; }
.rr-int-card > header small { color: #988d7d; font-size:10.5px; font-weight: 750; }
.rr-int-card > header span { margin-inline-start: auto; padding: 3px 9px; border-radius: 999px; background: var(--int-soft); color: var(--int-tone); font-size:10.5px; font-weight: 900; white-space: nowrap; }
.rr-int-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rr-int-chip {
  min-width: 30px; height: 28px; padding: 0 8px;
  border: 1px solid color-mix(in srgb, var(--int-tone, #847968) 32%, #e8dfd3); border-radius: 9px;
  background: var(--int-soft, #f1eee8); color: var(--int-tone, #6a6154);
  font: inherit; font-size:12.5px; font-weight: 900; cursor: pointer;
  transition: transform .13s var(--ease-soft), box-shadow .13s ease;
}
.rr-int-chip:hover { transform: translateY(-1.5px); box-shadow: 0 5px 12px color-mix(in srgb, var(--int-tone, #847968) 22%, transparent); }
.rr-int-chip.ok { --int-tone: #168878; --int-soft: #eaf8f4; }
.rr-int-chip.bad { --int-tone: #c24a3a; --int-soft: #fdeceb; }
.rr-int-chip.missed { --int-tone: #a97925; --int-soft: #fbf1df; }
.rr-int-chip.saved { --int-tone: #4268a5; --int-soft: #eef3fc; }
.rr-int-chip.none { --int-tone: #847968; --int-soft: #f1eee8; }
.rr-int-chip.inline { height: 24px; min-width: 26px; font-size:11.5px; }
.rr-int-none { margin: 0; color: #a79b89; font-size:12px; font-weight: 750; }
.rr-int-whatif { display: grid; gap: 10px; padding: 12px 13px; border: 1px solid #e9e1d4; border-radius: 13px; background: #fff; }
.rr-int-whatif > header { display: grid; gap: 3px; }
.rr-int-whatif > header b { color: #302b25; font-size:13px; font-weight: 950; }
.rr-int-whatif > header p { margin: 0; color: #988d7d; font-size:11.5px; font-weight: 750; line-height: 1.9; }
.rr-int-table tr.muted td { opacity: .55; }
.rr-int-delta { display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 999px; font-size:12px; font-weight: 950; white-space: nowrap; }
.rr-int-delta i { font-size:10px; font-style: normal; }
.rr-int-delta.up { background: #eaf8f4; color: #168878; }
.rr-int-delta.down { background: #fdeceb; color: #c24a3a; }
.rr-int-delta.zero { background: #f1eee8; color: #988d7d; font-weight: 800; }
.rr-int-ranks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.rr-int-ranks article {
  display: grid; gap: 6px; justify-items: center; padding: 11px 12px;
  border: 1px solid #e6ddd0; border-radius: 12px; background: linear-gradient(145deg, #fff, #fcfaf6); text-align: center;
}
.rr-int-ranks article span { color: #988d7d; font-size:11px; font-weight: 850; }
.rr-int-ranks article > div { display: inline-flex; align-items: center; gap: 7px; }
.rr-int-ranks article b { color: #6a6154; font-size:16px; font-weight: 950; }
.rr-int-ranks article b.sim { color: #7458b8; }
.rr-int-ranks article i { display: inline-grid; place-items: center; color: #c2b7a4; }
.rr-int-ranks article i svg { width: 13px; height: 13px; }
.rr-int-ranks > p { grid-column: 1 / -1; margin: 0; color: #a79b89; font-size:10.5px; font-weight: 750; text-align: center; }
.rr-int-note { align-items: center; flex-wrap: wrap; gap: 6px; }
@media (max-width: 760px) {
  .rr-int-cards { grid-template-columns: minmax(0, 1fr); }
  .rr-int-ranks { grid-template-columns: minmax(0, 1fr); }
  .rr-int-block, .rr-int-compose { padding: 11px; }
}

/* ===== شرکت مجدد: تایمر شمارش معکوس ۲۴ ساعته ===== */
.exam-retake-icon.is-locked { color: #b1b1b1; border-color: #e6e0d6; background: #f6f3ee; cursor: not-allowed; }
.exam-retake-icon.is-locked:hover svg { transform: none; }
.exam-retake-timer { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 999px; background: #fff3e2; border: 1px solid #f4d6ab; color: #a9601a; font-size: 10.5px; font-weight: 750; white-space: nowrap; }
.exam-retake-timer svg { width: 12px; height: 12px; }
.exam-retake-timer b { font-variant-numeric: tabular-nums; letter-spacing: .4px; }
.exam-retake-timer small { color: #b8792f; font-size: 9px; font-weight: 800; }
.exam-retake-wait { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.exam-retake-wait .primary-button[disabled] { opacity: .55; cursor: not-allowed; }
.exam-td-actions .exam-retake-timer { font-size: 9px; padding: 2px 5px; gap: 3px; }
.exam-td-actions .exam-retake-timer svg { width: 10px; height: 10px; }
/* فقط ردیفی که تایمر شرکت مجدد دارد اجازهٔ شکستن به خط بعد را می‌گیرد تا هرگز اسکرول افقی نسازد */
.exam-td-actions:has(.exam-retake-timer) { flex-wrap: wrap; row-gap: 4px; }

/* ===== صدور کارنامه: آنی / بعد از پایان آزمون (آزمون جمعی) ===== */
.pro-report-card { margin-top: 14px; border: 1.5px solid #e5dccb; border-radius: 15px; background: #fff; padding: 14px; }
.pro-report-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.pro-report-icon { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #fff3e2; color: var(--orange); }
.pro-report-icon svg { width: 18px; height: 18px; }
.pro-report-head b { display: block; font-size: 13px; }
.pro-report-head small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; line-height: 1.7; }
.pro-report-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pro-report-mode { position: relative; display: flex; padding: 12px; border: 1.5px solid #e5dccb; border-radius: 13px; background: #fff; cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.pro-report-mode.on { border-color: var(--orange); box-shadow: 0 0 0 1.5px var(--orange) inset; background: #fffdf9; }
.pro-report-mode input { position: absolute; opacity: 0; pointer-events: none; }
.pro-report-mode-main { display: flex; flex-direction: column; gap: 5px; }
.pro-report-mode-main b { display: flex; align-items: center; gap: 6px; font-size: 12.5px; }
.pro-report-mode-main b svg { width: 15px; height: 15px; color: var(--orange); }
.pro-report-mode-main small { color: var(--muted); font-size: 11px; line-height: 1.75; }
@media (max-width: 640px) {
  .pro-report-modes { grid-template-columns: minmax(0, 1fr); }
}

/* ═══════════════════ آزمون اعتبارسنجی و نظرسنجی ═══════════════════ */
.pro-extra-card { margin-top: 14px; border: 1.5px solid #e5dccb; border-radius: 15px; background: #fff; padding: 14px; }
.pro-extra-card.on { border-color: var(--orange); background: #fffdf9; }
.pro-extra-body { display: grid; gap: 12px; margin-top: 13px; padding-top: 13px; border-top: 1px dashed #ecdfc9; }
.pro-val-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pro-val-mode { position: relative; display: grid; gap: 5px; padding: 12px; border: 1.5px solid #e5dccb; border-radius: 13px; background: #fff; cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease; }
.pro-val-mode.on { border-color: var(--orange); box-shadow: 0 0 0 1.5px var(--orange) inset; background: #fffdf9; }
.pro-val-mode.disabled { opacity: .5; cursor: not-allowed; }
.pro-val-mode input { position: absolute; opacity: 0; pointer-events: none; }
.pro-val-mode b { font-size: 12.5px; }
.pro-val-mode span { color: var(--muted); font-size: 11px; line-height: 1.75; }
/* ورودی زمان اعتبارسنجی: هم‌شکلِ فیلدهای زمان/ضریب مرحلهٔ دفترچه‌ها */
.pro-val-time { display: grid; gap: 7px; width: max-content; max-width: 100%; }
.pro-val-time > span:first-child { margin-inline-start: 4px; color: #9a8c78; font-size: 10.5px; font-weight: 700; }
.pro-val-time .ew-time-input {
  height: 44px; padding-inline: 12px; border: 1px solid #e3d7c8; border-radius: 13px;
  background: #fff; box-shadow: 0 5px 14px rgba(69, 50, 29, .03); justify-content: center;
}
.pro-val-time .ew-time-input svg { width: 15px; height: 15px; color: #9b8a72; }
.pro-val-time .ew-time-input input {
  width: 54px; flex: none; padding: 0; border: 0; outline: 0; background: transparent; box-shadow: none;
  text-align: center; font: inherit; font-size: 14px; font-weight: 650; color: var(--ink);
}
.pro-val-time .ew-time-input small { margin-inline-start: 2px; font-size: 11px; }

.pro-survey-list { display: grid; gap: 10px; }
.pro-survey-row { border: 1px solid #e9dfcd; border-radius: 14px; background: #fff; padding: 12px; display: grid; gap: 11px; }
.pro-survey-row > header {
  display: grid; gap: 9px; align-items: end;
  grid-template-columns: 30px minmax(0, 1fr) 158px auto 44px;
  grid-template-areas: "num title type req del";
}
.pro-survey-row > header > .ew-bk-index { grid-area: num; margin-bottom: 7px; }
.pro-survey-row > header > .pro-survey-field:not(.is-type) { grid-area: title; }
.pro-survey-row > header > .pro-survey-field.is-type { grid-area: type; }
.pro-survey-row > header > .pro-survey-req { grid-area: req; }
.pro-survey-row > header > .ew-mini { grid-area: del; height: 44px; width: 44px; border-radius: 13px; }
/* فیلدِ برچسب‌بالا: متن پرسش و نوع پرسش */
.pro-survey-field { display: grid; gap: 7px; min-width: 0; }
.pro-survey-field > span { margin-inline-start: 4px; color: #9a8c78; font-size: 10.5px; font-weight: 700; }
.pro-survey-field input,
.pro-survey-field select {
  width: 100%; min-width: 0; height: 44px; padding: 0 12px;
  border: 1px solid #e3d7c8; border-radius: 13px; background: #fff; outline: 0;
  font: inherit; font-size: 13px; font-weight: 650; color: var(--ink);
  box-shadow: 0 5px 14px rgba(69, 50, 29, .03);
  transition: border-color .16s ease, box-shadow .16s ease;
}
.pro-survey-field input::placeholder { color: #b9ab97; font-weight: 500; }
.pro-survey-field input:hover,
.pro-survey-field select:hover { border-color: #dccbb4; }
.pro-survey-field input:focus,
.pro-survey-field select:focus { border-color: #f2a562; box-shadow: 0 0 0 3px rgba(255, 101, 25, .1); }
.pro-survey-field.is-type { position: relative; }
.pro-survey-field.is-type select { appearance: none; -webkit-appearance: none; padding-inline-end: 30px; cursor: pointer; }
.pro-survey-field.is-type::after {
  content: ""; position: absolute; inset-inline-end: 14px; bottom: 20px; width: 7px; height: 7px;
  border-right: 1.7px solid #8d806e; border-bottom: 1.7px solid #8d806e;
  transform: rotate(45deg) translateY(-1px); pointer-events: none;
}
.pro-survey-req {
  display: inline-flex; align-items: center; gap: 6px; height: 44px; padding-inline: 12px; margin-bottom: 0;
  border: 1px solid #e3d7c8; border-radius: 13px; background: #fff;
  color: var(--muted); font-size: 11px; font-weight: 700; white-space: nowrap; cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease;
}
.pro-survey-req input { accent-color: var(--orange); width: 15px; height: 15px; cursor: pointer; }
.pro-survey-req.on { border-color: #f6c69b; background: #fff8ef; color: #b4590f; }
.pro-survey-options { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pro-survey-options-label { flex: 0 0 100%; margin-inline-start: 4px; color: #9a8c78; font-size: 10.5px; font-weight: 700; }
.pro-survey-option {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; padding-inline: 9px;
  border: 1px solid #eadfcc; border-radius: 11px; background: #fdfbf7;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.pro-survey-option:focus-within { border-color: #f2a562; background: #fff; box-shadow: 0 0 0 3px rgba(255, 101, 25, .08); }
.pro-survey-option b { flex: none; color: var(--orange); font-size: 10.5px; }
.pro-survey-option input {
  width: 122px; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; box-shadow: none;
  font: inherit; font-size: 11.5px; font-weight: 650; color: var(--ink);
}
.pro-survey-option input::placeholder { color: #b9ab97; font-weight: 500; }
.pro-survey-option button {
  flex: none; width: 20px; height: 20px; border: 0; border-radius: 6px; background: transparent;
  color: #a4907a; cursor: pointer; display: grid; place-items: center; transition: background .16s ease, color .16s ease;
}
.pro-survey-option button:hover { background: #fdecea; color: #b3372f; }
.pro-survey-option button svg { width: 12px; height: 12px; }
.pro-survey-hint { margin: 0; color: var(--muted); font-size: 10.5px; line-height: 1.9; }
.pro-survey-actions { display: flex; gap: 9px; flex-wrap: wrap; }

/* نظرسنجی سمت دانش‌آموز */
.exam-survey-modal { display: grid; gap: 14px; }
.sv-q { display: grid; gap: 9px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface, #fff); }
.sv-q > header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sv-q > header b { font-size: 12.5px; }
.sv-req { padding: 2px 7px; border-radius: 999px; background: #fdeaea; color: #b3372f; font-size: 9.5px; font-style: normal; }
.sv-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.sv-choice { padding: 8px 13px; border: 1.5px solid #e5dccb; border-radius: 11px; background: #fff; font-size: 11.5px; cursor: pointer; transition: border-color .16s ease, background .16s ease; }
.sv-choice:hover { border-color: var(--orange); }
.sv-choice.on { border-color: var(--orange); background: #fff5e6; font-weight: 800; }
.sv-stars { display: inline-flex; align-items: center; gap: 4px; }
.sv-star { border: 0; background: transparent; color: #dcd3c4; font-size: 27px; line-height: 1; cursor: pointer; transition: color .14s ease, transform .14s ease; }
.sv-star:hover { transform: scale(1.08); }
.sv-star.on { color: #f5a623; }
.sv-star-label { margin-inline-start: 8px; color: var(--muted); font-size: 10.5px; font-style: normal; }
.sv-text {
  width: 100%; border: 1px solid #e3d7c8; border-radius: 12px; padding: 11px; outline: 0;
  background: #fff; font: inherit; font-size: 12px; line-height: 1.9; color: var(--ink); resize: vertical;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.sv-text::placeholder { color: #b9ab97; }
.sv-text:hover { border-color: #dccbb4; }
.sv-text:focus { border-color: #f2a562; box-shadow: 0 0 0 3px rgba(255, 101, 25, .1); }

/* اجراکنندهٔ اعتبارسنجی */
.exam-validation-runner .ev-top { border-bottom-color: #f0d9ae; }
.exam-validation-runner .er-title strong { color: var(--orange); }
.ev-info-body { display: grid; gap: 10px; }
.ev-result-ring {
  position: relative; display: grid; place-items: center; gap: 2px; width: 132px; height: 132px; margin: 4px auto 12px;
  border-radius: 50%; background: conic-gradient(var(--orange) calc(var(--rr-p, 0) * 1%), #eee6d8 0);
}
.ev-result-ring::before { content: ""; position: absolute; inset: 11px; border-radius: 50%; background: #fff; }
.ev-result-ring b { position: relative; font-size: 25px; color: var(--orange); }
.ev-result-ring span { position: relative; color: var(--muted); font-size: 10px; }

/* کارت اعتبارسنجی در کارنامه */
.rr-validation-card { border: 1.5px solid #e6dcc9; border-radius: 15px; background: #fff; padding: 13px 14px; display: grid; gap: 10px; }
.rr-validation-card.pending { border-color: var(--orange); background: #fffdf8; }
.rr-validation-card > header { display: flex; align-items: center; gap: 11px; flex-wrap: wrap; }
.rr-validation-card > header > div { flex: 1 1 220px; min-width: 0; }
.rr-validation-card b { display: block; font-size:14.5px; }
.rr-validation-card small { display: block; margin-top: 2px; color: var(--muted); font-size:12.5px; line-height: 1.8; }
.rr-validation-icon { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #fff3e2; color: var(--orange); }
.rr-validation-icon svg { width: 18px; height: 18px; }
.rr-validation-pct { flex: none; font-size:22px; color: var(--orange); }
.rr-validation-stats { display: flex; flex-wrap: wrap; gap: 8px; font-size:12.5px; }
.rr-validation-stats span { padding: 4px 9px; border-radius: 999px; background: #f6f2ea; color: var(--muted); }
.rr-validation-stats .ok { background: #e8f6ec; color: #1f7a3d; }
.rr-validation-stats .bad { background: #fdecea; color: #b3372f; }

/* تحلیل برگزارکننده: اعتبارسنجی و نظرسنجی */
.pro-analysis-tiles.compact { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); padding: 12px 13px 0; }
.pro-analysis-tiles.compact b { font-size: 15px; }
.pro-analysis-section > .pro-aud-hint { padding: 0 13px 12px; }
.pro-analysis-table.pro-val-lessons { margin-top: 12px; border-top: 1px solid var(--line); }
.pro-analysis-table.pro-val-lessons > div { min-width: 420px; grid-template-columns: minmax(140px, 1fr) 80px 120px; }
.pro-analysis-table.pro-val-rows { margin-top: 12px; border-top: 1px solid var(--line); }
.pro-analysis-table.pro-val-rows > div { min-width: 620px; grid-template-columns: minmax(160px, 1.4fr) minmax(90px, 1fr) minmax(110px, 1fr) 120px 80px; }
.pro-survey-stats { display: grid; gap: 11px; padding: 12px 13px; }
.pro-survey-stat { border: 1px solid var(--line); border-radius: 12px; background: var(--surface, #fff); padding: 11px; display: grid; gap: 9px; }
.pro-survey-stat > header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pro-survey-stat > header b { flex: 1 1 180px; font-size: 12px; }
.pro-survey-stat > header strong { color: #5142a8; font-size: 12px; }
.pro-survey-stars-avg { display: flex; align-items: center; gap: 3px; }
.pro-survey-stars-avg .sv-star { font-size: 20px; color: #dcd3c4; }
.pro-survey-stars-avg .sv-star.on { color: #f5a623; }
.pro-survey-stars-avg small { margin-inline-start: 8px; color: var(--muted); font-size: 10px; }
.pro-survey-bars { display: grid; gap: 6px; }
.pro-survey-bar { display: grid; grid-template-columns: minmax(64px, 132px) 1fr 34px 44px; align-items: center; gap: 8px; font-size: 10.5px; }
.pro-survey-bar-label { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-survey-bar-track { height: 9px; border-radius: 999px; background: #f0ecf9; overflow: hidden; }
.pro-survey-bar-track i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #7b68d6, #a794f0); }
.pro-survey-bar b { text-align: center; }
.pro-survey-bar em { color: var(--muted); font-style: normal; text-align: center; }
.pro-survey-texts { display: grid; gap: 8px; }
.pro-survey-texts blockquote { margin: 0; padding: 9px 11px; border-inline-start: 3px solid #a794f0; border-radius: 10px; background: #faf8ff; display: grid; gap: 4px; }
.pro-survey-texts blockquote > span { display: flex; align-items: center; gap: 7px; font-size: 10px; }
.pro-survey-texts blockquote small { color: var(--muted); }
.pro-survey-texts blockquote em { padding: 1px 6px; border-radius: 999px; background: #ece7fb; color: #5142a8; font-style: normal; font-size: 9px; }
.pro-survey-texts blockquote p { margin: 0; font-size: 11px; line-height: 1.9; }
.pro-analysis-table.pro-survey-people > div { grid-template-columns: minmax(150px, 1.4fr) repeat(auto-fit, minmax(110px, 1fr)); text-align: center; }
.pro-analysis-table.pro-survey-people em { padding: 1px 6px; border-radius: 999px; background: #ece7fb; color: #5142a8; font-style: normal; font-size: 9px; }
.pro-sheet-row-btns { display: inline-flex; gap: 7px; flex-wrap: wrap; }
.pro-sheet-val-badge { padding: 2px 8px; border-radius: 999px; background: #fff3e2; color: var(--orange); font-style: normal; font-size: 9.5px; white-space: nowrap; }
.pro-sheet-answer-grid label.is-validation span { background: #fff3e2; color: var(--orange); border-radius: 6px; }
@media (max-width: 900px) {
  .pro-survey-row > header {
    grid-template-columns: 30px minmax(0, 1fr) 44px;
    grid-template-areas: "num title del" "type type type" "req req req";
  }
  .pro-survey-row > header > .pro-survey-req { justify-self: start; }
}
@media (max-width: 640px) {
  .pro-val-modes { grid-template-columns: minmax(0, 1fr); }
  .pro-survey-option { flex: 1 1 100%; }
  .pro-survey-option input { width: 100%; }
  .pro-survey-bar { grid-template-columns: minmax(58px, 1fr) 1fr 30px 40px; }
}

/* ═══════════════════ ماهنامه ═══════════════════ */
.mn-detail-head,
.mn-lesson-tabs,
.mn-layout {
  --primary: var(--orange);
  --surface: var(--panel);
  --border: var(--line);
  --text: var(--ink);
}
.mn-cards { display: grid; gap: 14px; }
.mn-card {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: minmax(260px, 1fr) 122px 108px 78px 122px;
  align-items: center; column-gap: 10px; width: 100%;
  min-height: 60px; padding: 8px 14px; border-radius: 15px; cursor: pointer; text-align: right;
  color: var(--ink); background: #fff;
  border: 1px solid #e5d7c5; box-shadow: 0 6px 20px rgba(67, 52, 35, .055);
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.mn-card:hover {
  border-color: #eea46d; transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(134, 83, 42, .1);
}
.mn-card-main { min-width: 0; }
.mn-card-main > b { color: #28231e; font-size: .96rem; font-weight: 900; }
.mn-card-main > b,
.mn-card-scope,
.mn-card-badge { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mn-card-scope {
  display: flex; align-items: center; justify-content: center; width: 100%;
  min-height: 31px; padding: 5px 8px; border: 1px solid #e8dfd3; border-radius: 9px;
  color: #756a5d; background: #f7f3ed; font-size: .73rem; font-weight: 800; text-align: center;
}
.mn-card-badge {
  display: block; width: 100%; font-style: normal; font-size: .7rem; font-weight: 800;
  padding: 5px 8px; border-radius: 9px; text-align: center;
  background: #fff0e5; color: #c9540e; border: 1px solid #f7d8bf;
}
.mn-card-badge.alt { background: #edf8f6; border-color: #d7efeb; color: #357a72; }
.mn-card-open {
  display: inline-flex; align-items: center; justify-content: center; gap: 5px; width: 100%; padding: 7px 9px;
  border-radius: 9px; color: #b84d0d; background: #fff; border: 1px solid #efd9c8;
  box-sizing: border-box; font-size: .69rem; font-weight: 900; text-align: center; white-space: nowrap;
}
.mn-card-go { width: 15px; height: 15px; color: var(--muted); flex: 0 0 auto; }

.mn-detail-head .mn-back { padding: 4px 8px; margin-bottom: 6px; font-size: .82rem; }
.mn-head-badge {
  align-self: center; font-size: .82rem; font-weight: 700; padding: 8px 14px; border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 12%, transparent); color: var(--primary); white-space: nowrap;
}
.mn-tabs { margin-bottom: 14px; }

/* چیدمان دوستونی: فیلتر موضوع و منبع در راست، فهرست سؤال‌ها در چپ */
.mn-layout { display: grid; grid-template-columns: 276px minmax(0, 1fr); gap: 18px; align-items: start; }
.mn-main { grid-column: 2; grid-row: 1; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.mn-toolbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 12px 14px; border-radius: 16px; background: #fff; border: 1px solid #e8dfd3;
  box-shadow: 0 8px 24px rgba(67, 52, 35, .045);
}
.mn-admin-toolbar { justify-content: flex-start; }
.mn-toolbar-title {
  display: flex; flex: 0 0 auto; flex-direction: column; gap: 2px; min-width: 132px;
  padding-inline-end: 13px; border-inline-end: 1px solid #eee6dc;
}
.mn-toolbar-title strong { color: var(--ink); font-size: 12px; font-weight: 900; }
.mn-toolbar-title small { color: var(--muted); font-size: 9px; font-weight: 700; white-space: nowrap; }
.mn-admin-toolbar .seg-group { flex: 0 0 auto; background: #f3eee7; border: 1px solid #ece3d7; }
.mn-admin-toolbar .seg { color: #847968; }
.mn-admin-toolbar .seg.on { background: #fff; color: #c9510c; box-shadow: 0 3px 9px rgba(91, 62, 34, .1); }
.mn-toolbar .sbank-search { flex: 1 1 230px; min-width: 190px; max-width: 430px; }
.mn-toolbar .sbank-search input { height: 38px; border-color: #e6ddd0; background: #fffdfb; }
.mn-found { font-size: .82rem; color: var(--muted); white-space: nowrap; }
.mn-found b { color: var(--text); font-weight: 800; }
.mn-admin-toolbar .mn-found {
  margin-inline-start: auto; padding: 7px 10px; border-radius: 10px;
  background: #faf7f2; border: 1px solid #eee6dc;
}
.mn-list { display: flex; flex-direction: column; gap: 12px; }

/* نوار کناری */
.mn-side {
  grid-column: 1; grid-row: 1; position: sticky; top: 12px; display: flex; flex-direction: column; gap: 11px;
  padding: 12px; border-radius: 18px; background: #fff; border: 1px solid #e5dccf;
  box-shadow: 0 10px 28px rgba(67, 52, 35, .055);
  max-height: calc(100vh - 30px); overflow: auto;
  scrollbar-width: thin; scrollbar-color: #d8ccbc transparent;
}
.mn-side::-webkit-scrollbar { width: 6px; }
.mn-side::-webkit-scrollbar-thumb { background: #d8ccbc; border-radius: 999px; }
.mn-side-head {
  display: flex; align-items: center; gap: 9px; padding: 2px 2px 5px; font-size: .86rem;
}
.mn-side-icon {
  width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center;
  border-radius: 11px; background: var(--orange-soft); color: #d85b13;
}
.mn-side-icon .ui-icon { width: 17px; height: 17px; }
.mn-side-copy { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.mn-side-copy strong { color: var(--ink); font-size: 12px; font-weight: 900; }
.mn-side-copy small { color: var(--muted); font-size: 9px; font-weight: 700; white-space: nowrap; }
.mn-chips {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 8px;
  border-radius: 12px; background: #faf7f2; border: 1px dashed #e5d9ca;
}
.mn-clear {
  align-self: stretch; justify-content: center; min-height: 32px; padding: 5px 9px;
  border: 1px solid #eadfd2; border-radius: 10px; background: #fff; color: #9b6a46; font-size: .74rem;
}
.mn-clear:hover { border-color: #efb78e; background: #fff8f2; color: #c9510c; }
.mn-sec {
  overflow: hidden; padding: 0; border: 1px solid #e8dfd3; border-radius: 13px; background: #fffdfb;
}
.mn-sec > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  min-height: 40px; cursor: pointer; list-style: none; padding: 8px 10px;
  color: #4d463e; font-size: .8rem; font-weight: 850;
  transition: background .15s ease, color .15s ease;
}
.mn-sec > summary:hover { background: #faf4ec; color: #b64e12; }
.mn-sec > summary::-webkit-details-marker { display: none; }
.mn-sec > summary .ui-icon { width: 15px; height: 15px; color: var(--muted); transition: transform .18s ease; }
.mn-sec[open] > summary .ui-icon { transform: rotate(180deg); }
.mn-sec[open] > summary { background: #faf7f2; border-bottom: 1px solid #eee6dc; }
.mn-sec-body { padding: 7px; }
.mn-empty-note { font-size: .78rem; color: var(--muted); padding: 6px 2px; }
.mn-hint { font-size: .8rem; color: var(--muted); line-height: 1.9; margin: 0 0 8px; }

/* درخت موضوعی */
.mn-tree, .mn-ftree { display: flex; flex-direction: column; gap: 2px; }
.mn-trow, .mn-frow, .mn-ex-row {
  display: flex; align-items: center; gap: 6px; min-height: 34px; border: 1px solid transparent; border-radius: 9px; padding: 6px;
  padding-inline-start: calc(6px + var(--mn-depth, 0) * 12px);
  transition: background .15s ease, border-color .15s ease;
}
.mn-trow:hover, .mn-frow:hover, .mn-ex-row:hover { background: #faf4ec; border-color: #f2e3d1; }
.mn-trow:active { background: #f6ebdd; }
.mn-trow.on, .mn-frow.on { background: var(--orange-soft); border-color: #f4ceb4; }
.mn-tcaret {
  flex: 0 0 auto; display: grid; place-items: center; width: 20px; height: 20px; padding: 0;
  border: 0; border-radius: 7px; background: transparent; color: var(--muted); cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.mn-tcaret:hover { background: #f3e7d7; color: var(--orange); }
.mn-tcaret:focus-visible { outline: 2px solid rgba(255,101,25,.5); outline-offset: 1px; }
.mn-tcaret .ui-icon { width: 13px; height: 13px; transition: transform .22s cubic-bezier(.22,.61,.36,1); }
.mn-tcaret.open .ui-icon { transform: rotate(180deg); }
.mn-tcaret-sp { flex: 0 0 auto; width: 20px; }
.mn-tcheck { display: grid; place-items: center; flex: 0 0 auto; }
.mn-tcheck input { width: 15px; height: 15px; cursor: pointer; accent-color: var(--orange); }
.mn-tlabel, .mn-flabel {
  flex: 1 1 auto; min-width: 0; color: #514a42; font-size: .76rem; font-weight: 700; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mn-tcount {
  flex: 0 0 auto; min-width: 24px; color: #8d8273; font-size: .68rem; font-weight: 850; text-align: center;
  background: #f1eee8; border-radius: 999px; padding: 2px 6px;
}
.mn-trow.on .mn-tcount { background: #fff; color: #c9510c; }
/* شاخهٔ نقشهٔ مباحث که هنوز سؤالی ندارد: دیده می‌شود ولی کم‌رنگ */
.mn-trow.is-empty:not(.on) .mn-tlabel { color: #a89e91; font-weight: 600; }
.mn-trow.is-empty:not(.on) .mn-tcount { background: #f6f3ee; color: #b5aa9b; }
.mn-tkids, .mn-fkids, .mn-ex-kids { display: flex; flex-direction: column; gap: 2px; }
/* ارتفاعِ شاخهٔ بازشونده با slideBlock انیمیت می‌شود؛ margin نداشته باشد تا پرش نکند */
.mn-tkids { margin: 0; }

/* منابع */
.mn-src-list { display: flex; flex-direction: column; gap: 3px; }
.mn-src {
  display: flex; align-items: center; gap: 8px; min-height: 35px; padding: 6px 8px; border-radius: 9px;
  color: #514a42; font-size: .76rem; font-weight: 700; cursor: pointer; border: 1px solid transparent;
}
.mn-src:hover { background: #faf4ec; }
.mn-src.on { background: var(--orange-soft); border-color: #f4ceb4; }
.mn-src input { width: 15px; height: 15px; accent-color: var(--orange); }
.mn-src span { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mn-src b { min-width: 24px; padding: 2px 6px; border-radius: 999px; background: #f1eee8; color: #8d8273; font-size: .68rem; font-weight: 850; text-align: center; }
.mn-src.on b { background: #fff; color: #c9510c; }

/* صفحه‌بندی */
.mn-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px; padding: 6px 0 2px; }
.mn-pager button {
  min-width: 32px; height: 32px; padding: 0 8px; border-radius: 10px; cursor: pointer;
  background: var(--surface); border: 1px solid var(--border); color: var(--text); font-weight: 700; font-size: .8rem;
}
.mn-pager button:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.mn-pager button.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.mn-pager button:disabled { opacity: .45; cursor: default; }
.mn-pager button .ui-icon { width: 14px; height: 14px; }
.mn-pager-gap { color: var(--muted); padding: 0 2px; }

/* تبِ آزمون‌های ماهنامه */
.mn-ex-panel { display: flex; flex-direction: column; gap: 16px; }
.mn-ex-panel-head {
  padding: 15px 17px; border: 1px solid #e7ddcf; border-radius: 17px;
  background: linear-gradient(135deg, #fff, #fffaf5); box-shadow: 0 8px 24px rgba(67, 52, 35, .04);
}
.mn-ex-available {
  flex: 0 0 auto; padding: 7px 11px; border: 1px solid #eadfd2; border-radius: 10px;
  background: #fff; color: #8d8170; font-size: 10.5px; font-weight: 800; white-space: nowrap;
}
.mn-ex-available b { color: #c9510c; font-size: 13px; }
.mn-ex-layout { align-items: start; }
.mn-ex-filter .exam-filter-title > b {
  margin-inline-start: auto; min-width: 22px; height: 22px; display: grid; place-items: center;
  padding: 0 6px; border-radius: 8px; background: var(--orange-soft); color: #c9510c; font-size: 10px;
}
.mn-ex-filter .eb-side-note { margin: 2px 5px 5px; padding: 8px 9px; border-radius: 10px; background: #fff; }
.mn-ex-tree {
  display: grid; gap: 4px; padding: 10px 12px; border: 1px solid #e7ddcf; border-radius: 16px;
  background: #fff; box-shadow: 0 8px 24px rgba(67, 52, 35, .035);
}
.mn-ex-node .eb-row { border-radius: 10px; }
.mn-ex-node .eb-exam { margin-block: 3px; }
.mn-ex-node .eb-row.picked {
  border-color: #efb27f; background: #fff4e8; box-shadow: inset 3px 0 0 var(--orange);
}
.mn-ex-node .eb-branch.open { background: #faf7f2; }
.mn-ex-node .eb-name { min-width: 170px; gap: 5px; }
.mn-ex-context {
  display: inline-flex; align-items: center; gap: 6px; width: fit-content; min-width: 0;
  color: #8a7c6c; font-size: 10px; font-weight: 800; line-height: 1.5;
}
.mn-ex-context b {
  overflow: hidden; max-width: 210px; color: #2f756e; font-size: inherit;
  text-overflow: ellipsis; white-space: nowrap;
}
.mn-ex-context em { color: #c8b9a9; font-style: normal; }
.mn-ex-context span {
  overflow: hidden; max-width: 180px; color: #a85b23; text-overflow: ellipsis; white-space: nowrap;
}
.mn-ex-summary .mn-ex-context,
.eb-stage-paths .mn-ex-context { margin-top: 2px; }
.mn-ex-node .eb-join { background: linear-gradient(135deg, #ff7a2b, var(--orange)); box-shadow: 0 5px 12px rgba(255, 107, 24, .16); }
/* سرشاخهٔ منبع: مرحله‌ها زیرمجموعهٔ آن باز می‌شوند */
.mn-ex-src-node + .mn-ex-src-node { margin-top: 5px; }
.mn-ex-node .eb-row.mn-ex-src {
  cursor: pointer; padding: 9px 11px; border: 1px solid #eadfce; border-radius: 12px;
  background: #fdfbf7; transition: background .15s ease, border-color .15s ease;
}
.mn-ex-node .eb-row.mn-ex-src:hover { background: #faf4ec; border-color: #e3d3ba; }
.mn-ex-node .eb-row.mn-ex-src.open { background: #f8f3ea; border-color: #e3d3ba; }
.mn-ex-node .eb-row.mn-ex-src > .eb-badges { display: inline-flex; }
.mn-ex-node .eb-row.mn-ex-src .eb-title-line > b { font-size: 13.5px; font-weight: 900; }
.mn-ex-src-note {
  overflow: hidden; color: #a2937f; font-size: 9.5px; font-weight: 700;
  text-overflow: ellipsis; white-space: nowrap;
}
.mn-ex-src-node > .eb-children-anim > .eb-children { margin-inline-start: 14px; padding-inline-start: 8px; }
.mn-ex-summary {
  display: block; margin-top: 15px; padding: 14px; border: 1px solid #e2d5c4; border-radius: 16px;
  background: linear-gradient(135deg, #fdfaf4, #fbf7ef); box-shadow: 0 9px 26px rgba(67, 52, 35, .045);
}

/* سؤال‌های منتخبِ پنل کاربر */
.mn-picked-toolbar { min-height: 64px; }
.mn-picked-toolbar-copy { display: flex; flex-direction: column; gap: 2px; min-width: 155px; }
.mn-picked-toolbar-copy strong { color: var(--ink); font-size: 12px; font-weight: 900; }
.mn-picked-toolbar-copy small { color: var(--muted); font-size: 9.5px; font-weight: 700; white-space: nowrap; }
.mn-picked-toolbar .mn-found {
  padding: 6px 10px; border: 1px solid #eee5da; border-radius: 10px; background: #faf7f2;
}
.mn-picked-toolbar .sbank-search {
  flex: 0 1 390px; width: min(390px, 100%); max-width: 390px; margin-inline-start: auto;
}
.mn-picked-list .sq-item {
  overflow: hidden; border-color: #e5dccf; border-radius: 17px; background: #fff;
  box-shadow: 0 8px 25px rgba(67, 52, 35, .04);
}
.mn-picked-list .sq-main { padding-top: 15px; }
.mn-picked-list .sq-item-head { min-height: 36px; padding-bottom: 10px; border-bottom: 1px solid #f0e9df; }
.mn-picked-list .sq-rail {
  width: 122px; border-inline-start-color: #eee4d8;
  background: linear-gradient(180deg, #fffaf6 0%, #fbfaf7 100%);
}
.mn-picked-list .sq-rail-cell { min-height: 92px; padding: 11px 8px; gap: 5px; }
.mn-picked-list .sq-rail-cell + .sq-rail-cell { border-top-color: #eee4d8; }
.mn-picked-list .sq-src-icon {
  width: 46px !important; height: 46px !important; min-width: 46px; min-height: 46px; max-width: 46px; max-height: 46px;
  margin-bottom: 3px; border-radius: 13px;
}

/* پنل مدیریت */
.mn-admin-list { display: flex; flex-direction: column; gap: 10px; }
.mn-admin-row {
  display: grid; grid-template-columns: minmax(240px, 1fr) 118px minmax(350px, .9fr) 92px auto;
  align-items: center; gap: 10px; min-height: 52px; padding: 7px 11px; border-radius: 14px;
  background: #fff; border: 1px solid #e6dbcd; box-shadow: 0 7px 22px rgba(67, 52, 35, .045);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mn-admin-row:hover {
  border-color: #edb58e; box-shadow: 0 11px 28px rgba(101, 70, 42, .08); transform: translateY(-1px);
}
.mn-admin-main { min-width: 0; display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.mn-admin-main > b { overflow: hidden; color: #2d2823; font-size: .91rem; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.mn-admin-main small {
  overflow: hidden; max-width: 150px; color: #988c7e; font-size: .65rem; font-weight: 700;
  text-overflow: ellipsis; white-space: nowrap;
}
.mn-admin-main small::before { content: "-"; margin-inline-end: 7px; color: #c8bdae; }
.mn-admin-scope {
  display: flex; align-items: center; justify-content: center; width: 118px; height: 30px; min-height: 30px;
  padding: 0 8px; border: 1px solid #e7dfd5; border-radius: 8px; box-sizing: border-box;
  background: #f7f3ed; color: #756a5e; font-size: .67rem; font-weight: 850; white-space: nowrap;
}
.mn-admin-stats { display: grid; grid-template-columns: repeat(4, minmax(72px, 1fr)); gap: 6px; min-width: 0; }
.mn-admin-stats i {
  display: flex; align-items: center; justify-content: space-between; gap: 6px; min-width: 0;
  height: 30px; min-height: 30px; padding: 0 7px; border: 1px solid #ebe3d8; border-radius: 8px; box-sizing: border-box;
  background: #faf8f5; color: #766b5f; font-style: normal;
}
.mn-admin-stats i small { overflow: hidden; color: #9a8f82; font-size: .62rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.mn-admin-stats i b { color: #5e554c; font-size: .79rem; font-weight: 900; white-space: nowrap; }
.mn-admin-stats i.on { border-color: #f3cfb5; background: #fff2e8; }
.mn-admin-stats i.on small, .mn-admin-stats i.on b { color: #bd4f0d; }
.mn-admin-stats i.lesson { grid-column: span 2; }
.mn-admin-stats i.lesson b { overflow: hidden; max-width: 140px; text-overflow: ellipsis; }
.mn-admin-status {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  width: 92px; height: 30px; min-height: 30px; padding: 0 8px; border: 1px solid transparent;
  border-radius: 8px; box-sizing: border-box; font-size: .67rem; font-weight: 850; white-space: nowrap;
}
.mn-admin-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.mn-admin-status.ok { border-color: #cfe9de; background: #edf8f3; color: #278460; }
.mn-admin-status.draft { border-color: #e6dfd5; background: #f5f2ed; color: #82776a; }
.mn-admin-actions { display: flex; align-items: center; justify-content: flex-end; gap: 5px; min-width: 0; }
.mn-admin-actions .secondary-button {
  height: 30px; min-height: 30px; padding: 0 8px; border-color: #e6d8c9; border-radius: 8px;
  box-sizing: border-box; color: #4e463e; background: #fff; font-size: .67rem; font-weight: 850; white-space: nowrap;
}
.mn-admin-actions .secondary-button:hover { border-color: #efad7e; color: #bd4f0d; background: #fff9f4; }
.mn-admin-actions .secondary-button .ui-icon { width: 15px; height: 15px; }
.mn-admin-actions > .row-action {
  width: 30px; height: 30px; margin: 0; border: 1px solid #e8dfd4; border-radius: 8px;
  min-height: 30px; padding: 0; box-sizing: border-box; background: #fff; color: #8a8074;
  box-shadow: 0 2px 7px rgba(67, 52, 35, .035);
}
.mn-admin-actions > .row-action:hover { border-color: #efb58b; background: #fff9f4; color: #c05212; box-shadow: 0 4px 10px rgba(67, 52, 35, .08); }
.mn-admin-actions > .row-action.danger:hover { border-color: #efc5bf; color: var(--red); background: #fff3f1; }
.mn-admin-actions > .row-action .ui-icon { width: 14px; height: 14px; }

.mn-lesson-tabs {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 16px; padding: 10px;
  border: 1px solid #e8dfd3; border-radius: 16px; background: rgba(255, 255, 255, .82);
  box-shadow: 0 8px 24px rgba(67, 52, 35, .035);
}
.mn-lesson-tab {
  display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 8px 14px; border-radius: 11px; cursor: pointer;
  background: #fff; border: 1px solid #e6ddd0; color: #4d463e; font-size: .8rem; font-weight: 800;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.mn-lesson-tab b {
  min-width: 24px; padding: 2px 7px; border-radius: 999px;
  background: #f1eee8; color: #817668; font-size: .69rem; font-weight: 900; text-align: center;
}
.mn-lesson-tab:hover { border-color: #efb78e; background: #fffaf6; color: #b64e12; transform: translateY(-1px); }
.mn-lesson-tab.on {
  background: linear-gradient(135deg, #ff7a2b, var(--orange)); border-color: var(--orange); color: #fff;
  box-shadow: 0 7px 16px rgba(255, 107, 24, .2);
}
.mn-lesson-tab.on b { background: rgba(255, 255, 255, .2); color: #fff; }

.mn-pick-card {
  overflow: hidden; border: 1px solid #e5dccf; border-radius: 17px; background: #fff;
  box-shadow: 0 8px 26px rgba(67, 52, 35, .045);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.mn-pick-card.on { border-color: #f0a36d; box-shadow: 0 0 0 2px rgba(255, 107, 24, .1), 0 10px 30px rgba(80, 54, 30, .07); }
.mn-pick-card .sq-item { border: 0; border-radius: 0; background: #fff; }
.mn-pick-card .sq-main { padding-top: 14px; }
.mn-pick-card .sq-item-head {
  min-height: 41px; margin: -2px 0 14px; padding-bottom: 11px; border-bottom: 1px solid #f0e9df;
}
.mn-pick-card .sq-num {
  width: auto; min-width: 33px; height: 29px; padding: 0 9px;
  border: 1px solid #e9ded0; border-radius: 9px; background: #faf7f2; color: #5f574d; font-weight: 900;
}
.mn-pick-action {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 34px;
  margin-inline-start: auto; padding: 7px 13px; border: 1px solid var(--orange); border-radius: 10px;
  background: linear-gradient(135deg, #ff7a2b, var(--orange)); color: #fff;
  font: inherit; font-size: 11px; font-weight: 900; cursor: pointer;
  box-shadow: 0 6px 14px rgba(255, 107, 24, .18);
  transition: transform .16s var(--ease-soft), box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.mn-pick-action .ui-icon { width: 15px; height: 15px; }
.mn-pick-action:hover { transform: translateY(-1px); box-shadow: 0 9px 20px rgba(255, 107, 24, .25); }
.mn-pick-action.on {
  border-color: #92d4c7; background: #eaf8f4; color: #168878;
  box-shadow: 0 5px 13px rgba(22, 136, 120, .1);
}
.mn-pick-action.on:hover { border-color: #6fc3b2; box-shadow: 0 8px 18px rgba(22, 136, 120, .15); }
.mn-pick-card .sq-rail {
  width: 122px; border-inline-start-color: #eee4d8;
  background: linear-gradient(180deg, #fffaf6 0%, #fbfaf7 100%);
}
.mn-pick-card .sq-rail-cell { min-height: 92px; padding: 11px 8px; gap: 5px; }
.mn-pick-card .sq-rail-cell + .sq-rail-cell { border-top-color: #eee4d8; }
.mn-pick-card .sq-src-icon {
  width: 46px !important; height: 46px !important; min-width: 46px; min-height: 46px; max-width: 46px; max-height: 46px;
  margin-bottom: 3px; border-radius: 13px; box-shadow: 0 5px 12px rgba(72, 52, 31, .06);
}
.mn-pick-card .sq-rail-cell b { font-size: 10.5px; }
.mn-pick-card .sq-rail-cell small { font-size: 9px; }

/* مودال‌های ماهنامه */
.mn-folders-body, .mn-access-body { display: flex; flex-direction: column; gap: 10px; }
.mn-folder-search { width: 100%; }
.mn-ftree { max-height: 46vh; overflow: auto; padding: 8px; border-radius: 12px; border: 1px solid var(--border); }
.mn-fcounts { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.mn-fcounts b { font-size: .72rem; font-weight: 800; color: var(--primary); }
.mn-fcounts i { font-style: normal; font-size: .7rem; color: var(--muted); }
.mn-folder-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px;
  border-radius: 12px; background: color-mix(in srgb, var(--primary) 7%, transparent); font-size: .82rem;
}
.mn-access-list { display: flex; flex-direction: column; gap: 8px; max-height: 52vh; overflow: auto; }
.mn-access-row { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border); }
.mn-access-row.on { border-color: color-mix(in srgb, var(--primary) 40%, transparent); background: color-mix(in srgb, var(--primary) 5%, transparent); }
.mn-access-head { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: .86rem; }
.mn-access-head input { width: 15px; height: 15px; accent-color: var(--primary); }
.mn-access-head small { color: var(--muted); font-size: .74rem; margin-inline-start: auto; }
/* نقشِ سراسریِ «منتخب ماهنامه» — بدون تیکِ همین شماره هم دسترسی دارد */
.mn-access-global {
  padding: 2px 8px; border-radius: 999px; font-size: .7rem; font-weight: 800; font-style: normal;
  background: color-mix(in srgb, var(--primary) 12%, transparent); color: var(--primary);
}
.mn-access-lessons { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.mn-lesson-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px;
  font-size: .78rem; cursor: pointer; border: 1px solid var(--border);
}
.mn-lesson-chip.on { background: color-mix(in srgb, var(--primary) 13%, transparent); border-color: color-mix(in srgb, var(--primary) 34%, transparent); color: var(--primary); }
.mn-lesson-chip input { width: 13px; height: 13px; accent-color: var(--primary); }
.mn-lesson-chip b { font-size: .7rem; font-weight: 800; opacity: .7; }

@media (max-width: 1080px) {
  .mn-layout { grid-template-columns: 1fr; }
  /* grid-row: auto لازم است؛ وگرنه هر دو در ردیف ۱ می‌مانند و نوار کناری روی فهرست می‌افتد */
  .mn-main, .mn-side { grid-column: 1; grid-row: auto; }
  .mn-side { position: static; max-height: none; order: -1; }
  .mn-admin-row { grid-template-columns: minmax(220px, 1fr) 118px 92px auto; }
  .mn-admin-stats { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 720px) {
  .mn-card {
    grid-template-columns: minmax(0, 1fr) auto; gap: 9px 12px; min-height: 0; padding: 12px;
  }
  .mn-card-main { grid-column: 1 / -1; }
  .mn-card-scope { padding-inline: 0; text-align: right; }
  .mn-card-badge { width: auto; }
  .mn-card-open { grid-column: 2; grid-row: 2 / span 2; justify-self: end; }
  .mn-admin-row { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .mn-admin-main { grid-column: 1 / -1; }
  .mn-admin-scope { width: auto; }
  .mn-admin-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-column: 1 / -1; grid-row: auto; }
  .mn-admin-actions { grid-column: 1 / -1; justify-content: space-between; }
  .mn-toolbar { gap: 8px; }
  .mn-toolbar-title { width: 100%; padding: 0 0 8px; border-inline-end: 0; border-bottom: 1px solid #eee6dc; }
  .mn-admin-toolbar .seg-group, .mn-toolbar .sbank-search { flex: 1 1 100%; max-width: none; }
  .mn-admin-toolbar .seg { flex: 1 1 0; }
  .mn-admin-toolbar .mn-found { margin-inline-start: 0; }
  .mn-picked-toolbar-copy { width: 100%; }
  .mn-picked-toolbar .sbank-search { flex: 1 1 100%; width: 100%; max-width: none; margin-inline-start: 0; order: 3; }
  .mn-ex-panel-head { align-items: flex-start; }
  .mn-ex-available { justify-self: start; }
  .mn-ex-node .eb-badges { padding-inline-start: 0; }
  .mn-ex-node .eb-join { margin-inline-start: 0; }
  .mn-pick-action span { display: none; }
  .mn-pick-action { width: 34px; padding: 0; }
  .mn-pick-card .sq-rail { width: 105px; }
  .mn-picked-list .sq-rail { width: 105px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   تحلیل مباحث — بخش مستقلِ نقشه و مقایسهٔ سلسله‌مراتبی
   ══════════════════════════════════════════════════════════════════════════ */
.tm-analysis-page { --tm-blue:#3668e8; --tm-red:#df5362; --tm-green:#278a6d; display:grid; gap:12px; }
.tm-analysis-hero {
  position:relative; min-height:132px; display:flex; align-items:center; justify-content:space-between;
  gap:22px; padding:22px 24px; overflow:hidden; color:#302b26;
  border-color:#e7ddd1; background:
    radial-gradient(circle at 8% 0%,rgba(255,107,26,.12),transparent 35%),
    linear-gradient(125deg,#fffdf9 0%,#fffaf4 58%,#f7f2eb 100%);
}
.tm-analysis-hero::after {
  content:""; position:absolute; inset:-80px auto auto -55px; width:220px; height:220px;
  border:1px solid rgba(255,107,26,.11); border-radius:50%; box-shadow:0 0 0 32px rgba(255,107,26,.035);
}
.tm-analysis-title { position:relative; z-index:1; min-width:0; display:flex; align-items:center; gap:13px; }
.tm-analysis-icon { width:50px; height:50px; flex:none; display:grid; place-items:center; border-radius:15px; color:#fff; background:#ff6b1a; box-shadow:0 10px 24px rgba(255,107,26,.25); }
.tm-analysis-icon svg { width:28px; height:28px; }
.tm-dashboard-kicker {
  width:max-content; display:inline-flex; align-items:center; gap:5px; padding:4px 8px;
  border:1px solid #f3d5c0; border-radius:999px; color:#bd531f; background:#fff1e6;
  font-size:10.5px; font-weight:900; line-height:1;
}
.tm-dashboard-kicker svg { width:12px; height:12px; }
.tm-analysis-title h1 { margin:5px 0 0; font-size:25px; font-weight:950; }
.tm-analysis-title p { max-width:640px; margin:6px 0 0; color:#777067; font-size:12px; font-weight:650; line-height:1.85; }
.tm-analysis-summary { position:relative; z-index:1; display:flex; align-items:stretch; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.tm-analysis-summary > span {
  min-height:44px; display:flex; align-items:center; gap:6px; padding:7px 11px; border:1px solid #e9dfd3;
  border-radius:10px; color:#81786e; background:rgba(255,255,255,.82); font-size:10.5px; font-weight:800; white-space:nowrap;
}
.tm-analysis-summary > span b { color:#342f2a; font-size:12.5px; font-weight:950; }
.tm-analysis-summary > span.scope { max-width:220px; background:#fff2e8; border-color:#f2d3bd; }
.tm-analysis-summary > span.scope svg { width:17px; height:17px; color:#e56522; }

.tm-tool-switch { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding:7px; background:#f5f1ea; }
.tm-tool-switch > button {
  min-width:0; min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 13px;
  border:1px solid transparent; border-radius:12px; color:#6e665d; background:transparent; font:inherit; text-align:start; cursor:pointer;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.tm-tool-switch > button:hover { background:rgba(255,255,255,.65); transform:translateY(-1px); }
.tm-tool-switch > button.active { border-color:#e3d8ca; color:#302b26; background:#fff; box-shadow:0 7px 18px rgba(61,46,31,.07); }
.tm-tool-switch > button > span { min-width:0; display:grid; grid-template-columns:34px minmax(0,1fr); column-gap:9px; align-items:center; }
.tm-tool-switch > button > span > svg { grid-row:1 / span 2; width:36px; height:36px; padding:6px; border-radius:10px; color:#81786d; background:#ebe5dc; }
.tm-tool-switch > button.active > span > svg { color:#fff; background:#ff6b1a; }
.tm-tool-switch b,.tm-tool-switch small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tm-tool-switch b { font-size:13px; font-weight:950; }
.tm-tool-switch small { margin-top:2px; color:#8f877d; font-size:10px; font-weight:700; }
.tm-tool-switch > button > svg { width:14px; height:14px; flex:none; opacity:.45; }
.tm-tool-switch > button.active > svg { color:#ff6b1a; opacity:1; }

.tm-tool-content { min-width:0; }
.tm-card,.tm-radar-card { min-width:0; padding:20px; }
.tm-panel-head { display:flex; align-items:center; justify-content:space-between; gap:15px; padding-bottom:13px; border-bottom:1px solid #eee7dd; }
.tm-panel-head > div { min-width:0; }
.tm-panel-head > div > span { color:#c35d28; font-size:10.5px; font-weight:900; }
.tm-panel-head h2 { margin:3px 0 0; color:#302b26; font-size:17px; font-weight:950; }
.tm-panel-head p { margin:5px 0 0; color:#817970; font-size:11px; font-weight:650; line-height:1.75; }
.tm-level-count { flex:none; padding:7px 10px; border-radius:8px; color:#625b53; background:#f3efe9; font-size:11px; font-weight:900; }
.tm-loading { min-height:84px; display:flex; align-items:center; justify-content:center; gap:9px; color:inherit; font-size:12px; font-weight:850; }
.tm-loading svg { width:20px; height:20px; animation:tm-spin 1s linear infinite; }
@keyframes tm-spin { to { transform:rotate(360deg); } }
.tm-empty { display:flex; flex-direction:column; align-items:center; gap:8px; padding:28px 16px; color:#877f75; text-align:center; }
.tm-empty > span,.tm-empty span svg { width:32px; height:32px; color:#b9b0a3; }
.tm-empty h2 { margin:0; color:#38322c; font-size:15px; font-weight:950; }
.tm-empty p { max-width:480px; margin:0; font-size:11px; line-height:1.85; }
.tm-empty.small { padding:20px; }

/* نقشهٔ کامل مباحث */
.tm-map-browser { display:grid; gap:11px; padding-top:13px; }
.tm-crumbs { min-height:27px; display:flex; align-items:center; flex-wrap:wrap; gap:4px; }
.tm-crumb {
  min-height:27px; display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border:1px solid #e5ddd2; border-radius:8px;
  color:#665f56; background:#fff; font:inherit; font-size:10.5px; font-weight:850; cursor:pointer; transition:all .14s ease;
}
.tm-crumb svg { width:12px; height:12px; }
.tm-crumb:hover { border-color:#e7b995; color:#b55422; background:#fff8f2; }
.tm-crumb.current { border-color:#3b342e; color:#fff; background:#3b342e; cursor:default; }
.tm-crumb-sep { width:15px; height:15px; display:grid; place-items:center; color:#b8afa4; }
.tm-crumb-sep svg { width:10px; height:10px; }
.tm-map-context { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid #eee6dc; border-radius:11px; background:#fbf9f5; }
.tm-map-context > div:first-child > span { color:#938a7f; font-size:10px; font-weight:800; }
.tm-map-context h3 { margin:2px 0 0; color:#433c35; font-size:13.5px; font-weight:950; }
.tm-map-context-stats { display:flex; gap:5px; }
.tm-map-context-stats > span { min-width:72px; display:grid; justify-items:center; padding:6px 8px; border-radius:8px; color:#81786e; background:#fff; font-size:9.5px; font-weight:750; }
.tm-map-context-stats b { color:#463f38; font-size:12px; font-weight:950; }
.tm-bar { display:flex; flex-wrap:wrap; align-items:stretch; gap:6px; padding:6px; border:1px solid #ece4d8; border-radius:14px; background:#f4f0e9; }
/* نوار چندردیفه: نگه‌دارنده ستون ردیف‌هاست و دکمهٔ بازگشت بیرون آن می‌ماند. */
.tm-bar.tm-pack { flex-wrap:nowrap; }
.tm-pack-rows { flex:1 1 auto; min-width:0; display:flex; flex-wrap:wrap; align-items:stretch; gap:6px; }
.tm-pack-rows.is-packed { flex-direction:column; flex-wrap:nowrap; }
/* همهٔ ردیف‌ها هم‌ارتفاع‌اند؛ تفاوت مبحث‌ها فقط در طول است (پهنا = سهمشان از سؤال‌ها). */
.tm-pack-row { min-width:0; display:flex; align-items:stretch; justify-content:flex-start; gap:6px; height:var(--tm-row-h,58px); }
.tm-pack-row > .tm-seg { flex:var(--tm-grow,1) 1 0; width:auto; min-width:var(--tm-seg-min,54px); min-height:0; height:100%; }
.tm-seg {
  flex:var(--tm-grow) 1 190px; min-width:170px; min-height:52px; display:grid; grid-template-columns:minmax(0,1fr) minmax(64px,auto); align-items:center; gap:8px;
  padding:6px 9px; border:1px solid rgba(35,88,61,.08); border-radius:10px; color:#173b29; font:inherit; text-align:start; cursor:default;
  overflow:hidden; transition:transform .16s ease,box-shadow .16s ease,filter .16s ease,border-color .16s ease;
}
.tm-seg.drillable { cursor:pointer; }
.tm-seg.drillable:hover { z-index:2; transform:translateY(-2px); border-color:rgba(42,111,75,.28); box-shadow:0 9px 20px rgba(30,70,49,.14); filter:saturate(1.06); }
.tm-seg.untouched { border-color:#e4ddd3; color:#837b71!important; background:#f8f6f2!important; }
.tm-seg.untouched.drillable:hover { border-color:#e7b58d; color:#6b5442!important; background:#fff8f1!important; }
.tm-seg-copy { min-width:0; overflow:hidden; display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
.tm-seg-level { padding:2px 5px; border-radius:5px; color:inherit; background:rgba(255,255,255,.42); font-size:9px; font-weight:850; }
.tm-seg-stats { min-width:64px; max-width:86px; overflow:hidden; display:grid; justify-items:end; gap:2px; text-align:left; }
.tm-seg-pct { direction:ltr; font-size:12px; font-weight:950; }
.tm-seg-label { display:block; width:100%; overflow:hidden; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:950; }
.tm-seg-meta { max-width:100%; overflow:hidden; color:inherit; opacity:.76; font-size:9px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
/* مبحث باریک تک‌ستونی می‌شود، ولی عنوان همیشه یک‌خطی است و اضافه‌اش سه‌نقطه می‌شود؛
   چیپ نام کتاب هم هرگز حذف نمی‌شود تا همهٔ باکس‌های یک ردیف یک‌شکل بمانند. */
.tm-seg-slim { grid-template-columns:minmax(0,1fr); align-content:center; gap:2px; padding:5px 7px; }
.tm-seg-slim .tm-seg-copy { flex-direction:row; align-items:center; gap:5px; }
.tm-seg-slim .tm-seg-level { flex:none; max-width:46%; overflow:hidden; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.tm-seg-slim .tm-seg-label { font-size:11px; }
.tm-seg-slim .tm-seg-stats { min-width:0; max-width:none; display:flex; align-items:baseline; justify-content:flex-start; gap:6px; text-align:start; }
.tm-seg-slim .tm-seg-pct { font-size:10.5px; }
.tm-seg-slim .tm-seg-meta { font-size:8px; }
.tm-seg-tight { padding:4px 5px; }
.tm-seg-tight .tm-seg-copy { flex-direction:column; align-items:flex-start; gap:1px; }
.tm-seg-tight .tm-seg-level { max-width:100%; padding:1px 4px; font-size:7.5px; }
.tm-seg-tight .tm-seg-meta { display:none; }
.tm-seg-tight .tm-seg-label { font-size:10px; }
.tm-seg-tight .tm-seg-pct { font-size:9.5px; }
.tm-seg-mini { padding:3px 4px; }
.tm-seg-mini .tm-seg-label { font-size:8.5px; }
.tm-seg-mini .tm-seg-level { padding:1px 3px; font-size:7px; }
.tm-seg-mini .tm-seg-pct { font-size:8.5px; }
.tm-hint { display:flex; align-items:center; gap:5px; color:#8c8378; font-size:10px; font-weight:750; }
.tm-hint svg { width:12px; height:12px; }

/* در سطح درس، فصل‌های هر کتاب مستقیماً در یک نوار مستقل و متناسب با تعداد سؤال می‌آیند. */
.tm-book-chapter-list { display:grid; gap:8px; }
.tm-book-chapter-row {
  min-width:0; padding:6px; border:1px solid #e9e0d4; border-radius:13px; background:#fbf9f5;
}
.tm-book-chapter-bar { min-width:0; }
.tm-book-chapter-bar .tm-seg-level { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tm-book-row-back {
  flex:0 0 34px; min-width:34px; align-self:stretch; display:grid; place-items:center; padding:0; border:1px solid #e5d9cb;
  border-radius:9px; color:#b55a29; background:#fffaf5; cursor:pointer; transition:border-color .15s ease,background .15s ease;
}
.tm-book-row-back:hover { border-color:#ef9b69; background:#fff3e9; }
.tm-book-row-back svg { width:14px; height:14px; }
.tm-book-chapter-empty { min-height:58px; display:flex; align-items:center; gap:8px; padding:8px 12px; border-radius:10px; color:#958c81; background:#f6f3ee; font-size:10px; font-weight:750; }
.tm-book-chapter-empty .tm-book-row-back { margin-inline-start:auto; align-self:center; min-height:34px; }

/* نمودار مقایسه‌ای سلسله‌مراتبی */
/* ── نوار انتخاب گروه مقایسه (همه / یک پله بالاتر / هم‌سطح / یک پله پایین‌تر) ── */
.tm-group-switch {
  display:flex; flex-wrap:wrap; align-items:stretch; gap:7px; margin-top:12px;
  padding:7px; border:1px solid #eee7dd; border-radius:13px; background:#fbf8f4;
}
.tm-group-switch > button {
  flex:1 1 150px; min-width:0; display:grid; gap:2px; align-content:center; padding:8px 10px;
  border:1px solid transparent; border-radius:10px; color:#6d6459; background:#fff;
  font:inherit; text-align:start; cursor:pointer;
  transition:border-color .14s ease,background .14s ease,color .14s ease;
}
.tm-group-switch > button b { font-size:11.5px; font-weight:950; }
.tm-group-switch > button small { color:#968d82; font-size:9.5px; font-weight:700; line-height:1.5; }
.tm-group-switch > button:hover { border-color:#f0c8a6; background:#fff9f3; }
.tm-group-switch > button.on { border-color:var(--orange); color:#a8511a; background:#fff2e6; }
.tm-group-switch > button.on small { color:#b8825d; }
.tm-group-count {
  flex:none; align-self:center; padding:0 10px; color:#8d847a; font-size:10px; font-weight:850;
}
.tm-group-empty {
  display:flex; align-items:center; gap:7px; margin-top:9px; padding:9px 12px;
  border:1px solid #f0dcc4; border-radius:11px; background:#fdf6ec; color:#8a6534;
  font-size:11px; font-weight:800;
}
.tm-group-empty svg { width:14px; height:14px; flex:none; }
.tm-radar-controls { min-height:34px; display:flex; align-items:center; gap:9px; padding:8px 0 2px; }
.tm-back { min-height:30px; display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border:1px solid #e3d9cc; border-radius:8px; color:#5f574f; background:#fff; font:inherit; font-size:10.5px; font-weight:900; cursor:pointer; }
.tm-back:hover { border-color:#e6ad83; color:#b55321; background:#fff8f2; }
.tm-back svg { width:12px; height:12px; }
.tm-radar-trail { min-width:0; overflow:hidden; color:#8d847a; font-size:10px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
/* نمودار سقف عرض مستقل دارد و کمی کوچک‌تر از نصف ردیف است؛ بنابراین در مانیتور عریض
   بی‌نهایت بزرگ نمی‌شود. فهرست کنار نیز با ارتفاع طبیعی خودش در مرکز قرار می‌گیرد. */
.tm-radar-stage { min-width:0; display:grid; grid-template-columns:minmax(280px,47%) minmax(0,1fr); align-items:center; gap:18px; padding:6px 0 4px; direction:ltr; }
.tm-radar-visual { min-width:0; display:grid; place-items:center; direction:rtl; }
.tm-radar-svg { width:min(100%,500px); max-width:500px; height:auto; display:block; margin:auto; overflow:visible; }
.tm-radar-ring,.tm-radar-spoke { fill:none; stroke:#e7dfd5; stroke-width:1; }
.tm-radar-spoke { stroke-dasharray:3 3; }
.tm-radar-area { stroke-width:2.1; fill-opacity:.14; transition:opacity .16s ease; }
.tm-radar-area.user { stroke:var(--tm-blue); fill:var(--tm-blue); }
.tm-radar-area.cohort { stroke:var(--tm-red); fill:var(--tm-red); }
.tm-radar-dot { stroke:#fff; stroke-width:1.4; }
.tm-radar-axis { fill:#5e564e; font-size:10px; font-weight:850; cursor:default; }
/* خط راهنما: برچسبی که برای جلوگیری از هم‌پوشانی جابه‌جا شده را به نوکِ محورش وصل می‌کند */
.tm-radar-leader { fill:none; stroke:#cdc1b1; stroke-width:1; stroke-linejoin:round; stroke-linecap:round; }
.tm-radar-axis.drillable { fill:#315fc9; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
.tm-radar-axis.drillable:hover { fill:#ff6b1a; }
/* همیشه دو کارت در هر ردیف؛ اما ردیف‌ها دیگر تا ارتفاع نمودار کش نمی‌آیند. */
.tm-radar-axis-list { align-self:center; align-content:center; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:minmax(52px,auto); gap:7px; padding:3px; direction:rtl; }
.tm-radar-axis-list > button {
  min-width:0; min-height:52px; display:grid; grid-template-columns:minmax(0,1fr) auto 12px; align-items:center; gap:7px; padding:7px 8px;
  border:1px solid #eae2d8; border-radius:10px; color:#4c453e; background:#fff; font:inherit; text-align:start;
}
.tm-radar-axis-list > button.drillable { cursor:pointer; transition:border-color .14s ease,background .14s ease,transform .14s ease; }
.tm-radar-axis-list > button.drillable:hover { border-color:#efb88f; background:#fff9f3; transform:translateX(-2px); }
.tm-radar-axis-list > button:disabled { opacity:.78; }
.tm-axis-name { min-width:0; }
/* متن نمایشی حداکثر دو سطر است؛ نام کامل در title و aria-label دکمه حفظ می‌شود. */
.tm-radar-axis-list b,.tm-radar-axis-list small {
  display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere;
}
.tm-radar-axis-list b { -webkit-line-clamp:2; font-size:11.5px; font-weight:950; line-height:1.45; }
.tm-radar-axis-list small { -webkit-line-clamp:1; margin-top:2px; color:#8f867c; font-size:9px; line-height:1.4; }
.tm-radar-axis-list > button > svg { width:12px; height:12px; align-self:center; color:#d06a34; }
.tm-axis-values { display:grid; gap:2px; direction:ltr; text-align:left; }
.tm-axis-values i { font-style:normal; font-size:11px; font-weight:950; }
.tm-axis-values .user { color:var(--tm-blue); }
.tm-axis-values .cohort { color:var(--tm-red); }
.tm-radar-legend { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px 16px; padding-top:11px; border-top:1px solid #eee7de; }
.tm-radar-legend span { display:inline-flex; align-items:center; gap:5px; color:#625b52; font-size:10.5px; font-weight:850; }
.tm-radar-legend i { width:13px; height:4px; border-radius:999px; }
.tm-radar-legend .user i { background:var(--tm-blue); }
.tm-radar-legend .cohort i { background:var(--tm-red); }
.tm-radar-legend small { color:#8d847a; font-size:9.5px; }

/* نمودار میله‌ای برای سطح‌های یک یا دو گزینه‌ای */
.tm-radar-stage:has(> .tm-radar-bars) { display:block; min-height:0; }
.tm-radar-bars { width:100%; display:grid; gap:7px; padding-top:7px; direction:rtl; }
.tm-rb-row {
  width:100%; min-height:56px; display:grid; grid-template-columns:minmax(120px,1.1fr) minmax(180px,2fr) minmax(180px,2fr) auto;
  align-items:center; gap:10px; padding:7px 9px; border:1px solid #eae2d8; border-radius:10px; color:#4b443d; background:#fff; font:inherit; text-align:start;
}
.tm-rb-row.drillable { cursor:pointer; transition:border-color .14s ease,background .14s ease,transform .14s ease; }
.tm-rb-row.drillable:hover { border-color:#efb88f; background:#fff9f3; transform:translateX(-2px); }
.tm-rb-row:disabled { opacity:.82; }
.tm-rb-name { min-width:0; font-size:12.5px; font-weight:950; }
.tm-rb-name small { display:block; margin-top:2px; color:#8f867c; font-size:9.5px; font-weight:750; }
.tm-rb-series { display:grid; grid-template-columns:42px minmax(0,1fr) 42px; align-items:center; gap:6px; }
.tm-rb-series > small { color:#877e73; font-size:10px; font-weight:800; }
.tm-rb-track { height:7px; overflow:hidden; border-radius:999px; background:#eee8df; direction:ltr; }
.tm-rb-track i { display:block; height:100%; border-radius:inherit; }
.tm-rb-track i.user { background:var(--tm-blue); }
.tm-rb-track i.cohort { background:var(--tm-red); }
.tm-rb-val { direction:ltr; font-size:10.5px; font-weight:950; text-align:left; }
.tm-rb-val.user { color:var(--tm-blue); }
.tm-rb-val.cohort { color:var(--tm-red); }
.tm-rb-coverage { display:inline-flex; align-items:center; gap:4px; color:#8a8177; font-size:10px; font-weight:800; white-space:nowrap; }
.tm-rb-coverage svg { width:11px; height:11px; color:#d16b35; }

.tm-tooltip {
  position:fixed; z-index:9999; width:max-content; min-width:0; max-width:min(220px,calc(100vw - 24px)); padding:7px 9px; border:1px solid rgba(255,255,255,.1); border-radius:8px;
  color:#fbf8f3; background:rgba(43,38,33,.97); box-shadow:0 12px 28px rgba(20,20,15,.28);
  font-size:10px; font-weight:750; line-height:1.75; text-align:right; white-space:pre-line; opacity:0; pointer-events:none;
  transform:translate(-50%,calc(-100% - 11px)); transition:opacity .12s ease;
}
.tm-tooltip.show { opacity:1; }

@media (max-width: 980px) {
  .tm-analysis-hero { align-items:flex-start; flex-direction:column; }
  .tm-analysis-summary { justify-content:flex-start; }
  .tm-radar-stage { grid-template-columns:1fr; }
  .tm-radar-svg { width:min(100%,460px); }
  .tm-rb-row { grid-template-columns:minmax(100px,1fr) minmax(150px,2fr) minmax(150px,2fr); }
  .tm-rb-coverage { grid-column:1 / -1; }
}
@media (max-width: 640px) {
  .tm-analysis-hero { padding:16px; }
  .tm-analysis-title { align-items:flex-start; }
  .tm-analysis-icon { width:42px; height:42px; border-radius:12px; }
  .tm-analysis-summary > span { min-height:34px; }
  .tm-tool-switch { grid-template-columns:1fr; }
  .tm-group-switch > button { flex:1 1 100%; }
  .tm-group-switch > button small { display:none; }
  .tm-card,.tm-radar-card { padding:13px; }
  .tm-panel-head,.tm-map-context { align-items:flex-start; flex-direction:column; }
  .tm-map-context-stats { width:100%; overflow-x:auto; }
  .tm-map-context-stats > span { flex:1; }
  .tm-seg { min-width:160px; min-height:50px; }
  .tm-bar.tm-pack { gap:4px; padding:4px; }
  .tm-pack-rows, .tm-pack-row { gap:4px; }
  .tm-pack-row > .tm-seg { min-width:var(--tm-seg-min,48px); }
  .tm-book-row-back { flex-basis:30px; min-width:30px; }
  .tm-radar-axis-list { grid-template-columns:minmax(0,1fr); }
  .tm-radar-svg { width:min(100%,390px); }
  .tm-rb-row { grid-template-columns:1fr; gap:7px; }
  .tm-rb-series { grid-template-columns:50px minmax(0,1fr) 44px; }
}

/* ===== آزمون مشابه (sx-*) ===== */
.exam-similar-icon { color: #7a56c9; border-color: #e0d6f6; background: #f8f5ff; }
.exam-similar-icon:hover { color: #6741bd; border-color: #c3aef0; background: #f2ecff; }
.sx-body { display: grid; gap: 14px; }
.sx-state {
  display: grid; gap: 10px; place-items: center; text-align: center;
  padding: 46px 18px; border: 1px dashed #e4ded2; border-radius: 16px; background: var(--panel-soft);
  color: var(--muted); font-size: 12.5px; font-weight: 700;
}
.sx-state svg { width: 30px; height: 30px; color: #c3b8a3; }
.sx-state.error svg { color: var(--red); }

.sx-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 9px; }
.sx-tiles article {
  display: grid; gap: 3px; place-items: center; text-align: center; min-height: 74px;
  align-content: center; padding: 10px 8px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 13px;
}
.sx-tiles article span { font-size: 11px; color: #9a8c78; font-weight: 750; }
.sx-tiles article b { font-size: 18px; }
.sx-tiles article small { font-size: 10px; color: #b3a790; line-height: 1.5; }

.sx-modes { display: grid; gap: 8px; }
.sx-mode-seg { justify-self: start; }
.sx-mode-seg .seg { display: inline-flex; align-items: center; gap: 6px; }
.sx-mode-seg .seg svg { width: 14px; height: 14px; }
.sx-mode-note {
  margin: 0; padding: 11px 13px; border: 1px solid #eee3d7; border-radius: 13px;
  background: #fbf8f3; color: #706654; font-size: 12px; font-weight: 650; line-height: 1.95;
}
.sx-mode-note b { color: var(--ink); }

.sx-lessons { display: grid; gap: 9px; }
.sx-lesson { border: 1px solid var(--line); border-radius: 15px; background: var(--panel); overflow: hidden; }
.sx-lesson.open { border-color: #d7c9ee; box-shadow: 0 8px 22px rgba(87, 60, 155, .06); }
.sx-lesson-head {
  display: grid; align-items: center; gap: 10px; padding: 11px 13px; cursor: pointer;
  grid-template-columns: minmax(150px, 1.5fr) repeat(3, minmax(62px, .7fr)) minmax(112px, 1fr) minmax(92px, .9fr) 18px;
  transition: background .14s ease;
}
.sx-lesson-head:hover { background: var(--panel-soft); }
.sx-l-name { display: flex; align-items: center; gap: 7px; min-width: 0; }
.sx-l-name svg { width: 15px; height: 15px; color: #a99a80; }
.sx-l-name b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sx-l-name small { flex: none; font-size: 10.5px; color: #a99a80; font-weight: 700; }
.sx-l-cell { display: grid; gap: 2px; justify-items: center; text-align: center; }
.sx-l-cell small { font-size: 10px; color: #a99a80; font-weight: 700; }
.sx-l-cell b { font-size: 13px; font-weight: 850; }
.sx-caret { display: inline-grid; place-items: center; color: #b8ab94; transition: transform .2s var(--ease-soft); }
.sx-caret svg { width: 15px; height: 15px; }
.sx-lesson.open .sx-caret { transform: rotate(180deg); }

.sx-delta { font-size: 13px; font-weight: 850; }
.sx-delta.up { color: #1f8f5f; }
.sx-delta.down { color: var(--red); }
.sx-delta.flat { color: #8b8272; }
.sx-delta.none { color: #c0b6a3; }
.sx-verdict {
  display: inline-flex; align-items: center; padding: 3px 9px; border-radius: 999px;
  font-size: 10.5px; font-weight: 800; white-space: nowrap;
}
.sx-verdict.up { background: #e7f7ef; color: #1a7d54; }
.sx-verdict.down { background: var(--red-soft); color: #b8453f; }
.sx-verdict.flat { background: #f3f0e9; color: #7c7466; }
.sx-verdict.none { background: #f6f4ef; color: #aba290; }

.sx-level-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 9px 13px; border-top: 1px dashed #eee3d7; background: var(--panel-soft);
  font-size: 11.5px; font-weight: 750; color: #706654;
}
.sx-levels .seg { min-width: 68px; }

.sx-detail { display: grid; gap: 12px; padding: 12px 13px 14px; border-top: 1px solid var(--line); background: var(--panel-soft); }
.sx-mix-block { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.sx-mix-block > div { display: grid; gap: 5px; }
.sx-mix-block small { font-size: 10.5px; color: #9a8c78; font-weight: 750; }
.sx-mix { display: flex; height: 22px; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); background: #fff; }
.sx-mix.empty { background: repeating-linear-gradient(45deg, #f6f3ec 0 6px, #fff 6px 12px); }
.sx-mix-part {
  flex: 0 0 calc(var(--sx-w) * 1%); display: grid; place-items: center;
  font-style: normal; min-width: 0; overflow: hidden;
}
.sx-mix-part b { font-size: 10px; font-weight: 850; color: #fff; }
.sx-mix-part.veasy { background: #58c08d; }
.sx-mix-part.easy { background: #8ecf78; }
.sx-mix-part.medium { background: #e3b64a; }
.sx-mix-part.hard { background: #e8874c; }
.sx-mix-part.vhard { background: #d75a53; }
.sx-mix-part.unknown { background: #c6bcaa; }

.sx-table-title {
  display: flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 800; color: #7d7263;
}
.sx-table-title svg { width: 15px; height: 15px; color: #a99a80; }
.sx-table-wrap { border: 1px solid var(--line); border-radius: 12px; background: var(--panel); overflow-x: auto; }
.sx-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.sx-table th {
  padding: 8px 9px; text-align: center; font-size: 10.5px; font-weight: 800;
  color: #9a8c78; background: var(--panel-soft); border-bottom: 1px solid var(--line); white-space: nowrap;
}
.sx-table td { padding: 7px 9px; text-align: center; border-bottom: 1px solid #f3efe7; font-weight: 750; }
.sx-table tr:last-child td { border-bottom: 0; }
.sx-table .sx-band-name, .sx-table .sx-topic-name { text-align: start; white-space: nowrap; }
.sx-band-name { display: flex; align-items: center; gap: 7px; }
.sx-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.sx-dot.veasy { background: #58c08d; }
.sx-dot.easy { background: #8ecf78; }
.sx-dot.medium { background: #e3b64a; }
.sx-dot.hard { background: #e8874c; }
.sx-dot.vhard { background: #d75a53; }
.sx-dot.unknown { background: #c6bcaa; }
.sx-topic-name span { display: inline-block; padding-inline-start: calc(var(--sx-indent) * 14px); }
.sx-table.topics tr.lv1 .sx-topic-name span { font-weight: 850; }
.sx-table.topics tr.lv4 .sx-topic-name span { color: #7d7263; }

.sx-note { margin: 0; font-size: 11.5px; color: #8b8272; font-weight: 700; line-height: 1.9; }
.sx-note.warn {
  display: flex; align-items: center; gap: 8px; padding: 10px 12px;
  border: 1px solid #f3ddc4; border-radius: 12px; background: var(--yellow-soft); color: #8a6414;
}
.sx-note.warn svg { width: 16px; height: 16px; flex: none; }

.sx-footer { flex-wrap: wrap; gap: 10px; }
.sx-name { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1 1 260px; }
.sx-name span { flex: none; font-size: 11.5px; font-weight: 750; color: #8b8272; }
.sx-name input {
  flex: 1 1 auto; min-width: 0; height: 34px; padding: 0 11px;
  border: 1px solid var(--line); border-radius: 10px; background: var(--panel);
  font: inherit; font-size: 12.5px; color: var(--ink);
}
.sx-name input:focus { outline: none; border-color: #c3aef0; }

@media (max-width: 900px) {
  .sx-lesson-head { grid-template-columns: minmax(0, 1fr) 18px; row-gap: 9px; }
  .sx-l-name { grid-column: 1; }
  .sx-caret { grid-column: 2; grid-row: 1; }
  .sx-l-cell { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) max-content; justify-items: stretch; }
  .sx-l-cell small { text-align: start; }
  .sx-l-cell b, .sx-l-cell .sx-delta, .sx-l-cell .sx-verdict { justify-self: end; }
}
.sx-body.busy .sx-lessons, .sx-body.busy .sx-tiles { opacity: .55; transition: opacity .18s ease; }
.sx-refresh {
  display: flex; align-items: center; gap: 9px; padding: 8px 12px;
  border: 1px solid #e0d6f6; border-radius: 11px; background: #f8f5ff;
  color: #6741bd; font-size: 11.5px; font-weight: 750;
}
.sx-refresh i {
  width: 13px; height: 13px; flex: none; border-radius: 50%;
  border: 2px solid #d8caf5; border-top-color: #7a56c9;
  animation: sx-spin .7s linear infinite;
}
@keyframes sx-spin { to { transform: rotate(360deg); } }

/* ضریب هدف: عدد درشت = هدف، زیرش مبدأ؛ ▲/▼ جهت تغییر */
.sx-target { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 850; }
.sx-target i { font-style: normal; font-size: 9px; line-height: 1; }
.sx-target.up { color: #c2582f; }
.sx-target.down { color: #1f8f5f; }
.sx-target.flat { color: var(--ink); }
.sx-target.flat i { color: #b8ab94; }
.sx-tiles article .sx-target { font-size: 18px; }
.sx-l-cell .sx-target + small, .sx-tiles article .sx-target + small { color: #a99a80; }

/* سطح خودکار سؤال: قفلِ ناشی از رسیدن به آستانهٔ کاربر یکتا */
.qdiff-alert.auto { color: #5b3fa8; border-color: #ddd0f5; background: #f8f5ff; }
.qdiff-alert.auto b { color: #45308a; }
.auto-diff-note {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 9px 11px; border: 1px solid #ddd0f5; border-radius: 11px;
  background: #f8f5ff; color: #5b3fa8; font-size: 10.5px; font-weight: 700; line-height: 1.85;
}
.auto-diff-note svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.auto-diff-note b { color: #45308a; }

/* ═══════════════════ کنکور نوردی ═══════════════════ */
/* نشانِ سازمان سنجش: توپُر و رنگ‌گیرنده از currentColor (برخلاف بقیهٔ آیکون‌های خطی) */
.kn-glyph { display: inline-block; width: 1em; height: 1em; fill: currentColor; stroke: none; vertical-align: middle; flex: 0 0 auto; }
.nav-icon-konkur {
  width:19px;
  height:19px;
  fill:currentColor;
  stroke:none;
  transform:scale(.88);
  transform-origin:center;
}
.kn-unit-glyph { width: 20px; height: 20px; }
.kn-chip-glyph { width: 13px; height: 13px; }
.kn-empty-glyph { width: 34px; height: 34px; color: var(--orange); }

.kn-group + .kn-group { margin-top: 16px; }
.kn-unit-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 13px; }
/* شبکهٔ کارت‌ها داخل پنل است و پنل خودش padding ندارد؛ وگرنه کارت‌ها به لبه می‌چسبند */
.kn-group > .kn-unit-grid { padding: 15px 17px 17px; }
.kn-unit-card {
  display: flex; flex-direction: column; gap: 9px; padding: 14px; text-align: right; cursor: pointer;
  border: 1px solid #e5d7c5; border-radius: 17px; background: #fff; color: var(--ink);
  box-shadow: 0 8px 24px rgba(67, 52, 35, .05);
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.kn-unit-card:hover { border-color: #c58cf2; transform: translateY(-2px); box-shadow: 0 12px 30px rgba(96, 55, 140, .12); }
.kn-unit-top { display: flex; align-items: center; gap: 10px; min-width: 0; }
.kn-unit-icon {
  flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px;
  color: #fff; background: linear-gradient(135deg, var(--kn-color, #c344fd), color-mix(in srgb, var(--kn-color, #c344fd) 65%, #000));
}
.kn-unit-icon .ui-icon { width: 19px; height: 19px; }
.kn-unit-name { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kn-unit-name strong { font-size: .92rem; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kn-unit-name small { color: var(--muted); font-size: .7rem; font-weight: 700; }
.kn-unit-meta { display: flex; align-items: center; gap: 8px; color: #6d6357; font-size: .74rem; font-weight: 700; }
.kn-unit-meta b { color: #c9510c; font-size: .86rem; font-weight: 900; }
.kn-unit-meta i { width: 1px; height: 13px; background: #e6dcd0; }
.kn-unit-bar { display: block; height: 7px; border-radius: 999px; background: #f1ebe2; overflow: hidden; }
.kn-unit-bar > span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #ff7a2b, var(--orange)); transition: width .3s ease; }
.kn-unit-cover { color: var(--muted); font-size: .7rem; font-weight: 700; }

/* ── کارت نمایش سؤال (qv-*) ────────────────────────────────────────────────
   تنها فرمتِ نمایشِ سؤال در پاپ‌آپ‌ها و فهرست‌های فقط‌خواندنیِ هر سه پنل
   (کاربر، مدیر، حساب‌های غیر دانش‌آموز). چیدمانِ عمودی: نوارِ بالا (شماره،
   نشان‌ها، اسلاتِ اختصاصیِ صفحه) و زیرش صورتِ سؤال در تمام عرض و بعد گزینه‌ها. */
.qv-list { display: flex; flex-direction: column; gap: 10px; }
.qv-card {
  display: flex; flex-direction: column; gap: 9px;
  padding: 13px; border: 1px solid #e5dccf; border-radius: 15px; background: #fff;
  box-shadow: 0 6px 20px rgba(67, 52, 35, .04);
}
.qv-card.has-similar { border-color: #cfa5f0; box-shadow: inset 3px 0 0 #a855f7, 0 6px 20px rgba(67, 52, 35, .04); }
/* رنگِ نازکِ کنارهٔ کارت بر اساس نتیجهٔ کاربر (کارنامه/پاسخبرگ) */
.qv-card.qv-correct { box-shadow: inset 3px 0 0 #2f9e83, 0 6px 20px rgba(67, 52, 35, .04); }
.qv-card.qv-wrong { box-shadow: inset 3px 0 0 #dc5b52, 0 6px 20px rgba(67, 52, 35, .04); }
.qv-card.qv-blank { box-shadow: inset 3px 0 0 #c3b8a8, 0 6px 20px rgba(67, 52, 35, .04); }
/* همهٔ نشان‌ها و دکمه‌های نوارِ بالا هم‌ارتفاع‌اند (نازک و سبک) تا ردیف یکدست دیده شود */
.qv-top { display: flex; align-items: center; flex-wrap: nowrap; gap: 7px; --qv-top-h: 26px; }
.qv-no {
  flex: none; display: grid; place-items: center; min-width: var(--qv-top-h); height: var(--qv-top-h);
  padding: 0 7px; border-radius: 8px;
  background: #faf7f2; border: 1px solid #ece3d6; color: #5f574d; font-size: .78rem; font-weight: 900;
}
.qv-head { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
/* نشانِ مبحث می‌تواند خیلی بلند باشد؛ کوتاه می‌شود تا آمار و دکمه در همان ردیف بمانند */
.qv-top .qv-head { flex: 1 1 0; min-width: 0; flex-wrap: nowrap; overflow: hidden; }
.qv-top .qv-head > .meta-chip { min-width: 0; overflow: hidden; }
.qv-top .qv-head > .meta-chip b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qv-top .qv-head > :not(.meta-chip) { flex: none; }
.qv-head small { color: var(--muted); font-size: .7rem; font-weight: 700; }
.qv-uid {
  padding: 2px 7px; border-radius: 7px; background: #f3eee7; color: #7d7263;
  font-size: .68rem; font-weight: 850; direction: ltr;
}
/* نوع سؤال و یادداشت‌های کوتاهِ نوار بالا (پنل مدیر) */
.qv-type, .qv-note {
  padding: 0 9px; border-radius: 8px; background: #f7f3ed; border: 1px solid #ece3d6;
  color: #7d7263; font-size: .68rem; font-weight: 800; white-space: nowrap;
}
/* هم‌قدسازیِ اجزای نوارِ بالا: نشانِ مبحث، کد سؤال، سطح، نوع، وضعیت و اسلات‌ها */
.qv-top .qv-head > .meta-chip,
.qv-top .qv-uid,
.qv-top .qv-diff,
.qv-top .qv-type,
.qv-top .qv-note,
.qv-top .qv-head > .badge,
.qv-top .qv-status,
.qv-top .kn-qstats > i,
.qv-top .kn-qopen {
  height: var(--qv-top-h); border-radius: 8px;
}
.qv-top .qv-head > .meta-chip { display: inline-flex; align-items: center; }
.qv-top .qv-uid,
.qv-top .qv-type,
.qv-top .qv-note,
.qv-top .qv-head > .badge { display: inline-grid; place-items: center; padding: 0 9px; }
/* نشانِ وضعیت در نوار بالای کارت با inline-grid هم‌قد بقیه می‌شود؛ در این حالت
   نقطهٔ ::beforeِ .badge یک ردیفِ جدا در گرید می‌سازد و بالای متن می‌نشیند.
   نوار بالا خودش رنگ‌بندی دارد، پس نقطه اینجا لازم نیست. */
.qv-top .qv-head > .badge::before { display: none; }
/* سطح دشواری با نامِ خودش می‌آید؛ رنگِ ملایمِ متناسب با سطح */
.qv-diff {
  flex: none; display: inline-grid; place-items: center; padding: 0 9px;
  border: 1px solid transparent; font-size: .7rem; font-weight: 850; white-space: nowrap;
}
.qv-diff.lvl-1 { background: #eef8f5; border-color: #d3ebe4; color: #16816f; }
.qv-diff.lvl-2 { background: #fdf6e7; border-color: #f0e2c2; color: #a2760f; }
.qv-diff.lvl-3 { background: #fef2ea; border-color: #f6dbc8; color: #c25d21; }
.qv-diff.lvl-4 { background: #fdeef0; border-color: #f6d3d7; color: #c4444e; }
/* نتیجهٔ کاربر روی همین سؤال (کارنامه، پاسخبرگ، مرور رفتاری) */
.qv-status {
  flex: none; display: inline-grid; place-items: center; padding: 0 11px;
  border: 1px solid transparent; font-size: .71rem; font-weight: 900; white-space: nowrap;
}
.qv-status.correct { background: #edf9f4; border-color: #b7dfd0; color: #1c7d64; }
.qv-status.wrong { background: #fdeeed; border-color: #f2ccc8; color: #b9433a; }
.qv-status.blank, .qv-status.dunno { background: #f6f3ee; border-color: #e5dccf; color: #7d7263; }
/* متنِ کاملِ سؤال؛ هیچ‌جا کوتاه نمی‌شود */
.qv-body { display: block; color: #4e463d; font-size: .84rem; line-height: 1.9; }
.qv-body img { max-width: 100%; height: auto; }
/* placeholderِ تصویرِ لودنشده نسبتِ ۱۶:۱۰ دارد و در فهرستِ بلند خیلی جا می‌گیرد */
.qv-body img.sq-img-lazy { max-height: 150px; }
.qv-opts {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; align-content: start; grid-auto-rows: 1fr; gap: 6px 10px; margin-top: 4px;
}
.qv-opts.is-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.qv-opts.is-row > span { width: 100%; min-width: 0; }
.qv-opts.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.qv-opts.is-stack { grid-template-columns: minmax(0, 1fr); grid-auto-rows: max-content; }
.qv-opts > span {
  display: flex; align-items: center; gap: 6px; min-width: 0;
  min-height: 36px; padding: 2px 9px; border: 1px solid #eee5d9; border-radius: 9px; background: #fdfbf7;
  color: #5b5248; font-size: .76rem; line-height: 1.8;
}
.qv-opts > span.is-correct { border-color: #b3ddd0; background: #f1fbf7; }
.qv-opts > span.is-picked { border-color: #d9c6ea; background: #faf6fe; }
.qv-opts > span.is-correct.is-picked { border-color: #8ccbb5; background: #ecfaf4; }
.qv-opts > span > b {
  flex: none; display: grid; place-items: center; width: 18px; height: 18px;
  border-radius: 6px; background: #f1efe8; color: #7d7263; font-size: .64rem; font-weight: 900;
}
.qv-opts > span.is-correct > b { background: #2f9e83; color: #fff; }
.qv-opts > span.is-picked > b { background: #8b45d6; color: #fff; }
.qv-opts > span.is-correct.is-picked > b { background: #2f9e83; color: #fff; }
.qv-opts > span > span { min-width: 0; overflow-wrap: anywhere; flex: 1 1 auto; line-height: 1.55; }
.qv-opts > span > span > :first-child { margin-top: 0; }
.qv-opts > span > span > :last-child { margin-bottom: 0; }
.qv-opts > span > span > p { margin-block: 0; line-height: 1.55; }
.qv-opts > span img { max-width: 100%; height: auto; }
@media (max-width: 760px) {
  .qv-opts.is-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* فقط نشانِ انتخاب کاربر چسبیده به انتهای گزینه می‌آید. گزینهٔ صحیح مثل بانک
   سؤال با رنگِ کادر و شماره مشخص است و آیکون تیکِ جداگانه ندارد. */
.qv-opt-flags { flex: none; display: inline-flex; align-items: center; gap: 5px; margin-top: 1px; font-style: normal; }
.qv-opt-flags > em { display: inline-flex; align-items: center; font-style: normal; }
.qv-opt-flags > em.pick {
  padding: 1px 7px; border-radius: 6px; background: #f3e9fb; color: #7a3ec2;
  font-size: .63rem; font-weight: 850; white-space: nowrap;
}
/* پاسخ تشریحی و درسنامه، زیر همان کارت و با همان قاب */
.qv-answer { display: flex; flex-direction: column; gap: 10px; }
.qv-panel {
  padding: 13px; border: 1px solid #e5dccf; border-radius: 15px; background: #fff;
  box-shadow: 0 6px 20px rgba(67, 52, 35, .04);
}
.qv-panel > h3 { margin: 0 0 9px; font-size: .82rem; font-weight: 900; color: #4e463d; }
.qv-panel-body { color: #4e463d; font-size: .82rem; line-height: 2; }
.qv-panel-body img { max-width: 100%; height: auto; }
.qv-muted { color: var(--muted); font-size: .78rem; }
/* بدنهٔ پاپ‌آپی که سؤال نشان می‌دهد: فقط فاصله‌گذاری بین کارت و پنل‌ها */
.qv-modal { display: flex; flex-direction: column; gap: 10px; }
.qv-modal .question-detail-grid { margin: 0; }
.qv-modal .detail-main, .qv-modal .qrep-modal-main { display: flex; flex-direction: column; gap: 10px; }
.kn-qstats { display: flex; align-items: center; gap: 6px; flex: none; }
.kn-qstats > i {
  display: flex; align-items: center; gap: 5px; font-style: normal;
  padding: 0 9px; border: 1px solid #efe7db; border-radius: 8px; background: #fcfaf7;
}
.kn-qstats b { color: #b3a99b; font-size: .76rem; font-weight: 900; }
.kn-qstats > i.on { border-color: #f7d0b6; background: #fff5ec; }
.kn-qstats > i.on b { color: #c9510c; }
.kn-qstats > i.inherit { border-color: #e0c7f5; background: #faf4ff; }
.kn-qstats > i.inherit b { color: #8b45d6; }
.kn-qstats small { color: var(--muted); font-size: .67rem; font-weight: 700; white-space: nowrap; }
.kn-qopen { flex: none; justify-content: center; height: var(--qv-top-h); padding: 0 11px; gap: 5px; font-size: .73rem; }
.kn-qopen .ui-icon { width: 14px; height: 14px; }

/* نوار کناریِ کنکور نوردی: هیچ اسکرولِ داخلی ندارد — کلِ باکس دقیقاً به‌اندازهٔ درختِ
   بازشده بلند می‌شود و همراه صفحه اسکرول می‌شود (به همین دلیل sticky هم نیست). */
.kn-side { position: static; max-height: none; overflow: visible; }
.kn-side-scroll { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.kn-side .mn-sec-body { max-height: none; overflow: visible; }
.kn-side .mn-sec { flex: 0 0 auto; }

/* نوار کناریِ workspace: وضعیت مشابه‌داشتن */
.kn-status-group { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.kn-status {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 11px; border: 1px solid #ece3d6; border-radius: 10px; background: #fff;
  font: inherit; font-size: .78rem; font-weight: 800; color: #514a42; cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.kn-status:hover { border-color: #f0b487; }
.kn-status.on { border-color: #f4ceb4; background: var(--orange-soft); color: #c9510c; }
.kn-status b { min-width: 24px; padding: 2px 7px; border-radius: 999px; background: #f1eee8; color: #8d8273; font-size: .68rem; font-weight: 850; text-align: center; }
.kn-status.on b { background: #fff; color: #c9510c; }
/* با نوار کناری، ستون سؤال باریک‌تر می‌شود؛ تصویر سؤال هم به تعادل می‌رسد */
.kn-workspace .qv-list { gap: 10px; }

/* سؤال کنکورِ هدف در صفحهٔ انتخاب مشابه */
.kn-target {
  overflow: hidden; margin-bottom: 16px; border: 1px solid #d9bdf3; border-radius: 18px; background: #fff;
  box-shadow: 0 10px 30px rgba(96, 55, 140, .08);
}
.kn-target-head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 9px; padding: 10px 14px;
  background: linear-gradient(135deg, #f9f2ff, #fdfaff); border-bottom: 1px solid #ecdcfb;
  color: #6b5a80; font-size: .76rem; font-weight: 800;
}
.kn-target-tag {
  padding: 4px 10px; border-radius: 999px; color: #fff; font-size: .69rem; font-weight: 900;
  background: linear-gradient(135deg, #a855f7, #7c3aed);
}
.kn-target .sq-item { border: 0; border-radius: 0; }

/* کارت‌های انتخاب مشابه */
.kn-pick-card.inherited { border-color: #d3b1f0; }
.kn-inherit-note {
  display: flex; align-items: center; gap: 7px; padding: 8px 13px;
  background: #f8f2ff; border-bottom: 1px solid #ecdcfb; color: #6c4a9c; font-size: .72rem; font-weight: 800;
}
.kn-inherit-note .ui-icon { width: 14px; height: 14px; flex: none; }
.kn-pick-action.on { border-color: #f0a9a9; background: #fdf0f0; color: #c0392b; box-shadow: 0 5px 13px rgba(192, 57, 43, .1); }
.kn-pick-action.on:hover { border-color: #e08a8a; box-shadow: 0 8px 18px rgba(192, 57, 43, .15); }
.kn-tab-count { margin-inline-start: 5px; padding: 1px 6px; border-radius: 999px; background: #fff2e6; color: #c9510c; font-size: .66rem; font-weight: 900; }

/* نوار کناری فیلتر مخزن */
.kn-side .sd-check-group { display: flex; flex-direction: column; gap: 3px; }
.kn-sub-title { margin: 9px 2px 4px; color: var(--muted); font-size: .69rem; font-weight: 850; }

/* نشان «مشابه کنکور» روی کارت سؤال */
.kn-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 999px;
  border: 1px solid #e3cdf8; background: #f8f2ff; color: #7c3aed; font-size: .69rem; font-weight: 850; white-space: nowrap;
}
.kn-chip .ui-icon { width: 13px; height: 13px; }
.kn-chip b { padding: 1px 6px; border-radius: 999px; background: #fff; color: #6d28d9; font-size: .64rem; font-weight: 900; }
.kn-chip.is-konkur { border-color: #f7d0b6; background: #fff3e9; color: #c2410c; }
.kn-chip.is-konkur b { color: #9a3412; }
/* نشانِ «مشابهِ سؤال کنکور» روی کارت سؤال: فقط آیکونِ سنجش؛ متن روی hover می‌آید */
.kn-chip-icon {
  flex: 0 0 auto; display: inline-grid; place-items: center; width: 27px; height: 27px; padding: 0;
  border-color: #e6d4fa; border-radius: 9px; background: linear-gradient(180deg, #fdfbff, #f7f0ff);
  color: #7c3aed; box-shadow: 0 4px 11px rgba(124, 58, 237, .09); cursor: help;
}
.kn-chip-icon:hover, .kn-chip-icon:focus-visible { border-color: #c9a6f2; background: #f5ecff; outline: none; }
.kn-chip-icon .kn-chip-glyph { width: 16px; height: 16px; }

@media (max-width: 860px) {
  .kn-unit-grid { grid-template-columns: 1fr; }
  .qv-top { flex-wrap: wrap; }
  .qv-top .qv-head { flex: 1 1 100%; order: 3; }
  .kn-qstats { flex: 1 1 auto; }
  .kn-qopen { flex: 1 1 auto; }
}

/* ── کنکور نوردی: پنل کاربر ── */
.kns-group + .kns-group { margin-top: 18px; }
.kns-group-head { display: flex; align-items: baseline; gap: 9px; margin: 0 2px 10px; }
.kns-group-head strong { color: var(--ink); font-size: .95rem; font-weight: 900; }
.kns-group-head span { color: var(--muted); font-size: .74rem; font-weight: 700; }

/* کارت کنکور در پنل کاربر: بدنهٔ کلیک‌پذیر (رفتن به سؤال‌ها) + پای کارت (شرکت در آزمون).
   رنگِ کنکور در حالت عادی فقط تهرنگ است و روی هاور توپُر می‌شود تا نشان سفید بدرخشد. */
.kns-unit-card {
  position: relative; padding: 0; gap: 0; overflow: hidden; cursor: default;
  --kn-soft: color-mix(in srgb, var(--kn-color, #c344fd) 11%, #fff);
  --kn-line: color-mix(in srgb, var(--kn-color, #c344fd) 27%, #fff);
  --kn-deep: color-mix(in srgb, var(--kn-color, #c344fd) 76%, #000);
}
/* هالهٔ رنگیِ گوشهٔ کارت؛ فقط روی هاور محو-ظاهر می‌شود */
.kns-unit-card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: radial-gradient(125% 85% at 100% 0%, color-mix(in srgb, var(--kn-color, #c344fd) 14%, transparent), transparent 62%);
  transition: opacity .22s ease;
}
.kns-unit-card:hover {
  border-color: var(--kn-line);
  box-shadow: 0 16px 34px color-mix(in srgb, var(--kn-color, #c344fd) 17%, rgba(67, 52, 35, .07));
}
.kns-unit-card:hover::before { opacity: 1; }
.kns-unit-open {
  position: relative; z-index: 1; display: flex; flex-direction: column; gap: 9px; width: 100%;
  padding: 14px 14px 11px; border: 0; background: none; color: inherit; font: inherit;
  text-align: right; cursor: pointer;
}
.kns-unit-open:focus-visible { outline: 2px solid var(--kn-deep); outline-offset: -3px; border-radius: 16px; }
.kns-unit-card .kn-unit-icon {
  width: 40px; height: 40px; border-radius: 13px;
  background: var(--kn-soft); color: var(--kn-deep); border: 1px solid var(--kn-line);
  box-shadow: inset 0 1px 0 #fff;
  transition: background .22s ease, color .22s ease, border-color .22s ease, box-shadow .22s ease,
              transform .24s cubic-bezier(.34, 1.5, .64, 1);
}
.kns-unit-card .kn-unit-glyph { width: 22px; height: 22px; transition: transform .24s cubic-bezier(.34, 1.5, .64, 1); }
.kns-unit-card:hover .kn-unit-icon {
  background: linear-gradient(140deg, var(--kn-color, #c344fd), var(--kn-deep));
  border-color: transparent; color: #fff; transform: translateY(-1px) scale(1.05);
  box-shadow: 0 9px 18px color-mix(in srgb, var(--kn-color, #c344fd) 36%, transparent);
}
.kns-unit-card:hover .kn-unit-glyph { transform: scale(1.06); }
.kns-unit-card .kn-unit-name strong { transition: color .2s ease; }
.kns-unit-open:hover .kn-unit-name strong { color: var(--kn-deep); }
.kns-unit-arrow {
  flex: 0 0 auto; margin-inline-start: auto; display: grid; place-items: center;
  width: 26px; height: 26px; border-radius: 9px; background: transparent; opacity: .4;
  color: color-mix(in srgb, var(--kn-color, #c344fd) 65%, #6b6053);
  transition: opacity .2s ease, transform .2s ease, background .2s ease, color .2s ease;
}
.kns-unit-arrow .ui-icon { width: 16px; height: 16px; }
.kns-unit-open:hover .kns-unit-arrow, .kns-unit-open:focus-visible .kns-unit-arrow {
  opacity: 1; transform: translateX(-3px); background: var(--kn-soft); color: var(--kn-deep);
}
.kns-unit-card .kn-unit-cover {
  align-self: flex-start; padding: 3px 9px; border-radius: 999px;
  border: 1px solid #efe6da; background: #fbf7f2; color: #7a6e60; font-size: .69rem; font-weight: 800;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.kns-unit-card:hover .kn-unit-cover { border-color: var(--kn-line); background: var(--kn-soft); color: var(--kn-deep); }
.kns-unit-foot { position: relative; z-index: 1; padding: 0 14px 14px; }
.kns-unit-exam {
  position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; gap: 7px;
  width: 100%; padding: 10px 12px; border-radius: 12px; cursor: pointer; font: inherit;
  font-size: .78rem; font-weight: 900;
  border: 1px solid var(--kn-line); background: var(--kn-soft); color: var(--kn-deep);
  transition: background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .12s ease;
}
/* برقِ عبوریِ دکمه هنگام هاور */
.kns-unit-exam::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 26%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent);
  transform: skewX(-18deg); transition: left .55s ease;
}
.kns-unit-exam:hover::after { left: 125%; }
.kns-unit-exam .ui-icon { width: 17px; height: 17px; transition: transform .2s ease; }
.kns-unit-exam:hover {
  background: linear-gradient(140deg, var(--kn-color, #c344fd), var(--kn-deep));
  border-color: transparent; color: #fff;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--kn-color, #c344fd) 33%, transparent);
}
.kns-unit-exam:hover .ui-icon { transform: scale(1.08) rotate(-5deg); }
.kns-unit-exam:active { transform: translateY(1px); }
.kns-unit-exam:focus-visible { outline: 2px solid var(--kn-deep); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .kns-unit-card, .kns-unit-card::before, .kns-unit-card .kn-unit-icon, .kns-unit-card .kn-unit-glyph,
  .kns-unit-arrow, .kns-unit-exam, .kns-unit-exam::after { transition: none; }
}
.kns-list { gap: 16px; }
.kns-card {
  overflow: hidden; border: 1px solid #e5dccf; border-radius: 17px; background: #fff;
  box-shadow: 0 8px 26px rgba(67, 52, 35, .045);
}
.kns-card .sq-item { border: 0; border-radius: 0; }
.kns-card-head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 9px; padding: 10px 14px;
  background: linear-gradient(135deg, #fdf8f3, #fffdfb); border-bottom: 1px solid #f0e9df;
}
.kns-qno {
  padding: 4px 11px; border-radius: 999px; background: #fff2e6; color: #c2410c;
  font-size: .74rem; font-weight: 900; border: 1px solid #f7d8bf;
}
.kns-unit-tag {
  padding: 4px 10px; border-radius: 999px; background: #f8f2ff; color: #7c3aed;
  font-size: .71rem; font-weight: 800; border: 1px solid #e8d8fa;
}
.kns-similar-btn {
  display: inline-flex; align-items: center; gap: 6px; margin-inline-start: auto;
  padding: 7px 13px; border-radius: 10px; cursor: pointer; font: inherit;
  border: 1px solid #d9bdf3; background: #fff; color: #7c3aed; font-size: .75rem; font-weight: 900;
  transition: background .16s ease, border-color .16s ease, transform .16s var(--ease-soft);
}
.kns-similar-btn:hover { background: #f8f2ff; border-color: #b98df0; transform: translateY(-1px); }
.kns-similar-btn b { padding: 1px 7px; border-radius: 999px; background: #f3e9ff; color: #6d28d9; font-size: .68rem; }
.kns-similar-none { margin-inline-start: auto; color: var(--muted); font-size: .72rem; font-weight: 700; }
.kns-target { margin-bottom: 14px; }
.kns-relbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 14px;
  padding: 11px 14px; border-radius: 15px; background: #fff; border: 1px solid #e8dfd3;
  box-shadow: 0 8px 24px rgba(67, 52, 35, .04);
}
.kns-relbar .seg-group { background: #f3eee7; border: 1px solid #ece3d7; }
.kns-relbar .seg { color: #847968; gap: 5px; }
.kns-relbar .seg.on { background: #fff; color: #c9510c; box-shadow: 0 3px 9px rgba(91, 62, 34, .1); }
.kns-relbar .seg b { padding: 1px 6px; border-radius: 999px; background: #ece5db; color: #7d7263; font-size: .66rem; font-weight: 900; }
.kns-relbar .seg.on b { background: #fff2e6; color: #c9510c; }
.kns-basis { margin-inline-start: auto; color: var(--muted); font-size: .71rem; font-weight: 700; }
.kns-rel { padding: 4px 10px; border-radius: 999px; font-size: .71rem; font-weight: 850; border: 1px solid transparent; }
.kns-rel-harder { background: #fdecec; color: #c0392b; border-color: #f6d2d2; }
.kns-rel-same   { background: #eef7f5; color: #2f756e; border-color: #d5eae6; }
.kns-rel-easier { background: #eef6ec; color: #3f7a34; border-color: #d8ecd3; }
@media (max-width: 640px) {
  .kns-similar-btn, .kns-similar-none { margin-inline-start: 0; width: 100%; justify-content: center; }
  .kns-basis { margin-inline-start: 0; }
}

/* ── کنکور نوردی: هم‌خانواده‌ها در پنل پاسخ + مودال شرکت در آزمون ── */
.sq-reveal-tabs button b { margin-inline-start: 5px; padding: 1px 6px; border-radius: 999px; background: #f1eae0; color: #7d7263; font-size: .66rem; font-weight: 900; }
.sq-reveal-tabs button.on b { background: #fff2e6; color: #c9510c; }
.kn-fam { display: flex; flex-direction: column; gap: 9px; }
.kn-fam-note { margin: 0; color: var(--muted); font-size: .76rem; font-weight: 700; line-height: 1.8; }
.kn-fam-empty { margin: 0; color: var(--muted); font-size: .78rem; }
.kn-fam-list { display: flex; flex-direction: column; gap: 6px; }
.kn-fam-row {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 11px; cursor: pointer;
  border: 1px solid #e8dfd3; border-radius: 11px; background: #fff; color: var(--ink);
  font: inherit; font-size: .77rem; text-align: right;
  transition: border-color .16s ease, background .16s ease, transform .16s var(--ease-soft);
}
.kn-fam-row:hover { border-color: #efb27f; background: #fffaf5; transform: translateY(-1px); }
.kn-fam-row.is-konkur { border-color: #e3cdf8; background: #fdfbff; }
.kn-fam-row.is-konkur:hover { border-color: #c58cf2; background: #f8f2ff; }
.kn-fam-tag { display: inline-flex; align-items: center; gap: 5px; min-width: 0; font-weight: 850; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kn-fam-row.is-konkur .kn-fam-tag { color: #7c3aed; }
.kn-fam-no { flex: 0 0 auto; padding: 2px 8px; border-radius: 999px; background: #fff2e6; color: #c2410c; font-size: .69rem; font-weight: 900; }
.kn-fam-diff { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: .71rem; font-weight: 700; }
.kn-fam-diff img, .kn-fam-diff svg { width: 15px; height: 15px; }
.kn-fam-uid { margin-inline-start: auto; color: #8d8273; font-size: .69rem; font-weight: 800; }
.kn-fam-go { flex: 0 0 auto; color: var(--muted); display: grid; place-items: center; }
.kn-fam-go .ui-icon { width: 15px; height: 15px; }
.kn-peek-body { display: flex; flex-direction: column; gap: 14px; }
.kn-peek-panel { margin: 0; }

.kne-body { display: flex; flex-direction: column; gap: 15px; }
.kne-field { display: flex; flex-direction: column; gap: 6px; }
.kne-field > span { color: var(--ink); font-size: .78rem; font-weight: 850; }
.kne-field input { height: 40px; padding: 0 12px; border: 1px solid #e6ddd0; border-radius: 11px; background: #fffdfb; font: inherit; }
.kne-section { display: flex; flex-direction: column; gap: 8px; }
.kne-section > b { color: var(--ink); font-size: .78rem; font-weight: 900; }
.kne-hint { color: var(--muted); font-size: .72rem; font-weight: 700; }
.kne-delivery { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.kne-delivery-card {
  display: flex; flex-direction: column; gap: 3px; padding: 12px 13px; cursor: pointer;
  border: 1px solid #e6ddd0; border-radius: 13px; background: #fff;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.kne-delivery-card.on { border-color: var(--orange); background: var(--orange-soft); box-shadow: 0 6px 16px rgba(255, 107, 24, .12); }
.kne-delivery-card input { position: absolute; opacity: 0; pointer-events: none; }
.kne-dc-title { color: var(--ink); font-size: .82rem; font-weight: 900; }
.kne-dc-desc { color: var(--muted); font-size: .71rem; font-weight: 700; line-height: 1.7; }
.kne-bkmode { width: fit-content; }
/* نقشهٔ دفترچه‌ها در حالت «مشابه کنکور» */
.kne-bkmap {
  display: flex; flex-direction: column; gap: 5px; padding: 9px 11px;
  border: 1px solid #e8dfd3; border-radius: 12px; background: #fdfbf7;
}
.kne-bkmap-row { display: flex; align-items: center; gap: 9px; font-size: .76rem; }
.kne-bkmap-row i {
  flex: 0 0 auto; padding: 2px 9px; border-radius: 999px; font-style: normal;
  background: #fff2e6; color: #c2410c; font-size: .69rem; font-weight: 900;
}
.kne-bkmap-row b { min-width: 0; color: #514a42; font-weight: 800; }
.kne-lessons { display: flex; flex-direction: column; gap: 6px; }
.kne-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 9px 11px;
  border: 1px solid #eee6dc; border-radius: 11px; background: #fdfbf8;
}
.kne-row.off { opacity: .5; }
.kne-check { display: flex; align-items: center; gap: 8px; min-width: 128px; cursor: pointer; font-size: .8rem; font-weight: 850; }
.kne-check input { width: 16px; height: 16px; accent-color: var(--orange); }
.kne-count { color: var(--muted); font-size: .73rem; font-weight: 800; }
.kne-time, .kne-bk { display: inline-flex; align-items: center; gap: 6px; margin-inline-start: auto; }
.kne-bk { margin-inline-start: 0; }
.kne-time input, .kne-bk input {
  width: 62px; height: 34px; padding: 0 8px; text-align: center; font: inherit; font-weight: 800;
  border: 1px solid #e6ddd0; border-radius: 9px; background: #fff;
}
.kne-bk input { width: 48px; }
.kne-time i, .kne-bk span { color: var(--muted); font-size: .71rem; font-style: normal; font-weight: 700; }
.kne-switch { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; color: #514a42; font-size: .77rem; font-weight: 700; line-height: 1.8; }
.kne-switch input { margin-top: 3px; width: 16px; height: 16px; accent-color: var(--orange); flex: 0 0 auto; }
.kne-summary {
  display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 12px 14px;
  border: 1px solid #efe6da; border-radius: 13px; background: #faf7f2;
  color: #6d6357; font-size: .77rem; font-weight: 700;
}
.kne-summary b { color: #c9510c; font-size: .95rem; font-weight: 900; }
.kne-summary.over { border-color: #f3c4c4; background: #fdf1f1; }
.kne-summary.over b { color: #c0392b; }
.kne-error { margin: 0; color: #c0392b; font-size: .77rem; font-weight: 800; }

/* ═══════════════ برنامه راهبردی ═══════════════ */
.pl-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pl-head-actions > button { white-space: nowrap; }
.pl-head-actions > button .ui-icon { width: 19px; height: 19px; }
.pl-logo {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; flex: 0 0 auto; border-radius: 12px; overflow: hidden;
  background: color-mix(in srgb, var(--pl-brand, var(--orange)) 12%, #fff);
  border: 1px solid color-mix(in srgb, var(--pl-brand, var(--orange)) 26%, #fff);
}
.pl-logo > svg, .pl-logo > img { width: 100%; height: 100%; object-fit: contain; display: block; }
.pl-logo-text { font-weight: 900; font-size: 1.2rem; color: var(--pl-brand, var(--orange)); }
/* آیکونِ آپلودشدهٔ منبع: همان قاب لوگو، با کمی فاصلهٔ داخلی تا تصویر نچسبد */
.pl-logo-src { padding: 3px; background: #fff; }
.pl-logo-src > svg, .pl-logo-src > img { width: 100%; height: 100%; object-fit: contain; display: block; }
.pl-logo-src.src-icon-fallback { padding: 5px; color: var(--pl-brand, var(--orange)); }
.pl-chip-logo.pl-logo-src, .pl-cal-logo.pl-logo-src { padding: 2px; }

/* نوار حالت نمایش */
.pl-modebar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-wrap: wrap; margin: 4px 0 14px;
}
.pl-mode-tabs { display: inline-flex; gap: 4px; padding: 4px; background: #efece4; border-radius: 13px; }
.pl-mode-tab {
  display: inline-flex; align-items: center; gap: 7px; border: 0; background: transparent;
  font: inherit; font-size: .8rem; font-weight: 800; color: var(--muted);
  padding: 8px 16px; border-radius: 10px; cursor: pointer; transition: .16s ease;
}
.pl-mode-tab .ui-icon { width: 20px; height: 20px; }
.pl-mode-tab.on { background: #fff; color: var(--orange); box-shadow: 0 4px 12px rgba(79,58,38,.09); }
.pl-mode-count { font-size: .78rem; font-weight: 700; color: var(--muted); }
.pl-mode-count b { color: var(--ink); font-size: .95rem; font-weight: 900; }

/* نوار سری آزمون‌ها */
.pl-brandbar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; margin-bottom: 16px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.pl-brandbar-title { display: inline-flex; align-items: center; gap: 6px; font-size: .76rem; font-weight: 800; color: var(--muted); }
.pl-brandbar-title .ui-icon { width: 19px; height: 19px; }
.pl-brand-chips { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 1 1 auto; }
.pl-brand-chip {
  display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px 5px 7px;
  border: 1.5px solid var(--line); border-radius: 999px; background: #fff;
  font: inherit; font-size: .76rem; font-weight: 800; color: var(--muted);
  cursor: pointer; transition: .16s ease;
}
.pl-brand-chip b { font-weight: 800; }
.pl-brand-chip i { font-style: normal; font-size: .68rem; font-weight: 700; opacity: .7; }
.pl-brand-chip.on {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--pl-brand, var(--orange)) 55%, #fff);
  background: color-mix(in srgb, var(--pl-brand, var(--orange)) 9%, #fff);
}
.pl-brand-chip:not(.on) { opacity: .55; }
.pl-brand-all { --pl-brand: var(--teal); }
.pl-brand-all .ui-icon { width: 15px; height: 15px; }
.pl-chip-logo { width: 30px; height: 30px; border-radius: 9px; }
.pl-chip-logo.pl-logo-text { font-size: .9rem; }
.pl-save-btn {
  display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 10px;
  background: var(--teal-soft); color: #0e7f70; font: inherit; font-size: .76rem; font-weight: 800;
  padding: 8px 13px; cursor: pointer; transition: .16s ease;
}
.pl-save-btn:hover { background: #d8f2ed; }
.pl-save-btn .ui-icon { width: 18px; height: 18px; }

/* ---------- تقویم ---------- */
.pl-cal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: start; }
.pl-cal-month {
  min-width: 0; background: #fff; border: 1px solid #e8e4de; border-radius: var(--radius);
  box-shadow: 0 10px 28px rgba(53, 45, 35, .055); padding: 12px;
}
.pl-cal-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.pl-cal-head b { font-size: 1rem; font-weight: 900; }
.pl-cal-head small { color: var(--muted); font-weight: 700; }
.pl-cal-head i { margin-inline-start: auto; font-style: normal; font-size: .68rem; font-weight: 800; color: #77716a; background: #f3f1ed; padding: 3px 9px; border-radius: 999px; }
.pl-cal-weekdays, .pl-cal-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.pl-cal-weekdays { margin-bottom: 5px; }
.pl-cal-weekdays span { text-align: center; font-size: .68rem; font-weight: 800; color: var(--muted); }
.pl-cal-cell {
  position: relative; min-width: 0; min-height: 64px; border-radius: 9px; padding: 4px 2px;
  border: 1px solid transparent; background: #f8f7f4; display: flex; flex-direction: column; gap: 4px; align-items: center;
}
.pl-cal-cell.empty { background: transparent; }
.pl-cal-day { font-size: .72rem; font-weight: 800; color: #8d8880; }
.pl-cal-cell.has { background: #fff; border-color: #ddd8d1; box-shadow: none; }
.pl-cal-cell.has .pl-cal-day { color: var(--ink); }
.pl-cal-cell.today { border-color: #88827a; background: #f5f4f1; box-shadow: inset 0 0 0 1px #88827a; }
.pl-cal-cell.today .pl-cal-day { color: #393633; font-weight: 900; }
.pl-cal-marks {
  display: grid; grid-template-columns: repeat(4, 14px); justify-content: center; align-content: start;
  gap: 3px; width: 100%; min-height: 28px;
}
.pl-cal-marks.single { grid-template-columns: 28px; }
.pl-cal-marks.double { grid-template-columns: repeat(2, 20px); }
.pl-cal-marks.triple { grid-template-columns: repeat(3, 16px); }
.pl-cal-mark {
  position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 1; min-width: 0; padding: 0;
  border: 0; border-radius: 6px; cursor: pointer; font: inherit; background: transparent;
  transition: transform .14s ease, background .14s ease;
}
.pl-cal-mark:hover, .pl-cal-mark:focus-visible { z-index: 8; transform: translateY(-1px) scale(1.08); background: #f1efeb; outline: 0; }
.pl-cal-logo { width: 100%; height: 100%; max-width: 28px; max-height: 28px; padding: 0 !important; border-radius: 6px; border: 0 !important; background: transparent !important; color: #5f5b55 !important; object-fit: contain; }
.pl-cal-marks.double .pl-cal-logo { max-width: 20px; max-height: 20px; }
.pl-cal-marks.triple .pl-cal-logo { max-width: 16px; max-height: 16px; }
.pl-cal-marks.multi .pl-cal-logo { max-width: 14px; max-height: 14px; }
.pl-cal-logo.pl-logo-text { display: grid; place-items: center; font-size: .62rem; }
.pl-cal-tooltip {
  position: absolute; left: 50%; bottom: calc(100% + 7px); z-index: 20;
  width: max-content; max-width: 220px; padding: 6px 9px; border: 1px solid #ded9d1; border-radius: 8px;
  background: #292725; color: #fff; box-shadow: 0 8px 20px rgba(35, 31, 27, .18);
  font-size: .67rem; font-weight: 750; line-height: 1.55; white-space: nowrap;
  opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, 4px); transition: .14s ease;
}
.pl-cal-tooltip::after { content: ""; position: absolute; top: 100%; left: 50%; width: 7px; height: 7px; background: #292725; transform: translate(-50%, -4px) rotate(45deg); }
.pl-cal-mark:hover .pl-cal-tooltip, .pl-cal-mark:focus-visible .pl-cal-tooltip { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

/* ---------- نقشه راه ---------- */
.pl-roadmap { position: relative; padding: 8px 0 40px; }
.pl-rm-rail {
  position: absolute; top: 0; bottom: 0; inset-inline-start: 50%; width: 3px;
  transform: translateX(50%); border-radius: 3px;
  background: linear-gradient(#f0e7db, #e6ddd0);
}
.pl-rm-today {
  position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; gap: 8px;
  margin: 18px auto; width: fit-content; padding: 7px 16px; border-radius: 999px;
  background: var(--orange); color: #fff; box-shadow: 0 8px 20px rgba(255,107,24,.3);
}
.pl-rm-today b { font-size: .8rem; font-weight: 900; }
.pl-rm-today small { font-size: .7rem; opacity: .85; }
.pl-rm-today-dot { width: 9px; height: 9px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.28); }
.pl-rm-item { position: relative; display: flex; width: 50%; margin-top: var(--pl-gap, 24px); }
.pl-rm-item.pl-rm-start { margin-inline-end: 50%; justify-content: flex-start; padding-inline-end: 30px; }
.pl-rm-item.pl-rm-end { margin-inline-start: 50%; justify-content: flex-end; padding-inline-start: 30px; }
.pl-rm-node {
  position: absolute; top: 14px; z-index: 2;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: #fff;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pl-brand, var(--orange)) 35%, #fff), 0 6px 14px rgba(79,58,38,.12);
}
.pl-rm-start .pl-rm-node { inset-inline-end: -27px; }
.pl-rm-end .pl-rm-node { inset-inline-start: -27px; }
.pl-rm-logo { width: 52px; height: 52px; border-radius: 50%; border: 0; }
.pl-rm-card {
  position: relative; width: 100%; max-width: 420px; cursor: pointer;
  padding: 12px 14px; border-radius: 15px; background: var(--panel);
  border: 1px solid var(--line); border-inline-start: 4px solid var(--pl-brand, var(--orange));
  box-shadow: var(--shadow); transition: .18s ease;
}
.pl-rm-end .pl-rm-card { border-inline-start: 1px solid var(--line); border-inline-end: 4px solid var(--pl-brand, var(--orange)); }
.pl-rm-item:hover .pl-rm-card { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(41,36,29,.11); }
.pl-rm-item.past .pl-rm-card { opacity: .62; }
.pl-rm-item.past:hover .pl-rm-card { opacity: 1; }
.pl-rm-date {
  display: inline-flex; align-items: baseline; gap: 5px; font-size: .72rem; font-weight: 900;
  color: var(--pl-brand, var(--orange));
}
.pl-rm-date small { font-weight: 700; opacity: .7; }
.pl-rm-name { display: block; margin: 4px 0 5px; font-size: .92rem; font-weight: 900; }
.pl-rm-line {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-size: .72rem; font-weight: 600; color: var(--muted); line-height: 1.75;
}
.pl-rm-actions { display: flex; margin-top: 9px; }
.pl-mini-btn {
  display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line);
  border-radius: 9px; background: #fff; font: inherit; font-size: .72rem; font-weight: 800;
  color: var(--ink); padding: 6px 11px; cursor: pointer; transition: .15s ease;
}
.pl-mini-btn:hover { border-color: var(--orange); color: var(--orange); background: var(--orange-soft); }
.pl-mini-btn .ui-icon { width: 15px; height: 15px; }
.pl-rm-pop {
  position: absolute; top: 0; z-index: 9; width: 320px; padding: 14px;
  border-radius: 15px; background: var(--panel); border: 1px solid var(--line);
  box-shadow: 0 22px 48px rgba(41,36,29,.16);
  opacity: 0; visibility: hidden; transform: translateY(6px); transition: .18s ease; pointer-events: none;
}
.pl-rm-start .pl-rm-pop { inset-inline-start: calc(100% + 6px); }
.pl-rm-end .pl-rm-pop { inset-inline-end: calc(100% + 6px); }
.pl-rm-item:hover .pl-rm-pop, .pl-rm-item.on .pl-rm-pop { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
.pl-pop-head { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.pl-pop-head b { display: block; font-size: .85rem; font-weight: 900; }
.pl-pop-head small { color: var(--muted); font-size: .7rem; font-weight: 700; }
.pl-pop-logo { width: 44px; height: 44px; }
.pl-pop-note { margin: 8px 0 0; font-size: .72rem; font-weight: 700; color: var(--muted); }
.pl-pop-cta { width: 100%; margin-top: 11px; justify-content: center; }

/* ---------- بودجه‌بندی ---------- */
.pl-budget { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.pl-budget > li {
  display: grid; grid-template-columns: minmax(78px, auto) 1fr; gap: 8px; align-items: start;
  padding: 7px 9px; border-radius: 10px; background: var(--panel-soft); border: 1px solid var(--line);
}
.pl-budget-book { font-size: .74rem; font-weight: 900; color: var(--ink); }
.pl-budget-val { display: flex; flex-wrap: wrap; gap: 5px; }
.pl-budget-all { font-size: .72rem; font-weight: 900; color: var(--teal); background: var(--teal-soft); padding: 2px 9px; border-radius: 999px; }
.pl-budget-chip {
  display: inline-flex; flex-direction: column; gap: 1px;
  font-size: .7rem; font-weight: 800; color: #6d6357;
  background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 3px 8px;
}
.pl-budget-chip i { font-style: normal; font-size: .64rem; font-weight: 600; color: var(--muted); }
.pl-budget-compact > li { padding: 5px 8px; }
.pl-budget-empty { margin: 0; font-size: .74rem; font-weight: 700; color: var(--muted); }

/* ---------- مودال جزئیات ---------- */
.pl-modal-head { display: flex; align-items: center; gap: 10px; }
.pl-modal-logo { width: 52px; height: 52px; }
.pl-modal-head h2 small { display: block; font-size: .72rem; font-weight: 700; color: var(--muted); margin-top: 2px; }
.pl-modal-meta { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.pl-modal-meta span { display: inline-flex; align-items: center; gap: 5px; font-size: .74rem; font-weight: 800; color: var(--muted); }
.pl-modal-meta .ui-icon { width: 17px; height: 17px; }
.pl-modal-sub { margin: 0 0 8px; font-size: .8rem; font-weight: 900; }

/* ---------- صفحهٔ آزمون (انتخاب محدوده) ---------- */
.pl-exam-head .pl-back { margin-bottom: 8px; }
.pl-exam-title { display: flex; align-items: center; gap: 10px; }
.pl-exam-logo { width: 56px; height: 56px; }
.pl-head-badge {
  align-self: flex-start; font-size: .74rem; font-weight: 800; color: var(--orange);
  background: var(--orange-soft); padding: 7px 14px; border-radius: 999px;
}
.pl-ws { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.pl-ws-main, .pl-ws-card, .pl-ws-cta {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.pl-ws-main { padding: 14px; }
.pl-ws-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.pl-ws-copy strong { display: block; font-size: .85rem; font-weight: 900; }
.pl-ws-copy small { color: var(--muted); font-size: .72rem; font-weight: 700; }
.pl-ws-bulk { display: inline-flex; gap: 7px; }
.pl-tree { display: grid; gap: 3px; max-height: 62vh; overflow-y: auto; padding-inline-end: 4px; }
.pl-tn-row {
  display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 10px;
  cursor: pointer; transition: .14s ease; border: 1px solid transparent;
}
.pl-tn-row:hover { background: var(--panel-soft); }
.pl-tn-row.has-sel { background: transparent; }
.pl-tn-arr, .pl-tn-arr-ph { width: 14px; flex: 0 0 14px; text-align: center; color: var(--muted); font-size: .7rem; }
.pl-tn-cb input { width: 16px; height: 16px; accent-color: var(--orange); cursor: pointer; }
.pl-tn-lbl { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; line-height: 1.45; color: #1a1814; font-weight: 600; }
.pl-tn-cnt { font-style: normal; font-size: 10px; font-weight: 700; color: #c0bab0; white-space: nowrap; }
.pl-tn-lesson > .pl-tn-row .pl-tn-lbl { font-size: 13px; font-weight: 700; }
.pl-tn-book > .pl-tn-row .pl-tn-lbl { color: #b84500; font-weight: 600; }
.pl-tn-chapter > .pl-tn-row .pl-tn-lbl { font-size: 12px; font-weight: 500; }
.pl-tn-section > .pl-tn-row .pl-tn-lbl { font-size: 11.5px; font-weight: 500; }
.pl-tn-leaf > .pl-tn-lbl { font-size: 11px; color: #555; font-weight: 500; }
.pl-tn-ch { display: none; padding-inline-start: 18px; border-inline-start: 1px dashed var(--line); margin-inline-start: 14px; }
.pl-tn-ch.open { display: block; }
.pl-ws-side { display: grid; gap: 12px; position: sticky; top: 14px; }
.pl-ws-card { padding: 14px; }
.pl-ws-card h4 { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; font-size: .82rem; font-weight: 900; }
.pl-ws-card h4 .ui-icon { width: 19px; height: 19px; color: var(--orange); }
.pl-ws-stats, .pl-ws-lessons { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pl-ws-stats > li, .pl-ws-lessons > li {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-size: .74rem; font-weight: 700; color: var(--muted);
}
.pl-ws-stats b, .pl-ws-lessons b { color: var(--ink); font-size: .88rem; font-weight: 900; }
.pl-ws-lessons { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line); }
.pl-ws-cta { padding: 12px; display: grid; gap: 8px; }
.pl-ws-cta button { width: 100%; justify-content: center; }
.pl-ws-cta button .ui-icon { width: 19px; height: 19px; }
.pl-ws-hint { margin: 0; font-size: .7rem; font-weight: 600; color: var(--muted); line-height: 1.9; }

/* ---------- ساخت آزمون ---------- */
.pl-build-opts { display: flex; gap: 18px; flex-wrap: wrap; margin: 12px 0; }
.pl-build-rows { display: grid; gap: 8px; }
.pl-build-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 9px 11px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft);
}
.pl-build-lesson { font-size: .8rem; font-weight: 900; min-width: 92px; }
.pl-build-avail { font-size: .68rem; font-weight: 700; color: var(--muted); }
.pl-build-num { display: inline-flex; align-items: center; gap: 6px; margin-inline-start: auto; }
.pl-build-num span { font-size: .68rem; font-weight: 800; color: var(--muted); }
.pl-build-num input {
  width: 60px; height: 32px; text-align: center; font-weight: 800;
  border: 1px solid #e6ddd0; border-radius: 9px; background: #fff;
}

/* ---------- پنل مدیریت ---------- */
.pl-adm-toolbar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 14px; margin-bottom: 14px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.pl-adm-toolbar select { height: 36px; border: 1px solid var(--line); border-radius: 10px; padding: 0 10px; background: #fff; font-weight: 700; font-size: .76rem; }
.pl-adm-count { margin-inline-start: auto; font-size: .74rem; font-weight: 800; color: var(--muted); }
.pl-adm-list { display: grid; gap: 8px; }
.pl-adm-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas: "logo main actions" "logo meta meta";
  align-items: center; gap: 5px 12px;
  padding: 10px 13px; background: var(--panel); border: 1px solid var(--line);
  border-inline-start: 4px solid var(--pl-brand, var(--orange));
  border-radius: 14px; box-shadow: var(--shadow);
}
.pl-adm-logo { grid-area: logo; width: 46px; height: 46px; align-self: center; }
.pl-adm-main { grid-area: main; min-width: 0; }
.pl-adm-main b { display: block; font-size: .84rem; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-adm-main small { display: block; font-size: .69rem; font-weight: 600; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-adm-meta { grid-area: meta; display: flex; align-items: center; gap: 6px 14px; flex-wrap: wrap; min-width: 0; }
.pl-adm-meta > i { display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-size: .7rem; font-weight: 800; color: var(--muted); }
.pl-adm-meta .ui-icon { width: 14px; height: 14px; }
.pl-adm-live { color: var(--teal); }
.pl-adm-actions { grid-area: actions; display: inline-flex; gap: 4px; }
@media (max-width: 620px) {
  .pl-adm-row { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "logo main" "meta meta" "actions actions"; }
  .pl-adm-actions { justify-content: flex-end; }
}

/* سری آزمون‌ها */
.pl-brand-add { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.pl-brand-add .field { margin: 0; }
.pl-color-field input[type="color"] { width: 46px; height: 36px; padding: 2px; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; }
.pl-brand-list { display: grid; gap: 8px; }
.pl-brand-row {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft);
  border-inline-start: 4px solid var(--pl-brand, var(--orange));
}
.pl-brand-row-logo { width: 30px; height: 30px; }
.pl-brand-name { flex: 1 1 auto; height: 34px; border: 1px solid var(--line); border-radius: 9px; padding: 0 9px; background: #fff; font-weight: 800; font-size: .78rem; }
.pl-brand-color { width: 40px; height: 34px; padding: 2px; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; }

/* مودال تعریف آزمون: ردیف اول سری/پایه/رشته، ردیف دوم عنوان/تاریخ */
.pl-edit-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: end; }
.pl-edit-grid > .pl-source-field,
.pl-edit-grid > .pl-title-field,
.pl-edit-grid > .pl-date-field { grid-column: span 2; }
.pl-source-row { display: flex; align-items: center; gap: 8px; }
.pl-source-row select { flex: 1 1 auto; min-width: 0; }
.pl-source-logo { width: 46px; height: 46px; flex: 0 0 46px; }
.pl-source-color input[type="color"] { width: 38px; height: 36px; padding: 2px; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; }
.pl-date-field .pro-dt-cell { position: relative; }
.pl-note-field { grid-column: 1 / -1; }
.pl-bg-rows { display: grid; gap: 8px; }
.pl-bg-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 9px 11px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft);
}
.pl-bg-lesson { font-size: .8rem; font-weight: 900; min-width: 88px; }
.pl-bg-sum { flex: 1 1 220px; min-width: 0; font-size: .7rem; font-weight: 700; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-bg-count { font-style: normal; font-size: .68rem; font-weight: 800; color: var(--orange); background: var(--orange-soft); padding: 3px 9px; border-radius: 999px; }
.pl-bg-add { display: flex; align-items: center; gap: 9px; margin-top: 10px; }
.pl-bg-add select { flex: 1 1 auto; height: 36px; border: 1px solid var(--line); border-radius: 10px; padding: 0 10px; background: #fff; font-weight: 700; font-size: .78rem; }
.pl-edit-preview { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line); }
.pl-edit-preview h4 { display: flex; align-items: center; gap: 6px; margin: 0 0 9px; font-size: .8rem; font-weight: 900; }
.pl-edit-preview h4 .ui-icon { width: 15px; height: 15px; color: var(--orange); }

@media (max-width: 1000px) {
  .pl-ws { grid-template-columns: 1fr; }
  .pl-ws-side { position: static; }
}
@media (max-width: 900px) {
  .pl-rm-rail { inset-inline-start: 22px; transform: none; }
  .pl-rm-item, .pl-rm-item.pl-rm-start, .pl-rm-item.pl-rm-end {
    width: 100%; margin-inline: 0; padding-inline: 46px 0; justify-content: flex-start;
  }
  .pl-rm-start .pl-rm-node, .pl-rm-end .pl-rm-node { inset-inline-start: 4px; inset-inline-end: auto; }
  .pl-rm-end .pl-rm-card { border-inline-start: 4px solid var(--pl-brand, var(--orange)); border-inline-end: 1px solid var(--line); }
  .pl-rm-pop { position: static; width: auto; margin-top: 9px; box-shadow: none; transform: none; display: none; }
  .pl-rm-item.on .pl-rm-pop { display: block; }
  .pl-rm-item:hover .pl-rm-pop { opacity: 1; visibility: visible; }
  .pl-rm-today { margin-inline-start: 0; }
  .pl-cal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ══ خط زمانی برنامه راهبردی: محور مرکزی، کارت‌های فشرده و گروه‌بندی هم‌روز ══ */
.pl-brandbar { padding: 10px 12px; gap: 10px; }
.pl-brand-chips { gap: 7px; }
.pl-brand-chip {
  min-height: 42px;
  padding: 5px 9px 5px 6px;
  gap: 6px;
}
.pl-brand-all { min-width: 102px; }
.pl-chip-all-icon {
  display: grid;
  place-items: center;
  color: #0e7f70;
  background: var(--teal-soft);
  border: 1px solid #b9e1d9;
}
.pl-chip-all-icon .ui-icon { width: 20px; height: 20px; }
.pl-save-btn { min-height: 42px; }
.pl-mode-tab[data-pl-mode="roadmap"] .ui-icon { width: 22px; height: 22px; }

.pl-roadmap {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  padding: 6px 0 42px;
}
.pl-rm-rail {
  position: absolute;
  top: 42px;
  bottom: 20px;
  inset-inline-start: 50%;
  width: 3px;
  transform: translateX(50%);
  border-radius: 999px;
  background: #c9c5bf;
  box-shadow: 0 0 0 4px rgba(88, 83, 76, .025);
}
.pl-rm-rail::after {
  content: "";
  position: absolute;
  top: calc(100% + 7px);
  left: 50%;
  width: 9px;
  height: 34px;
  transform: translateX(-50%);
  background: radial-gradient(circle, #aaa59e 0 2px, transparent 2.4px) center top / 9px 9px repeat-y;
}
.pl-rm-month {
  position: relative;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  margin: 26px 0 13px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #554d44;
  box-shadow: none;
}
.pl-rm-month::before,
.pl-rm-month::after {
  content: "";
  flex: 1 1 auto;
  border-top: 1px dashed #d8cfc4;
}
.pl-rm-month-label {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 6px 13px;
  border: 1px solid #ddd6cc;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 5px 14px rgba(61, 48, 35, .07);
}
.pl-rm-month-label strong { font-size: .78rem; font-weight: 950; }
.pl-rm-month-label b { color: var(--muted); font-size: .67rem; }
.pl-rm-today {
  position: relative;
  z-index: 5;
  width: fit-content;
  margin: 15px auto;
  padding: 6px 12px;
  border: 4px solid var(--bg, #f7f6f2);
}
.pl-rm-day { position: relative; z-index: 2; padding: 3px 0 8px; }
.pl-rm-date {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: fit-content;
  min-height: 32px;
  margin: 0 auto 5px;
  padding: 4px 10px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #f2eee8;
  color: #5c554d;
  box-shadow: 0 0 0 1px #ddd5cb, 0 5px 13px rgba(61, 48, 35, .07);
}
.pl-rm-date > b { color: var(--ink); font-size: .83rem; font-weight: 950; line-height: 1; }
.pl-rm-date > span { margin: 0; font-size: .65rem; font-weight: 850; }
.pl-rm-date > small {
  padding-inline-start: 6px;
  border-inline-start: 1px solid #d8d0c5;
  color: var(--orange);
  font-size: .6rem;
  font-weight: 900;
}
.pl-rm-day-list { display: grid; gap: 2px; }
.pl-rm-item,
.pl-rm-item.pl-rm-start,
.pl-rm-item.pl-rm-end {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
  align-items: start;
  width: 100%;
  min-height: 68px;
  margin: 0;
  padding: 4px 0;
  direction: ltr;
}
.pl-rm-item .pl-rm-node {
  position: relative;
  inset: auto;
  top: 0;
  z-index: 4;
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  width: 48px;
  height: 48px;
  border: 4px solid #fff;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--pl-brand, var(--orange)) 48%, #fff), 0 6px 14px rgba(64, 45, 27, .11);
}
.pl-rm-logo {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: contain;
}
.pl-rm-item .pl-rm-card {
  position: relative;
  z-index: 3;
  grid-row: 1;
  width: min(100%, 350px);
  max-width: 350px;
  padding: 0;
  overflow: visible;
  cursor: default;
  border: 2px solid color-mix(in srgb, var(--pl-brand, var(--orange)) 62%, #e7ddd1);
  border-radius: 15px;
  background: #fff;
  direction: rtl;
  box-shadow: 0 8px 22px rgba(55, 42, 29, .07);
}
.pl-rm-left .pl-rm-card { grid-column: 1; justify-self: end; margin-right: 34px; }
.pl-rm-right .pl-rm-card { grid-column: 3; justify-self: start; margin-left: 34px; }
.pl-rm-card::before {
  content: "";
  position: absolute;
  top: 23px;
  z-index: -1;
  width: 72px;
  border-top: 2px solid var(--pl-brand, var(--orange));
}
.pl-rm-left .pl-rm-card::before { left: calc(100% + 1px); }
.pl-rm-right .pl-rm-card::before { right: calc(100% + 1px); }
.pl-rm-item:hover .pl-rm-card { transform: none; box-shadow: 0 12px 28px rgba(55, 42, 29, .11); }
.pl-rm-item.past .pl-rm-card { opacity: .72; filter: saturate(.78); }
.pl-rm-item.past:hover .pl-rm-card,
.pl-rm-item.next .pl-rm-card { opacity: 1; filter: none; }
.pl-rm-item.next .pl-rm-card {
  border-color: var(--pl-brand, var(--orange));
  box-shadow: 0 12px 30px color-mix(in srgb, var(--pl-brand, var(--orange)) 15%, transparent);
}
.pl-rm-card-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  width: 100%;
  min-height: 40px;
  padding: 7px 9px 5px;
  border: 0;
  border-radius: 13px 13px 0 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  text-align: start;
  cursor: pointer;
}
.pl-rm-summary {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  white-space: nowrap;
}
.pl-rm-summary i,
.pl-rm-summary em { flex: 0 0 auto; font-style: normal; font-size: .59rem; font-weight: 850; }
.pl-rm-summary i {
  padding: 2px 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--pl-brand, var(--orange)) 10%, #fff);
  color: var(--pl-brand, var(--orange));
}
.pl-rm-summary b { overflow: hidden; min-width: 0; font-size: .78rem; font-weight: 950; text-overflow: ellipsis; }
.pl-rm-summary em { color: var(--muted); }
.pl-rm-expand { display: inline-flex; align-items: center; gap: 3px; color: var(--muted); white-space: nowrap; }
.pl-rm-expand .ui-icon { width: 16px; height: 16px; transition: transform .2s ease; }
.pl-rm-expand small { font-size: .56rem; font-weight: 800; }
.pl-rm-item.on .pl-rm-expand .ui-icon { transform: rotate(180deg); }
.pl-rm-actions {
  display: flex;
  align-items: stretch;
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 0 8px 8px;
}
.pl-rm-actions .primary-button,
.pl-rm-actions .secondary-button {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  height: 31px;
  justify-content: center;
  padding-inline: 8px;
  border-radius: 9px;
  font-size: .66rem;
}
/* دکمهٔ ثبت/نمایش نتیجه: عرضِ محتوا، بدون شکستن خط */
.pl-rm-result {
  flex: 0 0 auto;
  height: 31px;
  padding-inline: 11px;
  border: 1px solid #e7ddd1;
  border-radius: 9px;
  background: #fff;
  color: #6d6357;
  font: inherit;
  font-size: .66rem;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: .15s ease;
}
.pl-rm-result:hover { border-color: var(--pl-brand, var(--orange)); color: var(--pl-brand, var(--orange)); }
.pl-rm-actions .ui-icon { width: 13px; height: 13px; }
.pl-rm-details {
  display: block;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  padding: 0 11px;
  border-top: 1px solid transparent;
  transition: max-height .28s ease, opacity .18s ease, padding .22s ease, border-color .22s ease;
}
.pl-rm-item.on .pl-rm-details {
  max-height: 1200px;
  opacity: 1;
  padding: 10px 11px 12px;
  border-top-color: #eee5da;
}

.pl-exam-head .pl-back {
  position: sticky;
  top: 8px;
  z-index: 12;
  min-height: 38px;
  margin-bottom: 11px;
  padding-inline: 12px;
  border: 1px solid #e7ddd1;
  background: rgba(255, 255, 255, .94);
  color: #514940;
  box-shadow: 0 7px 18px rgba(53, 40, 27, .07);
  backdrop-filter: blur(10px);
}
.pl-ws { grid-template-columns: minmax(0, 1fr) 280px; gap: 0; }
.pl-ws-main,
.pl-ws-card,
.pl-ws-cta {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.pl-ws-main { padding: 0 0 0 16px; }
.pl-ws-toolbar {
  margin: 0 4px 9px;
  padding: 0 0 11px;
  border-bottom: 1px solid #ede8de;
}
.pl-ws-side {
  gap: 8px;
  padding-inline-start: 16px;
  border-inline-start: 1px solid #ede8de;
}
.pl-ws-card { padding: 4px 0; }
.pl-ws-cta { padding: 8px 0 0; }
.pl-ws-copy strong { display: flex; align-items: center; gap: 6px; font-size: .92rem; }
.pl-ws-copy strong .ui-icon { width: 20px; height: 20px; color: var(--orange); }
.pl-scope-selected {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 4px 8px;
  padding: 6px 0 8px;
  border: 0;
  border-bottom: 1px solid #ede8de;
  border-radius: 0;
  background: transparent;
  overflow: hidden;
}
.pl-scope-selected > span { flex: 0 0 auto; color: #7a6e61; font-size: .7rem; font-weight: 800; }
.pl-scope-selected > span b { color: var(--orange); font-size: .84rem; }
.pl-scope-selected > div { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; }
.pl-scope-selected button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  height: 29px;
  padding: 0 8px;
  border: 1px solid #f0c9aa;
  border-radius: 999px;
  background: #fff;
  color: #6e5b4c;
  font: inherit;
  cursor: pointer;
}
.pl-scope-selected button b { font-size: .68rem; }
.pl-scope-selected button i { min-width: 18px; padding: 1px 5px; border-radius: 999px; background: var(--orange-soft); color: var(--orange); font-style: normal; font-size: .61rem; font-weight: 900; }
.pl-scope-selected button .ui-icon { width: 13px; height: 13px; color: #b26d48; }
.pl-scope-empty { margin: 0 4px 8px; padding: 8px 0 10px; border: 0; border-bottom: 1px solid #ede8de; border-radius: 0; color: var(--muted); font-size: .71rem; font-weight: 700; }
.pl-tree { gap: 0; max-height: 68vh; padding: 4px 2px; }
.pl-tree .pl-tn-ch {
  margin-inline-start: 14px;
  padding-inline-start: 8px;
  border-inline-start: 2px solid #ede8de;
}
.pl-tn-lesson {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.pl-tn-lesson > .pl-tn-row { min-height: 36px; padding: 6px 8px; border-radius: 9px; background: transparent; }
.pl-tn-lesson > .pl-tn-ch {
  margin: 0 14px 0 0;
  padding: 0 8px 0 0;
  border-inline-start: 2px solid #ede8de;
}
/* هم‌شکل با ردیف‌های پاپ‌آپ موضوعِ بانک: بدون کادر و پس‌زمینهٔ رنگی؛
   انتخاب فقط با نارنجی‌شدنِ برچسب و شمارنده دیده می‌شود. */
.pl-tn-row { min-height: 34px; padding: 6px 8px; border: 0; border-radius: 9px; background: transparent; }
.pl-tn-row:hover { background: #f5f1eb; }
.pl-tn-row.has-sel > .pl-tn-lbl { color: var(--orange); }
.pl-tn-row.has-sel > .pl-tn-arr { color: var(--orange); }
.pl-tn-leaf { cursor: default; }
.pl-tn-leaf:hover { background: #f6f2ec; }
.pl-tn-leaf.pl-tn-picked { background: transparent; }
.pl-tn-leaf.pl-tn-picked > .pl-tn-lbl { color: #c85000; font-weight: 700; }
.pl-tn-cb { display: grid; place-items: center; width: 20px; height: 20px; padding: 3px 2px; }
.pl-tn-cb input { width: 14px; height: 14px; }
.pl-tn-cnt { min-width: 36px; padding: 0; background: transparent; color: #b9b2a8; text-align: center; font-size: 10px; font-weight: 700; white-space: nowrap; }
.pl-tn-row.has-sel > .pl-tn-cnt { color: var(--orange); }
.pl-ws-lessons > li { min-height: 27px; }
.pl-ws-lessons > li button { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 7px; background: #fff1eb; color: #bf633c; cursor: pointer; }
.pl-ws-lessons > li button .ui-icon { width: 13px; height: 13px; }

.lesson-source-all { width: fit-content; color: var(--muted); font-size: 9px; font-weight: 700; }
.lesson-source-chips { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.lesson-source-chips > i { display: inline-flex; align-items: center; gap: 4px; padding: 2px 6px; border: 1px solid #e8dfd4; border-radius: 999px; background: #fff; color: #71685f; font-style: normal; font-size: 8.5px; font-weight: 750; }
.lesson-source-chip-logo { width: 17px; height: 17px; border-radius: 5px; }
.lesson-source-help { margin: 3px 0 8px; color: var(--muted); font-size: 10px; font-weight: 650; }
.lesson-source-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 7px; max-height: 280px; overflow-y: auto; padding: 3px; }
.lesson-source-option { display: flex; align-items: center; gap: 8px; min-height: 50px; padding: 7px 9px; border: 1px solid #e7ddd1; border-radius: 11px; background: #fff; cursor: pointer; transition: .15s ease; }
.lesson-source-option:hover { border-color: #efb98f; background: #fffaf6; }
.lesson-source-option.on { border-color: var(--orange); background: var(--orange-soft); box-shadow: 0 0 0 2px rgba(255, 107, 24, .08); }
.lesson-source-option input { width: 15px; height: 15px; accent-color: var(--orange); }
.lesson-source-option > span:last-child { display: grid; min-width: 0; }
.lesson-source-option b { overflow: hidden; font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.lesson-source-option small { color: var(--muted); font-size: 8.5px; }
.lesson-source-logo { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 8px; }
.lesson-source-empty { padding: 15px; border: 1px dashed var(--line); border-radius: 11px; color: var(--muted); text-align: center; font-size: 10px; }

/* هماهنگی ابعاد کنترل‌های ردیف در پنل مدیریت */
.pl-adm-actions > .row-action { min-width: 32px; width: 32px; height: 32px; padding: 0; justify-content: center; }
.pl-adm-actions > .row-action .ui-icon { width: 17px; height: 17px; }

.nav-item[data-view="exam-builder"] .nav-icon,
.nav-item[data-sview="exams"] .nav-icon { width: 21px; height: 21px; margin-inline: -1px; stroke-width: 1.9; }
/* همهٔ کنترل‌های ردیف اول/دوم هم‌قد ۴۶ پیکسل — از جمله سلکتِ داخلِ ردیفِ سری آزمون */
.pl-edit-grid .field > input,
.pl-edit-grid .field > select,
.pl-edit-grid .pl-source-row > select,
.pl-edit-grid .pro-dt-btn { height: 46px; min-height: 46px; }
.pl-date-field .pro-dt-btn > span { text-align: start; }
.pl-source-logo { width: 52px; height: 52px; flex-basis: 52px; }
.pl-bg-row > .ew-drag-handle { flex: 0 0 auto; }
.pl-bg-rank { display: grid; place-items: center; min-width: 22px; height: 22px; border-radius: 7px; background: var(--panel); border: 1px solid var(--line); font-size: .65rem; color: var(--muted); }
.pl-bg-row.dragging { opacity: .55; border-style: dashed; }
.pl-bg-sum { display: grid; gap: 3px; white-space: normal; }
.pl-bg-sum > b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 1000px) {
  .pl-ws { grid-template-columns: 1fr; }
  .pl-ws-main { padding: 0; }
  .pl-ws-side {
    position: static;
    margin-top: 14px;
    padding: 12px 0 0;
    border-inline-start: 0;
    border-top: 1px solid #ede8de;
  }
}

@media (max-width: 760px) {
  .pl-cal-grid { grid-template-columns: 1fr; }
  .pl-brandbar { align-items: flex-start; }
  .pl-brandbar-title { width: 100%; }
  .pl-brand-chips { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
  .pl-brand-chip { flex: 0 0 auto; }
  .pl-save-btn { width: 100%; justify-content: center; }
  .pl-rm-rail { inset-inline-start: 24px; transform: none; }
  .pl-rm-month { justify-content: flex-start; gap: 6px; }
  .pl-rm-month::before { flex: 0 0 24px; }
  .pl-rm-today,
  .pl-rm-date { margin-inline-start: 0; margin-inline-end: auto; }
  .pl-rm-date { min-height: 29px; padding: 3px 8px; }
  .pl-rm-item,
  .pl-rm-item.pl-rm-start,
  .pl-rm-item.pl-rm-end {
    grid-template-columns: 50px minmax(0, 1fr);
    gap: 9px;
    min-height: 62px;
    padding: 4px 0;
    direction: rtl;
  }
  .pl-rm-item .pl-rm-node { grid-column: 1; width: 44px; height: 44px; border-width: 4px; }
  .pl-rm-logo { width: 36px; height: 36px; }
  .pl-rm-left .pl-rm-card,
  .pl-rm-right .pl-rm-card {
    grid-column: 2;
    justify-self: stretch;
    width: 100%;
    max-width: none;
    margin: 0;
  }
  .pl-rm-left .pl-rm-card::before,
  .pl-rm-right .pl-rm-card::before {
    right: auto;
    left: 100%;
    width: 34px;
  }
  .pl-rm-card-main { padding: 8px 10px 5px; }
  .pl-rm-actions { padding: 0 10px 8px; }
  .pl-rm-details { padding-inline: 10px; }
  .pl-rm-item.on .pl-rm-details { padding: 9px 10px 11px; }
  .pl-scope-selected { align-items: flex-start; flex-direction: column; }
  .pl-scope-selected > div { width: 100%; }
  .lesson-source-picker { grid-template-columns: 1fr; }
  .pl-bg-row { align-items: flex-start; }
  .pl-edit-grid { grid-template-columns: 1fr; }
  .pl-edit-grid > .pl-source-field,
  .pl-edit-grid > .pl-title-field,
  .pl-edit-grid > .pl-date-field { grid-column: 1 / -1; }
}


/* ── پراکندگی سطح سؤال‌های انتخاب‌شده (پیکر آزمون شخصی و برنامه راهبردی) ── */
.ep-spread {
  margin-top: 14px; padding: 12px 13px;
  border: 1px solid var(--line); border-radius: 13px; background: var(--panel-soft);
}
.ep-spread-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.ep-spread-head span { font-size: .76rem; font-weight: 800; color: var(--ink); }
.ep-spread-head b { font-size: .74rem; font-weight: 800; color: var(--orange); }
.ep-spread-bar { display: flex; height: 26px; border-radius: 8px; overflow: hidden; background: #ece7de; }
.ep-spread-part {
  flex: 0 0 auto; width: calc(var(--ep-w) * 1%); min-width: 22px;
  display: flex; align-items: center; justify-content: center;
  font-style: normal; transition: width .2s ease;
}
.ep-spread-part b { font-size: .68rem; font-weight: 800; color: #fff; }
.ep-spread-part.lv-1 { background: #4aa96c; }
.ep-spread-part.lv-2 { background: #e0a92b; }
.ep-spread-part.lv-3 { background: #e07b39; }
.ep-spread-part.lv-4 { background: #cf4b4b; }
.ep-spread-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 9px; }
.ep-spread-legend span { display: inline-flex; align-items: center; gap: 5px; font-size: .7rem; font-weight: 700; color: var(--muted); }
.ep-spread-legend b { margin-inline-start: 2px; color: var(--ink); font-weight: 800; }
.ep-spread-legend i { width: 9px; height: 9px; border-radius: 3px; }
.ep-spread-legend .lv-1 i { background: #4aa96c; }
.ep-spread-legend .lv-2 i { background: #e0a92b; }
.ep-spread-legend .lv-3 i { background: #e07b39; }
.ep-spread-legend .lv-4 i { background: #cf4b4b; }
.ep-spread-note { margin: 0; font-size: .72rem; font-weight: 600; color: var(--muted); }
.ep-spread.empty { background: transparent; border-style: dashed; }

/* ══════ برنامه راهبردی: پوشش، شمارش معکوس، ضعف‌ها، نتیجه و مقایسه ══════ */
.pl-mode-tools { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pl-tool-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px;
  border: 1px solid var(--line); border-radius: 10px; background: #fff;
  font: inherit; font-size: .74rem; font-weight: 800; color: var(--muted); cursor: pointer; transition: .15s ease;
}
.pl-tool-btn .ui-icon { width: 15px; height: 15px; }
.pl-tool-btn:hover { border-color: var(--orange); color: var(--orange); }
.pl-tool-btn.on { background: var(--orange-soft); border-color: color-mix(in srgb, var(--orange) 40%, #fff); color: var(--orange); }

/* شمارش معکوس آزمون بعدی */
.pl-next {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 14px 16px; margin-bottom: 14px;
  background: var(--panel); border: 1px solid var(--line);
  border-inline-start: 5px solid var(--pl-brand, var(--orange));
  border-radius: var(--radius); box-shadow: var(--shadow);
}
.pl-next.hot { background: linear-gradient(90deg, #fff6f2, var(--panel) 55%); }
.pl-next-logo { width: 48px; height: 48px; }
.pl-next-main { flex: 1 1 190px; min-width: 0; }
.pl-next-eyebrow { display: block; font-size: .66rem; font-weight: 800; color: var(--pl-brand, var(--orange)); }
.pl-next-name { display: block; margin: 2px 0; font-size: .95rem; font-weight: 900; }
.pl-next-date { color: var(--muted); font-size: .72rem; font-weight: 700; }
.pl-next-count { text-align: center; padding: 0 10px; }
.pl-next-count b { display: block; font-size: 1.6rem; font-weight: 900; line-height: 1.1; color: var(--pl-brand, var(--orange)); }
.pl-next-count span { font-size: .66rem; font-weight: 700; color: var(--muted); }
.pl-next-cta { white-space: nowrap; }

/* نقاط ضعف */
.pl-weak h4 .ui-icon { color: #d8734a; }
.pl-weak-list { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 5px; }
.pl-weak-list > li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 9px; border-radius: 9px; background: #fff7f3; }
.pl-weak-list > li.bad { background: #fdf0ef; }
.pl-weak-list b { display: block; font-size: .74rem; font-weight: 800; }
.pl-weak-list small { display: block; font-size: .64rem; font-weight: 600; color: var(--muted); }
.pl-weak-list i { font-style: normal; font-size: .8rem; font-weight: 900; color: #cf4b4b; }
.pl-weak-list > li.mid i { color: #d8934a; }
.pl-weak-untouched { margin: 0 0 8px; font-size: .69rem; font-weight: 700; color: var(--muted); }
.pl-weak-empty { margin: 0; font-size: .71rem; font-weight: 600; color: var(--muted); line-height: 1.8; }
.pl-weak-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.pl-weak-actions .pl-mini-btn { flex: 1 1 auto; justify-content: center; }

/* ثبت نتیجه روی کارت خط زمانی */
.pl-rm-result.done { border-color: color-mix(in srgb, var(--teal) 50%, #fff); background: var(--teal-soft); color: #0e7f70; }
.pl-rm-result.done:hover { border-color: var(--teal); color: #0b6a5d; }
.pl-rm-compare {
  display: block; margin-top: 6px; padding: 4px 9px; border: 1px solid var(--line);
  border-radius: 8px; background: #fff; font: inherit; font-size: .62rem; font-weight: 800;
  color: var(--muted); cursor: pointer; white-space: nowrap;
}
.pl-rm-compare:hover { border-color: var(--orange); color: var(--orange); }

/* مودال ثبت نتیجه */
.pl-result-rows { display: grid; gap: 8px; margin-bottom: 12px; }
.pl-result-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 11px; background: var(--panel-soft); }
.pl-result-row b { font-size: .8rem; font-weight: 800; }
/* نشانِ درصد داخلِ خودِ کادر و سمتِ راستِ آن می‌نشیند (اول در DOM ⇒ راست در RTL) */
.pl-pct-field {
  display: inline-flex; align-items: center; gap: 0;
  border: 1px solid #e6ddd0; border-radius: 10px; background: #fff; overflow: hidden;
}
.pl-pct-field:focus-within { border-color: var(--orange); }
.pl-pct-icon {
  display: grid; place-items: center; width: 34px; height: 36px; flex: 0 0 34px;
  background: var(--orange-soft); color: var(--orange); border-inline-end: 1px solid #f0e2d4;
}
.pl-pct-icon .ui-icon { width: 15px; height: 15px; }
.pl-pct-field input { width: 84px; height: 36px; text-align: center; font-weight: 800; border: 0; background: transparent; }
.pl-pct-field input:focus { outline: none; }
/* تراز و رتبه: دو کارتِ هم‌وزن با آیکون */
.pl-result-scores { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin-top: 4px; }
.pl-score-card {
  display: flex; align-items: center; gap: 10px; cursor: text;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--panel-soft);
  border-inline-start: 4px solid var(--pl-score, var(--orange));
}
.pl-score-card.taraz { --pl-score: #2471a3; }
.pl-score-card:focus-within { border-color: var(--pl-score); background: #fff; }
.pl-score-icon { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 11px; background: color-mix(in srgb, var(--pl-score) 12%, #fff); color: var(--pl-score); }
.pl-score-icon .ui-icon { width: 18px; height: 18px; }
.pl-score-main { display: grid; gap: 1px; flex: 1 1 auto; min-width: 0; }
.pl-score-main b { font-size: .8rem; font-weight: 900; }
.pl-score-main small { font-size: .64rem; font-weight: 700; color: var(--muted); }
.pl-score-card input { width: 88px; height: 38px; flex: 0 0 88px; text-align: center; font-weight: 900; font-size: .86rem; border: 1px solid #e6ddd0; border-radius: 10px; background: #fff; }
.pl-score-card input:focus { border-color: var(--pl-score); outline: none; }
.pl-result-note { margin: 10px 0 0; font-size: .68rem; font-weight: 700; color: var(--muted); }

/* مقایسهٔ بودجه */
/* سرِ مقایسه: لوگوی هر سری در اندازهٔ واقعاً قابل دیدن */
.pl-compare-brands { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; margin-bottom: 14px; }
.pl-compare-brand {
  display: flex; align-items: center; gap: 10px; flex: 1 1 190px; min-width: 0;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--panel-soft);
  border-inline-start: 4px solid var(--pl-brand, var(--orange));
}
.pl-compare-brand b { font-size: .84rem; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-compare-brand small { font-size: .68rem; font-weight: 700; color: var(--muted); }
.pl-compare-brand > b, .pl-compare-brand > small { display: block; }
.pl-compare-brand .pl-compare-logo { flex: 0 0 auto; }
.pl-compare-top { display: flex; align-items: center; gap: 12px; padding: 12px 14px; margin-bottom: 14px; border-radius: 13px; background: var(--orange-soft); }
.pl-compare-top b { font-size: 1.5rem; font-weight: 900; color: var(--orange); }
.pl-compare-top span { font-size: .76rem; font-weight: 700; color: #7a5340; line-height: 1.7; }
.pl-compare-top span b { font-size: inherit; }
.pl-compare-top.high { background: var(--teal-soft); }
.pl-compare-top.high > b, .pl-compare-top.high span b { color: #0e7f70; }
.pl-compare-top.high span { color: #17635a; }
.pl-compare-top.low { background: #f6efe6; }
.pl-compare-block { margin-bottom: 12px; }
.pl-compare-block h4 { display: flex; align-items: center; gap: 9px; margin: 0 0 8px; font-size: .78rem; font-weight: 900; }
.pl-compare-block h4 > span { display: grid; gap: 1px; min-width: 0; }
.pl-compare-block h4 small { font-size: .66rem; font-weight: 700; color: var(--muted); }
.pl-compare-logo { width: 48px; height: 48px; flex: 0 0 48px; }
.pl-compare-block > div { display: flex; flex-wrap: wrap; gap: 6px; }
.pl-compare-block > div > span { display: inline-flex; align-items: center; gap: 6px; font-size: .7rem; font-weight: 700; color: #6d6357; background: var(--panel-soft); border: 1px solid var(--line); border-radius: 8px; padding: 4px 9px; }
.pl-compare-block > div > span i { font-style: normal; font-size: .62rem; font-weight: 900; opacity: .7; }
.pl-compare-block.shared > div > span { background: var(--teal-soft); border-color: #cdeae4; color: #0e7f70; }
.pl-compare-block em { font-size: .7rem; color: var(--muted); }
.pl-compare-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }

@media (max-width: 700px) {
  .pl-next { gap: 10px; }
  .pl-next-count { padding: 0; }
  .pl-next-cta { width: 100%; justify-content: center; }
}

/* ══════ خروجی PDF، گزارش روند، و شرکت در آزمون‌های برگزارشده ══════ */
.pl-export-range { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 12px; }
.pl-export-date > label { display: block; margin-bottom: 6px; font-size: .72rem; font-weight: 800; color: var(--ink); }
.pl-export-date .pro-dt-cell { position: relative; }
.pl-export-date .pro-dt-btn { width: 100%; }
.pl-export-quick { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 14px; }
.pl-export-preview { padding: 11px 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); }
.pl-export-preview > b { display: block; margin-bottom: 7px; font-size: .76rem; font-weight: 800; color: var(--orange); }
.pl-export-preview > b.empty { color: var(--muted); margin: 0; }
.pl-export-preview ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.pl-export-preview li { display: flex; gap: 8px; font-size: .71rem; font-weight: 700; color: #6d6357; }
.pl-export-preview li span { flex: 0 0 62px; color: var(--muted); font-weight: 800; }
.pl-export-preview li.more { color: var(--muted); font-weight: 600; }

/* گزارش روند — آکاردئونِ بالای برد؛ پیش‌فرض بسته تا صفحه بلند نشود */
.pl-report { margin: 14px 0 16px; padding: 0; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.pl-report-head {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; width: 100%;
  padding: 13px 16px; border: 0; background: transparent; font: inherit; text-align: start; cursor: pointer;
}
.pl-report-head:hover { background: var(--panel-soft); }
.pl-report-head b { display: inline-flex; align-items: center; gap: 7px; font-size: .95rem; font-weight: 900; }
.pl-report-head b .ui-icon { width: 18px; height: 18px; color: var(--orange); }
.pl-report-head small { color: var(--muted); font-size: .72rem; font-weight: 700; }
.pl-report-chev { margin-inline-start: auto; display: grid; place-items: center; color: var(--muted); transition: transform .2s ease; }
.pl-report-chev .ui-icon { width: 18px; height: 18px; }
.pl-report.open .pl-report-chev { transform: rotate(180deg); }
.pl-report-panel { display: none; padding: 0 16px 16px; }
.pl-report.open .pl-report-panel { display: block; }
/* نقطه‌ها خودشان دکمه‌اند: هالهٔ نامرئیِ ۱۱px سطحِ کلیک را بزرگ می‌کند */
.plrep-dot { cursor: pointer; }
.plrep-dot-halo { fill: transparent; }
.plrep-dot-core { transition: r .15s ease; stroke: var(--panel); stroke-width: 1.6; }
.plrep-dot:hover .plrep-dot-halo,
.plrep-dot:focus-visible .plrep-dot-halo { fill: color-mix(in srgb, var(--orange) 16%, transparent); }
.plrep-dot:hover .plrep-dot-core { r: 6; }
.plrep-dot:focus { outline: none; }
/* هشدارِ ناهم‌مقیاسیِ تراز بین سری‌ها */
.plrep-warn {
  display: flex; align-items: flex-start; gap: 7px; margin: 0 0 8px; padding: 9px 11px;
  border: 1px solid #cfe3ef; border-radius: 11px; background: #eef6fb;
  font-size: .7rem; font-weight: 700; line-height: 1.75; color: #1d5f83;
}
.plrep-warn .ui-icon { width: 15px; height: 15px; flex: 0 0 15px; margin-top: 2px; color: #2471a3; }
/* نبضِ لوگوی آزمونِ انتخاب‌شده از نمودار — بدون کادر دور کارت */
@keyframes plLogoLive {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pl-brand, var(--orange)) 45%, transparent); transform: scale(1); }
  50% { box-shadow: 0 0 0 10px color-mix(in srgb, var(--pl-brand, var(--orange)) 0%, transparent); transform: scale(1.14); }
}
.pl-logo-live { animation: plLogoLive 1.05s ease-out 3; z-index: 4; }
/* فیلترها افقی کنار هم می‌نشینند (قبلاً سه ردیفِ جدا بودند و فضای عمودیِ خالی
   می‌ساختند)؛ فقط وقتی جا کم بیاید سطر بعد می‌روند. */
.pl-report-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 6px; margin-bottom: 12px; }
.pl-report-filter-row { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pl-report-filter-row + .pl-report-filter-row { padding-inline-start: 6px; border-inline-start: 1px solid var(--line); margin-inline-start: 4px; }
.pl-report-filter-row > span { font-size: .7rem; font-weight: 800; color: var(--muted); white-space: nowrap; }
.pl-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px;
  border: 1px solid var(--line); border-radius: 999px; background: #fff;
  font: inherit; font-size: .71rem; font-weight: 800; color: var(--muted); cursor: pointer; transition: .15s ease;
}
.pl-chip i { font-style: normal; font-size: .64rem; opacity: .75; }
.pl-chip:hover { border-color: var(--pl-brand, var(--orange)); color: var(--pl-brand, var(--orange)); }
.pl-chip.on { background: color-mix(in srgb, var(--pl-brand, var(--orange)) 12%, #fff); border-color: color-mix(in srgb, var(--pl-brand, var(--orange)) 52%, #fff); color: var(--pl-brand, var(--orange)); }
.plrep-chart-wrap {
  overflow-x: auto; margin-top: 4px; padding: 6px 4px 2px;
  border: 1px solid var(--line); border-radius: 14px; background: var(--panel-soft);
}
/* viewBox ثابت + عرضِ ۱۰۰٪ ⇒ نمودار همیشه تمامِ طولِ کادر را می‌گیرد و ارتفاعش
   متناسب بالا/پایین می‌رود؛ روی موبایل به‌جای فشرده‌شدن، افقی اسکرول می‌شود. */
.plrep-chart { width: 100%; min-width: 540px; height: auto; display: block; }
.plrep-grid { stroke: #e7e1d7; stroke-width: 1; stroke-dasharray: 3 4; }
.plrep-axis { stroke: #d8d0c4; stroke-width: 1.2; }
.plrep-area { opacity: .1; }
/* `direction: ltr` لازم است: در صفحهٔ RTL معنای text-anchor برعکس می‌شود و
   عددهای محور روی خودِ نمودار می‌افتادند. عددها خنثی‌اند، پس LTR امن است. */
.plrep-ytick { fill: #a7a096; font-size: 9.5px; font-weight: 700; text-anchor: end; direction: ltr; }
.plrep-xtick { fill: #857f77; font-size: 9.5px; font-weight: 700; text-anchor: middle; }
.plrep-metrics .pl-chip { min-width: 56px; justify-content: center; }
.plrep-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; }
.plrep-legend span { display: inline-flex; align-items: center; gap: 5px; font-size: .69rem; font-weight: 700; color: var(--muted); }
.plrep-legend i { width: 9px; height: 9px; border-radius: 3px; }
.plrep-summary { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line); }
.plrep-summary > div { display: grid; gap: 2px; }
.plrep-summary span { font-size: .67rem; font-weight: 700; color: var(--muted); }
.plrep-summary b { font-size: 1.05rem; font-weight: 900; }
.plrep-summary b.good { color: #2f9e5f; }
.plrep-summary b.mid { color: #d8934a; }
.plrep-summary b.low { color: #cf4b4b; }
.plrep-summary b.up { color: #2f9e5f; }
.plrep-summary b.down { color: #cf4b4b; }
.plrep-points { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.plrep-point {
  display: grid; gap: 1px; min-width: 96px; padding: 7px 10px; text-align: center;
  border: 1px solid var(--line); border-radius: 11px; background: var(--panel-soft); font: inherit; cursor: pointer;
}
.plrep-point:hover { border-color: var(--orange); }
.plrep-point small { font-size: .62rem; font-weight: 700; color: var(--muted); }
.plrep-point b { font-size: .72rem; font-weight: 800; }
.plrep-point i { font-style: normal; font-size: .82rem; font-weight: 900; color: var(--orange); }
.plrep-empty { margin: 0; font-size: .74rem; font-weight: 700; color: var(--muted); }

/* شرکت در آزمون برگزارشده */
.pl-rm-join {
  flex: 0 0 auto; height: 31px; padding-inline: 11px;
  border: 1px solid color-mix(in srgb, var(--teal) 45%, #fff); border-radius: 9px;
  background: var(--teal-soft); color: #0e7f70; font: inherit; font-size: .66rem; font-weight: 800;
  white-space: nowrap; cursor: pointer; transition: .15s ease;
}
.pl-rm-join:hover { background: #d5f0ea; border-color: var(--teal); }
.pl-join-lessons { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 6px; }
.pl-join-lessons > li { display: flex; align-items: center; justify-content: space-between; padding: 8px 11px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); font-size: .76rem; font-weight: 700; }
.pl-join-lessons b { font-weight: 900; color: var(--orange); }
/* انتخاب کتاب‌های هر درس هنگام شرکت در آزمون برگزارشده */
.pl-join-books { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; flex: 1 1 220px; min-width: 0; }
.pl-join-book {
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
  padding: 3px 8px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--panel); font-size: .68rem; font-weight: 800; color: var(--muted);
}
.pl-join-book.on { border-color: var(--orange); background: var(--orange-soft); color: #a25528; }
.pl-join-book input { width: 13px; height: 13px; accent-color: var(--orange); margin: 0; }
.pl-join-book i { font-style: normal; font-size: .62rem; font-weight: 900; opacity: .75; }
.pl-join-row.off { opacity: .55; }
.pl-join-row.dragging { opacity: .55; }
.pl-join-section-field { margin-top: 10px; }
.pl-join-section-hint { display: block; margin-top: 6px; font-size: .66rem; font-weight: 700; color: var(--muted); }
.pl-folder-open { margin-top: 12px; }
.pl-adm-play { color: var(--teal); }
.pl-adm-idle { color: #b9b2a8; }
.pl-adm-actions .row-action.on { color: var(--teal); background: var(--teal-soft); }

/* صفحهٔ PDF خط زمانی (رندر سمت سرور با Chromium) */
.plpdf-page { position: relative; padding: 42px 44px 56px; background: #fff; font-family: "Vazirmatn", Tahoma, sans-serif; }
.plpdf-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 2px solid #ef7a3d; }
.plpdf-head h1 { margin: 0; font-size: 22px; font-weight: 900; color: #25231f; }
.plpdf-head p { margin: 5px 0 0; font-size: 12px; font-weight: 700; color: #827e75; }
.plpdf-brandmark { font-size: 12px; font-weight: 900; color: #ef7a3d; }
.plpdf-rail { position: absolute; top: 118px; bottom: 66px; inset-inline-end: 78px; width: 2px; background: #e6ddd0; }
.plpdf-rows { position: relative; display: grid; gap: 10px; margin-top: 16px; }
.plpdf-row { display: flex; align-items: stretch; gap: 14px; flex-direction: row-reverse; }
.plpdf-row.past { opacity: .62; }
.plpdf-node { flex: 0 0 42px; display: flex; align-items: center; justify-content: center; }
.plpdf-logo { width: 38px; height: 38px; border-radius: 50%; background: #fff; border: 2px solid var(--pl-brand, #ef7a3d); overflow: hidden; display: inline-flex; align-items: center; justify-content: center; padding: 3px; }
.plpdf-logo > img, .plpdf-logo > svg { width: 100%; height: 100%; object-fit: contain; }
.plpdf-card { flex: 1 1 auto; min-width: 0; padding: 10px 13px; border: 1px solid #ebe8e0; border-inline-end: 4px solid var(--pl-brand, #ef7a3d); border-radius: 11px; background: #fdfcfa; }
.plpdf-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.plpdf-card-head b { font-size: 14px; font-weight: 900; color: #25231f; }
.plpdf-card-head span { font-size: 11px; font-weight: 800; color: var(--pl-brand, #ef7a3d); white-space: nowrap; }
.plpdf-budget { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; max-height: 58px; overflow: hidden; }
.plpdf-budget li { display: flex; gap: 7px; font-size: 10.5px; line-height: 1.7; }
.plpdf-budget i { flex: 0 0 92px; font-style: normal; font-weight: 900; color: #4a443c; }
.plpdf-budget span { color: #6d6357; font-weight: 600; }
.plpdf-empty { margin: 0; font-size: 10.5px; font-weight: 600; color: #a8a29a; }
.plpdf-foot { position: absolute; inset-inline: 44px; bottom: 26px; display: flex; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid #ebe8e0; font-size: 10px; font-weight: 700; color: #a8a29a; }

/* ===================================================================
   میز کار سؤال (Question workbench) — بازطراحی «تعریف سؤال»
   نوار بالای چسبان + نوار متای یک‌ردیفه + تب‌های محتوا + ستون طبقه‌بندی
   =================================================================== */
.question-page.qw {
  width: 100%;
  max-width: none;
  padding-bottom: 24px;
}

/* ── نوار بالا: هویت سؤال، چک‌لیست ثبت و دکمه‌های ذخیره ───────────── */
.qw-topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  /* پدینگ .content را خنثی می‌کند تا نوار تمام‌عرض بچسبد */
  margin: -28px -30px 0;
  padding: 9px 30px;
  background: rgba(247, 246, 242, .93);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.qw-topbar-id { min-width: 0; }
.qw-topbar-id .breadcrumbs { font-size: 9px; margin: 0; }
.qw-topbar-id h1 { margin: 2px 0 0; font-size: 17px; white-space: nowrap; }
.qw-topbar-actions { display: flex; align-items: center; gap: 8px; }
.qw-topbar .primary-button,
.qw-topbar .secondary-button { min-height: 34px; padding: 6px 13px; font-size: 10.5px; }
.qw-ghost-btn {
  height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 700;
  cursor: pointer;
}
.qw-ghost-btn:hover { background: #efece5; color: var(--ink); }

/* ── چک‌لیست ثبت: دقیقاً همان شرط‌های اعتبارسنجی ذخیره ───────────── */
.qw-ready { display: flex; align-items: center; justify-content: center; gap: 9px; min-width: 0; }
.qw-ready-label {
  flex: 0 0 auto;
  padding: 5px 11px;
  border-radius: 99px;
  background: var(--orange-soft);
  color: #d9570e;
  font-size: 9.5px;
  font-weight: 800;
  white-space: nowrap;
}
.qw-ready.all-done .qw-ready-label { background: var(--teal-soft); color: #168878; }
.qw-ready-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.qw-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 99px;
  background: #fff;
  color: #8a8478;
  font-size: 9.5px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  transition: .14s;
}
.qw-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #d8d3c8; transition: .14s; }
.qw-chip.done { border-color: #bfe6dd; background: var(--teal-soft); color: #168878; }
.qw-chip.done::before { background: var(--teal); }
.qw-chip:hover { border-color: var(--orange); color: #d9570e; }

/* ── نوار متا: نوع، سطح دشواری و پوشه در یک ردیف ────────────────── */
.qw-meta {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin: 14px 0 12px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 5px 18px rgba(46, 39, 29, .03);
}
.qw-meta-cell { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
.qw-meta-grow { flex: 1 1 auto; }
.qw-meta-cell > label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
}
.qw-auto-flag {
  padding: 2px 7px;
  border-radius: 99px;
  background: var(--teal-soft);
  color: #168878;
  font-size: 8px;
  font-weight: 800;
  cursor: help;
}
.qw-folder-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid #cfe9e3;
  border-radius: 11px;
  background: var(--teal-soft);
  color: #157a6c;
  font-size: 10.5px;
  font-weight: 800;
}
.qw-folder-chip .ui-icon { width: 14px; height: 14px; }

.qw-seg {
  display: inline-flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f6f4ee;
}
.qw-seg-wrap { flex-wrap: wrap; }
.qw-seg-btn {
  display: inline-flex;
  align-items: center;
  height: 30px;
  padding: 0 14px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #6b6659;
  font-size: 10.5px;
  font-weight: 700;
  cursor: pointer;
  transition: .14s;
}
.qw-seg-btn:hover { background: #ebe7dd; color: var(--ink); }
.qw-seg-btn.on {
  background: #fff;
  color: #d9570e;
  box-shadow: 0 2px 7px rgba(46, 39, 29, .09);
}

/* ── چیدمان دوستونی: محتوا + طبقه‌بندی ─────────────────────────── */
.qw-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(272px, 25%, 344px);
  gap: 14px;
  align-items: start;
}
.question-form-main.qw-main { display: block; gap: 0; }

/* ── تب‌های محتوا ─────────────────────────────────────────────── */
.qw-tabbar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 15px 15px 0 0;
  background: #fbfaf7;
}
.qw-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: #6b6659;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  transition: .14s;
}
.qw-tab:hover { background: #f1eee7; color: var(--ink); }
.qw-tab.on {
  background: #fff;
  border-color: var(--line);
  color: var(--ink);
  box-shadow: 0 2px 8px rgba(46, 39, 29, .07);
}
.qw-tab-badge {
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: #ece9e1;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
}
.qw-tab.filled .qw-tab-badge { background: var(--teal-soft); color: #168878; }
.qw-tab[data-qw-required]:not(.filled) .qw-tab-badge { background: var(--orange-soft); color: #d9570e; }
.qw-tabbar-tools { margin-inline-start: auto; display: flex; align-items: center; gap: 8px; }
.qw-paste-hint {
  padding: 5px 9px;
  border-radius: 8px;
  background: #f1eee7;
  color: var(--muted);
  font-size: 8.5px;
  font-weight: 700;
  white-space: nowrap;
}
.qw-add-btn { min-height: 32px; padding: 6px 11px; font-size: 10px; border-radius: 9px; }
.qw-ai-btn {
  min-height: 32px;
  gap: 6px;
  padding: 6px 11px;
  border-color: #c9b9ef;
  border-radius: 9px;
  background: linear-gradient(135deg, #f7f3ff, #fff8f1);
  color: #6549a7;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}
.qw-ai-btn:hover { border-color: #9f82df; background: #f1eaff; color: #53348f; }
.qw-ai-btn .ui-icon { width: 13px; height: 13px; }

.qw-panel {
  padding: 12px;
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 15px 15px;
  background: rgba(255, 255, 255, .92);
}
.qw-scope-note { margin: 0 0 10px; }

/* ── مقایسهٔ تصویر و خروجی رونویسی هوشمند ───────────────────────── */
.qai-head > div { min-width: 0; }
.qai-head p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.qai-review { display: grid; gap: 12px; background: #f8f6f1; }
.qai-summary { display: flex; flex-wrap: wrap; gap: 8px; }
.qai-summary > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 10px;
  border: 1px solid #d8e8e2;
  border-radius: 99px;
  background: #f2fbf8;
  color: #527067;
  font-size: 9.5px;
  font-weight: 750;
}
.qai-summary > span b { color: #187b6c; font-size: 10.5px; }
.qai-summary.needs-review > span:first-child { border-color: #f0d2ad; background: #fff7eb; color: #8b6837; }
.qai-summary.needs-review > span:first-child b { color: #bf6a1d; }
.qai-warnings {
  display: grid;
  gap: 5px;
  padding: 9px 12px;
  border: 1px solid #efd3ad;
  border-radius: 11px;
  background: #fff9ef;
  color: #795a30;
  font-size: 10px;
}
.qai-warnings strong { display: flex; align-items: center; gap: 5px; color: #aa621d; }
.qai-warnings strong .ui-icon { width: 13px; height: 13px; }
.qai-warnings ul { margin: 0; padding-inline-start: 20px; line-height: 1.8; }
.qai-compare { display: grid; grid-template-columns: minmax(250px, 34%) minmax(0, 1fr); gap: 12px; align-items: start; }
.qai-source,
.qai-output { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.qai-source > header,
.qai-output > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
  background: #fcfbf8;
}
.qai-source > header strong,
.qai-output > header strong { font-size: 11.5px; }
.qai-source > header small,
.qai-output > header small { color: var(--muted); font-size: 8.5px; }
.qai-source > div { display: grid; gap: 9px; max-height: 66vh; overflow: auto; padding: 10px; }
.qai-source figure { margin: 0; overflow: hidden; border: 1px solid #e7dfd3; border-radius: 10px; background: #f3f0e9; }
.qai-source img { display: block; width: 100%; max-height: 58vh; object-fit: contain; background: #ece8df; }
.qai-source figcaption { padding: 6px 8px; color: var(--muted); font-size: 8.5px; overflow-wrap: anywhere; }
.qai-output { max-height: 70vh; overflow-y: auto; }
.qai-section { padding: 12px 14px; }
.qai-section + .qai-section { border-top: 1px solid #ece6dc; }
.qai-section > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.qai-section > header label { display: flex; align-items: center; gap: 7px; color: #554d42; font-size: 10.5px; font-weight: 850; cursor: pointer; }
.qai-section > header input { width: 15px; height: 15px; accent-color: var(--teal); }
.qai-section > header small { padding: 3px 7px; border-radius: 7px; background: #f3f0e9; color: var(--muted); font-size: 8.5px; }
.qai-render { padding: 10px 12px; border: 1px dashed #ded5c8; border-radius: 10px; background: #fffdfa; font-size: 12px; }
.qai-render .mktable { max-width: 100%; }
.qai-options { display: grid; gap: 7px; }
.qai-option { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; align-items: start; padding: 8px; border: 1px solid #e8e1d6; border-radius: 10px; background: #fffdfa; }
.qai-option > b { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: #efebe3; color: #756c5f; }
.qai-option.is-correct { border-color: #9ed8cc; background: #f1fbf8; }
.qai-option.is-correct > b { background: var(--teal); color: #fff; }
.qai-option > div { min-width: 0; line-height: 2; }
.qai-keep-source { display: flex; align-items: flex-start; gap: 9px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: #fff; cursor: pointer; }
.qai-keep-source input { margin-top: 3px; accent-color: var(--teal); }
.qai-keep-source span { display: grid; gap: 2px; }
.qai-keep-source b { font-size: 10.5px; }
.qai-keep-source small { color: var(--muted); font-size: 8.5px; line-height: 1.7; }
.qai-footer { gap: 10px; }
.qai-footer > span { flex: 1; color: var(--muted); font-size: 9px; text-align: center; }
.qai-loading { display: grid; gap: 14px; justify-items: center; padding-block: 26px; }
.qai-loader { display: grid; justify-items: center; gap: 6px; text-align: center; }
.qai-loader > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #f0e9ff; color: #6845ad; animation: qaiSpin 1.25s linear infinite; }
.qai-loader > span .ui-icon { width: 22px; height: 22px; }
.qai-loader b { color: #54486c; font-size: 12.5px; }
.qai-loader small { color: var(--muted); font-size: 9.5px; }
.qai-loading-images { display: flex; justify-content: center; gap: 8px; max-width: 100%; overflow-x: auto; }
.qai-loading-images img { width: 118px; height: 88px; object-fit: contain; border: 1px solid var(--line); border-radius: 9px; background: #f2efe9; }
@keyframes qaiSpin { to { transform: rotate(360deg); } }

@media (max-width: 820px) {
  .qai-compare { grid-template-columns: 1fr; }
  .qai-source > div { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); max-height: 38vh; }
  .qai-source img { max-height: 32vh; }
  .qai-output { max-height: none; }
  .qai-footer > span { display: none; }
}

/* ── ناحیهٔ تصویر ─────────────────────────────────────────────── */
.qw-media { margin: 0; border: 0; border-radius: 0; overflow: visible; background: transparent; }
.qw-drop { margin: 0; min-height: 78px; padding: 12px 16px; }
.qw-drop.compact { min-height: 54px; padding: 9px 14px; }
.question-page .qw-media-list {
  padding: 10px 0 0;
  gap: 10px;
  /* حداقل عریض تا تصویرها ریز نشوند؛ یک تصویر تمام‌عرض می‌ماند */
  grid-template-columns: repeat(auto-fit, minmax(430px, 1fr));
  align-items: start;
  justify-items: start;
}
/* کارت به عرض خودِ تصویر جمع می‌شود تا دو طرفش کادر سفید نیفتد */
.qw-media .media-card { width: fit-content; max-width: 100%; }
/* تصویر دقیقاً با همان برشی که ساخته شده دیده می‌شود: بدون سقف ارتفاع و بدون
   letterbox. سقفِ ارتفاع + object-fit:contain باعث می‌شد تصویرهای بلند کوچک
   شوند و دو طرفشان کادر سفید بیفتد؛ حالا نسبت ابعاد طبیعی حفظ می‌شود و بزرگ‌تر
   از اندازهٔ واقعی هم کشیده نمی‌شود. */
.qw-media .media-card img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: none;
  object-fit: unset;
  margin-inline: auto;
}
.qw-media .media-card-body { display: flex; align-items: center; gap: 7px; padding: 7px; }
.qw-media .media-card-body input { flex: 1 1 auto; height: 28px; font-size: 9.5px; }
.qw-media .image-dimensions { margin: 0; padding: 5px 8px; font-size: 8.5px; white-space: nowrap; }
.order-btn.danger:hover:not(:disabled) { border-color: var(--red); color: var(--red); background: var(--red-soft); }

/* ── ردیف‌های درون‌پنلی (چیدمان پاسخ تشریحی) ───────────────────── */
.qw-inline-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 0 0 11px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfaf7;
}
.qw-inline-label { display: flex; flex-direction: column; font-size: 10.5px; font-weight: 700; }
.qw-inline-label small { color: var(--muted); font-size: 8.5px; font-weight: 500; }
.qw-inline-note { color: var(--muted); font-size: 8.5px; }
.qw-layout-ico {
  display: inline-flex;
  gap: 1.5px;
  width: 13px;
  height: 11px;
  margin-inline-end: 6px;
}
.qw-layout-ico.is-horizontal { flex-direction: column; }
.qw-layout-ico b { flex: 1; border-radius: 1px; background: #cfc9bd; }
.qw-seg-btn.on .qw-layout-ico b { background: #ffb07e; }

/* ── گزینهٔ صحیح: یک نوار افقی زیر تصویر صورت سؤال ─────────────── */
.qw-correct {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 12px;
  padding: 10px 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfaf7;
}
.qw-correct.empty { border-color: #f4cdad; background: var(--orange-soft); }
.qw-correct-picker { display: flex; gap: 7px; }
.qw-correct-btn {
  width: 44px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: .14s;
}
.qw-correct-btn:hover { border-color: #8fd0c4; background: #f3fffd; }
.qw-correct-btn.on { border-color: var(--teal); background: var(--teal); color: #fff; box-shadow: 0 4px 12px rgba(26, 163, 146, .28); }

/* ── ستون طبقه‌بندی ───────────────────────────────────────────── */
/* بدون اسکرول داخلی و بدون sticky: ستون همراه خودِ صفحه بالا و پایین می‌رود،
   پس چرخ ماوس هرجای صفحه — از جمله روی همین ستون — یکسان کار می‌کند.
   کل فرم حالا تقریباً یک صفحه است، پس چسبان‌بودن چیزی اضافه نمی‌کرد و فقط
   اسکرول را دو تکه می‌کرد. برای پریدن به هر بخش، چیپ‌های چک‌لیست بالا هستند. */
.qw-side { align-self: start; }
.qw-card {
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255, 255, 255, .92);
  overflow: hidden;
}
.qw-card + .qw-card,
.qw-side .book-tags + .qw-card,
.qw-card + .book-tags { margin-top: 10px; }
.qw-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
  background: #fbfaf7;
}
.qw-card-head strong { font-size: 11.5px; }
.qw-card-count {
  min-width: 21px;
  height: 21px;
  padding: 0 6px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: #ece9e1;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
}
.qw-card-count.on { background: var(--teal-soft); color: #168878; }
.qw-card-hint {
  margin-inline-start: auto;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 8.5px;
}
.qw-card-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-inline-start: auto;
  height: 27px;
  padding: 0 10px;
  border: 1px solid #f2d4bd;
  border-radius: 8px;
  background: var(--orange-soft);
  color: #d9570e;
  font-size: 9.5px;
  font-weight: 800;
  cursor: pointer;
  transition: .14s;
}
.qw-card-action:hover { background: var(--orange); color: #fff; border-color: var(--orange); }
.qw-card-action .ui-icon { width: 12px; height: 12px; }
.qw-card-body { padding: 10px 12px; }
.qw-empty { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.9; }
.qw-note {
  width: 100%;
  min-height: 54px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fdfcfa;
  font-size: 10px;
  resize: vertical;
}

.qw-topic-chips { display: flex; flex-direction: column; gap: 5px; }
.qw-topic-chip {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8f6f1;
}
.qw-topic-chip b { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.qw-topic-chip i {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
}
.qw-topic-chip > button {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.qw-topic-chip > button:hover { background: var(--red-soft); color: var(--red); }
.qw-topic-chip > button .ui-icon { width: 11px; height: 11px; }

/* ── معادل مبحث در پایه/رشتهٔ دیگر (کارت طبقه‌بندی) ─────────── */
.qw-eq-mini {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 8.5px;
}
.qw-eq-mini .ui-icon { width: 11px; height: 11px; }
.qw-eq-note { margin: 0 0 8px; color: var(--muted); font-size: 8.5px; line-height: 1.85; }
/* «انتخاب همه»: میان‌بُرِ تیک‌زدنِ همهٔ پیشنهادها، داخل بدنهٔ کارت می‌ماند تا
   نوار سر کارت (ستون باریکِ ۲۷۲px) دو دکمه‌ای و شکسته نشود. */
.qw-eq-bulk {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 8.5px;
}
.qw-eq-bulk > button {
  margin-inline-start: auto;
  height: 22px;
  padding: 0 9px;
  border: 1px solid #b9e0d7;
  border-radius: 7px;
  background: var(--teal-soft);
  color: #168878;
  font-family: inherit;
  font-size: 8.5px;
  font-weight: 800;
  cursor: pointer;
  transition: .14s;
}
.qw-eq-bulk > button:hover { background: #d7f0ea; }
.qw-eq-bulk > button[data-equiv-all="off"] { border-color: var(--line); background: #f4f2ec; color: var(--muted); }
.qw-eq-group + .qw-eq-group { margin-top: 9px; padding-top: 9px; border-top: 1px dashed var(--line); }
.qw-eq-src {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 5px;
  min-width: 0;
}
.qw-eq-src b { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9.5px; }
.qw-eq-src i {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
}
.qw-eq-row {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fdfcfa;
  cursor: pointer;
  transition: .14s;
}
.qw-eq-row + .qw-eq-row { margin-top: 5px; }
.qw-eq-row:hover { border-color: #cfe9e3; background: #f8fdfc; }
.qw-eq-row.on { border-color: #b9e0d7; background: #f2fbf9; }
.qw-eq-row > input { flex: 0 0 auto; width: 13px; height: 13px; accent-color: #17a68b; cursor: pointer; }
.qw-eq-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.qw-eq-main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9.5px; }
.qw-eq-main i {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
}
.qw-eq-tag {
  flex: 0 0 auto;
  padding: 2px 6px;
  border-radius: 6px;
  background: #ece9e1;
  color: var(--muted);
  font-size: 7.5px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}
.qw-eq-tag.is-link { background: var(--teal-soft); color: #168878; }
.qw-eq-unlink {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.qw-eq-unlink:hover { background: var(--red-soft); color: var(--red); }
.qw-eq-unlink .ui-icon { width: 11px; height: 11px; }

.qw-source-list { display: flex; flex-direction: column; gap: 8px; }
.qw-source-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fdfcfa;
}
.qw-source-row.primary { border-color: #cfe9e3; background: #f6fdfb; }
.qw-source-row select,
.qw-source-row input {
  width: 100%;
  min-width: 0;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-size: 9.5px;
}
.qw-source-row .qw-source-main { grid-column: 1 / span 2; }
.qw-source-row .qw-row-remove { grid-column: 3; grid-row: 1; }
.qw-source-row .qw-primary-pick { grid-column: 3; grid-row: 2; }
.qw-primary-pick {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 32px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.qw-source-row.primary .qw-primary-pick { border-color: var(--teal); background: var(--teal-soft); color: #157a6c; }
.qw-primary-pick input { accent-color: var(--teal); margin: 0; }
.qw-row-remove {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
}
.qw-row-remove:hover { border-color: var(--red); background: var(--red-soft); color: var(--red); }
.qw-row-remove .ui-icon { width: 12px; height: 12px; }

.qw-tag-selector { display: flex; flex-wrap: wrap; gap: 5px; }
.qw-side .book-tags {
  margin: 10px 0 0;
  padding: 10px 12px;
  border-radius: 15px;
  background: rgba(255, 255, 255, .92);
}
.qw-side .book-tags-head { margin-bottom: 8px; }

.qw-flash { animation: qwFlash .9s ease; }
@keyframes qwFlash {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 107, 24, 0); }
  30% { box-shadow: 0 0 0 4px rgba(255, 107, 24, .22); }
}

@media (max-width: 1280px) {
  .qw-topbar { grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; }
  .qw-ready { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
}
@media (max-width: 1360px) {
  .qw-paste-hint { display: none; }
}
@media (max-width: 1120px) {
  .qw-layout { grid-template-columns: minmax(0, 1fr); }
  .qw-card + .qw-card { margin-top: 10px; }
}
@media (max-width: 720px) {
  .qw-topbar { margin: -20px -16px 0; padding: 9px 16px; grid-template-columns: minmax(0, 1fr) auto; }
  /* در موبایل فقط شمارندهٔ چک‌لیست می‌ماند تا نوار چسبان ارتفاع نگیرد */
  .qw-ready { grid-column: 1 / -1; grid-row: 2; }
  .qw-ready-chips { display: none; }
  .qw-topbar-actions { grid-column: 2; grid-row: 1; flex-wrap: wrap; justify-content: flex-end; }
  .qw-topbar-actions .qw-ghost-btn { display: none; }
  .qw-topbar-id h1 { font-size: 15px; }
  .qw-tabbar { flex-wrap: wrap; }
  .qw-tabbar-tools { margin-inline-start: 0; width: 100%; }
  .qw-meta { gap: 10px; }
  .qw-source-row { grid-template-columns: minmax(0, 1fr) auto; }
  .qw-source-row .qw-source-main { grid-column: 1 / span 2; }
}

/* ── حالت تمرکز صفحهٔ تعریف سؤال: بدون نوار ناوبری سایت ───────────── */
.app-shell.question-focus { grid-template-columns: minmax(0, 1fr); }
.app-shell.question-focus > .sidebar,
.app-shell.question-focus > .sidebar-backdrop { display: none; }
/* دکمهٔ منوی موبایل بدون نوار ناوبری کاری نمی‌کند، پس مخفی می‌شود */
.app-shell.question-focus #menuToggle { display: none; }

/* ستون طبقه‌بندی سمت راست (ابتدای جریان RTL) و محتوا سمت چپ */
.qw-layout { direction: rtl; }
.qw-side { grid-column: 1; grid-row: 1; }
.question-form-main.qw-main { grid-column: 2; grid-row: 1; }
.qw-layout { grid-template-columns: clamp(272px, 25%, 344px) minmax(0, 1fr); }

/* در حالت تک‌ستونی، محتوا بالا می‌ماند و طبقه‌بندی زیرش می‌آید */
@media (max-width: 1120px) {
  .qw-side { grid-column: 1; grid-row: 2; }
  .question-form-main.qw-main { grid-column: 1; grid-row: 1; }
}

/* ── نشانهٔ منابعِ منتقل‌شده از سؤال قبلی + دکمهٔ پیش‌نویس ─────────── */
.qw-carried-flag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 21px;
  padding: 0 8px;
  border: 1px solid #cfe9e3;
  border-radius: 99px;
  background: var(--teal-soft);
  color: #157a6c;
  font-size: 8.5px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: .14s;
}
.qw-carried-flag:hover { border-color: var(--red); background: var(--red-soft); color: var(--red); }
.qw-draft-btn {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, .8);
  color: #6b6659;
}
.qw-draft-btn:hover { border-color: var(--yellow); background: var(--yellow-soft); color: #97701a; }

/* ===== گزارش ایراد سؤال: صفحهٔ رسیدگی بازبین =====
   فهرست سؤال‌به‌سؤال با شمارندهٔ گزارش، و مودالِ دو ستونی که سؤال و
   گزارش‌های همان سؤال را کنار هم می‌گذارد. */
/* فاصلهٔ تب‌ها از خطِ زیرِ سربرگ پنل، هم‌ریتم با پدینگ ۱۹px خودِ سربرگ */
.qrep-tabs { display: flex; gap: 8px; padding: 16px 19px; flex-wrap: wrap; }
.qrep-tab {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); background: var(--panel-soft); color: var(--muted);
  border-radius: 999px; padding: 7px 14px; font-size: 11.5px; font-weight: 700;
  cursor: pointer; transition: .15s;
}
.qrep-tab i { font-style: normal; font-size: 10px; font-weight: 800; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 1px 7px; }
.qrep-tab:hover { border-color: var(--orange); color: var(--orange); }
.qrep-tab.on { background: var(--orange-soft); border-color: #f6c19a; color: #c04f0f; }
.qrep-tab.on i { background: #fff; border-color: #f6c19a; color: #c04f0f; }

/* این جدول هشت ستونِ کوتاه دارد و به min-width سراسریِ ۸۵۰px جدول‌های مشخصات
   نیاز ندارد؛ با آن، نوار اسکرول افقی همیشه زیر کادر می‌ماند در حالی که
   محتوا کاملاً جا شده است. */
.qrep-table { min-width: 560px; table-layout: fixed; }
.qrep-table td { vertical-align: middle; }
.qrep-table th:first-child, .qrep-table td:first-child { width: 62px; }
.qrep-table th:nth-child(2), .qrep-table td:nth-child(2) { width: 84px; }
.qrep-table th:nth-child(3), .qrep-table td:nth-child(3),
.qrep-table th:nth-child(4), .qrep-table td:nth-child(4),
.qrep-table th:nth-child(5), .qrep-table td:nth-child(5) { width: 11%; }
.qrep-table th:nth-child(7), .qrep-table td:nth-child(7) { width: 92px; }
.qrep-table th:last-child, .qrep-table td:last-child { width: 128px; }
.qrep-table td:nth-child(3), .qrep-table td:nth-child(4), .qrep-table td:nth-child(5) { overflow-wrap: anywhere; }
.qrep-table td:last-child button { width: 100%; justify-content: center; padding: 9px 10px; font-size: 11px; }
.qrep-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 34px; height: 26px; padding: 0 8px; border-radius: 9px;
  background: var(--red-soft); border: 1px solid #f4c9c9; color: #c2453f;
  font-size: 12.5px; font-weight: 800;
}
.qrep-count.done { background: var(--teal-soft); border-color: #bfe7e0; color: #0f7a6d; }
.qrep-reasons { display: inline-flex; flex-wrap: wrap; gap: 5px; }
.qrep-reason {
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--yellow-soft); border: 1px solid #f0dfa9; color: #8d6a10;
  border-radius: 7px; padding: 2px 7px; font-size: 10.5px; font-weight: 700;
}
.qrep-reason i { font-style: normal; font-size: 9.5px; background: #fff; border-radius: 5px; padding: 0 4px; color: #b27b00; }
.qrep-more { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.qrep-age { font-size: 11.5px; color: var(--muted); white-space: nowrap; }

.qrep-modal-grid { display: grid; grid-template-columns: minmax(0, 1fr) 288px; gap: 16px; align-items: start; }
.qrep-modal-main { display: grid; gap: 14px; min-width: 0; }
.qrep-modal-side { display: grid; gap: 14px; position: sticky; top: 0; }
.qrep-question-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.qrep-question-head small { color: var(--muted); font-size: 11px; }
.qrep-list-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.qrep-list-head h3 { margin: 0; font-size: 13px; display: flex; align-items: center; gap: 8px; }
.qrep-list-head .count { background: var(--panel-soft); border: 1px solid var(--line); border-radius: 999px; padding: 1px 9px; font-size: 10.5px; color: var(--muted); }
.qrep-cards { display: grid; gap: 10px; }
.qrep-card {
  border: 1px solid var(--line); border-radius: 14px; padding: 13px 14px;
  background: var(--panel); display: grid; gap: 9px;
  border-inline-start: 3px solid var(--yellow);
}
.qrep-card.fixed { border-inline-start-color: var(--teal); background: var(--panel-soft); }
.qrep-card.referred { border-inline-start-color: var(--orange); background: var(--panel-soft); }
.qrep-card.invalid { border-inline-start-color: var(--muted); background: var(--panel-soft); opacity: .85; }
.qrep-card-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.qrep-who { display: grid; gap: 2px; }
.qrep-who strong { font-size: 12.5px; }
.qrep-who small { color: var(--muted); font-size: 10.5px; }
.qrep-text { margin: 0; font-size: 12px; line-height: 1.9; color: #57534b; white-space: pre-wrap; }
.qrep-acts { display: grid; gap: 9px; padding-top: 3px; border-top: 1px dashed var(--line); }
.qrep-note-input {
  width: 100%; border: 1px solid var(--line); border-radius: 10px;
  padding: 8px 11px; font-size: 11.5px; font-family: inherit; background: var(--panel-soft);
}
.qrep-note-input:focus { outline: none; border-color: var(--orange); background: #fff; }
.qrep-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.qrep-buttons button { font-size: 11px; padding: 8px 12px; }
.qrep-verdict { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 11px; color: var(--muted); border-top: 1px dashed var(--line); padding-top: 8px; }
.qrep-verdict b { font-weight: 600; color: #57534b; }
.qrep-verdict button { margin-inline-start: auto; font-size: 10.5px; padding: 6px 10px; }
.qrep-reason-stats { display: grid; gap: 6px; margin-top: 4px; }
.qrep-reason-stat { display: flex; justify-content: space-between; align-items: center; font-size: 11.5px; color: #57534b; }
.qrep-reason-stat b { font-size: 11px; background: var(--panel-soft); border: 1px solid var(--line); border-radius: 7px; padding: 1px 8px; }
.qrep-side-acts { display: grid; gap: 8px; }
.qrep-side-acts button { width: 100%; justify-content: center; }

@media (max-width: 900px) {
  .qrep-modal-grid { grid-template-columns: 1fr; }
  .qrep-modal-side { position: static; }
}

/* ===== سمت کاربر: وضعیت گزارشی که خودش ثبت کرده ===== */
.sq-info-act.sq-report-pending { border-color: #f0dfa9; background: var(--yellow-soft); color: #8d6a10; }
.sq-info-act.sq-report-fixed { border-color: #bfe7e0; background: var(--teal-soft); color: #0f7a6d; }
.sq-info-act.sq-report-invalid { border-color: var(--line); background: var(--panel-soft); color: var(--muted); }

.srep-history { display: grid; gap: 9px; margin-bottom: 14px; }
.srep-history h4 { margin: 0; font-size: 12px; color: var(--muted); font-weight: 700; }
.srep-item {
  border: 1px solid var(--line); border-radius: 13px; padding: 11px 13px;
  display: grid; gap: 7px; border-inline-start: 3px solid var(--yellow); background: var(--panel-soft);
}
.srep-item.fixed { border-inline-start-color: var(--teal); }
.srep-item.invalid { border-inline-start-color: var(--muted); }
.srep-item header { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.srep-state { font-size: 11.5px; font-weight: 800; color: #8d6a10; }
.srep-item.fixed .srep-state { color: #0f7a6d; }
.srep-item.invalid .srep-state { color: var(--muted); }
.srep-item header small { color: var(--muted); font-size: 10.5px; }
.srep-reasons { display: flex; flex-wrap: wrap; gap: 5px; }
.srep-reasons b {
  background: #fff; border: 1px solid var(--line); border-radius: 7px;
  padding: 2px 7px; font-size: 10.5px; font-weight: 700; color: #57534b;
}
.srep-item p { margin: 0; font-size: 11.5px; line-height: 1.9; color: #57534b; white-space: pre-wrap; }
.srep-note { color: var(--muted); font-size: 10.5px; }


/* ═══════════════════════ پشتیبانی: تیکت، ایده، اعلان ═══════════════════════
   یک پوستهٔ مشترک (sup-*) که در پنل کاربر و پنل مدیر یکسان دیده می‌شود:
   همان چیپ‌ها، همان نشان‌های وضعیت و همان قالبِ گفت‌وگو.               */

/* ---------- سه ابزار آیکونیِ نوار بالای پنل کاربر ---------- */
.topbar-tools { display: flex; align-items: center; gap: 8px; margin-inline-start: auto; }
.topbar-tools + .topbar-profile { margin-inline-start: 10px; }
.topbar-icon {
  position: relative; width: 38px; height: 38px; flex: none;
  display: inline-grid; place-items: center; cursor: pointer;
  border: 1px solid var(--line); border-radius: 12px; background: #fff; color: #6f6a61;
  transition: background var(--motion-med, .2s) ease, color var(--motion-med, .2s) ease,
              border-color var(--motion-med, .2s) ease, transform var(--motion-fast, .14s) ease;
}
.topbar-icon svg { width: 18px; height: 18px; }
.topbar-icon:hover { background: var(--orange-soft); border-color: #f4c19a; color: #d4590f; transform: translateY(-1px); }
.topbar-icon.has-news { border-color: #f4c19a; color: #d4590f; }
.tb-badge {
  position: absolute; inset-block-start: -6px; inset-inline-start: -6px;
  min-width: 18px; height: 18px; padding: 0 5px;
  display: inline-grid; place-items: center;
  border-radius: 9px; background: var(--orange); color: #fff;
  font-size: 10px; font-weight: 800; font-style: normal;
  box-shadow: 0 3px 8px rgba(255, 107, 24, .35);
}
@media (max-width: 640px) {
  .topbar-icon { width: 34px; height: 34px; border-radius: 10px; }
  .topbar-tools { gap: 6px; }
}

/* ---------- اجزای مشترک ---------- */
.sup-chip {
  display: inline-flex; align-items: center; gap: 5px; flex: none;
  border: 1px solid #e7ded0; background: #fdf8f1; color: #7a6a54;
  border-radius: 8px; padding: 3px 8px; font-size: 10.5px; font-weight: 700;
}
.sup-chip.ghost { background: var(--panel-soft); border-color: var(--line); color: var(--muted); }
.sup-chip svg { width: 12px; height: 12px; }
.sup-chip small { color: var(--muted); font-size: 9.5px; font-weight: 600; }
.sup-badge {
  display: inline-grid; place-items: center; flex: none;
  border-radius: 8px; padding: 3px 9px; font-size: 10.5px; font-weight: 800; white-space: nowrap;
}
.sup-badge.tone-yellow { background: var(--yellow-soft); color: #a97d0a; }
.sup-badge.tone-blue   { background: var(--blue-soft); color: #3560c4; }
.sup-badge.tone-teal   { background: var(--teal-soft); color: #12856f; }
.sup-badge.tone-orange { background: var(--orange-soft); color: #cd5a10; }
.sup-badge.tone-purple { background: var(--purple-soft); color: #6b4bc0; }
.sup-badge.tone-red    { background: var(--red-soft); color: #c04747; }
.sup-badge.tone-grey   { background: #f1efe9; color: #7d7871; }
.sup-code { font-size: 11px; font-weight: 850; color: #b1560f; letter-spacing: .02em; }
.sup-time { font-size: 10.5px; color: var(--muted); white-space: nowrap; }
.sup-link, .sup-inline-link {
  color: #2f6fd0; font-weight: 700; text-decoration: none;
  border-bottom: 1px dashed rgba(47,111,208,.45); background: none; border-width: 0 0 1px; cursor: pointer; padding: 0;
}
.sup-link:hover, .sup-inline-link:hover { color: #1f52a5; border-bottom-style: solid; }
.sup-empty-line { margin: 12px 0; color: var(--muted); font-size: 12px; }
.sup-loading { display: flex; align-items: center; gap: 8px; padding: 30px; color: var(--muted); font-size: 12.5px; justify-content: center; }
.sup-loading svg { width: 16px; height: 16px; }

/* ---------- فرم‌ها ---------- */
.sup-form { display: grid; gap: 10px; }
.sup-label { font-size: 11.5px; font-weight: 800; color: #5f5a52; display: block; }
.sup-label .req { color: var(--red); margin-inline-start: 3px; }
.sup-input {
  width: 100%; border: 1px solid var(--line); border-radius: 11px; background: #fff;
  padding: 10px 12px; font-size: 12.5px; color: var(--ink); transition: border-color .16s ease, box-shadow .16s ease;
}
.sup-input:focus { outline: none; border-color: #f0b487; box-shadow: 0 0 0 3px rgba(255,107,24,.1); }
.sup-input.compact { width: auto; min-width: 150px; padding: 7px 10px; font-size: 11.5px; border-radius: 9px; }
.sup-textarea { resize: vertical; line-height: 1.95; min-height: 90px; }
.sup-chip-row { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.sup-pick {
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
  border: 1px solid var(--line); background: #fff; color: #6b665e;
  border-radius: 10px; padding: 7px 12px; font-size: 11.5px; font-weight: 700; transition: .15s ease;
}
.sup-pick svg { width: 13px; height: 13px; }
.sup-pick:hover { border-color: #f0b487; color: #c9550d; }
.sup-pick.on { background: var(--orange-soft); border-color: #f4bd93; color: #c9550d; }
.sup-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 2px; }
.sup-hint { color: var(--muted); font-size: 10.5px; line-height: 1.8; }
.sup-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.sup-inline-field { display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; color: #5f5a52; font-weight: 700; }
.secondary-button.block, .primary-button.block { width: 100%; justify-content: center; margin-top: 8px; }
.ghost-button.danger { color: var(--red); }

/* ---------- پاپ‌آپ‌ها ---------- */
.modal.medium { width: min(760px, 96vw); }
.modal.sup-modal-shell .modal-body { padding-bottom: 22px; }
.sup-modal { display: grid; gap: 16px; }
.sup-head-count { color: var(--orange); font-size: 11px; font-weight: 700; }

/* ---------- صندوق اعلان‌ها ---------- */
.sup-note-list { display: grid; gap: 10px; }
.sup-note {
  display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 11px; align-items: start;
  border: 1px solid var(--line); border-radius: 14px; padding: 12px 13px; background: var(--panel-soft);
  border-inline-start: 3px solid var(--line);
}
.sup-note.unread { background: #fff; border-inline-start-color: var(--orange); box-shadow: 0 6px 16px rgba(79,58,38,.05); }
.sup-note.tone-success.unread { border-inline-start-color: var(--teal); }
.sup-note.tone-warning.unread { border-inline-start-color: var(--yellow); }
.sup-note.tone-danger.unread { border-inline-start-color: var(--red); }
.sup-note-icon { width: 34px; height: 34px; display: inline-grid; place-items: center; border-radius: 11px; background: #fff; border: 1px solid var(--line); color: #8a8279; }
.sup-note-icon svg { width: 16px; height: 16px; }
.sup-note.tone-success .sup-note-icon { background: var(--teal-soft); border-color: #bfe6dc; color: #12856f; }
.sup-note.tone-warning .sup-note-icon { background: var(--yellow-soft); border-color: #ecd9a4; color: #a97d0a; }
.sup-note.tone-danger .sup-note-icon { background: var(--red-soft); border-color: #f2cccc; color: #c04747; }
.sup-note-body { display: grid; gap: 5px; min-width: 0; }
.sup-note-body header { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.sup-note-body header strong { font-size: 12.5px; font-weight: 800; }
.sup-note-body p { margin: 0; font-size: 12px; line-height: 2; color: #5c574f; overflow-wrap: anywhere; }
.sup-note-body footer { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sup-pin { background: var(--orange-soft); color: #c9550d; border-radius: 6px; padding: 1px 6px; font-size: 9.5px; font-weight: 800; }
.sup-note-link {
  display: inline-flex; align-items: center; gap: 4px; cursor: pointer;
  border: 1px solid #f0d0b4; background: #fff7f0; color: #c9550d;
  border-radius: 8px; padding: 4px 9px; font-size: 10.5px; font-weight: 800;
}
.sup-note-link svg { width: 12px; height: 12px; }
.sup-note-link:hover { background: var(--orange-soft); }

/* ---------- صندوق انتقاد و پیشنهاد ---------- */
.sup-hero {
  display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; align-items: start;
  border: 1px solid #ecdfc6; background: linear-gradient(180deg, #fffaf0, #fffdf9);
  border-radius: 15px; padding: 14px;
}
.sup-hero-icon { width: 42px; height: 42px; display: inline-grid; place-items: center; border-radius: 13px; background: #fff3d6; color: #b5860e; }
.sup-hero-icon svg { width: 20px; height: 20px; }
.sup-hero strong { display: block; font-size: 13px; margin-bottom: 4px; }
.sup-hero p { margin: 0; font-size: 11.5px; line-height: 2; color: #6f6960; }
.sup-redirect {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  border: 1px dashed #d8cdbb; border-radius: 13px; padding: 11px 13px; background: var(--panel-soft);
  font-size: 11.5px; line-height: 1.9; color: #6f6960;
}
.sup-redirect > svg { width: 17px; height: 17px; color: var(--yellow); flex: none; }
.sup-redirect span { flex: 1 1 240px; }
.sup-redirect .secondary-button { flex: none; }
.sup-mine h3 { margin: 0 0 10px; font-size: 12.5px; display: flex; align-items: center; gap: 7px; }
.sup-mine .count { background: var(--panel-soft); border: 1px solid var(--line); border-radius: 7px; padding: 1px 7px; font-size: 10.5px; color: var(--muted); }
.sup-fb-card { border: 1px solid var(--line); border-radius: 14px; padding: 12px 13px; background: var(--panel-soft); display: grid; gap: 8px; }
.sup-fb-card + .sup-fb-card { margin-top: 10px; }
.sup-fb-card header { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.sup-fb-card p { margin: 0; font-size: 12px; line-height: 2; color: #524d46; overflow-wrap: anywhere; }
.sup-fb-reply { border-inline-start: 3px solid var(--teal); background: #fff; border-radius: 0 11px 11px 0; padding: 9px 12px; display: grid; gap: 5px; }
.sup-fb-reply b { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #12856f; }
.sup-fb-reply b svg { width: 13px; height: 13px; }

/* ---------- صفحهٔ تیکت (پنل کاربر) ---------- */
.sup-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.sup-panel { padding: 0; overflow: hidden; }
.sup-panel > .panel-header { flex-wrap: wrap; gap: 12px; }
.sup-list { display: grid; }
.sup-row {
  display: grid; grid-template-columns: 62px minmax(0, 1fr) auto auto auto 34px;
  align-items: center; gap: 12px; text-align: start; cursor: pointer;
  padding: 13px 20px; border: 0; border-top: 1px solid var(--line); background: #fff;
  transition: background .15s ease;
}
.sup-row:first-child { border-top: 0; }
.sup-row:hover { background: var(--panel-soft); }
.sup-row.has-unread { background: #fffaf5; }
.sup-row-code { font-size: 11px; font-weight: 850; color: #b1560f; }
.sup-row-main { display: grid; gap: 3px; min-width: 0; }
.sup-row-main strong { font-size: 12.5px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-row-main small { font-size: 10.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-row-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.sup-row-time { display: grid; gap: 2px; justify-items: end; }
.sup-row-time small { font-size: 9.5px; color: var(--muted); }
.sup-row-dot {
  min-width: 22px; height: 22px; padding: 0 6px; display: inline-grid; place-items: center;
  border-radius: 11px; background: var(--orange); color: #fff; font-size: 10px; font-weight: 800; font-style: normal;
}
.sup-row-dot.ghost { background: none; color: var(--muted); }
.sup-row-dot svg { width: 15px; height: 15px; }
@media (max-width: 900px) {
  .sup-row { grid-template-columns: minmax(0, 1fr) auto; grid-auto-rows: auto; row-gap: 7px; }
  .sup-row-code { grid-column: 1; }
  .sup-row-main { grid-column: 1 / -1; }
  .sup-row-chips, .sup-row-time { grid-column: 1 / -1; justify-items: start; }
  .sup-row-time { justify-items: start; grid-auto-flow: column; gap: 8px; }
}

.sup-guide {
  display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start;
  margin: 16px 20px; padding: 13px 15px; border-radius: 14px;
  border: 1px solid #ecdfc6; background: #fffaf0;
}
.sup-guide > svg { width: 18px; height: 18px; color: var(--yellow); }
.sup-guide b { font-size: 12px; }
.sup-guide ul { margin: 7px 0 0; padding-inline-start: 17px; display: grid; gap: 5px; }
.sup-guide li { font-size: 11.5px; line-height: 1.95; color: #6f6960; }
.sup-panel > .sup-form { padding: 0 20px 20px; }

/* ---------- گفت‌وگوی تیکت ---------- */
.sup-thread-panel { padding-bottom: 20px; }
.sup-thread-head {
  display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap;
  padding: 16px 20px; border-bottom: 1px solid var(--line); background: var(--panel-soft);
}
.sup-thread-title { flex: 1 1 260px; min-width: 0; }
.sup-thread-title h2 { margin: 0 0 8px; font-size: 15px; }
.sup-thread-meta { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.sup-thread-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.sup-thread { display: grid; gap: 12px; padding: 18px 20px; }
.sup-msg { border: 1px solid var(--line); border-radius: 15px; padding: 12px 14px; display: grid; gap: 8px; max-width: 88%; }
.sup-msg.from-user { background: #fff; border-inline-start: 3px solid var(--orange); justify-self: start; }
.sup-msg.from-agent { background: #f4fbf9; border-color: #cfeae2; border-inline-end: 3px solid var(--teal); justify-self: end; }
.sup-msg header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sup-msg-who { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 800; color: #5f5a52; }
.sup-msg-who svg { width: 14px; height: 14px; color: var(--muted); }
.sup-msg.from-agent .sup-msg-who svg { color: var(--teal); }
.sup-msg-text { font-size: 12.5px; line-height: 2.05; color: #45413b; overflow-wrap: anywhere; }
.sup-sys {
  display: flex; align-items: center; gap: 8px; justify-self: center;
  font-size: 11px; color: var(--muted); background: var(--panel-soft);
  border: 1px dashed var(--line); border-radius: 20px; padding: 5px 13px;
}
.sup-sys svg { width: 13px; height: 13px; }
@media (max-width: 720px) { .sup-msg { max-width: 100%; } }

/* ---------- پیوست‌ها ---------- */
.sup-files { display: flex; flex-wrap: wrap; gap: 8px; }
.sup-file { position: relative; display: inline-flex; }
.sup-file > a {
  display: inline-flex; align-items: center; gap: 7px; text-decoration: none;
  border: 1px solid var(--line); border-radius: 10px; padding: 6px 10px; background: #fff; color: #5f5a52;
  font-size: 11px; font-weight: 700; transition: .15s ease;
}
.sup-file > a:hover { border-color: #f0b487; color: #c9550d; }
.sup-file > a svg { width: 14px; height: 14px; color: var(--muted); }
.sup-file > a small { color: var(--muted); font-size: 9.5px; font-weight: 600; }
.sup-file.is-image > a { padding: 0; border-radius: 12px; overflow: hidden; }
.sup-file.is-image img { display: block; width: 116px; height: 88px; object-fit: cover; }
.sup-file-x {
  position: absolute; inset-block-start: -6px; inset-inline-start: -6px;
  width: 20px; height: 20px; display: grid; place-items: center; cursor: pointer;
  border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--red);
  box-shadow: 0 3px 8px rgba(0,0,0,.08);
}
.sup-file-x svg { width: 11px; height: 11px; }
.sup-composer { display: grid; gap: 9px; }
.sup-composer-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sup-attach {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer; flex: none;
  border: 1px dashed #d8cdbb; border-radius: 10px; padding: 7px 12px;
  background: var(--panel-soft); color: #6f6960; font-size: 11.5px; font-weight: 700; transition: .15s ease;
}
.sup-attach:hover { border-color: #f0b487; color: #c9550d; background: #fff7f0; }
.sup-attach svg { width: 14px; height: 14px; }
.sup-reply { padding: 0 20px; }
.sup-closed-box {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 0 20px; padding: 13px 15px; border-radius: 14px;
  border: 1px solid #cfeae2; background: #f4fbf9;
}
.sup-closed-box > svg { width: 20px; height: 20px; color: var(--teal); flex: none; }
.sup-closed-box b { display: block; font-size: 12px; }
.sup-closed-box span { font-size: 11.5px; color: #6f6960; line-height: 1.9; }
.sup-closed-box > div { flex: 1 1 220px; }
/* امتیاز ستاره‌ای — «تشکر و نظر» و رضایت از پشتیبانیِ تیکت.
   پرشدن ستاره‌ها با کلاس .on از سمت JS می‌آید، نه با سلکتور خواهرِ CSS؛ در
   چیدمان راست‌به‌چپ، `~` دقیقاً برعکسِ ترتیبِ امتیاز پر می‌کرد. */
.sup-stars { display: inline-flex; align-items: center; gap: 9px; flex-wrap: wrap; font-size: 11.5px; color: #6f6960; }
.sup-stars-label { font-weight: 700; }
.sup-stars-row { display: inline-flex; align-items: center; gap: 2px; }
.sup-star {
  cursor: pointer; border: 0; background: none; padding: 2px; line-height: 0;
  color: #dcd4c6; transition: color .12s ease, transform .12s ease;
}
.sup-star svg { width: 21px; height: 21px; }
.sup-star:hover { transform: scale(1.12); }
.sup-star.on { color: var(--yellow); }
.sup-star.on svg { fill: currentColor; }
.sup-stars-value { font-size: 10.5px; font-weight: 800; color: #a97d0a; }
/* نمایش فقط‌خواندنیِ امتیازِ ثبت‌شده روی کارت نظر */
.sup-stars-static { display: inline-flex; align-items: center; gap: 1px; }
.sup-stars-static i { line-height: 0; color: #e2dbcd; }
.sup-stars-static i.on { color: var(--yellow); }
.sup-stars-static i.on svg { fill: currentColor; }
.sup-stars-static svg { width: 13px; height: 13px; }
.sup-rate-box {
  border: 1px solid #ecdfc6; background: #fffaf0; border-radius: 13px; padding: 11px 13px;
}

/* ---------- میز پشتیبانی (پنل مدیر) ---------- */
.sup-admin-panel { padding: 0; overflow: hidden; }
.sup-admin-tabs { display: flex; gap: 4px; padding: 12px 20px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.sup-tab {
  cursor: pointer; border: 0; background: none; color: var(--muted);
  padding: 9px 15px; border-radius: 11px 11px 0 0; font-size: 12px; font-weight: 800;
  border-bottom: 2px solid transparent; transition: .15s ease;
}
.sup-tab:hover { color: var(--ink); background: var(--panel-soft); }
.sup-tab.on { color: #c9550d; border-bottom-color: var(--orange); background: var(--orange-soft); }
.sup-admin-panel .panel-header { padding: 16px 20px 10px; }
.sup-admin-panel .qrep-tabs { padding-inline: 20px; }
.sup-admin-panel .table-wrap { padding: 0 8px 8px; }
.sup-panel-note { margin: 0; font-size: 11px; color: var(--muted); line-height: 1.9; flex: 1 1 260px; }
/* یادداشتی که بیرون از panel-header می‌آید پدینگِ آن را ندارد و به لبه می‌چسبید */
.sup-admin-panel > #supAdminBody > .sup-panel-note { padding: 12px 20px 0; }
.sup-admin-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sup-admin-table td { vertical-align: middle; }
.sup-admin-table tr.has-unread { background: #fffaf5; }
.sup-cell-subject { max-width: 280px; }
.sup-cell-subject strong { display: block; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-cell-subject small { display: block; font-size: 10px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-user { display: inline-grid; gap: 1px; }
.sup-user b { font-size: 11.5px; }
.sup-user small { font-size: 9.5px; color: var(--muted); }
.sup-wait { color: #cd5a10; font-size: 11px; font-weight: 800; }
.sup-admin-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.sup-admin-main { min-width: 0; }
.sup-admin-subject { margin: 0 0 8px; font-size: 15px; }
.sup-admin-main .sup-thread { padding: 14px 0; }
.sup-admin-main .sup-reply { padding: 0; }
.sup-admin-side { display: grid; gap: 14px; }
.sup-admin-side .sup-label { margin-top: 9px; }
@media (max-width: 980px) { .sup-admin-grid { grid-template-columns: minmax(0, 1fr); } }

.sup-fb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; padding: 14px 20px 20px; }
.sup-fb-admin { border: 1px solid var(--line); border-radius: 15px; padding: 13px 14px; background: #fff; display: grid; gap: 9px; align-content: start; }
.sup-fb-admin.is-new { border-color: #f0d0b4; background: #fffaf5; }
.sup-fb-admin header { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.sup-fb-text { margin: 0; font-size: 12px; line-height: 2; color: #524d46; overflow-wrap: anywhere; }
.sup-fb-who { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--muted); }
.sup-fb-who svg { width: 13px; height: 13px; }
.sup-fb-note { display: flex; align-items: center; gap: 7px; font-size: 11px; color: #6f6960; background: var(--panel-soft); border-radius: 10px; padding: 7px 10px; }
.sup-fb-note svg { width: 13px; height: 13px; color: var(--muted); }
.sup-fb-admin footer { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }

.sup-ann-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; padding: 14px 20px 20px; }
.sup-ann { border: 1px solid var(--line); border-radius: 15px; padding: 13px 14px; background: #fff; display: grid; gap: 9px; align-content: start; border-inline-start: 3px solid var(--blue); }
.sup-ann.tone-success { border-inline-start-color: var(--teal); }
.sup-ann.tone-warning { border-inline-start-color: var(--yellow); }
.sup-ann.tone-danger { border-inline-start-color: var(--red); }
.sup-ann.off { opacity: .6; }
.sup-ann header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sup-ann header strong { font-size: 12.5px; flex: 1 1 auto; }
.sup-ann p { margin: 0; font-size: 12px; line-height: 2; color: #524d46; overflow-wrap: anywhere; }
.sup-ann-meta { display: grid; gap: 5px; font-size: 10.5px; color: var(--muted); }
.sup-ann-meta span { display: flex; align-items: center; gap: 6px; }
.sup-ann-meta svg { width: 12px; height: 12px; }
.sup-ann footer { display: flex; gap: 7px; flex-wrap: wrap; }

.sup-audience { display: grid; gap: 10px; }
.sup-audience-box { border: 1px solid var(--line); border-radius: 13px; padding: 12px; background: var(--panel-soft); display: grid; gap: 9px; }
.sup-audience-box b { font-size: 11.5px; color: #5f5a52; }
.sup-user-list { display: grid; gap: 4px; max-height: 260px; overflow: auto; padding-inline-end: 4px; }
.sup-user-list .sd-check span { display: inline-flex; align-items: baseline; gap: 7px; }
.sup-user-list .sd-check small { color: var(--muted); font-size: 9.5px; }

.sup-agent-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 12px; padding: 14px 20px 20px; }
/* حالت خالی یک سلولِ گرید می‌شد و آیکون و متن به گوشه می‌چسبید؛ باید کل عرض را بگیرد */
.sup-fb-grid > .empty-state,
.sup-ann-grid > .empty-state,
.sup-agent-list > .empty-state { grid-column: 1 / -1; }
.sup-agent { border: 1px solid var(--line); border-radius: 15px; padding: 13px 14px; background: #fff; display: grid; gap: 10px; align-content: start; }
.sup-agent header { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.sup-agent-sections { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 5px; }
.sup-agent footer { display: flex; gap: 7px; flex-wrap: wrap; }

/* ===== فاصلهٔ یکدست بلوک‌های هر صفحهٔ پنل مدیریت =====
   پیش‌تر هر صفحه حاشیهٔ دلخواه خودش را روی بلوک‌های سطح‌بالا می‌گذاشت و
   بلوک‌هایی که حاشیه نداشتند به هم می‌چسبیدند. این قاعده در انتهای فایل
   می‌آید تا بر حاشیه‌های موضعی بچربد و همهٔ صفحه‌ها یک ریتم داشته باشند. */
.content > * { margin-bottom: 22px; }
.content > *:last-child { margin-bottom: 0; }

/* ═══════════════════════════════════════════════════════════════════════
   آزمون صلاحیت مدیران
   `ax-*`  → صفحهٔ جدای داوطلب (/admin-test) که پوستهٔ پنل را ندارد
   `axm-*` → صفحهٔ «تست مدیران» داخل پنل مدیر اصلی
   ═══════════════════════════════════════════════════════════════════════ */
body.ax-body { background: radial-gradient(circle at 78% -4%, rgba(255, 184, 126, .16), transparent 30rem), var(--bg); }
#adminExamRoot[hidden] { display: none; }

.ax-page { min-height: 100vh; display: flex; flex-direction: column; }
.ax-top {
  position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between;
  gap: 14px; padding: 12px 26px; background: rgba(255, 255, 255, .88); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.ax-brand { display: flex; align-items: center; gap: 10px; }
.ax-brand-mark {
  width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center;
  background: var(--orange-soft); color: var(--orange);
}
.ax-brand-mark svg { width: 19px; height: 19px; }
.ax-brand-copy { display: grid; line-height: 1.5; }
.ax-brand-copy b { font-size: 13.5px; }
.ax-brand-copy small { font-size: 10.5px; color: var(--muted); }
.ax-who { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.ax-who-name { font-size: 12.5px; font-weight: 700; }
.ax-who-role, .ax-who-progress {
  font-size: 10.5px; padding: 3px 9px; border-radius: 999px; background: var(--panel-soft);
  border: 1px solid var(--line); color: #5f5a52;
}
.ax-who-progress { background: var(--teal-soft); border-color: transparent; color: #147a6d; font-weight: 700; }

.ax-main { flex: 1 1 auto; width: min(920px, 100%); margin: 0 auto; padding: 26px 22px 60px; }
.ax-page-wide .ax-main { width: min(1500px, 100%); }

.ax-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 26px 26px 28px; display: grid; gap: 14px;
}
.ax-card-narrow { max-width: 430px; margin: 40px auto 0; }
.ax-card h1 { margin: 0; font-size: 19px; }
.ax-sub { margin: 0; font-size: 12.5px; line-height: 2; color: #5f5a52; }
.ax-note {
  margin: 0; display: flex; align-items: flex-start; gap: 8px; font-size: 11.5px; line-height: 1.9;
  color: #6b6459; background: var(--panel-soft); border: 1px dashed var(--line); border-radius: 13px; padding: 10px 12px;
}
.ax-note svg { width: 15px; height: 15px; flex: none; margin-top: 2px; color: var(--yellow); }

.ax-form { display: grid; gap: 11px; }
.ax-input {
  width: 100%; border: 1px solid var(--line); border-radius: 13px; padding: 12px 14px;
  font: inherit; font-size: 13.5px; background: var(--panel-soft); color: var(--ink);
}
.ax-input:focus { outline: none; border-color: var(--orange); background: #fff; }
.ax-code { text-align: center; letter-spacing: .55em; font-size: 20px; font-weight: 700; }
.ax-primary {
  border: none; border-radius: 13px; padding: 12px 18px; font: inherit; font-size: 13.5px; font-weight: 700;
  background: var(--orange); color: #fff; cursor: pointer; transition: filter .15s ease, opacity .15s ease;
}
.ax-primary:hover:not(:disabled) { filter: brightness(1.06); }
.ax-primary:disabled { opacity: .45; cursor: not-allowed; }
.ax-primary.ax-sm { padding: 9px 16px; font-size: 12.5px; }
.ax-ghost {
  border: 1px solid var(--line); border-radius: 11px; padding: 8px 13px; font: inherit; font-size: 11.5px;
  background: #fff; color: #5f5a52; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
  text-decoration: none;
}
.ax-ghost:hover { border-color: var(--orange); color: var(--orange); }
.ax-ghost svg { width: 14px; height: 14px; }
.ax-block { width: 100%; justify-content: center; }
.ax-link { border: none; background: none; font: inherit; font-size: 11.5px; color: var(--orange); cursor: pointer; padding: 0; }
.ax-devcode {
  font-size: 12px; text-align: center; padding: 8px; border-radius: 11px;
  background: var(--yellow-soft); color: #8a6712;
}

.ax-empty, .axm-empty {
  display: grid; justify-items: center; gap: 5px; text-align: center; padding: 26px 18px;
  border: 1px dashed var(--line); border-radius: 15px; background: var(--panel-soft); color: var(--muted);
}
.ax-empty svg, .axm-empty svg { width: 26px; height: 26px; color: var(--muted); }
.ax-empty b, .axm-empty b { font-size: 12.5px; color: #5f5a52; }
.ax-empty span, .axm-empty span { font-size: 11px; }
.axm-empty.small { padding: 16px; }

.ax-video, .axm-video { width: 100%; max-height: 60vh; border-radius: 15px; background: #14120f; }
.ax-intro-text {
  font-size: 12.5px; line-height: 2.1; color: #524d46; background: var(--panel-soft);
  border: 1px solid var(--line); border-radius: 14px; padding: 13px 15px;
}
.ax-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 9px; }
.ax-step {
  display: flex; align-items: flex-start; gap: 9px; padding: 11px 12px; border-radius: 13px;
  background: var(--panel-soft); border: 1px solid var(--line);
}
.ax-step b {
  width: 22px; height: 22px; flex: none; border-radius: 8px; display: grid; place-items: center;
  background: var(--orange-soft); color: var(--orange); font-size: 11.5px;
}
.ax-step span { font-size: 11.5px; line-height: 1.85; color: #5f5a52; }

.ax-pick-group { display: grid; gap: 9px; }
.ax-pick-group h2 { margin: 6px 0 0; font-size: 13px; color: #5f5a52; }
.ax-pick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.ax-pick {
  border: 1px solid var(--line); border-radius: 15px; padding: 15px 14px; background: #fff; cursor: pointer;
  display: grid; gap: 4px; text-align: start; font: inherit; transition: border-color .15s ease, transform .15s ease;
}
.ax-pick:hover { border-color: var(--orange); transform: translateY(-2px); }
.ax-pick.busy { opacity: .5; pointer-events: none; }
.ax-pick b { font-size: 13.5px; }
.ax-pick small { font-size: 10.5px; color: var(--muted); }

.ax-done { text-align: center; justify-items: center; }
.ax-done-mark {
  width: 54px; height: 54px; border-radius: 18px; display: grid; place-items: center;
  background: var(--teal-soft); color: var(--teal);
}
.ax-done-mark svg { width: 28px; height: 28px; }

/* ── میز کار داوطلب ── */
.ax-work { display: grid; grid-template-columns: minmax(320px, 40%) 1fr; gap: 18px; align-items: start; }
.ax-paper {
  position: sticky; top: 74px; display: grid; gap: 10px; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; box-shadow: var(--shadow);
}
.ax-paper-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ax-paper-head b { font-size: 13.5px; display: block; }
.ax-paper-head small { font-size: 10.5px; color: var(--muted); }
.ax-paper-frame { width: 100%; height: calc(100vh - 220px); min-height: 380px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }

.ax-questions { display: grid; gap: 14px; }
.ax-work-bar {
  position: sticky; top: 74px; z-index: 5; display: flex; align-items: center; gap: 11px; flex-wrap: wrap;
  background: var(--panel); border: 1px solid var(--line); border-radius: 15px; padding: 11px 14px; box-shadow: var(--shadow);
}
.ax-work-progress { flex: 1 1 140px; height: 7px; border-radius: 999px; background: var(--line); overflow: hidden; }
.ax-work-progress span { display: block; height: 100%; background: var(--teal); border-radius: 999px; transition: width .25s ease; }
.ax-work-count { font-size: 11.5px; color: #5f5a52; }

.ax-q {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 15px 16px; display: grid; gap: 12px; box-shadow: var(--shadow);
}
.ax-q.done { border-color: rgba(26, 163, 146, .45); }
.ax-q.busy { opacity: .6; pointer-events: none; }
.ax-q-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ax-q-num { font-size: 13.5px; font-weight: 700; }
.ax-q-state {
  display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; padding: 3px 9px;
  border-radius: 999px; background: var(--panel-soft); border: 1px solid var(--line); color: var(--muted);
}
.ax-q.done .ax-q-state { background: var(--teal-soft); border-color: transparent; color: #147a6d; font-weight: 700; }
.ax-q-state svg { width: 13px; height: 13px; }

.ax-q-slots { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; }
.ax-slot {
  position: relative; min-height: 150px; border: 1.5px dashed var(--line); border-radius: 14px;
  background: var(--panel-soft); display: grid; place-items: center; padding: 26px 10px 40px; cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.ax-slot:hover, .ax-slot.over { border-color: var(--orange); background: var(--orange-soft); }
.ax-slot.armed { border-color: var(--orange); border-style: solid; background: var(--orange-soft); }
.ax-slot.has-img { border-style: solid; background: #fff; padding-top: 26px; }
.ax-slot-label {
  position: absolute; inset-block-start: 8px; inset-inline-start: 11px; font-size: 10.5px;
  color: var(--muted); font-weight: 700;
}
.ax-slot-hint { display: grid; justify-items: center; gap: 3px; text-align: center; color: var(--muted); }
.ax-slot-hint svg { width: 22px; height: 22px; }
.ax-slot-hint b { font-size: 11.5px; color: #5f5a52; }
.ax-slot-hint small { font-size: 10px; }
.ax-slot-img { max-width: 100%; max-height: 260px; border-radius: 9px; display: block; }
.ax-slot-x {
  position: absolute; inset-block-start: 6px; inset-inline-end: 6px; width: 24px; height: 24px;
  border-radius: 8px; border: 1px solid var(--line); background: #fff; display: grid; place-items: center; cursor: pointer;
}
.ax-slot-x svg { width: 13px; height: 13px; color: var(--red); }
.ax-slot-pick {
  position: absolute; inset-block-end: 9px; inset-inline-start: 50%; transform: translateX(50%);
  border: 1px solid var(--line); background: #fff; border-radius: 9px; padding: 5px 12px;
  font: inherit; font-size: 10.5px; color: #5f5a52; cursor: pointer;
}
.ax-slot-pick:hover { border-color: var(--orange); color: var(--orange); }

.ax-q-field { display: grid; gap: 7px; }
.ax-q-field-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 11.5px; color: #5f5a52; font-weight: 700; }
.ax-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ax-chip-empty { font-size: 11px; color: var(--muted); }
.ax-chip {
  display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 10px; border-radius: 999px;
  background: var(--blue-soft); color: #2c4f9e; font-size: 11px; max-width: 100%;
}
.ax-chip b { font-weight: 700; }
.ax-chip small { font-size: 9.5px; opacity: .75; }

.ax-levels { display: flex; gap: 6px; flex-wrap: wrap; }
.ax-level {
  border: 1px solid var(--line); border-radius: 10px; padding: 7px 14px; font: inherit; font-size: 11.5px;
  background: #fff; color: #5f5a52; cursor: pointer; transition: all .14s ease;
}
.ax-level:hover { border-color: currentColor; }
.ax-level.lv-1.on { background: var(--teal-soft); border-color: transparent; color: #147a6d; font-weight: 700; }
.ax-level.lv-2.on { background: var(--blue-soft); border-color: transparent; color: #2c4f9e; font-weight: 700; }
.ax-level.lv-3.on { background: var(--yellow-soft); border-color: transparent; color: #8a6712; font-weight: 700; }
.ax-level.lv-4.on { background: var(--red-soft); border-color: transparent; color: #b03e3e; font-weight: 700; }

.ax-confirm-body { margin: 0; font-size: 13px; line-height: 2.1; color: #524d46; }

/* ── انتخابگر موضوع (پایهٔ دوازدهم) ── */
.ax-tp-head h2 small { display: block; font-size: 10.5px; font-weight: 400; color: var(--muted); margin-top: 3px; }
.ax-tp-search { display: flex; align-items: center; gap: 8px; padding: 12px 20px 0; }
.ax-tp-search svg { width: 16px; height: 16px; color: var(--muted); flex: none; }
.ax-tp-search input {
  flex: 1 1 auto; border: 1px solid var(--line); border-radius: 11px; padding: 9px 13px;
  font: inherit; font-size: 12.5px; background: var(--panel-soft);
}
.ax-tp-search input:focus { outline: none; border-color: var(--orange); background: #fff; }
.ax-tp-tree { max-height: min(56vh, 520px); overflow: auto; padding: 12px 20px; display: grid; gap: 2px; align-content: start; }
.ax-tp-row {
  display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 10px; cursor: pointer;
  transition: background .12s ease;
}
.ax-tp-row:hover { background: var(--panel-soft); }
.ax-tp-row.lvl-1 { font-weight: 700; font-size: 12.5px; }
.ax-tp-row.lvl-2 { font-size: 12px; }
.ax-tp-row.lvl-3 { font-size: 11.5px; color: #5f5a52; }
.ax-tp-caret svg { width: 14px; height: 14px; color: var(--muted); transition: transform .16s ease; }
.ax-tp-row.open .ax-tp-caret svg { transform: rotate(180deg); }
/* بخشِ بدون زیربخش: جای فلش خالی می‌ماند تا با بخش‌های شاخه‌دار هم‌تراز بماند */
.ax-tp-caret-blank { width: 14px; height: 14px; flex: none; }
.ax-tp-row-leaf.on { background: var(--orange-soft); color: #a04a11; font-weight: 700; }
.ax-tp-label { flex: 1 1 auto; }
.ax-tp-count { font-size: 10px; color: var(--muted); }
.ax-tp-check {
  width: 17px; height: 17px; flex: none; border-radius: 6px; border: 1.5px solid var(--line);
  background: #fff; cursor: pointer; position: relative;
}
.ax-tp-check.on { background: var(--orange); border-color: var(--orange); }
.ax-tp-check.on::after {
  content: ""; position: absolute; inset-block-start: 2px; inset-inline-start: 5px; width: 4px; height: 8px;
  border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.ax-tp-check.some { background: var(--orange-soft); border-color: var(--orange); }
.ax-tp-check.some::after {
  content: ""; position: absolute; inset-block-start: 6px; inset-inline-start: 3px;
  width: 8px; height: 2px; background: var(--orange); border-radius: 2px;
}
.ax-tp-kids { padding-inline-start: 18px; display: grid; gap: 2px; }
.ax-tp-leaf {
  display: flex; align-items: center; gap: 8px; padding: 6px 9px; border-radius: 9px;
  font-size: 11.5px; cursor: pointer; color: #5f5a52;
}
.ax-tp-leaf:hover { background: var(--panel-soft); }
.ax-tp-leaf.on { background: var(--orange-soft); color: #a04a11; font-weight: 700; }
.ax-tp-leaf input { accent-color: var(--orange); width: 15px; height: 15px; }
.ax-tp-empty { display: grid; justify-items: center; gap: 6px; padding: 34px; color: var(--muted); text-align: center; }
.ax-tp-empty svg { width: 26px; height: 26px; }
.ax-tp-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ax-tp-selected { font-size: 11.5px; color: #5f5a52; }
.ax-tp-foot-actions { display: flex; gap: 8px; }

/* ── صفحهٔ مدیر اصلی ── */
.axm { display: grid; gap: 18px; }
.axm-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.axm-head h1 { margin: 0 0 6px; font-size: 20px; }
.axm-head p { margin: 0; max-width: 620px; font-size: 12.5px; line-height: 2; color: #5f5a52; }
.axm-link {
  display: grid; gap: 6px; justify-items: start; padding: 12px 14px; border-radius: 15px;
  background: var(--panel-soft); border: 1px solid var(--line);
}
.axm-link span { font-size: 10.5px; color: var(--muted); }
.axm-link code { font-size: 12px; direction: ltr; color: var(--orange); font-weight: 700; }

.axm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 11px; }
.axm-stat {
  background: var(--panel); border: 1px solid var(--line); border-radius: 15px; padding: 14px 16px;
  display: grid; gap: 3px;
}
.axm-stat b { font-size: 21px; }
.axm-stat span { font-size: 11px; color: var(--muted); }

.axm-tabs { display: flex; gap: 7px; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.axm-tab {
  border: 1px solid var(--line); background: #fff; border-radius: 11px; padding: 8px 15px; font: inherit;
  font-size: 12.5px; color: #5f5a52; cursor: pointer; display: inline-flex; align-items: center; gap: 7px;
}
.axm-tab.on { background: var(--orange); border-color: var(--orange); color: #fff; font-weight: 700; }
.axm-tab span {
  font-size: 10px; padding: 1px 7px; border-radius: 999px; background: var(--panel-soft); color: #5f5a52;
}
.axm-tab.on span { background: rgba(255, 255, 255, .28); color: #fff; }

.axm-body { display: grid; gap: 14px; }
.axm-add {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; display: grid; gap: 11px;
}
.axm-add h2 { margin: 0; font-size: 14px; }
.axm-add > .primary-button { justify-self: start; }
.axm-add-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.axm-add-row label { flex: 1 1 180px; display: grid; gap: 5px; font-size: 11.5px; color: #5f5a52; }
.axm-add-row .primary-button { flex: 0 0 auto; height: 38px; }
.axm-hint { margin: 0; font-size: 11px; line-height: 1.95; color: var(--muted); }
.axm-input {
  width: 100%; border: 1px solid var(--line); border-radius: 11px; padding: 9px 12px;
  font: inherit; font-size: 12.5px; background: var(--panel-soft); color: var(--ink);
}
.axm-input:focus { outline: none; border-color: var(--orange); background: #fff; }
.axm-check { display: flex !important; align-items: center; gap: 8px; }
.axm-check input { accent-color: var(--orange); width: 16px; height: 16px; }

.axm-list { display: grid; gap: 9px; }
.axm-row {
  background: var(--panel); border: 1px solid var(--line); border-radius: 15px; padding: 13px 15px;
  display: grid; grid-template-columns: minmax(200px, 1.3fr) minmax(180px, 1fr) auto; gap: 12px; align-items: center;
}
.axm-row-main { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.axm-row-main b { font-size: 13px; }
.axm-row-mobile { font-size: 11.5px; color: var(--muted); }
.axm-row-role { font-size: 10.5px; padding: 2px 9px; border-radius: 999px; background: var(--panel-soft); border: 1px solid var(--line); color: #5f5a52; }
.axm-row-meta { display: flex; align-items: center; gap: 11px; flex-wrap: wrap; font-size: 11px; color: #5f5a52; }
.axm-row-meta .muted { color: var(--muted); }
.axm-row-meta a { display: inline-flex; align-items: center; gap: 5px; color: var(--blue); text-decoration: none; }
.axm-row-meta svg { width: 13px; height: 13px; }
.axm-score { font-weight: 700; color: #147a6d; }
.axm-row-actions { display: flex; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.axm-row-actions .ghost-button { padding: 7px 11px; font-size: 11px; }
.ghost-button.danger { color: var(--red); }
.ghost-button.danger:hover { border-color: var(--red); }

.axm-status { font-size: 10.5px; padding: 2px 10px; border-radius: 999px; font-weight: 700; }
.axm-status.s-invited { background: var(--panel-soft); border: 1px solid var(--line); color: var(--muted); }
.axm-status.s-started { background: var(--yellow-soft); color: #8a6712; }
.axm-status.s-submitted { background: var(--teal-soft); color: #147a6d; }
.axm-warn-inline { display: inline-flex; align-items: center; gap: 5px; color: var(--red); }
.axm-warn {
  display: flex; align-items: flex-start; gap: 8px; font-size: 11.5px; line-height: 1.9;
  background: var(--yellow-soft); color: #8a6712; border-radius: 12px; padding: 10px 12px;
}
.axm-warn svg { width: 15px; height: 15px; flex: none; margin-top: 2px; }

/* گزارش سؤال‌به‌سؤال */
.axm-detail { display: grid; gap: 12px; }
.axm-detail-stats { display: flex; gap: 11px; flex-wrap: wrap; align-items: center; }
.axm-detail-stats > div {
  display: grid; gap: 2px; padding: 10px 14px; border-radius: 13px; background: var(--panel-soft);
  border: 1px solid var(--line);
}
.axm-detail-stats b { font-size: 15px; }
.axm-detail-stats span { font-size: 10.5px; color: var(--muted); }
.axm-qrow { border: 1px solid var(--line); border-radius: 15px; padding: 13px 14px; display: grid; gap: 10px; }
.axm-qrow header { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.axm-qrow header b { font-size: 12.5px; }
.axm-verdict { font-size: 10.5px; padding: 3px 10px; border-radius: 999px; font-weight: 700; }
.axm-verdict.ok { background: var(--teal-soft); color: #147a6d; }
.axm-verdict.warn { background: var(--yellow-soft); color: #8a6712; }
.axm-verdict.bad { background: var(--red-soft); color: #b03e3e; }
.axm-verdict.muted { background: var(--panel-soft); color: var(--muted); }
.axm-qimgs { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 9px; }
.axm-qimgs a { display: grid; gap: 4px; justify-items: center; text-decoration: none; }
.axm-qimgs img { max-width: 100%; max-height: 220px; border-radius: 11px; border: 1px solid var(--line); }
.axm-qimgs small { font-size: 10px; color: var(--muted); }
.axm-noimg {
  display: grid; place-items: center; font-size: 11px; color: var(--muted); min-height: 70px;
  border: 1px dashed var(--line); border-radius: 11px;
}
.axm-compare { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 9px; }
.axm-compare > div { display: grid; gap: 5px; align-content: start; }
.axm-compare-label { font-size: 10px; color: var(--muted); }
.axm-topics { display: flex; flex-wrap: wrap; gap: 5px; }
.axm-topic { font-size: 10.5px; padding: 3px 9px; border-radius: 999px; background: var(--blue-soft); color: #2c4f9e; }
.axm-topics.key .axm-topic { background: var(--teal-soft); color: #147a6d; }
.axm-none { font-size: 11px; color: var(--muted); }
.axm-level-tag { font-size: 11px; font-weight: 700; color: #2c4f9e; }
.axm-level-tag.key { color: #147a6d; }
.axm-keynote { margin: 0; display: flex; gap: 7px; font-size: 11px; color: #6b6459; }
.axm-keynote svg { width: 14px; height: 14px; flex: none; color: var(--yellow); }
.axm-review { display: grid; gap: 6px; font-size: 11.5px; color: #5f5a52; }

/* برگه و کلید */
.axm-paper { display: grid; gap: 14px; }
.axm-paper-top { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; align-items: end; }
.axm-paper-top label { display: grid; gap: 5px; font-size: 11.5px; color: #5f5a52; }
.axm-paper-file {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 11px 13px;
  border: 1px dashed var(--line); border-radius: 13px; background: var(--panel-soft);
}
.axm-file-ok, .axm-file-none { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; }
.axm-file-ok { color: #147a6d; }
.axm-file-none { color: var(--red); }
.axm-file-ok svg, .axm-file-none svg { width: 14px; height: 14px; }
.axm-key-title { margin: 0; font-size: 13px; }
.axm-key { display: grid; gap: 8px; }
.axm-key-row {
  display: grid; grid-template-columns: 30px minmax(180px, 1fr) auto; gap: 11px; align-items: center;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 13px;
}
.axm-key-n {
  width: 26px; height: 26px; border-radius: 9px; display: grid; place-items: center;
  background: var(--panel-soft); font-size: 11.5px; font-weight: 700;
}
.axm-key-topics { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.axm-key-levels .ax-level { padding: 5px 10px; font-size: 10.5px; }

@media (max-width: 1080px) {
  .ax-work { grid-template-columns: 1fr; }
  .ax-paper { position: static; }
  .ax-paper-frame { height: 55vh; }
}
@media (max-width: 720px) {
  .ax-main { padding: 18px 14px 46px; }
  .ax-top { padding: 10px 14px; }
  .ax-card { padding: 18px 16px 20px; }
  .axm-row { grid-template-columns: 1fr; }
  .axm-row-actions { justify-content: flex-start; }
  .axm-key-row { grid-template-columns: 30px 1fr; }
  .axm-key-levels { grid-column: 1 / -1; }
}
/* پلاگین PDF مرورگر در لایهٔ ترکیب‌بندیِ خودش نقاشی می‌شود و روی پشتِ مودال
   می‌افتد؛ تا وقتی پاپ‌آپی باز است، برگه را پنهان می‌کنیم. */
body:has(.modal-root:not(:empty)) .ax-paper-frame { visibility: hidden; }
/* عنوان پاپ‌آپ‌های این بخش دو خط است: تیتر + زیرعنوانِ کم‌رنگ */
.axm-detail-modal-head h2 small,
.ax-tp-head h2 small,
.modal-head h2 small.axm-sub { display: block; margin-top: 3px; font-size: 10.5px; font-weight: 400; color: var(--muted); }

/* ------------------------------------------------------------ نسخهٔ جدید
   وقتی صفحه مشغول است (آزمون، پاپ‌آپ، فرم نیمه‌کاره) رفرش خودکار انجام نمی‌شود
   و به‌جایش این نوار پیشنهاد به‌روزرسانی می‌دهد. کنار toast-stack می‌نشیند، ولی
   z-index آن باید از modal-root (100000) بالاتر باشد وگرنه دقیقاً در همان
   حالتی که نشان داده می‌شود (پاپ‌آپ باز، رانرِ آزمون) زیر لایه گم می‌شود. */
.app-update-bar {
  position: fixed;
  left: 22px;
  bottom: 22px;
  z-index: 100050;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: min(420px, calc(100vw - 44px));
  padding: 10px 12px 10px 10px;
  border-radius: 12px;
  background: #292721;
  color: #fff;
  font-size: 11px;
  box-shadow: 0 14px 35px rgba(0, 0, 0, .24);
  border-right: 4px solid var(--teal);
  animation: toast-in .22s ease;
}
.app-update-bar .app-update-text { flex: 1; line-height: 1.7; }
.app-update-bar .app-update-apply {
  flex: none;
  padding: 6px 14px;
  border: 0;
  border-radius: 9px;
  background: var(--teal);
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.app-update-bar .app-update-apply:hover { filter: brightness(1.08); }
/* نوار «نسخهٔ جدید» نباید روی toastها بیفتد */
body:has(#appUpdateBar) .toast-stack { bottom: 74px; }
@media (max-width: 720px) {
  .app-update-bar { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}

/* جرقهٔ آزمون هوشمند: وقتی تب فعال است آرام نفس می‌کشد تا «زنده» به نظر برسد.
   عمداً کند و کم‌دامنه است؛ روی تبِ غیرفعال و برای کاربری که حرکت را کم کرده
   اصلاً اجرا نمی‌شود. */
@keyframes smx-twinkle {
  0%, 100% { opacity: 1; transform: rotate(0deg) scale(1); }
  50%      { opacity: .78; transform: rotate(-8deg) scale(1.08); }
}
.exam-hub-tab.on [href$="ai-spark"],
.exam-hub-tab.on svg:has([href$="ai-spark"]) { transform-origin: 45% 45%; }
.exam-hub-tab.on svg:has(use[href="#icon-ai-spark"]) { animation: smx-twinkle 3.4s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  .exam-hub-tab.on svg:has(use[href="#icon-ai-spark"]) { animation: none; }
}

/* ============ آزمون هوشمند ============
   پنل انتخاب درس/مبحث، پوستهٔ اجراکنندهٔ بلوکی و تب «مسیر تطبیقی» کارنامه.
   رنگ شناسهٔ این بخش بنفش است تا از آزمون شخصی (نارنجی) و جمعی (آبی) جدا بماند. */
.smx-panel { --smx: var(--purple); --smx-soft: var(--purple-soft); }
.smx-resume {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px;
  border: 1px solid #ddd0f7; border-radius: 16px;
  background: linear-gradient(180deg, var(--smx-soft), rgba(255,255,255,.6));
}
.smx-resume-icon { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border-radius: 13px; background: #fff; color: var(--smx); box-shadow: 0 6px 16px rgba(134,100,216,.18); }
.smx-resume-icon .ui-icon { width: 22px; height: 22px; }
.smx-resume-main { flex: 1; display: grid; gap: 3px; min-width: 0; }
.smx-resume-main b { font-size: 13.5px; }
.smx-resume-main span { color: var(--muted); font-size: 12px; font-weight: 700; }
.smx-resume-btns { display: flex; gap: 8px; flex: none; }

.smx-how { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; }
.smx-how-card {
  display: grid; grid-template-columns: 34px 1fr; grid-template-rows: auto auto;
  column-gap: 10px; row-gap: 2px; padding: 12px 13px;
  border: 1px solid var(--line); border-radius: 14px; background: var(--panel-soft);
}
.smx-how-card i { grid-row: 1 / span 2; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: var(--smx-soft); color: var(--smx); }
.smx-how-card i .ui-icon { width: 17px; height: 17px; }
.smx-how-card b { font-size: 12.5px; }
.smx-how-card span { color: var(--muted); font-size: 11.5px; font-weight: 700; line-height: 1.85; }

.smx-step { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.smx-step.off { opacity: .5; pointer-events: none; }
.smx-step-head { display: flex; align-items: center; gap: 11px; }
.smx-step-num {
  display: grid; place-items: center; width: 27px; height: 27px; flex: none;
  border-radius: 9px; background: var(--smx); color: #fff; font-size: 12.5px; font-weight: 800;
}
.smx-step-head b { display: block; font-size: 13.5px; }
.smx-step-head small { display: block; margin-top: 2px; color: var(--muted); font-size: 11.5px; font-weight: 700; }
.smx-lessons { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 9px; }
.smx-lesson {
  display: grid; gap: 3px; padding: 11px 13px; text-align: right;
  border: 1px solid var(--line); border-radius: 13px; background: var(--panel-soft);
  font: inherit; color: inherit; cursor: pointer; transition: border-color .15s, background .15s, transform .12s;
}
.smx-lesson:hover { transform: translateY(-1px); border-color: #d8c8f5; }
.smx-lesson b { font-size: 13px; }
.smx-lesson span { color: var(--muted); font-size: 11.5px; font-weight: 700; }
.smx-lesson.on { border-color: var(--smx); background: var(--smx-soft); box-shadow: 0 8px 20px rgba(134,100,216,.14); }
.smx-lesson.on span { color: var(--smx); }
.smx-topic-btn { justify-self: start; }
.smx-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.smx-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 6px 5px 10px;
  border: 1px solid #ddd0f7; border-radius: 999px; background: var(--smx-soft);
  font-size: 11.5px; font-weight: 700; color: #5b4a86;
}
.smx-chip button { display: grid; place-items: center; width: 17px; height: 17px; padding: 0; border: 0; border-radius: 50%; background: rgba(134,100,216,.16); color: #5b4a86; cursor: pointer; }
.smx-chip button .ui-icon { width: 11px; height: 11px; }
.smx-empty { margin: 0; color: var(--muted); font-size: 12px; font-weight: 700; }

.smx-launch { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.smx-launch-stat { display: flex; gap: 16px; flex-wrap: wrap; color: var(--muted); font-size: 12.5px; font-weight: 700; }
.smx-launch-stat span { display: inline-flex; align-items: center; gap: 6px; }
.smx-launch-stat b { color: var(--ink); font-size: 14px; }
.smx-launch-stat .ui-icon { width: 15px; height: 15px; }
.smx-start { min-width: 200px; }

.smx-history { display: grid; gap: 10px; padding-top: 4px; border-top: 1px dashed var(--line); }
.smx-history h3 { display: flex; align-items: center; gap: 7px; margin: 8px 0 0; font-size: 14px; }
.smx-history h3 .ui-icon { width: 17px; height: 17px; color: var(--smx); }
.smx-history-rows { display: grid; gap: 7px; }
.smx-history-row {
  display: grid; grid-template-columns: minmax(0,1fr) auto auto auto auto auto;
  align-items: center; gap: 12px; padding: 9px 13px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft);
}
.smx-hr-main { display: grid; gap: 2px; min-width: 0; }
.smx-hr-main b { font-size: 12.5px; }
.smx-hr-main small { color: var(--muted); font-size: 11px; font-weight: 700; }
.smx-hr-stat { color: var(--muted); font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.smx-hr-pct { color: var(--ink); font-size: 13px; font-weight: 800; }
.smx-hr-delta { font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.smx-hr-delta.up { color: var(--teal); }
.smx-hr-delta.down { color: var(--red); }

/* ---- اجراکننده در حالت هوشمند ---- */
.exam-runner-smart .er-title strong { display: inline-flex; align-items: center; gap: 7px; }
.exam-runner-smart .er-title strong .ui-icon { width: 18px; height: 18px; color: var(--purple); }
.smx-run-progress { display: inline-flex; align-items: center; gap: 10px; color: var(--muted); font-size: 12px; font-weight: 700; }
.smx-run-progress b { color: var(--ink); font-size: 13.5px; }
.smx-run-progress i { width: 4px; height: 4px; border-radius: 50%; background: currentColor; opacity: .45; }
.smx-info-card .er-info-row i { color: var(--purple); }
.smx-clock { display: grid; gap: 2px; justify-items: center; padding: 12px 0 6px; }
.smx-clock b { font-size: 26px; font-weight: 800; letter-spacing: .5px; font-variant-numeric: tabular-nums; }
.smx-clock span { color: var(--muted); font-size: 11px; font-weight: 700; }
.smx-clock.time-hidden b { filter: blur(9px); user-select: none; }
.smx-run-actions { display: grid; gap: 7px; padding: 12px 12px 12px; border-top: 1px solid var(--line); }
.smx-block-progress { height: 6px; border-radius: 999px; background: var(--line); overflow: hidden; }
.smx-block-progress span { display: block; height: 100%; border-radius: 999px; background: var(--purple); transition: width .25s ease; }
.smx-block-note { color: var(--muted); font-size: 11px; font-weight: 700; text-align: center; }
.smx-continue { display: inline-flex; align-items: center; justify-content: center; gap: 5px; width: 100%; background: var(--purple); }
.smx-continue:hover:not(:disabled) { filter: brightness(1.07); }
.smx-continue .ui-icon { width: 15px; height: 15px; }
.smx-finish { width: 100%; }

.smx-gate { display: grid; gap: 10px; }
.smx-gate-row { display: grid; grid-template-columns: 36px 1fr; gap: 11px; align-items: start; padding: 12px 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--panel-soft); }
.smx-gate-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: var(--yellow-soft); color: var(--yellow); }
.smx-gate-spam .smx-gate-icon { background: var(--red-soft); color: var(--red); }
.smx-gate-row b { display: block; font-size: 12.5px; font-weight: 700; line-height: 2; }
.smx-gate-nums { display: block; margin-top: 5px; color: var(--muted); font-size: 11.5px; font-weight: 800; }
.smx-autofinish { display: grid; gap: 10px; justify-items: center; text-align: center; padding: 8px 0; }
.smx-autofinish-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 17px; background: var(--purple-soft); color: var(--purple); }
.smx-autofinish-icon .ui-icon { width: 27px; height: 27px; }
.smx-autofinish p { margin: 0; line-height: 2; font-size: 13px; }

/* ---- کارنامه: تب مسیر تطبیقی ---- */
.smx-report { display: grid; gap: 16px; }
.smx-report-stats { grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); }
.smx-stop-note { display: flex; align-items: center; gap: 9px; padding: 11px 14px; border: 1px solid #e6dcf7; border-radius: 13px; background: var(--purple-soft); color: #4f4173; font-size: 12.5px; font-weight: 700; line-height: 1.9; }
.smx-stop-note .ui-icon { width: 18px; height: 18px; flex: none; color: var(--purple); }
.smx-report-card { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.smx-card-head b { display: block; font-size: 13.5px; }
.smx-card-head small { display: block; margin-top: 3px; color: var(--muted); font-size: 11.5px; font-weight: 700; line-height: 1.85; }
.smx-trend-wrap { display: grid; gap: 8px; }
.smx-trend { display: block; width: 100%; height: auto; }
.smx-trend-grid { stroke: var(--line); stroke-width: 1; }
.smx-trend-axis { fill: var(--muted); font-size: 11px; font-weight: 700; font-family: inherit; }
.smx-trend-bar { fill: rgba(134,100,216,.16); }
.smx-trend-line { fill: none; stroke: var(--purple); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.smx-trend-dot circle { fill: #fff; stroke: var(--purple); stroke-width: 2.5; }
.smx-trend-dot:hover circle { fill: var(--purple); }
.smx-trend-legend { display: flex; gap: 16px; justify-content: center; color: var(--muted); font-size: 11.5px; font-weight: 700; }
.smx-trend-legend span { display: inline-flex; align-items: center; gap: 6px; }
.smx-trend-legend span::before { content: ""; width: 12px; height: 3px; border-radius: 2px; background: var(--purple); }
.smx-trend-legend .pct::before { height: 10px; width: 10px; border-radius: 3px; background: rgba(134,100,216,.3); }

.smx-node-rows { display: grid; gap: 7px; }
.smx-node-row {
  display: grid; grid-template-columns: minmax(0,1.6fr) minmax(90px,1fr) 48px 76px 56px;
  align-items: center; gap: 12px; padding: 10px 13px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft);
}
.smx-node-name { display: grid; gap: 2px; min-width: 0; }
.smx-node-name b { font-size: 12.5px; }
.smx-node-name small { color: var(--muted); font-size: 11px; font-weight: 700; }
.smx-node-bar { height: 8px; border-radius: 999px; background: var(--line); overflow: hidden; }
.smx-node-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--teal), var(--purple)); }
.smx-node-pct { font-size: 12.5px; font-weight: 800; text-align: center; }
.smx-node-level { display: grid; gap: 1px; justify-items: center; }
.smx-node-level b { font-size: 14px; font-weight: 800; color: var(--purple); }
.smx-node-level small { color: var(--muted); font-size: 10.5px; font-weight: 700; }
.smx-node-move { font-size: 12px; font-weight: 800; text-align: center; color: var(--muted); }
.smx-node-move.up { color: var(--teal); }
.smx-node-move.down { color: var(--red); }

.smx-block-table { display: grid; gap: 5px; }
.smx-block-row {
  display: grid; grid-template-columns: 62px 1.2fr 60px 60px 60px 78px 88px;
  align-items: center; gap: 8px; padding: 9px 12px;
  border: 1px solid var(--line); border-radius: 11px; background: var(--panel-soft);
  font-size: 12.5px; font-weight: 700; text-align: center;
}
.smx-block-row.head { background: transparent; border-color: transparent; color: var(--muted); font-size: 11.5px; }
.smx-block-row .ok { color: var(--teal); font-weight: 800; }
.smx-block-row .bad { color: var(--red); font-weight: 800; }
.smx-block-row .blank { color: var(--muted); font-weight: 800; }
.smx-bt-level { display: grid; gap: 1px; }
.smx-bt-level small { color: var(--muted); font-size: 10.5px; font-weight: 700; }

@media (max-width: 860px) {
  .smx-resume { flex-wrap: wrap; }
  .smx-resume-btns { width: 100%; }
  .smx-resume-btns button { flex: 1; }
  .smx-launch { flex-direction: column; align-items: stretch; }
  .smx-start { width: 100%; }
  .smx-history-row { grid-template-columns: 1fr auto; row-gap: 7px; }
  .smx-history-row button { grid-column: 1 / -1; }
  .smx-node-row { grid-template-columns: 1fr 64px 56px; row-gap: 8px; }
  .smx-node-bar { grid-column: 1 / -1; }
  .smx-block-row { grid-template-columns: 46px 1fr 40px 40px 40px 60px; font-size: 11.5px; }
  .smx-block-row span:last-child { display: none; }
  .smx-run-progress { display: none; }
}

/* ── ویرایشگر قاب آیکون (منابع و سری‌های آزمون) ─────────────────────────── */
.modal.icon-fit-modal { width: min(620px, 96vw); }

.icon-fit {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.ife-stage { display: grid; gap: 9px; }

.ife-frame {
  position: relative;
  width: 250px;
  height: 250px;
  border-radius: 18px;
  border: 1px solid var(--line);
  overflow: hidden;
  touch-action: none;
  cursor: grab;
  /* شطرنجیِ ملایم تا شفافیتِ آیکون و لبهٔ قاب دیده شود */
  background-color: #fff;
  background-image:
    linear-gradient(45deg, rgba(15,23,42,.055) 25%, transparent 25%, transparent 75%, rgba(15,23,42,.055) 75%),
    linear-gradient(45deg, rgba(15,23,42,.055) 25%, transparent 25%, transparent 75%, rgba(15,23,42,.055) 75%);
  background-size: 16px 16px;
  background-position: 0 0, 8px 8px;
}
.ife-frame.is-dragging { cursor: grabbing; }
.ife-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.06);
  pointer-events: none;
}

.ife-art {
  display: block;
  width: 100%;
  height: 100%;
  transform-origin: 50% 50%;
  will-change: transform;
  pointer-events: none;
}
.ife-art > svg,
.ife-art > img { width: 100%; height: 100%; object-fit: contain; display: block; }

.ife-hint { margin: 0; color: var(--muted); font-size: 11.5px; line-height: 1.8; max-width: 250px; }

.ife-side { display: grid; gap: 14px; align-content: start; }

.ife-zoom-box {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 11px 12px;
  background: var(--panel-soft);
  display: grid;
  gap: 9px;
}
.ife-zoom-head { display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 700; }
.ife-zoom-head b { font-size: 13px; }
.ife-zoom { display: flex; align-items: center; gap: 8px; }
.ife-zoom input[type="range"] { flex: 1; min-width: 0; accent-color: var(--orange); }
.ife-step {
  width: 28px; height: 28px; flex: 0 0 28px;
  border-radius: 9px; border: 1px solid var(--line); background: #fff;
  font-size: 16px; font-weight: 800; line-height: 1; cursor: pointer; color: var(--text);
}
.ife-step:hover { border-color: var(--orange); color: var(--orange); }

.ife-check { display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; font-weight: 600; cursor: pointer; line-height: 1.7; }
.ife-check input { margin-top: 3px; accent-color: var(--orange); }
.ife-check.off { color: var(--muted); cursor: default; }

.ife-preview { display: grid; gap: 9px; }
.ife-preview-title { color: var(--muted); font-size: 11.5px; font-weight: 700; }
.ife-previews {
  display: flex; align-items: center; gap: 14px;
  border: 1px solid var(--line); border-radius: 14px; padding: 12px; background: #fff;
}
.ife-pv { display: inline-flex; overflow: hidden; border-radius: 6px; }
.ife-pv.sm { width: 20px; height: 20px; flex: 0 0 20px; }
.ife-pv.md { width: 30px; height: 30px; flex: 0 0 30px; }
.ife-pv.lg { width: 46px; height: 46px; flex: 0 0 46px; border-radius: 12px; }

.ife-reset { justify-content: center; }

@media (max-width: 720px) {
  .icon-fit { grid-template-columns: minmax(0, 1fr); }
  /* قابِ تمام‌عرض روی موبایل کلِ صفحه را می‌گیرد و کنترل‌ها زیرِ خطِ دید می‌افتند */
  .ife-frame { width: min(100%, 260px); height: auto; aspect-ratio: 1 / 1; }
  .ife-hint { max-width: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   فرمول ریاضی (KaTeX) و ویرایشگر متن سؤال
   ───────────────────────────────────────────────────────────────────────────
   جزیرهٔ فرمول (.mkm) سه کار هم‌زمان می‌کند و هر سه لازم‌اند:

   ۱) direction: ltr — ریاضی همه‌جای دنیا چپ‌به‌راست است. بدون این، جهتِ rtlِ
      صفحه به داخل فرمول نشت می‌کند و «x = ۵» را «۵ = x» نشان می‌دهد (خودِ
      KaTeX جهت را تثبیت نمی‌کند چون فرضش صفحهٔ چپ‌به‌راست است).
   ۲) unicode-bidi: isolate — فرمول یک جزیرهٔ بستهٔ bidi می‌شود، پس عبارتِ
      لاتینِ داخلش نمی‌تواند ترتیبِ کلمه‌های فارسیِ قبل و بعد را جابه‌جا کند.
   ۳) وزیرمتن ته زنجیرهٔ فونت — گلیف فارسی و ارقام فارسی در فونت‌های KaTeX
      نیست؛ بدون این، مرورگر به فونت پیش‌فرضِ سیستم می‌افتد و متنِ داخل
      \text{} با بقیهٔ صفحه ناهماهنگ می‌شود.
   ═════════════════════════════════════════════════════════════════════════ */

.mkm {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
}
/* فرمولِ نمایشی: خطِ مستقل. جای پیش‌فرضش لبهٔ چپ است — همان‌جایی که معادله‌های
   کتاب‌های درسیِ فارسی می‌نشینند — و با data-mk-align قابل تغییر است. */
.mkm.is-display {
  display: block;
  margin: 10px 0;
  text-align: left;
}
.mkm.is-display[data-mk-align="center"] { text-align: center; }
.mkm.is-display[data-mk-align="right"] { text-align: right; }
.mkm.is-display[data-mk-align="left"] { text-align: left; }
/* KaTeX دو جا تراز را قفل می‌کند: روی خودِ `.katex-display` و — که فراموش شده
   بود — روی فرزندِ مستقیمش `.katex-display > .katex`. تا وقتی فرزند هم آزاد
   نشود، دکمه‌های راست/وسط/چپِ نوارِ فرمول هیچ اثری ندارند و هر فرمولِ خط‌مستقل
   وسط‌چین دیده می‌شود. هر دو از ترازِ جزیره ارث می‌برند. */
.mkm.is-display .katex-display,
.mkm.is-display .katex-display > .katex { text-align: inherit; }

/* معادلهٔ بلندتر از عرضِ ستون (موبایل، ستونِ باریکِ چاپ) باید خودش اسکرول بگیرد،
   نه اینکه از کادر بیرون بزند یا بی‌صدا بریده شود. جعبهٔ اسکرول باید خودِ
   `.katex-display` باشد: KaTeX فرزندش را `display:block; white-space:nowrap`
   می‌کند، پس عرضِ `.katex` همیشه برابر ظرف است و گذاشتنِ overflow روی `.mkm`
   هرگز سرریز را نمی‌بیند. */
.mkm.is-display .katex-display {
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 0;
  margin: 0;
}

.mkm .katex {
  /* KaTeX معادله را سرِ عملگرهای رابطه‌ای/دوتایی به چند span (.base) می‌شکند تا
     بتواند بپیچد، ولی برای معادلهٔ نمایشی nowrap می‌گذارد. روی ستون باریکِ
     موبایل، پیچیدنِ سرِ «=» یا «+» از نوارِ اسکرولِ افقی خیلی خواناتر است، پس
     اجازهٔ پیچیدن داده می‌شود؛ معادله‌ای که هیچ نقطهٔ شکستی ندارد (یک کسرِ بلند)
     همچنان با قاعدهٔ زیر داخل کادر خودش اسکرول می‌گیرد. */
  white-space: normal;
}
/* فونتِ داخلِ فرمول یک‌جا و فقط یک‌جا تعریف می‌شود — بخشِ «فونت متنِ سؤال» پایین‌تر.
   قبلاً اینجا هم یک نسخهٔ قدیمی بود و تنها به‌خاطرِ ترتیبِ فایل بازنویسی می‌شد؛
   هر جابه‌جاییِ بی‌ربطی در styles.css می‌توانست بی‌صدا برشان گرداند. */

/* اندازهٔ پایهٔ کلِ فرمول پایین‌تر به ۱em نرمال می‌شود؛ بنابراین گلیفِ فارسی
   دیگر به ضریبِ جبرانیِ ۰٫۸۲۶ نیاز ندارد و هم‌قدِ متنِ اطراف می‌ماند. */
.mkm .mkm-fa {
  font-size: 1em;
  font-family: "Vazirmatn", Tahoma, sans-serif;
  font-feature-settings: "ss01";
  direction: rtl;
  unicode-bidi: isolate;
}

/* فرمولِ خراب: به‌جای صفحهٔ سفید یا متنِ قرمزِ KaTeX، یک چیپِ قابل‌کلیک که
   خودِ TeX را نشان می‌دهد تا مدیر بفهمد کجا را باید درست کند. */
.mkm-error {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
  padding: 1px 7px;
  border: 1px dashed var(--red);
  border-radius: 7px;
  background: var(--red-soft);
  color: #a63b3b;
  font-family: ui-monospace, Menlo, monospace;
  font-size: 11.5px;
  white-space: pre-wrap;
}

/* ─────────────────────────── ویرایشگر متن سؤال ─────────────────────────── */

.rte {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.rte-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
  padding: 5px 7px;
  background: var(--panel-soft);
  border-bottom: 1px solid var(--line);
}
.rte-sep { width: 1px; align-self: stretch; margin: 3px 4px; background: var(--line); }
.rte-spacer { flex: 1 1 auto; }

.rte-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 28px;
  height: 28px;
  padding: 0 6px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
}
.rte-btn:hover { background: #fff; border-color: var(--line); }
.rte-btn.on { background: var(--orange-soft); border-color: #ffd0b4; color: #c2470a; }
.rte-btn:disabled { opacity: 0.4; cursor: default; }
.rte-btn .ui-icon { width: 15px; height: 15px; }
.rte-btn-f {
  background: var(--teal-soft);
  border-color: #b9e8e0;
  color: #10796c;
  font-weight: 700;
  padding: 0 9px;
}
.rte-btn-f:hover { background: #d6f4ef; border-color: #8fdccf; }
.rte-btn-ltr { font-family: ui-monospace, Menlo, monospace; font-size: 11px; }

.rte-area {
  min-height: var(--rte-min, 150px);
  max-height: var(--rte-max, 460px);
  overflow-y: auto;
  padding: 12px 14px;
  outline: none;
  line-height: 2.05;
  font-size: 14.5px;
  overflow-wrap: anywhere;
}
/* هنگام تایپ فقط کِرسر دیده شود. جلوهٔ عمومیِ inputها (حرکت یک‌پیکسلی و هالهٔ
   نارنجی) برای یک سطحِ بزرگِ ویرایش متن مزاحم است و هیچ وضعیت تازه‌ای نمی‌گوید. */
.rte-area:focus,
.rte-area:focus-visible {
  transform: none;
  box-shadow: none;
}
.rte-area:empty::before {
  content: attr(data-placeholder);
  color: var(--muted);
  pointer-events: none;
}
.rte-area > *:first-child { margin-top: 0; }
.rte-area > *:last-child { margin-bottom: 0; }
.rte-area p { margin: 0 0 6px; }
.rte-area ul, .rte-area ol { margin: 6px 0; padding-inline-start: 22px; }
.rte-area img { max-width: 100%; height: auto; border-radius: 8px; }
.rte-area table { border-collapse: collapse; margin: 8px 0; }
.rte-area td, .rte-area th { border: 1px solid var(--line); padding: 4px 8px; }

/* ویرایشگرِ تک‌خطیِ گزینه‌ها: همان موتور، بدون نوار ابزارِ کامل */
.rte.is-compact { border-radius: 11px; }
.rte.is-compact .rte-bar { padding: 3px 5px; }
.rte.is-compact .rte-area { --rte-min: 40px; padding: 7px 10px; line-height: 1.9; }

/* چیپ فرمول داخل ویرایشگر: کلیک = ویرایش، یک واحدِ تقسیم‌ناپذیر برای کِرسر */
.rte-area .mkm {
  border-radius: 6px;
  padding: 0 2px;
  cursor: pointer;
  transition: background 0.12s ease, box-shadow 0.12s ease;
}
.rte-area .mkm:hover { background: var(--teal-soft); box-shadow: 0 0 0 2px #cdeee8; }
.rte-area .mkm.is-selected { background: #cdeee8; box-shadow: 0 0 0 2px var(--teal); }
.rte-area .mkm.is-display { cursor: pointer; padding: 4px 0; }

.rte-hint {
  padding: 5px 12px;
  border-top: 1px solid var(--line);
  background: var(--panel-soft);
  color: var(--muted);
  font-size: 11px;
}
.rte-hint b { color: var(--ink); font-weight: 600; }
.rte-hint kbd {
  display: inline-block;
  padding: 0 4px;
  border: 1px solid var(--line);
  border-bottom-width: 2px;
  border-radius: 4px;
  background: #fff;
  font-family: ui-monospace, Menlo, monospace;
  font-size: 10px;
}

/* ───────────────────────── پاپ‌آپ فرمول (LaTeX) ───────────────────────── */

.modal.fml-modal { width: min(700px, 96vw); }

.fml {
  display: grid;
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.fml-modes { display: flex; gap: 6px; }
.fml-mode {
  flex: 1 1 0;
  display: grid;
  gap: 2px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  text-align: start;
  cursor: pointer;
}
.fml-mode strong { font-size: 12.5px; }
.fml-mode small { color: var(--muted); font-size: 11px; }
.fml-mode.on { border-color: var(--teal); background: var(--teal-soft); }
.fml-mode.on small { color: #10796c; }

.fml-input {
  width: 100%;
  min-height: 84px;
  resize: vertical;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfaf7;
  color: var(--ink);
  direction: ltr;
  text-align: left;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 13.5px;
  line-height: 1.7;
  outline: none;
}
.fml-input:focus { border-color: #ffc6a3; box-shadow: 0 0 0 3px rgba(255, 107, 24, 0.09); }

/* نوارِ عنوانِ کادرِ کد: دکمه‌های جهت نباید به لبهٔ بالای textarea بچسبند —
   یک پلهٔ کوچک بالاتر می‌نشینند و زیرشان فاصله می‌ماند. */
.fml-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-block: 2px 9px;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 700;
}
.fml-label a { color: var(--teal); text-decoration: none; cursor: pointer; font-weight: 600; }

.fml-label-tools { display: inline-flex; align-items: center; gap: 8px; }

.fml-fa-entry {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 7px; margin-top: 7px;
}
.fml-fa-entry label { display: grid; gap: 3px; color: var(--muted); font-size: 10.5px; font-weight: 700; }
.fml-fa-entry input {
  width: 100%; min-width: 0; height: 34px; padding: 5px 9px;
  border: 1px solid var(--line); border-radius: 9px; background: #fff;
  color: var(--ink); font-family: var(--q-font); font-size: 13px; outline: none;
}
.fml-fa-entry input:focus { border-color: var(--teal); box-shadow: 0 0 0 2px rgba(26, 163, 146, .1); }
.fml-fa-entry button {
  height: 34px; padding: 0 11px; border: 1px solid #b9e8e0; border-radius: 9px;
  background: var(--teal-soft); color: #10796c; font: inherit; font-size: 11px; font-weight: 700; cursor: pointer;
}
.fml-fa-hint { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.fml-fa-hint code { direction: ltr; unicode-bidi: isolate; display: inline-block; }

/* کادر پیش‌نمایش: ارتفاعش ثابت است تا با هر بار تایپ، پاپ‌آپ بالا و پایین نپرد */
.fml-out {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 96px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  overflow-x: auto;
}
.fml-out .mkm { font-size: 20px; }
.fml-out.is-empty { color: var(--muted); font-size: 12.5px; }

.fml-err {
  display: none;
  padding: 7px 11px;
  border-radius: 10px;
  background: var(--red-soft);
  color: #a63b3b;
  font-size: 12px;
}
.fml-err.on { display: block; }
.fml-err code {
  direction: ltr;
  display: inline-block;
  font-family: ui-monospace, Menlo, monospace;
  font-size: 11px;
}

/* پالت نمادها: تبِ دسته + شبکهٔ دکمه‌ها، همه با برچسب فارسی */
.fml-pal { display: grid; gap: 7px; }
.fml-pal-tabs { display: flex; flex-wrap: wrap; gap: 4px; }
.fml-pal-tab {
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 11.5px;
  cursor: pointer;
}
.fml-pal-tab.on { border-color: var(--teal); background: var(--teal-soft); color: #10796c; font-weight: 700; }
.fml-pal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(62px, 1fr));
  gap: 4px;
  max-height: 132px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-soft);
}
.fml-sym {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 5px 4px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-size: 18px;
}
.fml-sym:hover { border-color: var(--teal); background: var(--teal-soft); }
.fml-sym .mkm { font-size: 1em; pointer-events: none; }

@media (max-width: 720px) {
  .fml-modes { flex-direction: column; }
  .fml-pal-grid { max-height: 108px; }
  .fml-fa-entry { grid-template-columns: minmax(0, 1fr); }
  /* نوار ابزار روی ستون باریک سه ردیف می‌شد و نصف ارتفاعِ ویرایشگر را می‌گرفت */
  .rte-bar { gap: 1px; padding: 4px 5px; }
  .rte-btn { min-width: 26px; height: 26px; padding: 0 4px; font-size: 12px; }
  .rte-sep { display: none; }
  .rte-hint { font-size: 10.5px; }
}

/* ───────────── تعویض حالتِ «تصویر / متن» در میز کار سؤال ───────────── */

.qw-mode {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.qw-mode > span { color: var(--muted); font-size: 12px; font-weight: 700; }
.qw-mode-note { color: var(--muted); font-size: 11.5px; }

.qw-text-zone { display: grid; gap: 12px; }
.qw-ai-reference {
  overflow: hidden;
  border: 1px solid #efc894;
  border-radius: 14px;
  background: #fffaf2;
}
.qw-ai-reference > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid #f1dcc0;
  background: #fff6e9;
}
.qw-ai-reference > header > span { display: grid; gap: 2px; }
.qw-ai-reference > header strong { color: #8f541d; font-size: 11.5px; }
.qw-ai-reference > header small { color: #8b765f; font-size: 9px; line-height: 1.7; }
.qw-ai-reference > header button {
  display: grid; place-items: center; flex: none; width: 28px; height: 28px;
  border: 1px solid #e7c79f; border-radius: 8px; background: #fff; color: #85684c; cursor: pointer;
}
.qw-ai-reference > header button .ui-icon { width: 14px; height: 14px; }
.qw-ai-reference > div {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  overflow-x: auto;
  padding: 10px;
}
.qw-ai-reference figure { flex: 0 0 auto; margin: 0; max-width: min(100%, 760px); }
.qw-ai-reference img {
  display: block; width: auto; max-width: 100%; max-height: 52vh; object-fit: contain;
  border: 1px solid #e7d7c3; border-radius: 10px; background: #fff;
}
.qw-ai-reference figcaption { margin-top: 4px; color: var(--muted); font-size: 8.5px; }
.qw-ai-reference.is-stored { margin-bottom: 12px; }
.qw-legacy-image-mode { padding: 8px 11px; border: 1px solid #f0d3ad; border-radius: 11px; background: #fff9ef; }
.qw-opts-editor { display: grid; gap: 8px; }
.qw-opt-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 8px;
}
.qw-opt-pick {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-top: 3px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.qw-opt-pick:hover { border-color: var(--teal); color: var(--teal); }
.qw-opt-pick.on { border-color: var(--teal); background: var(--teal); color: #fff; }

/* متن گزینه از ابتدای جهت خودش شروع می‌شود؛ تراز وسطِ OCR یا داده‌های قدیمی
   نباید کارت گزینه را وسط‌چین کند. */
.rte-area[data-rte-key^="option:"],
.qai-option > div,
.sq-ans-opt > span:last-child,
.qv-opts > span > span,
.er-opt > span,
.draw-question-options > div > span { text-align: start; }
.rte-area[data-rte-key^="option:"] > *,
.qai-option > div > *,
.sq-ans-opt > span:last-child > *,
.qv-opts > span > span > *,
.er-opt > span > *,
.draw-question-options > div > span > * { text-align: start !important; }

/* فرمولِ «خط مستقل» داخل کارت گزینه: خودِ کارت یک خط است، پس بلوکِ تمام‌عرضِ
   حاشیه‌دار فقط کارت را بی‌دلیل بلند و پهن می‌کند و فرمول را — با ترازِ چپِ
   پیش‌فرضش — از شمارهٔ گزینه دور می‌اندازد. اینجا مثل فرمول درون‌خطی رفتار
   می‌کند: جمع، بدون حاشیه، و چسبیده به ابتدای گزینه. ترازِ data-mk-align
   مالِ متنِ سؤال است، نه کارت گزینه. */
.rte-area[data-rte-key^="option:"] .mkm.is-display,
.qai-option > div .mkm.is-display,
.sq-ans-opt .mkm.is-display,
.qv-opts .mkm.is-display,
.er-opt .mkm.is-display,
.pq-option .mkm.is-display,
.draw-question-options .mkm.is-display {
  display: inline-block;
  margin: 0;
  text-align: start;
}
.rte-area[data-rte-key^="option:"] .mkm.is-display .katex-display,
.qai-option > div .mkm.is-display .katex-display,
.sq-ans-opt .mkm.is-display .katex-display,
.qv-opts .mkm.is-display .katex-display,
.er-opt .mkm.is-display .katex-display,
.pq-option .mkm.is-display .katex-display,
.draw-question-options .mkm.is-display .katex-display { padding: 0; }

/* متنِ سؤال در پنل دانش‌آموز و چاپ: فاصلهٔ سطرِ کافی برای فرمولِ دوطبقه */
.sq-rich-text { line-height: 2.05; }
.sq-rich-text > *:first-child { margin-top: 0; }
.sq-rich-text > *:last-child { margin-bottom: 0; }
.sq-rich-text p { margin: 0 0 6px; }
.sq-rich-text ul, .sq-rich-text ol { margin: 6px 0; padding-inline-start: 22px; }
.sq-rich-text img { max-width: 100%; height: auto; }
.sq-rich-text table { border-collapse: collapse; margin: 8px 0; }
.sq-rich-text td, .sq-rich-text th { border: 1px solid var(--line); padding: 4px 8px; }

/* ═══════════ تصویر و جدولِ داخلِ متنِ سؤال ═══════════════════════════════════
   یک ظاهرِ مشترک برای هر سه جا: ویرایشگر مدیر (.rte-area)، نمایشِ سؤال در پنل‌ها
   (.sq-rich-text) و صفحهٔ چاپ/PDF. عرض همیشه درصدی است تا همان سؤال روی موبایل،
   کارتِ پنل و A4 یک نسبت داشته باشد.
   ═════════════════════════════════════════════════════════════════════════ */

.mkfig {
  display: block;
  position: relative;
  width: 55%;
  max-width: 100%;
  margin: 12px 0;
}
.mkfig[data-align="center"] { margin-inline: auto; }
.mkfig[data-align="left"] { margin-inline-end: auto; margin-inline-start: 0; }
.mkfig[data-align="right"] { margin-inline-start: auto; margin-inline-end: 0; }
/* در جریانِ راست‌به‌چپ، «راست» یعنی همان لبهٔ شروع؛ صریح نوشتنش از وابسته‌شدن
   نتیجه به جهتِ ظرف جلوگیری می‌کند (سؤال هم در کادر rtl و هم در ستون ltr می‌آید). */
[dir="rtl"] .mkfig[data-align="right"] { margin-inline-start: 0; margin-inline-end: auto; }
[dir="rtl"] .mkfig[data-align="left"] { margin-inline-start: auto; margin-inline-end: 0; }

.mkfig img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}

.mktable {
  border-collapse: collapse;
  width: 100%;
  margin: 12px 0;
  font-size: 0.95em;
  /* جدولِ عریض‌تر از ستون نباید صفحه را بکشد */
  max-width: 100%;
}
.mktable[data-align="center"] { margin-inline: auto; }
.mktable[data-align="left"] { margin-inline-end: auto; margin-inline-start: 0; }
.mktable[data-align="right"] { margin-inline-start: auto; margin-inline-end: 0; }
[dir="rtl"] .mktable[data-align="right"] { margin-inline-start: 0; margin-inline-end: auto; }
[dir="rtl"] .mktable[data-align="left"] { margin-inline-start: auto; margin-inline-end: 0; }

.mktable th,
.mktable td {
  border: 1px solid var(--line);
  padding: 6px 9px;
  text-align: center;
  vertical-align: middle;
  /* یک کلمهٔ بلندِ لاتین نباید ستون را از عرضِ تعیین‌شده بیرون بزند.
     عمداً break-word و نه anywhere: anywhere عرضِ min-content ستون را هم آزاد
     می‌کند و مرورگر اجازه می‌گیرد «جیوه» را وسطِ کلمه بشکند. */
  overflow-wrap: break-word;
}
.mktable th { background: var(--panel-soft); font-weight: 700; }
/* جدولِ تو در تو نباید حاشیهٔ دوبل و فاصلهٔ بیرونی بگیرد */
.mktable .mktable { margin: 0; font-size: 1em; }

/* ─────────────────── حالتِ ویرایش: دستگیره‌ها و انتخاب ─────────────────── */

.rte-area .mkfig { cursor: grab; }
.rte-area .mkfig:active { cursor: grabbing; }
.rte-area .mkfig.is-dragging { opacity: .42; }
.rte-area .mkfig::after {
  content: "";
  position: absolute;
  inset: -3px;
  border: 1px dashed transparent;
  border-radius: 10px;
  pointer-events: none;
}
.rte-area .mkfig:hover::after { border-color: #cdd9e8; }
.rte-area .mkfig.is-selected::after { border: 2px solid var(--teal); border-style: solid; }

.mkfig-grip {
  position: absolute;
  inset-inline-start: -7px;
  bottom: -7px;
  width: 16px;
  height: 16px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--teal);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
  cursor: nwse-resize;
  opacity: 0;
  transition: opacity 0.12s ease;
  touch-action: none;
}
.rte-area .mkfig:hover .mkfig-grip,
.rte-area .mkfig.is-selected .mkfig-grip { opacity: 1; }
.rte-area .is-fig-drop-before { box-shadow: 0 -3px 0 var(--teal); }
.rte-area .is-fig-drop-after { box-shadow: 0 3px 0 var(--teal); }
.rte.is-inline-drop .rte-area { box-shadow: inset 0 0 0 2px rgba(26, 163, 146, .28); }
/* بیرون از ویرایشگر (پنل کاربر، چاپ) دستگیره اصلاً وجود ندارد؛ این فقط تور ایمنی است */
.sq-rich-text .mkfig-grip { display: none; }

.rte-area .mktable { cursor: text; }
.rte-area .mktable th.is-col-grip,
.rte-area .mktable td.is-col-grip { cursor: col-resize; }
.rte-area .mktable th.is-col-grip,
.rte-area .mktable td.is-col-grip { box-shadow: inset 2px 0 0 var(--teal); }

.rte.is-drop { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(26, 163, 146, 0.15); }

/* ───────────────── نوار ابزارِ وابسته به متن (تصویر / جدول) ───────────────── */

.rte-ctx {
  border-bottom: 1px solid var(--line);
  background: #f2f8f7;
}
.rte-ctx-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
  padding: 5px 7px;
}
.rte-ctx-row + .rte-ctx-row { border-top: 1px dashed var(--line); }
.rte-ctx-label {
  margin-inline-end: 4px;
  color: #10796c;
  font-size: 11.5px;
  font-weight: 700;
}
.rte-ctx .rte-btn { font-size: 11.5px; height: 26px; min-width: 26px; }
.rte-formula-align-tools { display: inline-flex; align-items: center; gap: 2px; }
.rte-formula-align-tools[hidden] { display: none; }
.rte-btn-danger { color: #a63b3b; }
.rte-btn-danger:hover { background: var(--red-soft); border-color: #f0c4c4; }
.rte-btn-m { font-weight: 600; }
.rte-btn-m .ui-icon { width: 14px; height: 14px; }

/* ───────────────────── انتخابگرِ ابعادِ جدول ───────────────────── */

.rte-drop-host { position: relative; display: inline-flex; }
.rte-grid {
  position: absolute;
  top: calc(100% + 6px);
  inset-inline-end: 0;
  z-index: 40;
  display: none;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(41, 36, 29, 0.16);
}
.rte-grid.on { display: block; }
.rte-grid-cells { display: grid; gap: 3px; direction: rtl; }
.rte-grid-cells i {
  width: 17px;
  height: 17px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: #fff;
  cursor: pointer;
}
.rte-grid-cells i.on { border-color: var(--teal); background: var(--teal-soft); }
.rte-grid-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 7px;
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}
.rte-grid-foot label { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }

/* ─────────────── چیدمانِ فرمولِ نمایشی داخل پاپ‌آپ فرمول ─────────────── */

.fml-align { display: flex; align-items: center; gap: 4px; }
.fml-align[hidden] { display: none; }
.fml-align-label { margin-inline-end: 4px; color: var(--muted); font-size: 11.5px; font-weight: 700; }

/* ══════════════ صورتِ سؤال درشت‌تر از بقیهٔ متن‌ها ══════════════════════════
   قراردادِ کتاب‌های کمک‌درسی: صورتِ سؤال درشت (bold) و پاسخ تشریحی/درسنامه با
   وزنِ عادی. با وزنِ بلوکی، سوپراسکریپت و فرمولِ داخلش هم خودبه‌خود همراه می‌شوند. */
.sq-rich-body { font-weight: 700; }
/* صورتِ سؤال یک وزنِ واحد دارد: فرمول هم از فیس‌های ۷۰۰ خانوادهٔ ترکیبی/KaTeX
   استفاده می‌کند تا وسط جمله از متنِ بولد باریک‌تر نیفتد. */
.sq-rich-body .katex { font-weight: 700; }
.sq-rich-body .katex .mkm-fa { font-weight: 700; }
/* جدولِ داخلِ صورتِ سؤال نباید همه‌اش درشت شود؛ فقط سطرِ عنوان */
.sq-rich-body .mktable td { font-weight: normal; }

.rte-area[data-rte-key="body"] { font-weight: 700; }
.rte-area[data-rte-key="body"] .katex { font-weight: 700; }
.rte-area[data-rte-key="body"] .katex .mkm-fa { font-weight: 700; }
.rte-area[data-rte-key="body"] .mktable td { font-weight: normal; }

/* گزینه‌ها، پاسخ تشریحی و درسنامه در حالت پایه عادی‌اند. <b>/<strong> داخلشان
   همچنان وزن ۷۰۰ می‌گیرد، پس دکمهٔ B فقط همان انتخابِ کاربر را درشت می‌کند. */
.sq-rich-explanation,
.sq-rich-lesson,
.qv-opts > span > span,
.sq-ans-opt > span:last-child,
.er-opt > span,
.pq-option > span,
.draw-question-options > div > span,
.rte-area[data-rte-key="explanation"],
.rte-area[data-rte-key="lesson"],
.rte-area[data-rte-key^="option:"] {
  font-weight: 400;
}

/* ══════════════ مودال پاداش گروهی ═══════════════════════════════════════════
   بازه هیچ پیش‌فرضی ندارد؛ تا انتخاب نشدنش، بخش‌های ۲ و ۳ خاموش (.off) می‌مانند
   و دکمهٔ ثبت غیرفعال است. تقویم درون‌خطی است تا در بدنهٔ اسکرول‌شونده بریده نشود. */

/* چک‌باکس/رادیو داخل .field نباید قواعدِ ورودی‌های تمام‌عرض را بگیرد؛
   وگرنه به یک کادرِ ۴۲پیکسلیِ تمام‌عرض تبدیل می‌شود و متنِ کنارش له می‌شود. */
.field input[type="checkbox"],
.field input[type="radio"] { width: auto; min-height: 0; padding: 0; }

.modal-head.brw-head { align-items: flex-start; }
.brw-head h2 { margin: 0; }
.brw-head p { margin: 4px 0 0; color: var(--muted); font-size: 11.5px; font-weight: 600; line-height: 1.7; }

.brw { display: grid; gap: 14px; }
.brw-card { border: 1px solid var(--line); border-radius: 16px; background: var(--panel); padding: 14px; transition: opacity .18s ease, filter .18s ease; }
.brw-card.off { opacity: .45; filter: grayscale(.35); pointer-events: none; }
.brw-card > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
.brw-card > header > b { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; }
.brw-card > header em { font-style: normal; font-size: 11px; font-weight: 700; color: var(--muted); }
.brw-step { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 8px; background: var(--orange-soft); color: var(--orange); font-size: 11px; font-weight: 900; font-style: normal; }
.brw-req { color: var(--orange) !important; }

.brw-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.brw-mode { display: flex; align-items: center; gap: 9px; text-align: start; padding: 11px 12px; border: 1px solid var(--line); border-radius: 13px; background: #fff; color: var(--ink); font: inherit; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.brw-mode:hover { border-color: #f2a562; }
.brw-mode.on { border-color: var(--orange); background: var(--orange-soft); box-shadow: 0 0 0 3px rgba(255, 107, 24, .1); }
.brw-mode svg { width: 18px; height: 18px; flex: none; color: var(--orange); }
.brw-mode > span { display: grid; gap: 2px; min-width: 0; }
.brw-mode b { font-size: 12.5px; font-weight: 800; }
.brw-mode small { color: var(--muted); font-size: 10.5px; font-weight: 600; }

.brw-panel { margin-top: 11px; padding: 11px; border: 1px dashed #e6d7c3; border-radius: 13px; background: #fffdf9; }
.brw-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.brw-chip { padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); font: inherit; font-size: 11.5px; font-weight: 700; cursor: pointer; transition: border-color .14s ease, background .14s ease, color .14s ease; }
.brw-chip:hover { border-color: #f0b487; color: #c25710; }
.brw-chip.on { border-color: var(--orange); background: var(--orange); color: #fff; }
.brw-num { display: flex; align-items: center; gap: 8px; margin-top: 9px; }
.brw-num input { width: 96px; min-height: 40px; border: 1px solid var(--line); border-radius: 11px; background: #fff; padding: 8px 11px; font: inherit; font-weight: 800; text-align: center; outline: 0; }
.brw-num input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 107, 24, .1); }
.brw-num span { color: var(--muted); font-size: 11.5px; font-weight: 700; }

.brw-dates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.brw-dt { min-height: 48px; }
.brw-dt > span { text-align: start; }
.brw-cal { width: 100%; max-width: none; margin: 11px 0 0; }
.brw-cal .audit-cal-cell.inrange { background: var(--orange-soft); border-color: #f6d3b6; color: #c25710; }
.brw-cal-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px solid #f0e3d2; }
.brw-cal-foot span { color: var(--muted); font-size: 11px; font-weight: 700; }

.brw-note { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 11px 0 0; padding: 9px 11px; border-radius: 11px; font-size: 11.5px; font-weight: 700; line-height: 1.8; }
.brw-note svg { width: 15px; height: 15px; flex: none; }
.brw-note.warn { background: #fff7ed; color: #b4560f; }
.brw-note.ok { background: var(--teal-soft, #eaf7f3); color: #15706a; }
.brw-note span { color: var(--muted); font-weight: 600; }

.brw-pct { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.brw-pct .brw-num { margin-top: 0; }
.brw-reason { display: grid; gap: 6px; margin-top: 12px; }
.brw-reason label { font-size: 11px; font-weight: 800; }
.brw-reason input { width: 100%; min-height: 42px; border: 1px solid var(--line); border-radius: 11px; background: #fff; padding: 9px 11px; font: inherit; outline: 0; }
.brw-reason input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 107, 24, .1); }

.brw-tools { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.brw-search { display: flex; align-items: center; gap: 7px; flex: 1; min-width: 0; padding: 0 11px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.brw-search svg { width: 15px; height: 15px; flex: none; color: var(--muted); }
.brw-search input { flex: 1; min-width: 0; min-height: 40px; border: 0; outline: 0; background: transparent; font: inherit; }
.brw-linkbtn { border: 0; background: none; color: var(--orange); font: inherit; font-size: 11.5px; font-weight: 800; cursor: pointer; padding: 4px 2px; }
.brw-linkbtn:hover { text-decoration: underline; }

.brw-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 254px; overflow-y: auto; padding-inline-end: 2px; }
.brw-admin { display: flex; align-items: center; gap: 9px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 12px; background: #fff; cursor: pointer; transition: border-color .14s ease, background .14s ease; }
.brw-admin:hover { border-color: #f0b487; }
.brw-admin.on { border-color: var(--teal); background: var(--teal-soft); }
.brw-admin.zero { opacity: .62; }
.brw-admin input[type="checkbox"] { width: 16px; height: 16px; min-height: 0; flex: none; margin: 0; padding: 0; accent-color: var(--orange); cursor: pointer; }
.brw-admin .avatar { width: 26px; height: 26px; flex: none; }
.brw-admin-who { display: flex; align-items: center; gap: 7px; min-width: 0; flex: 1; }
.brw-admin-who b { font-size: 12px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brw-admin-num { display: grid; gap: 1px; text-align: start; flex: none; }
.brw-admin-num b { font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.brw-admin-num small { color: var(--muted); font-size: 10px; font-weight: 600; white-space: nowrap; }
.brw-empty { grid-column: 1 / -1; margin: 0; padding: 14px; text-align: center; color: var(--muted); font-size: 12px; font-weight: 700; }

.modal-footer.brw-footer { justify-content: space-between; gap: 12px; }
.brw-sum { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.brw-sum > span { color: var(--muted); font-size: 11.5px; font-weight: 700; }
.brw-sum > b { font-size: 15px; font-weight: 900; color: var(--muted); }
.brw-sum.on > b { color: var(--teal, #15706a); }
.brw-sum em { font-style: normal; color: var(--muted); font-size: 10.5px; font-weight: 600; }
.brw-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.brw-actions .primary-button[disabled] { opacity: .45; cursor: not-allowed; box-shadow: none; }

@media (max-width: 720px) {
  .brw-modes, .brw-dates, .brw-list { grid-template-columns: 1fr; }
  .brw-list { max-height: 46vh; }
  .modal-footer.brw-footer { flex-direction: column; align-items: stretch; }
  .brw-actions { justify-content: flex-end; }
}

/* ══════════════ فونت «ب نازنین» روی متنِ سؤال ═════════════════════════════
   دامنه عمداً باریک است: فقط جایی که متنِ خودِ سؤال دیده می‌شود — پنل مدیر،
   پنل کاربر، رانرِ آزمون، استودیوی چاپ و PDF سرور — و ویرایشگری که همان متن
   در آن نوشته می‌شود. نوار ابزار، منو، دکمه، فرم و جدول‌های مدیریتی وزیرمتن
   می‌مانند؛ اینجا هیچ قاعدهٔ سراسری‌ای روی body یا * گذاشته نمی‌شود.

   ضریب --q-scale دقیقاً یک بار به هر سطح اعمال می‌شود. اگر روی ظرف و مظروف
   هر دو بنشیند در هم ضرب می‌شود و متن غول‌آسا می‌شود، پس هر انتخابگرِ پایین
   یک «سطحِ مستقلِ نمایشِ سؤال» است، نه تودرتو.
   ═════════════════════════════════════════════════════════════════════════ */

.sq-rich-text,
.qv-opts > span,
.sq-ans-opt > span:not(.sq-ans-no),
.er-opt > span,
.pq-option > span,
.draw-question-options > div,
.rte-area,
.fml-out {
  font-family: var(--q-font);
  font-size: calc(1em * var(--q-scale));
  /* ب نازنین بدنهٔ کوتاه‌تری دارد، پس با همان line-height قبلی سطرها زیادی از
     هم باز می‌افتند؛ کمی جمع‌تر، همان فشردگیِ کتاب درسی را می‌دهد. */
  line-height: 1.9;
}

/* گزینهٔ تک‌خطی مثل یک ردیف پاسخ جمع‌وجور می‌ماند؛ با چندخطی‌شدن متن، ارتفاع
   همچنان طبیعی و بدون برش زیاد می‌شود. */
.sq-ans-opt > span:not(.sq-ans-no) { line-height: 1.55; }

/* شمارهٔ گزینه روی صفحه از فونتِ پوسته (وزیرمتن) می‌آید، نه از فونتِ سؤال:
   رقمِ ب نازنین داخلِ کادرِ کوچکِ شماره ریز و کم‌جان دیده می‌شد و با بقیهٔ
   عددهای رابط یکدست نبود. متنِ گزینه بالاتر خودش خانواده را می‌گیرد؛ اینجا
   فقط ارثِ رسیده به خودِ شماره خنثی می‌شود. برگهٔ چاپ (.pq-option) استثناست
   و فونتِ سؤال را نگه می‌دارد، چون آنجا کلِ صفحه باید مثل کتاب دیده شود. */
.qv-opts > span > b,
.draw-question-options > div > b { font-family: "Vazirmatn", Tahoma, sans-serif; }
/* شمارهٔ گزینه هم‌قدِ متنِ گزینه است: ضریب --q-scale روی متن اعمال می‌شود و اگر
   به خودِ شماره نرسد، «۱)» کنارِ متن ریز و کم‌جان دیده می‌شود. */
.pq-option > b { font-family: var(--q-font); font-size: calc(1em * var(--q-scale)); }

/* فرمول هم همان قرارداد را می‌گیرد: حرف و عددِ لاتینِ داخل فرمول XITS (Times)
   می‌شود — دقیقاً مثل دفترچهٔ کنکور — و متنِ فارسیِ \text{} و ارقامِ فارسی‌شده
   از ب نازنین/وزیرمتن می‌آیند. همه از یک خانوادهٔ ترکیبی، پس تفکیک خودکار است.

   KaTeX_Main بعد از آن در زنجیره می‌ماند و همین نگهش می‌دارد: نشانه‌هایی که در
   XITS نیستند (∑ ∏ ∫ ∈ و …) از فونتِ خودِ KaTeX می‌آیند. کلاس‌های ساختاری
   (delimsizing، size1..4، AMS، Caligraphic، Script) هم font-family صریحِ خودشان
   را دارند و دست‌نخورده می‌مانند — بدون آن‌ها پرانتزِ بلند و رادیکال می‌شکند. */
.mkm .katex { font-family: "MK Question", KaTeX_Main, "Times New Roman", serif; font-size: 1em; }
/* خودِ KaTeX کل فرمول را ۱٫۲۱em می‌گیرد. XITS با همان اندازهٔ متن خواناست و
   بزرگ‌نماییِ اضافه باعث می‌شد x/H/… از ضریب و عددِ کنارش درشت‌تر بیفتد؛ ۱em
   اندازهٔ پایه را با متن و ارقام یکسان می‌کند.

   در جهتِ مقابل، KaTeX توان، اندیس و اجزای کسرِ inline را ۰٫۷em و اندیسِ
   رادیکال/اندازهٔ tiny را حتی ۰٫۵em می‌کند. نگاشتِ خواناترِ ما ۰٫۷ برای
   کوچک‌ترین سطح، ۰٫۷۵ برای سطح بعدی و ۰٫۸ برای توان/اندیس عادی است. لایهٔ
   تو‌در‌توی توان/اندیس هم ۰٫۸ِ مرحلهٔ اول (در مجموع ۰٫۶۴ اندازهٔ پایه) می‌شود. */
.mkm .katex .fontsize-ensurer.reset-size6.size1,
.mkm .katex .sizing.reset-size6.size1 { font-size: 0.7em; }
.mkm .katex .fontsize-ensurer.reset-size6.size2,
.mkm .katex .sizing.reset-size6.size2 { font-size: 0.75em; }
.mkm .katex .fontsize-ensurer.reset-size6.size3,
.mkm .katex .sizing.reset-size6.size3 { font-size: 0.8em; }
.mkm .katex .fontsize-ensurer.reset-size3.size1,
.mkm .katex .sizing.reset-size3.size1 { font-size: 0.8em; }
/* KaTeX متغیرِ ساده‌ای مثل `x` را .mathnormal و به‌طور پیش‌فرض italic می‌کند.
   در خروجیِ کنکورِ مرجع و متنِ انگلیسیِ سؤال، همان حرف upright است؛ بنابراین
   علاوه بر خانواده، style هم باید اینجا صریحاً همسان شود. حالت‌های درخواستیِ
   \mathit/\textit پایین‌تر همچنان italic می‌مانند. */
.mkm .katex .mathnormal {
  font-family: "MK Question", KaTeX_Math, serif;
  font-style: normal;
}
.mkm .katex .mathrm,
.mkm .katex .textrm,
.mkm .katex .mathbf,
.mkm .katex .textbf,
.mkm .katex .mathit,
.mkm .katex .textit { font-family: "MK Question", KaTeX_Main, serif; }
.mkm .katex .mathsf,
.mkm .katex .textsf { font-family: KaTeX_SansSerif, "MK Question", sans-serif; }
.mkm .katex .mathtt,
.mkm .katex .texttt { font-family: KaTeX_Typewriter, monospace; }
/* اندازهٔ این گلیف‌ها بالاتر ۱em شده و اینجا فقط خانوادهٔ نهاییِ متنِ سؤال را
   می‌گیرد تا ویرایشگر، نمایش سایت و PDF دقیقاً یک خروجی داشته باشند. */
.mkm .mkm-fa { font-family: var(--q-font); }

/* ── استثنای اکسان: اینجا فونت باید به خودِ KaTeX برگردد ──────────────────────
   KaTeX جای کلاهک/تیلده/بردار را با یک margin منفی می‌گذارد که مقدارش را از
   عرضِ گلیفِ پایه در فونت‌های *خودش* حساب کرده است. اگر گلیفِ پایه از فونت
   دیگری بیاید و عرضش فرق کند، اکسان از وسطِ حرف می‌لغزد: `\hat{x}` کلاهک را
   روی خودِ x می‌اندازد و یک لکهٔ ناخوانا می‌سازد (سنجیده و دیده شد).

   `\overline{}`/`\underline{}` مشکلی ندارند چون خطشان با عرضِ واقعیِ محتوا
   کشیده می‌شود، نه با عددِ ازپیش‌حساب‌شده؛ فقط `.accent` برمی‌گردد.

   هزینه‌اش این است که حرفِ زیرِ اکسان با فونتِ KaTeX می‌آید نه Times — در برابرِ
   اکسانِ جابه‌جا، معاملهٔ درستی است. */
.mkm .katex .accent .mord,
.mkm .katex .accent .mathnormal,
.mkm .katex .accent .mathrm,
.mkm .katex .accent .textrm { font-family: KaTeX_Main, serif; }
.mkm .katex .accent .mathnormal {
  font-family: KaTeX_Math, serif;
  font-style: italic;
}

/* ── نوار پیشرفت آپلود فایل پوشه ────────────────────────────────────────────
   کنار توست‌ها می‌نشیند ولی خودش توست نیست: سرِ جایش به‌روز می‌شود و تا پایان
   کار می‌ماند، به‌جای اینکه هر ۱۰٪ یک پیام تازه روی هم تلنبار شود. */
.upload-progress {
  min-width: 280px;
  max-width: 390px;
  background: #292721;
  color: white;
  border-radius: 12px;
  padding: 12px 14px;
  box-shadow: 0 14px 35px rgba(0,0,0,.2);
  border-right: 4px solid var(--teal);
  animation: toast-in .22s ease;
}
.upload-progress .up-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.upload-progress .up-head strong {
  font-size: 11px; font-weight: 800; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.upload-progress .up-head span { flex: none; font-size: 12px; font-weight: 900; color: #7fd6c3; }
.upload-progress .up-bar { height: 7px; border-radius: 999px; background: rgba(255,255,255,.14); overflow: hidden; }
.upload-progress .up-bar i {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, #3fa38c, var(--teal));
  transition: width .2s ease;
}
/* پیشرفت نامعلوم (آپلود محلی): نوار راه‌راهِ متحرک به‌جای عدد */
.upload-progress .up-bar.unknown i {
  background-image: linear-gradient(115deg, rgba(255,255,255,.32) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.32) 50%, rgba(255,255,255,.32) 75%, transparent 75%);
  background-size: 18px 18px;
  animation: up-stripes .7s linear infinite;
}
.upload-progress small { display: block; margin-top: 7px; font-size: 10px; color: rgba(255,255,255,.55); }
@keyframes up-stripes { from { background-position: 0 0; } to { background-position: 18px 0; } }
@media (prefers-reduced-motion: reduce) {
  .upload-progress .up-bar i { transition: none; animation: none; }
}