/* Maghzeto specialist panel — panel.maghzeto.ir
   -------------------------------------------------------------------------
   A deliberate sibling of admin/static/admin.css, not a copy: same dense
   "instrument" rhythm, same primitives (.card/.kpi/table/.btn/.result-page),
   so anything already written for the admin panel drops in here unchanged.

   What differs on purpose is the ONE thing a specialist sees first: the
   chrome is NAVY (#16263F), not the admin panel's near-black brand ink
   (#17191C). Same family, different room — a specialist logging in should
   never wonder whether they are looking at the clinic's own back office.
   The peach accent (#FBE1D1 / #5D2A1A) is untouched, since that is the
   thread that keeps both panels reading as Maghzeto.

   Fonts are self-hosted (project convention, and a hard practical
   requirement on this audience's network — Google's font CDN is slow or
   blocked in Iran, which is exactly what the old inline <style> in
   base.html was silently hitting, meaning the panel has most likely been
   rendering in a fallback face this whole time). Only Vazirmatn: Estedad
   is the public site's editorial display face and has no job in an
   instrument. */

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('fonts/vazirmatn-arabic.woff2') format('woff2');
}
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('fonts/vazirmatn-latin.woff2') format('woff2');
}

:root {
  /* Navy chrome — the one axis this panel differs from admin.css on. */
  --navy: #16263F;
  --navy-deep: #0F1B2E;
  --navy-line: rgba(255, 255, 255, .09);
  --navy-dim: rgba(255, 255, 255, .62);
  --navy-dimmer: rgba(255, 255, 255, .60);

  --bg: #F7F8FA;
  --panel: #FFFFFF;
  --surface: #F1F3F6;
  --ink: #16263F;          /* headings, filled buttons — navy, not near-black */
  --body: #2A3444;         /* long-form body copy, softer than headings */
  --muted: #5B6575;
  --faint: #6E7787;
  --placeholder: #78808D;
  --border: #E7EAEF;

  --accent-bg: #FBE1D1;
  --accent-ink: #5D2A1A;
  --mint-bg: #DFF5E3;
  --mint-ink: #14532D;
  --danger-bg: #FBEAE6;
  --danger-ink: #A1402F;
  --info-bg: #E6EDF7;
  --info-ink: #1E3A5F;

  --sidebar-w: 248px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-pill: 999px;
  --shadow-soft: 0 1px 2px rgba(22, 38, 63, .04), 0 8px 24px rgba(22, 38, 63, .06);
}

* { box-sizing: border-box; }
html, body { height: 100%; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--body);
  font-family: 'Vazirmatn', Tahoma, system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { color: var(--ink); }

/* ---------------------------------------------------------------- shell */

.shell { display: flex; min-height: 100vh; }

/* Sidebar is written FIRST in the DOM and lands on the right in RTL flex —
   no absolute positioning, so it stays a normal scrollable column. Same
   trick as admin.css; see that file's note. */
.sidebar {
  width: var(--sidebar-w);
  flex: 0 0 var(--sidebar-w);
  background: var(--navy);
  color: #fff;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
}

.sidebar__brand {
  padding: 20px 20px 16px;
  background: var(--navy-deep);
  border-bottom: 1px solid var(--navy-line);
}
.sidebar__brand b { font-size: 16px; font-weight: 800; letter-spacing: -.01em; }
.sidebar__brand span { display: block; font-size: 11.5px; color: var(--navy-dimmer); margin-top: 2px; }

.sidebar__nav { padding: 10px 10px 16px; flex: 1; overflow-y: auto; }

/* Group heading — the whole point of this redesign is that the nav reads as
   three or four short lists, never one long one. */
.navgroup { margin-top: 14px; }
.navgroup:first-child { margin-top: 2px; }
.navgroup__title {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--navy-dimmer);
  padding: 0 12px 6px;
  margin: 0;
}

.navitem {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: var(--r-md);
  color: var(--navy-dim);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 2px;
  transition: background .15s, color .15s;
}
.navitem:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.navitem--active { background: rgba(255, 255, 255, .13); color: #fff; font-weight: 600; }
.navitem__icon { font-size: 13px; opacity: .85; width: 16px; text-align: center; flex: none; }
.navitem__badge {
  margin-inline-start: auto;
  font-size: 11px;
  font-weight: 700;
  min-width: 18px;
  padding: 1px 6px;
  border-radius: var(--r-pill);
  background: var(--accent-bg);
  color: var(--accent-ink);
  text-align: center;
}
/* A nav item for a phase that isn't built yet: visible so the specialist can
   see where the product is going, but obviously not clickable. Never a dead
   link that 404s. */
.navitem--soon { opacity: .38; cursor: default; pointer-events: none; }
.navitem--soon .navitem__badge { background: rgba(255, 255, 255, .1); color: var(--navy-dimmer); font-weight: 500; }

.sidebar__foot {
  padding: 13px 18px 16px;
  border-top: 1px solid var(--navy-line);
  font-size: 12.5px;
  color: var(--navy-dimmer);
}
.sidebar__foot b { display: block; color: #fff; font-size: 13.5px; font-weight: 600; }
.sidebar__foot a { color: var(--navy-dim); }
.sidebar__foot a:hover { color: #fff; }

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

.topbar {
  background: var(--panel);
  border-bottom: 1px solid var(--border);
  padding: 15px 28px;
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
}
.topbar h1 { font-size: 19px; margin: 0; font-weight: 700; letter-spacing: -.01em; }
.topbar .sub { color: var(--muted); font-size: 13px; }
.topbar__bell {
  margin-inline-start: auto; position: relative; text-decoration: none;
  font-size: 18px; line-height: 1; opacity: .75;
}
.topbar__bell:hover { opacity: 1; }
.topbar__bell-badge {
  position: absolute; top: -7px; inset-inline-start: -9px;
  background: var(--danger-ink, #B3261E); color: #fff;
  border-radius: 999px; font-size: 10.5px; font-weight: 700;
  min-width: 16px; height: 16px; display: flex; align-items: center; justify-content: center;
  padding: 0 3px;
}

.content { padding: 22px 28px 56px; }
.content > * + * { margin-top: 16px; }

/* ---------------------------------------------------------------- primitives */

.card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 18px 20px;
}
.card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.card__head h2 { font-size: 14.5px; margin: 0; font-weight: 700; }
.hint { font-size: 12px; color: var(--faint); }
.lede { color: var(--muted); font-size: 13.5px; margin: 0 0 14px; }

.grid { display: grid; gap: 16px; }
.grid--kpi { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.grid--2 { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
@media (max-width: 1080px) { .grid--2 { grid-template-columns: 1fr; } }

.kpi {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 15px 18px;
}
.kpi__label { font-size: 12.5px; color: var(--muted); margin-bottom: 5px; }
.kpi__value { font-size: 26px; font-weight: 800; letter-spacing: -.02em; line-height: 1.25; color: var(--ink); }
.kpi__value small { font-size: 13px; font-weight: 600; color: var(--muted); margin-inline-start: 3px; }
.kpi__meta { font-size: 12px; color: var(--faint); margin-top: 4px; }
.kpi--accent { background: var(--accent-bg); border-color: transparent; color: var(--accent-ink); }
.kpi--accent .kpi__value { color: var(--accent-ink); }
.kpi--accent .kpi__label, .kpi--accent .kpi__meta { color: rgba(93, 42, 26, .68); }

/* Tables */
table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th, td { padding: 9px 10px; text-align: right; border-bottom: 1px solid var(--border); }
th { color: var(--faint); font-size: 11.5px; font-weight: 700; }
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover { background: #FBFCFD; }
td.num, th.num { font-variant-numeric: tabular-nums; }
td.ltr { direction: ltr; text-align: left; font-size: 12.5px; color: var(--muted); }
.table-scroll { overflow-x: auto; }

.tag {
  display: inline-block;
  font-size: 11.5px;
  padding: 1px 8px;
  border-radius: var(--r-pill);
  background: var(--surface);
  color: var(--muted);
  font-weight: 600;
}
.tag--ok { background: var(--mint-bg); color: var(--mint-ink); }
.tag--pending { background: var(--accent-bg); color: var(--accent-ink); }
.tag--off { background: var(--danger-bg); color: var(--danger-ink); }

.empty { color: var(--muted); font-size: 13.5px; padding: 26px 0; text-align: center; }

.note {
  background: var(--surface);
  border-radius: var(--r-md);
  padding: 11px 14px;
  font-size: 12.5px;
  color: var(--muted);
}
.note b { color: var(--ink); font-weight: 600; }

/* One "page" of a redeemed test result — the exact same Telegram HTML subset
   (<b>/<i>/<code>) the bots send, rendered as real HTML via Jinja's |safe.
   Kept byte-compatible with admin.css's own .result-page so a template can
   move between the two panels untouched. */
.result-page {
  white-space: pre-wrap;
  font-size: 13.5px;
  line-height: 1.9;
  padding: 12px 0;
  border-bottom: 1px dashed var(--border);
}
.result-page:last-child { border-bottom: none; }
.result-page code { background: var(--surface); border-radius: 4px; padding: 1px 5px; font-size: 13px; }

/* Bars — CSS only, no chart library, no CDN (project convention). */
.bars { display: flex; flex-direction: column; gap: 11px; }
.bar__top { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 5px; }
.bar__top b { font-weight: 600; }
.bar__top span { color: var(--muted); font-variant-numeric: tabular-nums; }
.bar__track { height: 7px; background: var(--surface); border-radius: var(--r-pill); overflow: hidden; }
.bar__fill { height: 100%; background: var(--navy); border-radius: var(--r-pill); }

/* ---------------------------------------------------------------- forms */

.field { margin-bottom: 14px; }
label { display: block; font-size: 12.5px; color: var(--muted); margin-bottom: 6px; font-weight: 500; }
label.inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: var(--body);
  font-weight: 400;
  margin: 0 0 8px;
  margin-inline-end: 14px;
}
label.inline input { width: auto; margin: 0; }

input[type=text], input[type=tel], input[type=email], input[type=date], select, textarea {
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-family: inherit;
  font-size: 14.5px;
  background: var(--panel);
  color: var(--body);
}
input[type=text], input[type=tel], input[type=email], textarea { width: 100%; }
textarea { line-height: 1.8; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--placeholder); }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--navy); outline-offset: 1px; border-color: transparent; }

input.code-readonly {
  direction: ltr;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13.5px;
  background: var(--surface);
}

.filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.filters input[type=text] { flex: 1 1 220px; width: auto; }
.filters select, .filters input[type=date] { flex: 0 0 auto; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 11px 22px;
  border-radius: var(--r-pill);
  font-family: inherit;
  font-weight: 600;
  font-size: 14px;
  border: 1px solid var(--navy);
  background: var(--navy);
  color: #fff;
  cursor: pointer;
}
.btn:hover { opacity: .9; }
.btn--block { width: 100%; }
.btn--ghost { background: transparent; color: var(--navy); }
.btn--sm { padding: 7px 14px; font-size: 13px; }

.error, .success, .info {
  border-radius: var(--r-md);
  padding: 10px 13px;
  font-size: 13px;
  margin-bottom: 14px;
}
.error { background: var(--danger-bg); color: var(--danger-ink); }
.success { background: var(--mint-bg); color: var(--mint-ink); }
.info { background: var(--info-bg); color: var(--info-ink); }

.otp-input {
  text-align: center;
  letter-spacing: .45em;
  font-size: 20px !important;
  font-weight: 700;
  padding-inline-start: .45em !important;
}

/* ---------------------------------------------------------------- login */

.login-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background:
    radial-gradient(1100px 520px at 78% -12%, rgba(22, 38, 63, .12) 0%, rgba(22, 38, 63, 0) 62%),
    var(--bg);
}
.login {
  width: 100%;
  max-width: 384px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 30px 28px;
  box-shadow: var(--shadow-soft);
}
.login__brand { font-size: 19px; font-weight: 800; margin-bottom: 3px; color: var(--ink); }
.login__sub { color: var(--muted); font-size: 13px; margin: 0 0 20px; }

/* ---------------------------------------------------------------- responsive */

/* موبایل: سایدبار می‌شود کشوی کناری با دکمه‌ی همبرگری (به‌جای نوارِ اسکرول‌شونده‌ی افقی که
   خیلی‌ها نمی‌فهمیدند باید اسکرول کنند). فقط transform/opacity انیمیت می‌شود. */
.burger, .sidebar__close, .navscrim { display: none; }
@media (max-width: 820px) {
  .shell { display: block; }
  .content, .topbar { padding-inline: 16px; }

  .topbar { position: sticky; top: 0; z-index: 40; flex-wrap: nowrap; gap: 10px; padding-block: 10px; background: var(--navy); border-bottom: 1px solid var(--navy-line); box-shadow: 0 6px 18px rgba(15, 27, 46, .18); }
  .topbar h1 { color: #fff; }
  .topbar__bell { color: rgba(255, 255, 255, .85); }
  .topbar__bell:hover, .topbar__bell:active { background: rgba(255, 255, 255, .12); color: #fff; }
  .topbar__bell-badge { box-shadow: 0 0 0 2px var(--navy); }
  .topbar h1 { font-size: 17px; flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .topbar .sub { display: none; }

  .burger {
    display: grid; place-items: center; position: relative; flex: none;
    width: 42px; height: 42px; margin-inline-end: 2px; padding: 0; cursor: pointer;
    border: 1px solid rgba(255, 255, 255, .16); border-radius: 13px; background: rgba(255, 255, 255, .08); color: #fff;
    transition: background .15s, border-color .15s, transform .15s;
    -webkit-tap-highlight-color: transparent;
  }
  .burger:active { transform: scale(.94); }
  .burger:focus-visible { outline: 2px solid var(--accent-bg); outline-offset: 2px; }
  .burger__bars { position: relative; width: 18px; height: 14px; display: block; }
  .burger__bars i {
    position: absolute; inset-inline: 0; height: 2px; border-radius: 2px; background: currentColor;
    transition: transform .28s cubic-bezier(.4, 0, .2, 1), opacity .2s, width .2s;
  }
  .burger__bars i:nth-child(1) { top: 0; }
  .burger__bars i:nth-child(2) { top: 6px; width: 70%; inset-inline-start: auto; inset-inline-end: 0; }
  .burger__bars i:nth-child(3) { top: 12px; }
  .nav-open .burger { background: rgba(255, 255, 255, .18); border-color: rgba(255, 255, 255, .3); }
  .nav-open .burger__bars i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .nav-open .burger__bars i:nth-child(2) { opacity: 0; }
  .nav-open .burger__bars i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .burger__dot {
    position: absolute; top: 6px; inset-inline-start: 6px; width: 9px; height: 9px; border-radius: 50%;
    background: #FF8A3D; border: 2px solid var(--navy);
  }
  .nav-open .burger__dot { display: none; }

  .navscrim {
    display: block; position: fixed; inset: 0; z-index: 1000;
    background: rgba(15, 27, 46, .55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
    animation: navfade .22s ease both;
  }
  .navscrim[hidden] { display: none; }

  .sidebar {
    position: fixed; z-index: 1001; top: 0; bottom: 0; inset-inline-start: 0;
    width: min(86vw, 330px); height: 100%; flex: none;
    transform: translateX(104%); visibility: hidden;
    transition: transform .32s cubic-bezier(.32, .72, 0, 1), visibility 0s linear .32s;
    box-shadow: -18px 0 48px rgba(15, 27, 46, .35);
    border-radius: 24px 0 0 24px;
    overflow: hidden;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .nav-open .sidebar { transform: none; visibility: visible; transition-delay: 0s; }
  body.nav-open { overflow: hidden; }

  .sidebar__brand { display: flex; align-items: center; justify-content: space-between; padding: 22px 20px 18px; }
  .sidebar__brand b { font-size: 19px; }
  .sidebar__close {
    display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; cursor: pointer;
    border: 1px solid var(--navy-line); background: rgba(255, 255, 255, .06); color: #fff;
  }
  .sidebar__close:active { background: rgba(255, 255, 255, .14); }

  .sidebar__nav { display: block; overflow-y: auto; overscroll-behavior: contain; padding: 8px 12px 20px; }
  .navgroup { display: block; margin-top: 18px; }
  .navgroup:first-child { margin-top: 6px; }
  .navgroup__title { display: block; padding: 0 12px 8px; font-size: 11.5px; }
  .navitem { white-space: normal; margin-bottom: 3px; padding: 12px 14px; font-size: 15px; gap: 12px; }
  .navitem--active { background: rgba(255, 255, 255, .14); }
  .navitem--active::before { inset-inline-start: -12px; }
  .navitem__icon { width: 22px; height: 22px; }
  .navitem--soon { display: none; }
  /* ورود آرام گزینه‌ها هنگام بازشدن */
  .nav-open .navitem { animation: navin .38s cubic-bezier(.2, .7, .2, 1) both; }
  .nav-open .navgroup:nth-child(2) .navitem { animation-delay: .04s; }
  .nav-open .navgroup:nth-child(3) .navitem { animation-delay: .08s; }
  .nav-open .navgroup:nth-child(4) .navitem { animation-delay: .12s; }

  .sidebar__foot { display: flex; justify-content: space-between; align-items: center; padding: 14px 20px 18px; }
  .sidebar__foot b { display: inline; }
  .sidebar__foot a { padding: 7px 12px; border: 1px solid var(--navy-line); border-radius: 10px; font-size: 12.5px; }
}
@keyframes navfade { from { opacity: 0; } to { opacity: 1; } }
@keyframes navin { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .sidebar, .burger__bars i, .navscrim, .nav-open .navitem { transition: none !important; animation: none !important; }
}

/* ---------------------------------------------------------------- MBTI case report (case_typemap.html)
   Ported verbatim from that template's own inline <style> (phase 1,
   2026-09-16) -- it stayed inline at the time because this file was being
   rewritten by a parallel session and a shared edit would have clobbered
   one or the other's work. Every class here is prefixed `cx-` (or `.cx`
   itself) specifically so it never collided with anything above; that's
   still true now, this is just a location change, not a rename.
   Palette comes from Maghzeto/docs/TEST-RESULT-DESIGN-SYSTEM.md (one color
   per content family, not one per card) and the hero gradient from
   engine/typemap/portraits.py's GROUP_COLORS/GROUP_INK -- the same color
   the site and both bots use for that type, not a re-derived approximation. */
/* ---------------------------------------------------- پروفایل عمومی من
   «badge» (زنده/نیازِ تایید)، تگ‌های تخصص به‌شکلِ chip روی چک‌باکس‌های
   واقعی (بدونِ نیاز به جاوااسکریپت، فقط CSS sibling-selector)، و قاب/
   آپلودِ عکس + کارتِ پیش‌نمایشِ دایرکتوری. */
.badge {
  display: inline-flex; align-items: center;
  font-size: 11px; font-weight: 700;
  padding: 3px 10px; border-radius: var(--r-pill);
  white-space: nowrap;
}
.badge--live { background: var(--mint-bg); color: var(--mint-ink); }
.badge--review { background: var(--accent-bg); color: var(--accent-ink); }

.pp-photo-row { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.pp-photo-frame {
  width: 108px; height: 108px; flex: 0 0 108px;
  border-radius: var(--r-lg); overflow: hidden;
  background: var(--surface); border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
}
.pp-photo-frame img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.pp-photo-placeholder { font-size: 34px; font-weight: 800; color: var(--faint); }
.pp-photo-upload { flex: 1 1 220px; min-width: 220px; }
.pp-filebtn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 16px; border: 1px dashed var(--border); border-radius: var(--r-md);
  font-size: 13.5px; color: var(--navy); cursor: pointer; width: 100%;
  background: var(--surface); text-align: center;
}
.pp-filebtn:hover { border-color: var(--navy); }
.pp-photo-hint { font-size: 12px; color: var(--faint); margin: 8px 0 12px; }

.chiptag-row { display: flex; flex-wrap: wrap; gap: 8px; }
.chiptag { display: inline-flex; cursor: pointer; }
.chiptag input {
  position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none;
}
.chiptag span {
  display: inline-flex; align-items: center;
  padding: 7px 14px; border-radius: var(--r-pill);
  background: var(--surface); color: var(--muted);
  font-size: 13px; font-weight: 600; border: 1px solid transparent;
  transition: background .12s, color .12s;
}
.chiptag input:checked + span { background: var(--accent-bg); color: var(--accent-ink); }
.chiptag input:focus-visible + span { outline: 2px solid var(--navy); outline-offset: 2px; }
.chiptag:hover span { border-color: var(--border); }

.pp-preview-card {
  border: 1px solid var(--border); border-radius: var(--r-lg);
  padding: 18px; display: flex; gap: 16px; align-items: flex-start; max-width: 440px;
}
.pp-preview-photo {
  width: 64px; height: 64px; flex: 0 0 64px; border-radius: var(--r-md);
  overflow: hidden; background: var(--surface);
  display: flex; align-items: center; justify-content: center;
}
.pp-preview-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.pp-preview-photo span { font-size: 22px; font-weight: 800; color: var(--faint); }
.pp-preview-body b { font-size: 16px; color: var(--ink); }
.pp-preview-title { color: var(--faint); font-size: 13.5px; margin-top: 2px; }
.pp-preview-body p { margin: 8px 0 0; font-size: 13.5px; }
.pp-preview-bio { color: var(--muted); font-size: 13px; }
.pp-preview-meta { font-size: 12.5px; color: var(--muted); }
.pp-preview-tags { display: flex; flex-wrap: wrap; gap: 4px; }

.cx{--cx-line:#E7E2DA;--cx-ink:#17191C;--cx-mute:#6B6F78;--cx-faint:#9A9EA6;
    --ok-bg:#DFF5E3;--ok-ink:#14532D;--warn-bg:#FBEFC7;--warn-ink:#6B5416;
    --alert-bg:#FBE0E0;--alert-ink:#7A2E2E;--mute-bg:#F1EFEB;--mute-ink:#5A5E66;
    --sky-bg:#DCEEF7;--sky-ink:#1B4965;--lav-bg:#E6E1F5;--lav-ink:#3D3266;
    --priv-bg:#EDE7F6;--priv-ink:#432C6B;
    max-width:none;line-height:1.85}
.cx *{box-sizing:border-box}
.cx h2{font-size:18px;margin:0}
.cx h3{font-size:15.5px;margin:0 0 4px}
.cx p{margin:0 0 10px}

/* --- شماره‌گذاریِ بخش‌ها: متخصص باید بتواند بگوید «بخش ۴ را ببین» --- */
.cx-sec{margin:0 0 26px}
.cx-sec__head{display:flex;align-items:baseline;gap:10px;margin:0 0 12px;flex-wrap:wrap}

/* --- گزارشی که سایت نشان می‌دهد (۲۰۲۶-۰۹-۳۰): بخشِ اول هر پرونده، قبل از تفسیر تخصصی --- */
.cx-sec--sitereport{background:#F7F4EC;border:1px solid var(--cx-line);border-radius:16px;padding:18px 18px 6px;margin:0 0 30px}
.cx-sec--sitereport .cx-sec__head h2{font-size:17px}
.cx-sec--sitereport .cx-det{background:#fff}
/* the start of the specialist version, right after the two client reports (owner 2026-10-01) */
.cx-pro-divider{display:flex;align-items:center;gap:16px;margin:4px 0 28px;padding:18px 22px;border-radius:16px;color:#eaf4ee;background-color:#163527;background-image:radial-gradient(90% 140% at 100% 0%,rgba(92,160,124,.5),transparent 60%),linear-gradient(158deg,#1d4433,#122f22);border:1px solid rgba(255,255,255,.09);box-shadow:0 22px 38px -30px rgba(12,38,27,.7)}
.cx-pro-divider__icon{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#FBE1D1;color:#163527}
.cx-pro-divider h2{margin:0 0 4px;font-size:19px;line-height:1.4;color:#fff}
.cx-pro-divider p{margin:0;font-size:13.5px;line-height:1.85;color:rgba(234,244,238,.82)}
/* collapse / expand everything under the specialist divider; the choice is remembered (localStorage) */
.cx-pro-divider__toggle{flex:none;margin-inline-start:auto;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#eaf4ee;font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s,transform .15s}
.cx-pro-divider__toggle:hover{background:rgba(255,255,255,.18)}
.cx-pro-divider__toggle:active{transform:scale(.97)}
.cx-pro-divider__toggle:focus-visible{outline:2px solid #FBE1D1;outline-offset:2px}
.cx-pro-divider__toggle svg{transition:transform .25s ease}
.cx-pro-divider.is-collapsed .cx-pro-divider__toggle svg{transform:rotate(180deg)}
.cx-pro-divider.is-collapsed ~ *:not(script):not(style){display:none!important}
.cx-pro-divider.is-collapsed{margin-bottom:12px}
/* the client's website reports (base + full) never go into the specialist's PDF: only the specialist version prints (owner 2026-10-01) */
@media print{.cx-sec--sitereport,.cx-pro-divider{display:none!important}}
@media print{.cx-pro-divider__toggle{display:none}.cx-pro-divider.is-collapsed ~ *{display:revert!important}}
@media(max-width:560px){.cx-pro-divider__toggle{align-self:flex-end;margin-inline-start:0}}
@media print{.cx-pro-divider{background-image:none!important;box-shadow:none!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}}
@media(max-width:560px){.cx-pro-divider{flex-direction:column;align-items:flex-start;gap:10px;padding:16px}}

.cx-sec__n{width:26px;height:26px;flex:0 0 26px;border-radius:50%;background:var(--cx-ink);
           color:#fff;font-size:12.5px;font-weight:700;display:flex;align-items:center;
           justify-content:center;line-height:1}
.cx-sec__note{color:var(--cx-mute);font-size:13.5px;margin:0}
.cx-card{background:#fff;border:1px solid var(--cx-line);border-radius:16px;padding:20px 22px}

/* --- نیمرخ خطی (سبک کلاسیک MMPI): چارتش عمداً به‌اندازه‌ی خودش رندر می‌شود، نه اندازه‌ی
   کارت — روی موبایل با کد ۱۶ مقیاس فشرده و ناخوانا می‌شد اگر کوچک می‌شد؛ حالا به‌جایش
   افقی اسکرول می‌کند (mpt-chart--profile در charts_svg.py خودش width/height ثابت دارد) --- */
.cx-chart__t{margin:0 0 4px;font-size:15.5px}
.cx-chart__svg{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -4px 8px;padding:0 4px}
.cx-chart__svg svg.mpt-chart--profile{display:block;max-width:none}
.cx-chart__sub{margin:0 0 8px;font-size:12.5px;color:var(--cx-mute);line-height:1.8}
.cx-chart__legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;line-height:1.8}
.cx-chart__legend span{white-space:nowrap}
@media print{.cx-chart__svg{overflow-x:visible}}

/* --- سربرگ --- */
.cx-hero{border-radius:20px;padding:24px 26px;display:flex;gap:22px;align-items:flex-start;
         flex-wrap:wrap;margin:0 0 18px}
.cx-hero__img{width:132px;height:132px;flex:0 0 132px;border-radius:16px;object-fit:contain;
              background:rgba(255,255,255,.45)}
.cx-hero__body{flex:1;min-width:260px}
.cx-hero__code{font-size:34px;font-weight:800;letter-spacing:1px;line-height:1.1;margin:0}
.cx-hero__name{font-size:19px;font-weight:700;margin:2px 0 6px}
.cx-hero__blurb{font-size:15px;margin:0 0 10px;opacity:.9}
.cx-hero__desc{font-size:14.5px;margin:0;opacity:.85}
.cx-hero--nt{background:linear-gradient(135deg,#F1EDFB,#E1D9F5 55%,#D6CBF0);color:#3D3266}
.cx-hero--nf{background:linear-gradient(135deg,#EBF7EF,#D2ECDA 55%,#BEE2C9);color:#2C5B3C}
.cx-hero--sj{background:linear-gradient(135deg,#EAF5F7,#D0EAEE 55%,#B9DFE6);color:#1B535F}
.cx-hero--sp{background:linear-gradient(135deg,#FBF3E3,#F5E3C0 55%,#EFD49C);color:#6E4B14}

/* --- چیپ‌های شناسنامه --- */
.cx-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}
.cx-chip{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--cx-line);
         border-radius:999px;padding:5px 12px;font-size:13px;color:var(--cx-ink)}
.cx-chip b{color:var(--cx-faint);font-weight:600;font-size:11.5px}
.cx-chip--btn{cursor:pointer;font-family:inherit}

/* --- کاشی‌های «در یک نگاه» --- */
.cx-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:10px;margin:0 0 8px}
.cx-tile{border-radius:14px;padding:13px 15px;border:1px solid transparent}
.cx-tile__l{font-size:11.5px;font-weight:700;opacity:.75;margin:0 0 2px}
.cx-tile__v{font-size:17px;font-weight:800;margin:0 0 4px;line-height:1.3}
.cx-tile__h{font-size:11.5px;line-height:1.6;margin:0;opacity:.8}
.t-ok{background:var(--ok-bg);color:var(--ok-ink)}
.t-warn{background:var(--warn-bg);color:var(--warn-ink)}
.t-alert{background:var(--alert-bg);color:var(--alert-ink)}
.t-mute{background:var(--mute-bg);color:var(--mute-ink)}
.t-private{background:var(--priv-bg);color:var(--priv-ink);border-color:var(--priv-ink);border-style:dashed}

/* --- هشدارِ قفلِ ادعا --- */
.cx-lock{background:var(--warn-bg);color:var(--warn-ink);border-radius:14px;padding:13px 16px;
         font-size:13.5px;margin:0 0 22px}
.cx-lock b{display:block;margin-bottom:2px}

/* --- جدولِ شاخص‌های اعتبار --- */
.cx-vrow{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:baseline;
         padding:12px 0;border-bottom:1px solid var(--cx-line)}
.cx-vrow:last-child{border-bottom:0;padding-bottom:0}
.cx-vrow__v{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.cx-vrow__h{grid-column:1/-1;font-size:12.5px;color:var(--cx-mute);margin:0}
.cx-vrow__t{grid-column:1/-1;font-size:11.5px;color:var(--cx-faint);margin:0}
.cx-pill{display:inline-block;border-radius:999px;padding:2px 9px;font-size:11.5px;font-weight:700;
         vertical-align:middle;margin-inline-start:6px}

/* --- قطبیت --- */
.cx-pol{display:grid;grid-template-columns:auto 1fr auto;gap:8px 12px;align-items:center;font-size:13px}
.cx-pol__bar{height:8px;border-radius:999px;background:var(--mute-bg);overflow:hidden}
.cx-pol__fill{height:100%;border-radius:999px;background:var(--sky-ink)}
.cx-pol__fill--flag{background:var(--alert-ink)}

/* --- نوارِ SEM: قلبِ این صفحه --- */
.cx-axis{position:relative;height:100%;direction:ltr}
.cx-bar{position:relative;height:38px;background:#FAF8F5;border:1px solid var(--cx-line);
        border-radius:10px;direction:ltr;overflow:hidden}
.cx-bar--sm{height:26px}
.cx-bar__mid{position:absolute;top:0;bottom:0;background:#EFECE6}
.cx-bar__tick{position:absolute;top:0;bottom:0;width:1px;background:#DFDAD1}
.cx-bar__zero{position:absolute;top:0;bottom:0;width:2px;background:var(--cx-ink);opacity:.55;left:calc(50% - 1px)}
.cx-bar__range{position:absolute;top:50%;height:6px;transform:translateY(-50%);border-radius:999px;
               background:currentColor;opacity:.22}
.cx-bar__fill{position:absolute;top:50%;height:12px;transform:translateY(-50%);border-radius:999px;
              background:currentColor;opacity:.55}
.cx-bar__dot{position:absolute;top:50%;width:14px;height:14px;margin-left:-7px;transform:translateY(-50%);
             border-radius:50%;background:currentColor;box-shadow:0 0 0 2.5px #fff}
.cx-bar--sm .cx-bar__dot{width:11px;height:11px;margin-left:-5.5px;box-shadow:0 0 0 2px #fff}
.cx-bar--sm .cx-bar__fill{height:8px}
.cx-bar__over{position:absolute;top:50%;transform:translateY(-50%);font-size:12px;font-weight:800;
              color:currentColor}
.cx-bar__over--high{right:4px}
.cx-bar__over--low{left:4px}
.c-ok{color:#2F6B44}.c-warn{color:#9A7418}.c-alert{color:#A1402F}.c-mute{color:#8C9098}

.cx-scale{display:flex;justify-content:space-between;direction:ltr;font-size:10.5px;
          color:var(--cx-faint);font-variant-numeric:tabular-nums;margin-top:4px}

/* --- بُعد --- */
.cx-dim{border:1px solid var(--cx-line);border-radius:14px;padding:16px 18px;margin:0 0 12px;background:#fff}
.cx-dim__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.cx-dim__letter{width:38px;height:38px;flex:0 0 38px;border-radius:11px;background:var(--lav-bg);
                color:var(--lav-ink);font-weight:800;font-size:18px;display:flex;align-items:center;
                justify-content:center;direction:ltr}
.cx-dim__name{font-weight:700;font-size:15.5px}
.cx-dim__sub{color:var(--cx-mute);font-size:12.5px}
.cx-poles{display:flex;justify-content:space-between;direction:ltr;font-size:12px;margin:0 0 5px}
.cx-poles span{color:var(--cx-mute)}
.cx-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;margin:12px 0 0}
.cx-fact{background:#FAF8F5;border-radius:10px;padding:8px 10px}
.cx-fact dt{font-size:11px;color:var(--cx-faint);font-weight:700;margin:0}
.cx-fact dd{margin:1px 0 0;font-size:14.5px;font-weight:700;font-variant-numeric:tabular-nums}

/* --- ویژگی --- */
.cx-fgroup{margin:0 0 18px}
.cx-fgroup__h{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:0 0 8px}
.cx-frow{display:grid;grid-template-columns:150px 1fr 118px;gap:12px;align-items:center;
         padding:7px 0;border-bottom:1px solid #F2EFEA}
.cx-frow:last-child{border-bottom:0}
.cx-fpoles{display:grid;grid-template-columns:150px 1fr 118px;gap:12px;margin:0 0 6px}
.cx-fpoles__in{display:flex;justify-content:space-between;direction:ltr;font-size:12px;
               color:var(--cx-mute)}
.cx-frow__n{font-size:13.5px;font-weight:600;line-height:1.5}
.cx-frow__c{font-size:10.5px;color:var(--cx-faint);direction:ltr;display:block}
.cx-frow__m{font-size:11.5px;color:var(--cx-mute);direction:rtl;text-align:left;
            font-variant-numeric:tabular-nums;line-height:1.7}
.cx-frow__m .cx-pill{margin:0 0 3px}
.cx-frow__num{display:block}
.cx-fnote{font-size:12.5px;color:var(--cx-mute);margin:8px 0 0}

/* --- کارت‌های رنگی --- */
.cx-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.cx-box{border-radius:14px;padding:16px 18px}
.cx-box h3{margin:0 0 6px;font-size:15px}
.cx-box p{font-size:13.5px;margin:0 0 8px}
.cx-box p:last-child{margin-bottom:0}
.b-sky{background:var(--sky-bg);color:var(--sky-ink)}
.b-lav{background:var(--lav-bg);color:var(--lav-ink)}
.b-gold{background:var(--warn-bg);color:var(--warn-ink)}
.b-rose{background:var(--alert-bg);color:var(--alert-ink)}
.b-mint{background:var(--ok-bg);color:var(--ok-ink)}

/* --- بُعد پنجم: عمداً شبیه هیچ‌چیز دیگری نیست --- */
.cx-private{background:var(--priv-bg);color:var(--priv-ink);border:2px dashed var(--priv-ink);
            border-radius:16px;padding:20px 22px}
.cx-gauge{height:14px;border-radius:999px;background:rgba(255,255,255,.65);overflow:hidden;
          margin:10px 0 6px;direction:ltr}
.cx-gauge__f{height:100%;background:var(--priv-ink);border-radius:999px}

/* --- کارکردها --- */
.cx-stack{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:10px}
.cx-fn{border:1px solid var(--cx-line);border-radius:14px;padding:14px 16px;background:#fff}
.cx-fn__r{font-size:11px;font-weight:700;color:var(--cx-faint)}
.cx-fn__t{font-size:16px;font-weight:800;margin:2px 0 1px}
.cx-fn__t span{font-size:12.5px;color:var(--cx-mute);font-weight:600;direction:ltr}
.cx-fn__b{font-size:12.5px;color:var(--cx-mute);margin:6px 0 0;line-height:1.7}

/* --- پرسش‌های مصاحبه --- */
.cx-asks{counter-reset:ask;list-style:none;padding:0;margin:0}
.cx-asks li{counter-increment:ask;position:relative;padding:12px 44px 12px 0;
            border-bottom:1px solid var(--cx-line);font-size:14.5px}
.cx-asks li:last-child{border-bottom:0}
.cx-asks li::before{content:counter(ask);position:absolute;right:0;top:12px;width:28px;height:28px;
                    border-radius:50%;background:var(--sky-bg);color:var(--sky-ink);font-size:13px;
                    font-weight:800;display:flex;align-items:center;justify-content:center}

/* --- جمع‌شونده‌ها --- */
.cx-det{border:1px solid var(--cx-line);border-radius:14px;background:#fff;margin:0 0 12px}
.cx-det>summary{cursor:pointer;padding:15px 18px;font-weight:700;font-size:15px;list-style:none}
.cx-det>summary::-webkit-details-marker{display:none}
.cx-det>summary::before{content:"▾ ";color:var(--cx-faint)}
.cx-det[open]>summary{border-bottom:1px solid var(--cx-line)}
.cx-det__b{padding:16px 18px}
.cx-page{border:1px solid var(--cx-line);border-radius:12px;padding:14px 16px;margin:0 0 10px;
         white-space:pre-wrap;font-size:13.5px;line-height:1.95;background:#FAF8F5}
.cx-page:last-child{margin-bottom:0}

/* --- فرمِ یادداشت --- */
.cx-note textarea{width:100%;padding:13px 15px;border:1px solid var(--cx-line);border-radius:12px;
                  font-family:inherit;font-size:15px;background:#FFFDF9;line-height:1.9}
.cx-note textarea:focus{outline:2px solid var(--cx-ink);outline-offset:1px}

/* --- SPECIALIST-OPINION-REPORT-PLAN.md فاز ۲: یادداشتِ داخلی جمع‌شده + بخشِ مراجعِ ساختاریافته --- */
.note-internal{margin:0 0 18px;background:#FAFAF8}
.note-internal>summary{display:flex;align-items:center;gap:8px}
.note-internal .note-lock{font-size:12px;font-weight:500;color:var(--cx-mute)}
.note-internal .cx-det__b textarea{margin:0 0 12px}
.note-internal label{display:block;font-size:13px;color:var(--cx-mute);margin:0 0 6px}
.note-client{display:flex;flex-direction:column;gap:16px;margin:0 0 16px}
.note-field label{display:block;font-size:14.5px;font-weight:700;margin:0 0 4px}
.note-field__hintrow{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:0 0 8px}
.note-field__hint{font-size:12.5px;color:var(--cx-mute);margin:0;line-height:1.7}
.note-suggest-btn{flex:0 0 auto;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:999px;
                   border:1px dashed var(--cx-line);background:transparent;color:var(--cx-ink);
                   white-space:nowrap;cursor:pointer}
.note-suggest-btn:hover{background:#F0ECE5}
.note-optional{font-size:11.5px;font-weight:500;color:var(--cx-mute);margin-inline-start:4px}
.note-field--safety textarea{border-color:#D9A441;background:#FFFBF2}
.note-legacy{background:#FFF7E8;border:1px dashed #D9A441;margin:0 0 16px}
.note-legacy__text{white-space:pre-wrap;font-size:13.5px;color:var(--cx-ink);margin:0 0 10px}
.note-preview{margin-top:20px;padding-top:16px;border-top:1px dashed var(--cx-line)}
.note-preview__label{font-size:12.5px;color:var(--cx-mute);margin:0 0 10px}
.note-preview__body{border:1px solid var(--cx-line);border-radius:14px;padding:16px 18px;background:var(--bg,#F7F8FA)}
.note-preview__sec{margin:0 0 14px}
.note-preview__sec:last-child{margin-bottom:0}
.note-preview__sec h4{margin:0 0 4px;font-size:13.5px;display:flex;align-items:center;gap:6px}
.note-preview__sec p{margin:0;font-size:14px;line-height:1.9;white-space:pre-wrap;color:var(--cx-ink)}
.note-preview__empty{margin:0;font-size:13.5px;color:var(--cx-mute)}

.cx-back{display:inline-block;color:var(--cx-mute);text-decoration:none;font-size:14px;margin:0 0 14px}
.cx-print{float:left}

@media (max-width:640px){
  .cx-frow{grid-template-columns:1fr;gap:4px}
  .cx-fpoles{display:none}
  .cx-frow__m{text-align:right}
  .cx-hero__img{width:96px;height:96px;flex:0 0 96px}
  .cx-hero__code{font-size:28px}
}
/* نسخه‌ی چاپ: متخصص گفته بود نسخه‌ی کاغذی برای بردن سرِ جلسه لازم است --
   به‌جای یک تولیدکننده‌ی PDF (وابستگیِ جدید)، همان صفحه با چاپِ مرورگر. */
@media print{
  html,body{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .sidebar,.topbar,.cx-back,.cx-print,.cx-note{display:none !important}
  .cx-det{border:0} .cx-det>summary{display:none} .cx-det__b{padding:0}
  .cx,.main,.content,.shell{max-width:none;margin:0;padding:0;display:block}
  .cx-sec{break-inside:avoid} .cx-dim,.cx-fn,.cx-tile{break-inside:avoid}
  .cx-bar{break-inside:avoid}
  body{background:#fff}
}

/* --- گزارش MMPI در پنل: اعداد/کدها جدا از متن (پلن خوانایی MMPI، فاز ۱) --- */
.cx-rs{margin-bottom:12px}
.cx-rs__t{margin:0 0 8px;font-size:16px}
.cx-rs__note{font-size:12.5px;color:var(--cx-mute);margin:8px 0 0;line-height:1.9}
.cx bdi[dir=ltr]{unicode-bidi:isolate}
.cx-rt{width:100%;border-collapse:collapse;font-size:13.5px}
.cx-rt tr{border-top:1px solid var(--cx-line)}
.cx-rt th,.cx-rt td{border:0;background:none}
.cx-rt th{padding:6px 4px;font-weight:600;text-align:right;vertical-align:top}
.cx-rt td{padding:6px 4px;vertical-align:top}
.cx-rt__v{white-space:nowrap;text-align:right}
.cx-rt__n{color:var(--cx-mute)}
.cx-rl{margin:6px 0 0;padding-inline-start:20px;font-size:13.5px;line-height:1.95}
.cx-map{padding:10px 0;border-top:1px solid var(--cx-line)}
.cx-map:first-of-type{border-top:0}
.cx-map__g{font-weight:600;font-size:13.5px;margin-bottom:6px}
.cx-map__c{display:flex;flex-wrap:wrap;gap:6px}
.cx-chipcell{display:inline-block;padding:3px 9px;border:1px solid var(--cx-line);border-radius:999px;
             background:#FAF8F5;font-size:13px;line-height:1.7;white-space:nowrap}
@media (max-width:640px){
  .cx-rt,.cx-rt tbody,.cx-rt tr,.cx-rt th,.cx-rt td{display:block;width:auto}
  .cx-rt tr{padding:8px 0}
  .cx-rt th,.cx-rt td{padding:1px 0}
  .cx-rt__v{text-align:right;white-space:normal;font-size:15px}
}
.cx-rl--plain{list-style:none;padding-inline-start:0}
.cx-rl--plain li{padding:8px 0;border-top:1px solid var(--cx-line)}
.cx-rl--plain li:first-child{border-top:0}

/* --- گزارش MMPI: خلاصه، ناوبری، نوار T، کارت‌ها (پلن خوانایی MMPI، فاز ۳ و ۴) --- */
.cx-sum{margin-bottom:14px}
.cx-sum__h{margin:0 0 12px;font-size:18px}
.cx-sum__h small{font-size:12px;color:var(--cx-faint);font-weight:500;margin-inline-start:6px}
.cx-sum__alert{border:1px solid #c0392b;background:#fdf0ee;border-radius:12px;padding:12px 14px;margin-bottom:12px;line-height:1.9;font-size:14px}
.cx-sum__row{display:grid;grid-template-columns:130px 1fr;gap:4px 12px;padding:10px 0;border-top:1px solid var(--cx-line)}
/* نیمرخِ خطیِ اصلی همین‌جا توی خلاصه هم دیده شود (نه فقط تب «نیمرخ») — درخواستِ کاربر: همان اول کار
   معلوم باشد. کارتِ چارت این‌جا با کارتِ خلاصه یکی می‌شود، نه یک کارتِ سفیدِ توی کارتِ سفید. */
.cx-sum__chart{padding:12px 0 4px;border-top:1px solid var(--cx-line)}
.cx-sum__chart .cx-chart{border:0;padding:0;background:transparent}
.cx-sum__k{font-size:12.5px;color:var(--cx-mute);font-weight:600;padding-top:3px}
.cx-sum__v{line-height:1.95;font-size:14px}
.cx-sum__v small{display:block;color:var(--cx-mute);font-size:12px}
.cx-sum__chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0}
.cx-sum__chips .cx-chipcell{white-space:normal;text-decoration:none;color:inherit}
.cx-sum__why,.cx-sum__steps{margin:6px 0 0;padding-inline-start:20px;font-size:13px;color:var(--cx-mute);line-height:1.9}
.cx-sum__steps{color:inherit;font-size:14px;margin:0}
.cx-sum__foot{margin:10px 0 0;font-size:12px;color:var(--cx-mute)}
.cx-lv{display:inline-block;padding:1px 10px;border-radius:999px;font-weight:700;font-size:13px;border:1px solid}
.cx-lv--ok{background:#e8f5ee;color:#1f7a4d;border-color:#1f7a4d}
.cx-lv--warn{background:#fff6e0;color:#8a5a00;border-color:#b98200}
.cx-lv--alert{background:#fdf0ee;color:#a12a1e;border-color:#c0392b}

.cx-jump{position:sticky;top:0;z-index:20;display:flex;gap:6px;overflow-x:auto;padding:8px 2px;margin:0 0 14px;
         background:rgba(247,248,250,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--cx-line);scrollbar-width:none}
.cx-jump::-webkit-scrollbar{display:none}
.cx-jump a{flex:0 0 auto;padding:8px 14px;min-height:36px;border-radius:999px;border:1px solid var(--cx-line);background:#fff;
           color:var(--cx-ink);font-size:13.5px;text-decoration:none;white-space:nowrap}
.cx-jump a.is-on{background:var(--cx-ink);color:#fff;border-color:var(--cx-ink)}
.cx-sec{scroll-margin-top:64px}

.cx-mk{display:inline-block;padding:0 8px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.9;border:1px solid;margin-inline-end:4px;white-space:nowrap}
.cx-mk--h{background:#fff6e0;color:#8a5a00;border-color:#b98200}
.cx-mk--vh{background:#fdf0ee;color:#a12a1e;border-color:#c0392b}
.cx-mk--lo{background:#eaf2fb;color:#1c5a96;border-color:#1c5a96}
.cx-mk--weak{background:#f1f1f1;color:#555;border-color:#aaa;font-weight:600}

.cx-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 10px}
.cx-tools__q{flex:1 1 200px;min-height:40px;padding:8px 12px;border:1px solid var(--cx-line);border-radius:10px;font:inherit;font-size:14px}
.cx-tools__c{font-size:13.5px;display:flex;gap:6px;align-items:center;min-height:40px;cursor:pointer}
.cx-grp{border-top:1px solid var(--cx-line);padding:4px 0}
.cx-grp>summary{cursor:pointer;font-weight:700;font-size:14.5px;padding:10px 0;min-height:44px;list-style:none;display:flex;align-items:center;gap:8px}
.cx-grp>summary::-webkit-details-marker{display:none}
.cx-grp>summary::before{content:"▾";color:var(--cx-faint)}
.cx-grp:not([open])>summary::before{content:"◂"}
.cx-grp__n{font-weight:500;font-size:12px;color:var(--cx-faint)}
.cx-sc{display:grid;grid-template-columns:minmax(120px,1.1fr) minmax(120px,1.4fr) 92px minmax(0,1.2fr);gap:4px 12px;align-items:center;padding:7px 0;border-top:1px dashed var(--cx-line)}
.cx-sc--high,.cx-sc--very_high{background:linear-gradient(90deg,transparent,rgba(185,130,0,.06))}
.cx-sc__name{font-size:14px}
.cx-sc__code{font-size:11.5px;color:var(--cx-faint);margin-inline-start:4px}
.cx-sc__t{font-weight:700;font-size:15px;line-height:1.3}
.cx-sc__t small{display:block;font-weight:400;font-size:11px;color:var(--cx-faint)}
.cx-sc__raw{grid-column:2/-1;font-size:14px;color:var(--cx-mute)}
.cx-tb{position:relative;display:block;height:14px;border-radius:7px;border:1px solid var(--cx-line);
       background:linear-gradient(90deg,#faf8f5 0,#faf8f5 56.25%,#fbecc8 56.25%,#fbecc8 75%,#f6cfc9 75%);overflow:hidden}
.cx-tb::before,.cx-tb::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:rgba(0,0,0,.28)}
.cx-tb::before{left:37.5%}
.cx-tb::after{left:56.25%;background:rgba(0,0,0,.18)}
.cx-tb__ci{position:absolute;top:5px;height:4px;background:rgba(23,25,28,.28);border-radius:2px}
.cx-tb__dot{position:absolute;top:1px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--cx-ink);border:2px solid #fff;box-sizing:content-box}
.cx-axis{display:flex;justify-content:space-between;font-size:11px;color:var(--cx-faint);margin-top:10px;padding-inline:2px}
.cx-empty{color:var(--cx-mute);font-size:14px}

.cx-pt{font-size:13.5px}
.cx-pt__h,.cx-pt__r{display:grid;grid-template-columns:minmax(150px,2fr) 50px 90px 110px 70px minmax(0,1.6fr);gap:8px;align-items:center;padding:8px 6px}
.cx-pt__h{position:sticky;top:52px;background:#fff;font-weight:700;font-size:12px;color:var(--cx-mute);border-bottom:2px solid var(--cx-line)}
.cx-pt__r{border-bottom:1px solid var(--cx-line)}
.cx-pt__r:nth-child(even){background:#fcfbf9}
.cx-pt__n{font-weight:600}

.cx-pair{border:1px solid var(--cx-line);border-radius:12px;padding:10px 12px;margin:0 0 10px;background:#fffdf9}
.cx-pair__h{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.cx-pair__n{font-size:12px;color:var(--cx-mute);font-weight:600}
.cx-pair__s{display:flex;gap:10px;align-items:flex-start;padding:5px 0;line-height:1.9;font-size:14px}
.cx-ans{flex:0 0 auto;min-width:52px;text-align:center;padding:0 8px;border-radius:8px;font-size:12.5px;font-weight:700;line-height:1.9;border:1px solid}
.cx-ans--t{background:#e8f5ee;color:#1f7a4d;border-color:#1f7a4d}
.cx-ans--f{background:#f1f1f1;color:#444;border-color:#999}

.cx-steps{margin:0;padding-inline-start:0;list-style:none;display:grid;gap:8px}
.cx-steps li{border:1px solid var(--cx-line);border-radius:12px;padding:10px 12px;line-height:1.9}
.cx-steps__c{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.cx-steps__none{display:block;color:var(--cx-mute);font-size:13px}

.cx-cls{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:9px 0;border-top:1px solid var(--cx-line);align-items:center}
.cx-cls__v{font-weight:700;font-size:15px}
.cx-cls__p{color:var(--cx-mute);font-weight:500;font-size:13px}
.cx-cls__bar{grid-column:1/-1;display:block;height:6px;border-radius:3px;background:#f0ece5;overflow:hidden;direction:ltr}
.cx-cls__bar i{display:block;height:100%;background:var(--cx-ink);opacity:.55}
.cx-cls__u{grid-column:1/-1;font-size:12px;color:var(--cx-faint)}

@media (max-width:640px){
  .cx-sum__row{grid-template-columns:1fr}
  .cx-sc{grid-template-columns:1fr auto;gap:4px 10px;padding:9px 0}
  .cx-sc__n{grid-column:1/-1}
  .cx-sc .cx-tb{grid-column:1;grid-row:2}
  .cx-sc__t{grid-column:2;grid-row:2;text-align:left}
  .cx-sc__t small{display:none}
  .cx-sc__m{grid-column:1/-1}
  .cx-sc__raw{grid-column:1/-1}
  .cx-pt__h{display:none}
  .cx-pt__r{grid-template-columns:1fr 1fr;gap:4px 10px;padding:10px 4px}
  .cx-pt__n{grid-column:1/-1}
  .cx-pt__r span[data-l]:not(.cx-pt__n)::before{content:attr(data-l) ": ";color:var(--cx-faint);font-size:11.5px}
  .cx-pt__r span[data-l="برچسب"]{grid-column:1/-1}
  .cx-pt__r span[data-l="برچسب"]::before{content:""}
}
@media print{.cx-jump,.cx-tools{display:none !important}.cx-pair,.cx-steps li,.cx-sc,.cx-pt__r{break-inside:avoid}}

/* --- راهنمای خواندن (فاز ۵): همه‌ی آن `.cx-guide` است و با تنظیم «نمایش راهنما» یکجا پنهان می‌شود --- */
html[data-guide="off"] .cx-guide{display:none !important}
.cx-guide--sec{margin:0 0 10px;border:1px solid #d9e6f2;background:#f3f8fd;border-radius:12px;padding:0 12px}
.cx-guide--sec>summary{cursor:pointer;min-height:40px;display:flex;align-items:center;font-size:13.5px;font-weight:700;color:#1c5a96;list-style:none}
.cx-guide--sec>summary::-webkit-details-marker{display:none}
.cx-guide--sec>summary::before{content:"؟";display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-inline-end:8px;border-radius:50%;background:#1c5a96;color:#fff;font-size:12px}
.cx-guide--sec ul{margin:0 0 10px;padding-inline-start:20px;font-size:13.5px;line-height:1.95}
.cx-guide__h{margin:6px 0 2px;font-size:12.5px;font-weight:700;color:#1c5a96}
.cx-guide__sym{display:grid;gap:4px;margin:0 0 10px;font-size:13px;line-height:1.8}
.cx-help{min-width:28px;min-height:28px;margin-inline-start:6px;padding:0;border-radius:50%;border:1px solid #1c5a96;background:#f3f8fd;color:#1c5a96;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.cx-help[aria-expanded="true"]{background:#1c5a96;color:#fff}
.cx-sc__ht{grid-column:1/-1;margin:2px 0 4px;padding:8px 12px;background:#f3f8fd;border-radius:10px;font-size:13px;line-height:1.9;color:#234}
.cx-sc__ht i{display:block;color:var(--cx-mute);font-style:normal;font-size:12px}
@media print{.cx-guide,.cx-print{display:none !important}}
.cx-pt__nt{grid-column:span 2;color:var(--cx-mute);font-size:12px}
.cx-sum__why{grid-column:1/-1}

/* --- بخش‌های جمع‌شونده (dropdown) --- */
.cx-acc{padding:0;overflow:hidden;transition:box-shadow .2s,border-color .2s}
.cx-acc[open]{box-shadow:0 6px 22px -14px rgba(23,25,28,.35)}
.cx-acc__s{display:flex;align-items:center;gap:10px;padding:14px 18px;cursor:pointer;list-style:none;min-height:56px;
           user-select:none;-webkit-tap-highlight-color:transparent;transition:background .15s}
.cx-acc__s::-webkit-details-marker{display:none}
.cx-acc__s:hover{background:#faf8f5}
.cx-acc__s:focus-visible{outline:2px solid var(--cx-ink);outline-offset:-2px}
.cx-acc .cx-rs__t{margin:0;flex:1 1 auto;font-size:16px}
.cx-acc__meta{flex:0 0 auto;font-size:12px;font-weight:600;color:var(--cx-mute);background:#f0ece5;border-radius:999px;padding:2px 10px}
.cx-acc__chev{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:#f0ece5;position:relative;transition:transform .25s,background .2s}
.cx-acc__chev::before{content:"";position:absolute;inset:0;margin:auto;width:8px;height:8px;border-right:2px solid var(--cx-ink);border-bottom:2px solid var(--cx-ink);
                      transform:translateY(-2px) rotate(45deg)}
.cx-acc[open]>.cx-acc__s{border-bottom:1px solid var(--cx-line)}
.cx-acc[open]>.cx-acc__s .cx-acc__chev{transform:rotate(180deg);background:var(--cx-ink)}
.cx-acc[open]>.cx-acc__s .cx-acc__chev::before{border-color:#fff}
.cx-acc__body{padding:14px 18px 18px}
.cx-acc[open]>.cx-acc__body{animation:cxAcc .28s ease}
@keyframes cxAcc{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.cx-acc-tools{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 14px}
.cx-acc-btn{min-height:38px;padding:6px 14px;border:1px solid var(--cx-line);border-radius:999px;background:#fff;color:var(--cx-ink);font:inherit;font-size:13px;cursor:pointer}
.cx-acc-btn:hover{background:#faf8f5}
@media (prefers-reduced-motion:reduce){.cx-acc__body,.cx-acc__chev{animation:none !important;transition:none !important}}
@media (max-width:640px){.cx-acc__s{padding:12px 14px}.cx-acc__body{padding:12px 14px 16px}}
@media print{.cx-acc-tools{display:none !important}}

/* two-person case: on a phone the columns stack, so every value says whose it is (the header row is redundant then) */
@media (max-width:640px){
  .cx-dy thead{display:none}
  .cx-dy td[data-who]{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:3px 0}
  .cx-dy td[data-who]::before{content:attr(data-who);font-size:12.5px;color:var(--cx-mute);font-weight:500}
  .cx-dy th{padding-bottom:4px}
}

/* ---- تحلیل دونفره‌ی متخصص (overhaul تفسیر زوج MMPI) ---- */
.cx{--cmp-a:#6d5bd0;--cmp-b:#e07b4f;--chart-grid:rgba(70,74,82,.22)}
.cx-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:12px}
.cx-stack{display:grid;gap:12px}
.cx-svg svg{display:block}
.cx-svg--narrow{max-width:520px}
.cx-svg--wide{overflow-x:auto}
.cx-svg--wide svg{min-width:960px}
.cx-dvi__val{display:flex;align-items:baseline;gap:10px;margin:4px 0 2px}
.cx-dvi__val b{font-size:44px;font-weight:800;line-height:1;color:var(--cx-ink)}
.cx-dvi__val span{color:var(--cx-mute);font-size:14px}
.cx-pat{margin:0;border-inline-start:4px solid var(--cx-line)}
.cx-pat--3{border-inline-start-color:#c0392b}
.cx-pat--2{border-inline-start-color:#d9822b}
.cx-pat__h{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.cx-pat__sc{margin:0 0 6px}
@media print{.cx-svg--wide{overflow:visible}.cx-svg--wide svg{min-width:0}}
.note-publish-confirm{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;border:1px solid #E4DCCB;border-radius:10px;background:#FBF8F1;font-size:13px}
.note-publish-confirm[hidden]{display:none}

/* ================================================================ داشبورد (بازطراحی ۲۰۲۶-۱۰-۰۱)
   مینیمال: بدون کارتِ تودرتو، خطِ مو به‌جای جعبه، یک رنگِ تاکیدی (همان هلوییِ برند)،
   عددها بزرگ و بقیه ساکت. فقط transform/opacity انیمیت می‌شوند و reduced-motion رعایت شده. */

/* آیکن‌های سایدبار و بالا */
.ico { display: block; flex: none; }
.navitem__icon { width: 18px; height: 18px; display: grid; place-items: center; opacity: .8; font-size: 0; }
.navitem--active .navitem__icon { opacity: 1; color: var(--accent-bg); }
.navitem { position: relative; }
.navitem--active::before {
  content: ""; position: absolute; inset-block: 9px; inset-inline-start: -10px;
  width: 3px; border-radius: 3px; background: var(--accent-bg);
}
.topbar { align-items: center; padding-block: 14px; }
.topbar__bell { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; opacity: 1; color: var(--muted); transition: background .15s, color .15s; }
.topbar__bell:hover { background: var(--surface); color: var(--ink); }
.topbar__bell-badge { top: 1px; inset-inline-start: 0; }

/* نوار آمار */
.stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-block: 1px solid var(--border); background: transparent; }
.stat { display: flex; flex-direction: column; gap: 4px; padding: 20px 8px 20px 24px; border-inline-start: 1px solid var(--border); transition: background .2s; }
.stat:first-child { border-inline-start: 0; padding-inline-start: 8px; }
.stat:hover { background: rgba(22, 38, 63, .025); }
.stat__l { font-size: 12.5px; color: var(--muted); }
.stat__v { font-size: 34px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; color: var(--ink); font-variant-numeric: tabular-nums; }
.stat__v small { font-size: 13px; font-weight: 600; color: var(--muted); margin-inline-start: 6px; letter-spacing: 0; }
.stat__v--hot { color: var(--accent-ink); }
.stat--accent .stat__v { color: var(--accent-ink); }

/* چیدمان اصلی: ستونِ اصلی + ستونِ باریکِ کناری */
.dash { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: start; margin-top: 28px !important; }
.dash__main > * + * { margin-top: 36px; }
.dash__side > * + * { margin-top: 28px; }

.inbox__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.inbox__head h2 { margin: 0; font-size: 15px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.inbox__count { min-width: 22px; height: 22px; padding: 0 7px; border-radius: var(--r-pill); background: var(--accent-bg); color: var(--accent-ink); font-size: 12px; font-weight: 800; display: inline-grid; place-items: center; }
.linkbtn { background: none; border: 0; padding: 4px 0; font: inherit; font-size: 12.5px; color: var(--muted); cursor: pointer; border-bottom: 1px solid transparent; }
.linkbtn:hover { color: var(--ink); border-bottom-color: currentColor; }
.linkbtn:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; border-radius: 4px; }

.avatar { flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--navy); color: #fff; font-weight: 700; font-size: 15px; }
.avatar--soft { background: var(--surface); color: var(--muted); }

.inbox__list, .rlist { list-style: none; margin: 0; padding: 0; }
.irow { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px solid var(--border); animation: rowin .35s cubic-bezier(.16, 1, .3, 1) both; }
.irow:first-child { border-top-color: var(--ink); }
.inbox__list > .irow:nth-child(2) { animation-delay: .04s; }
.inbox__list > .irow:nth-child(3) { animation-delay: .08s; }
.inbox__list > .irow:nth-child(4) { animation-delay: .12s; }
.irow__body { flex: 1; min-width: 0; }
.irow__top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.irow__top b { color: var(--ink); font-size: 14.5px; }
.irow__top time { font-size: 12px; color: var(--faint); white-space: nowrap; }
.irow__body p { margin: 2px 0 0; font-size: 13px; color: var(--muted); line-height: 1.8; }
.irow__body em { font-style: normal; color: var(--body); font-weight: 600; }
.irow__go { flex: none; }
.btn { transition: transform .15s, opacity .15s; }
.btn:active { transform: scale(.97); }
.inbox__more { margin-top: 2px; border-top: 1px solid var(--border); }
.inbox__more > summary { cursor: pointer; list-style: none; padding: 12px 0; font-size: 13px; font-weight: 600; color: var(--muted); display: flex; align-items: center; gap: 8px; }
.inbox__more > summary::-webkit-details-marker { display: none; }
.inbox__more > summary::after { content: ""; width: 7px; height: 7px; border-right: 1.7px solid currentColor; border-bottom: 1.7px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .2s; }
.inbox__more[open] > summary::after { transform: rotate(225deg); }
.inbox__more > summary:hover { color: var(--ink); }
.inbox__empty { display: flex; align-items: center; gap: 14px; padding: 22px 0; border-top: 1px solid var(--ink); color: var(--muted); }
.inbox__empty p { margin: 0; font-size: 13.5px; }
@keyframes rowin { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* آخرین نتیجه‌ها */
.rrow { display: flex; align-items: center; gap: 14px; padding: 12px 8px; margin-inline: -8px; border-radius: var(--r-md); transition: background .15s; }
.rrow:hover { background: var(--surface); }
.rrow:focus-visible { outline: 2px solid var(--navy); outline-offset: 1px; }
.rrow__body { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.6; }
.rrow__body b { color: var(--ink); font-size: 14px; }
.rrow__body small { color: var(--muted); font-size: 12.5px; }
.rrow__t { font-size: 12px; color: var(--faint); white-space: nowrap; }
.rrow__go { color: var(--faint); transition: transform .2s, color .2s; }
.rrow:hover .rrow__go { color: var(--ink); transform: translateX(-3px); }

/* ستون کناری */
.reflink h2, .quick b { color: var(--ink); }
.reflink h2 { margin: 0 0 4px; font-size: 15px; font-weight: 700; }
.reflink p { margin: 0 0 12px; font-size: 12.5px; color: var(--muted); line-height: 1.9; }
.reflink__box { display: flex; gap: 8px; }
.reflink__box input { flex: 1; min-width: 0; padding: 9px 11px; font-size: 12px; }
.quick { display: flex; flex-direction: column; border-top: 1px solid var(--border); }
.quick a { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border); color: var(--muted); transition: color .15s, padding .2s; }
.quick a span { display: flex; flex-direction: column; line-height: 1.6; }
.quick b { font-size: 13.5px; }
.quick small { font-size: 12px; color: var(--faint); }
.quick a:hover { color: var(--ink); padding-inline-start: 6px; }
.quick a:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }

@media (max-width: 1080px) {
  .dash { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 640px) {
  .stats { grid-template-columns: 1fr; }
  .stat { flex-direction: row; align-items: baseline; justify-content: space-between; padding: 14px 4px; border-inline-start: 0; border-top: 1px solid var(--border); }
  .stat:first-child { border-top: 0; }
  .stat__v { font-size: 26px; }
  .irow { flex-wrap: wrap; }
  .irow__go { margin-inline-start: 52px; }
}
@media (prefers-reduced-motion: reduce) {
  .irow { animation: none; }
  .btn, .rrow__go, .quick a, .inbox__more > summary::after { transition: none; }
}

/* برند (مغزتو / لوگو) لینک به داشبورد است */
.sidebar__home { display: block; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
.sidebar__home:hover b { opacity: .85; }
.sidebar__home:focus-visible { outline: 2px solid rgba(255, 255, 255, .6); outline-offset: 4px; border-radius: 6px; }

/* دکمه‌ی خروج از حساب */
.sidebar__foot a {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  margin-top: 12px; padding: 11px 14px; border-radius: 12px;
  font-size: 13.5px; font-weight: 700; color: #fff; text-decoration: none;
  background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .26);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset;
  transition: background .18s, color .18s, border-color .18s, transform .12s;
}
.sidebar__foot a::before {
  content: ""; width: 18px; height: 18px; flex: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E") center / contain no-repeat;
}
.sidebar__foot a:hover { background: #fff; color: var(--navy); border-color: #fff; }
.sidebar__foot a:active { transform: scale(.97); }
.sidebar__foot a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
@media (max-width: 820px) { .sidebar__foot a { margin-top: 0; padding: 9px 14px; font-size: 13px; } }

/* ---- Branded file picker (filepick.js) — RULE: never show the native Browse button ---- */
.fp { position:relative; display:flex; align-items:center; gap:14px; width:100%; min-height:56px; padding:8px 8px 8px 14px; box-sizing:border-box;
  background:var(--panel); border:1.5px dashed var(--border); border-radius:var(--r-md); transition:border-color .15s, background .15s, box-shadow .15s; }
.fp:hover, .fp.is-drag { border-color:var(--ink); background:var(--surface); }
.fp:focus-within { border-color:var(--ink); box-shadow:0 0 0 3px var(--surface); }
.fp.has-file { border-style:solid; border-color:var(--ink); background:var(--surface); }
.fp-native { position:absolute !important; inset:0; width:100% !important; height:100% !important; min-height:0 !important; opacity:0; cursor:pointer; margin:0; padding:0 !important; border:0 !important; }
.fp-btn { flex:none; display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-radius:var(--r-pill); font-size:14px; font-weight:700; color:#fff;
  background:var(--ink); box-shadow:0 4px 12px rgba(0,0,0,.16); transition:transform .15s, box-shadow .15s; }
.fp:hover .fp-btn { transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.22); }
.fp-name { flex:1; min-width:0; font-size:13.5px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fp.has-file .fp-name { color:var(--ink); font-weight:600; }

/* ===== چک‌باکس یکدست (مهر با جرقه؛ تیکِ دقیقاً وسط که هنگام زدن از کادر بیرون می‌پرد) ===== */
input[type=checkbox][type=checkbox] {
  --cb-fill: #16263F; --cb-fill2: #24406A; --cb-tick: #fff; --cb-bg: #fff; --cb-ring: #E3A07E; --cb-light: #FBE1D1; --cb-s: 22px;
  -webkit-appearance: none; appearance: none; position: relative; flex: none; display: inline-block; vertical-align: middle;
  width: var(--cb-s); height: var(--cb-s); min-width: 0; min-height: 0; padding: 0;
  margin: 1px 0 0; margin-top: max(0px, calc((1lh - var(--cb-s)) / 2));
  border: 2px solid var(--cb-ring); border-radius: 50%; background: var(--cb-bg); cursor: pointer;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--cb-ring) 22%, transparent);
  accent-color: var(--cb-fill);
  transition: background .25s, border-color .25s, box-shadow .25s;
}
input[type=checkbox][type=checkbox]:focus-visible { outline: 2px solid var(--cb-ring); outline-offset: 5px; }
input[type=checkbox][type=checkbox]:disabled { opacity: .45; cursor: not-allowed; }
input[type=checkbox][type=checkbox]::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: var(--cb-s); height: var(--cb-s);
  margin: calc(var(--cb-s) / -2) 0 0 calc(var(--cb-s) / -2); background: var(--cb-tick);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12.6l4.2 4.2L18.5 7.4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12.6l4.2 4.2L18.5 7.4'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: 0; pointer-events: none; border: 0; transform: none;
}
input[type=checkbox][type=checkbox]::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: 4px; height: 4px; margin: -2px;
  border-radius: 50%; pointer-events: none; opacity: 0;
}
input[type=checkbox][type=checkbox]:checked { background: linear-gradient(135deg, var(--cb-fill2), var(--cb-fill)); animation: mzcb-ring .7s ease-out; }
input[type=checkbox][type=checkbox]:checked::after { opacity: 1; animation: mzcb-out .65s cubic-bezier(.34, 1.3, .5, 1) both; }
input[type=checkbox][type=checkbox]:checked::before { animation: mzcb-burst .65s ease-out; }
@keyframes mzcb-out { 0% { transform: scale(0); clip-path: inset(0 100% 0 0); } 35% { transform: scale(2.2); clip-path: inset(0 0 0 0); } 100% { transform: scale(1); clip-path: inset(0 0 0 0); } }
@keyframes mzcb-ring { 0% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--cb-ring) 22%, transparent), 0 0 0 0 color-mix(in srgb, var(--cb-ring) 55%, transparent); } 100% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--cb-ring) 22%, transparent), 0 0 0 16px transparent; } }
@keyframes mzcb-burst {
  0% { opacity: 1; box-shadow: 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-light), 0 0 0 0 var(--cb-light); }
  100% { opacity: 0; box-shadow: -26px -4px 0 -1px var(--cb-ring), 26px -4px 0 -1px var(--cb-ring), 0 -27px 0 -1px var(--cb-ring), -16px 20px 0 -1px var(--cb-ring), 16px 20px 0 -1px var(--cb-ring), 0 27px 0 -1px var(--cb-ring), -19px -19px 0 -2px var(--cb-light), 19px -19px 0 -2px var(--cb-light); }
}
@media (prefers-reduced-motion: reduce) { input[type=checkbox][type=checkbox], input[type=checkbox][type=checkbox]::before, input[type=checkbox][type=checkbox]::after { animation: none !important; transition: none !important; } }
/* 2026-11-04: plain-language case story at the top of the NEO case page (panel/case_bigfive.py _story_view) */
.cx-story{background:#fff;border:1px solid var(--cx-line);border-radius:20px;padding:22px 24px 16px;box-shadow:0 1px 2px rgba(23,25,28,.04)}
.cx-story__head{display:flex;align-items:flex-start;gap:14px;margin:0 0 16px}
.cx-story__head h2{font-size:19px;margin:2px 0 4px;color:#163527}
.cx-story__badge{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#E6F2EA;color:#2F6F52}
.cx-story__intro{margin:0;color:var(--cx-mute);font-size:13.5px;line-height:1.9}
.cx-story__time{flex:none;margin-inline-start:auto;font-size:12.5px;color:var(--cx-mute);background:var(--mute-bg);border-radius:999px;padding:3px 12px;white-space:nowrap}
.cx-story__lead{background:linear-gradient(160deg,#F1F8F3,#FBFCFA 70%);border:1px solid #D7EADF;border-radius:16px;padding:16px 20px 8px;margin:0 0 16px}
.cx-story__lead .cx-story__p{font-size:15.5px;line-height:2.15}
.cx-story__kicker{margin:0 0 6px;font-size:12.5px;font-weight:700;letter-spacing:0;color:#2F6F52}
.cx-story__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 14px}
.cx-story__ch{border:1px solid var(--cx-line);border-radius:16px;padding:14px 18px 6px;background:#FDFCFA}
.cx-story__ch h3,.cx-story__act h3{display:flex;align-items:center;gap:8px;font-size:15.5px;margin:0 0 8px;color:var(--cx-ink)}
.cx-story__ico{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--mute-bg);color:#2F6F52;flex:none}
.cx-story__p{margin:0 0 10px;font-size:14.5px;line-height:2.05}
.cx-story__acts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.cx-story__act{border-radius:16px;padding:14px 18px 6px;border:1px solid transparent}
.cx-story__act--ask{background:var(--sky-bg);border-color:#C3E0EF}
.cx-story__act--ask .cx-story__ico{background:#fff;color:var(--sky-ink)}
.cx-story__act--start{background:var(--ok-bg);border-color:#C4E8CD}
.cx-story__act--start .cx-story__ico{background:#fff;color:var(--ok-ink)}
.cx-term{display:inline-flex;align-items:baseline;gap:4px;margin:0;padding:0 9px;border-radius:999px;font-size:12.5px;line-height:1.9;white-space:nowrap;vertical-align:1px;background:var(--mute-bg);color:var(--mute-ink)}
.cx-term b{font-weight:700}
.cx-term--hi{background:#FCE8D8;color:#8A3F12}
.cx-term--lo{background:var(--sky-bg);color:var(--sky-ink)}
.cx-story__act .cx-term{background:rgba(255,255,255,.75)}
.cx-story__legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:12px 0 0;font-size:12.5px;color:var(--cx-mute)}
@media(max-width:860px){.cx-story__grid,.cx-story__acts{grid-template-columns:1fr}.cx-story{padding:18px 16px 12px}.cx-story__time{display:none}}
@media print{.cx-story{box-shadow:none}.cx-story__ch,.cx-story__act,.cx-story__lead{break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}}