/* ==========================================================================
   1. توکن‌ها — همان توکن‌های صفحه‌ی مگ و ماژول‌ها
   ========================================================================== */
.drm-post{
  --p-font: inherit;
  --p-primary: var(--drm-primary, #6c1410);
  --p-ink: var(--drm-text-strong, #1e1e1e);
  --p-text: var(--drm-text, #333333);
  --p-muted: var(--drm-text-muted, #7b7b7b);
  --p-card: #f9f8f6;
  --p-card-2: #f4f2ef;
  --p-image-bg: #efeeec;
  --p-hairline: rgba(30,30,30,.08);
  --p-container: var(--drm-container, 1500px);   /* عرض باکس دسکتاپ قالب */
  --p-r-lg: var(--drm-r-lg, 18px);
  --p-r-md: var(--drm-r-md, 16px);
  --p-r-sm: 12px;
  --p-gap: 10px;
  --p-ease: var(--drm-ease, cubic-bezier(.22,.61,.36,1));
  --p-dur: var(--drm-fast, .2s);

  --p-fs-body: 16px;
  --p-lh-body: 2.15;

  font-family: var(--p-font);
  direction: rtl;
  color: var(--p-ink);
  padding-block: 22px 40px;
  /* Same edge spacing the category page uses. Inert once the viewport is wider
     than the boxed width, so wide screens stay aligned with the rest of the site. */
  padding-inline: var(--drm-mobile-gutter, 15px);
}
.drm-post *, .drm-post *::before, .drm-post *::after{ box-sizing:border-box; }
.drm-post__wrap{ width:100%; max-width:var(--p-container); margin-inline:auto; }

/* ==========================================================================
   2. مسیر راهنما
   ========================================================================== */
/* مسیر راهنما تک‌خطی. سطح‌های میانی کوتاه نمی‌شوند؛ فقط عنوان مقاله که
   آخرین سطح است، در صورت سرریز از انتها محو می‌شود. متن هرگز از DOM حذف
   نمی‌شود، پس چیزی از خزنده پنهان نمی‌ماند. */
.drm-post__crumbs{ font-size:12px; color:var(--p-muted); padding:10px 0 14px; }
.drm-post__crumbs ol{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:nowrap; gap:6px; align-items:center;
  overflow:hidden;
}
.drm-post__crumbs li{ flex:0 0 auto; display:flex; align-items:center; gap:6px; white-space:nowrap; }
.drm-post__crumbs li:last-child{ flex:1 1 auto; min-inline-size:0; }
.drm-post__crumbs li:last-child span,
.drm-post__crumbs li:last-child a{ display:block; overflow:hidden; white-space:nowrap; }
.drm-post__crumbs a{ color:var(--p-muted); text-decoration:none; }
.drm-post__crumbs a:hover{ color:var(--p-primary); }
.drm-post__crumbs li + li::before{ content:"/"; opacity:.5; flex:0 0 auto; }
.drm-post__crumbs [aria-current]{ color:var(--p-ink); font-weight:700; }
.drm-post__crumbs.is-truncated li:last-child span,
.drm-post__crumbs.is-truncated li:last-child a{
  -webkit-mask-image:linear-gradient(to left, #000 55%, rgba(0,0,0,0) 97%);
          mask-image:linear-gradient(to left, #000 55%, rgba(0,0,0,0) 97%);
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
[dir="ltr"] .drm-post__crumbs.is-truncated li:last-child span,
[dir="ltr"] .drm-post__crumbs.is-truncated li:last-child a{
  -webkit-mask-image:linear-gradient(to right, #000 55%, rgba(0,0,0,0) 97%);
          mask-image:linear-gradient(to right, #000 55%, rgba(0,0,0,0) 97%);
}
@media (forced-colors: active){
  .drm-post__crumbs.is-truncated li:last-child span,
  .drm-post__crumbs.is-truncated li:last-child a{ -webkit-mask-image:none; mask-image:none; }
}

/* ==========================================================================
   3. سربرگ مقاله
   ========================================================================== */
.drm-post__header{ max-width:72ch; margin-block-end:26px; }
.drm-post__cat{
  display:inline-flex; align-items:center; line-height:1;
  font-size:11.5px; font-weight:800; color:#fff; text-decoration:none;
  background:var(--p-primary); padding:7px 12px; border-radius:8px;
  margin-block-end:14px;
  transition:filter var(--p-dur) var(--p-ease);
}
.drm-post__cat:hover{ filter:brightness(1.25); }
.drm-post__title{
  margin:0 0 12px;
  font-size:clamp(22px, 3.1vw, 32px); font-weight:800; line-height:1.65;
  letter-spacing:-.01em; color:var(--p-ink);
}
.drm-post__meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px;
  font-size:12.5px; font-weight:600; color:var(--p-muted);
  margin-block-start:14px; padding-block-start:14px;
  border-block-start:1px solid var(--p-hairline);
}
.drm-post__meta span{ display:inline-flex; align-items:center; gap:6px; }
.drm-post__meta svg{ inline-size:15px; block-size:15px; fill:none; stroke:currentColor; stroke-width:1.7; opacity:.85; }
.drm-post__metalink{ color:inherit; text-decoration:none; }
.drm-post__metalink:hover{ color:var(--p-primary); }
.drm-post__updated{ color:var(--p-muted); font-weight:500; }

.drm-post__byline{ display:flex; align-items:center; gap:11px; }
.drm-avatar{
  flex:0 0 auto; overflow:hidden; border-radius:50%;
  background:var(--p-image-bg); display:block;
}
.drm-avatar img{ inline-size:100%; block-size:100%; object-fit:cover; display:block; }
.drm-avatar--44{ inline-size:44px; block-size:44px; }
.drm-avatar--36{ inline-size:36px; block-size:36px; }
.drm-avatar--32{ inline-size:32px; block-size:32px; }
.drm-avatar--64{ inline-size:64px; block-size:64px; }
.drm-post__byname{ display:flex; flex-direction:column; gap:3px; min-inline-size:0; }
.drm-post__byname a{ color:var(--p-ink); text-decoration:none; font-size:13.5px; font-weight:800; }
.drm-post__byname a:hover{ color:var(--p-primary); }
.drm-post__byrole{ font-size:11.5px; font-weight:600; color:var(--p-muted); }

/* ==========================================================================
   4. تصویر شاخص
   ========================================================================== */
.drm-post__hero{ margin:0 0 18px; }
.drm-post__heromedia{
  margin:0; overflow:hidden; border-radius:var(--p-r-lg);
  background:var(--p-image-bg); aspect-ratio:16/9; position:relative;
}
.drm-post__heromedia img{ inline-size:100%; block-size:100%; object-fit:cover; display:block; }

/* Image fill guard. Optimizer/lazy-load plugins rewrite <img> tags and can drop
   our class or force height:auto, which breaks the crop. Targeting the child
   image keeps the card cropping correct whatever the tag ends up looking like. */
.drm-post__heromedia > img,
.drm-rcard__media > img,
.drm-mini__media > img,
.drm-avatar > img{
  width:100% !important; height:100% !important; max-width:none;
  object-fit:cover; object-position:center; display:block;
}


/* ==========================================================================
   5. چیدمان دو ستونی
   ========================================================================== */
.drm-post__layout{
  display:grid; grid-template-columns:minmax(0,1fr) 312px; gap:36px; align-items:start;
}
.drm-post__main{ min-inline-size:0; }
.drm-post__aside{ position:sticky; top:16px; display:flex; flex-direction:column; gap:12px; }

/* ==========================================================================
   6. در یک نگاه
   ========================================================================== */
.drm-brief{
  background:var(--p-card); border:0; border-radius:var(--p-r-lg);
  padding:16px 18px; margin-block-end:16px; max-width:72ch;
}
.drm-brief__head{ display:flex; align-items:center; gap:9px; margin-block-end:11px; }
.drm-brief__bar{ inline-size:4px; block-size:17px; border-radius:99px; background:var(--p-primary); flex:0 0 auto; }
.drm-brief__title{ margin:0; font-size:14px; font-weight:800; line-height:1.5; color:var(--p-ink); }
.drm-brief ul{ margin:0; padding-inline-start:18px; }
.drm-brief li{ margin:0 0 7px; font-size:13.5px; line-height:1.95; color:var(--p-text); }
.drm-brief li:last-child{ margin-bottom:0; }

/* ==========================================================================
   7. فهرست مطالب
   ========================================================================== */
.drm-toc{
  background:var(--p-card); border:0; border-radius:var(--p-r-lg);
  padding:14px 18px 16px; margin-block-end:22px; max-width:72ch;
}
.drm-toc__btn{
  all:unset; box-sizing:border-box;
  display:flex; align-items:center; gap:9px; inline-size:100%; cursor:pointer;
  font-size:14px; font-weight:800; color:var(--p-ink);
}
.drm-toc__btn:focus-visible{ outline:2px solid var(--p-primary); outline-offset:3px; border-radius:6px; }
.drm-toc__btn svg{ inline-size:16px; block-size:16px; fill:none; stroke:currentColor; stroke-width:1.9; }
.drm-toc__chev{ margin-inline-start:auto; transition:transform var(--p-dur) var(--p-ease); }
.drm-toc__btn[aria-expanded="true"] .drm-toc__chev{ transform:rotate(180deg); }
.drm-toc__list{ list-style:none; margin:12px 0 0; padding:0; }
.drm-toc__list[hidden]{ display:none; }
.drm-toc__list li{ margin:0 0 8px; }
.drm-toc__list li:last-child{ margin-bottom:0; }
.drm-toc__list a{
  color:var(--p-text); text-decoration:none; font-size:13px; font-weight:600; line-height:1.9;
  display:inline-flex; gap:8px;
}
.drm-toc__list a::before{ content:""; inline-size:4px; block-size:4px; margin-block-start:11px; border-radius:50%; background:var(--p-muted); flex:0 0 auto; }
.drm-toc__list a:hover{ color:var(--p-primary); }
.drm-toc__list a:hover::before{ background:var(--p-primary); }
.drm-toc__list .is-sub{ padding-inline-start:16px; }
.drm-toc__list .is-sub a{ font-weight:500; color:var(--p-muted); }

/* ==========================================================================
   8. متن مقاله
   ========================================================================== */
.drm-post__body{
  max-width:72ch;
  font-size:var(--p-fs-body); line-height:var(--p-lh-body); color:var(--p-text);
  text-align:justify; text-justify:inter-word;
}
.drm-post__body > * { scroll-margin-top:90px; }
.drm-post__body p{ margin:0 0 18px; }
.drm-post__body h2{
  margin:32px 0 12px; font-size:20px; font-weight:800; line-height:1.7; color:var(--p-ink);
  text-align:start; display:flex; align-items:center; gap:9px;
}
.drm-post__body h2::before{
  content:""; inline-size:4px; block-size:19px; border-radius:99px;
  background:var(--p-primary); flex:0 0 auto;
}
.drm-post__body h3{ margin:24px 0 10px; font-size:16.5px; font-weight:800; line-height:1.75; color:var(--p-ink); text-align:start; }
.drm-post__body ul, .drm-post__body ol{ margin:0 0 18px; padding-inline-start:22px; }
.drm-post__body li{ margin:0 0 9px; }
.drm-post__body a{ color:var(--p-primary); text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
.drm-post__body strong, .drm-post__body b{ font-weight:800; color:var(--p-ink); }
.drm-post__body figure{ margin:0 0 22px; }
.drm-post__body figure img{
  inline-size:100%; block-size:auto; display:block;
  border-radius:var(--p-r-md); background:var(--p-image-bg);
}
.drm-post__body figcaption{ margin-block-start:8px; font-size:11.5px; line-height:1.9; color:var(--p-muted); text-align:center; }
.drm-post__body blockquote{
  margin:0 0 22px; padding:16px 18px;
  background:var(--p-card); border:0; border-radius:var(--p-r-md);
  border-inline-start:4px solid var(--p-primary);
  font-size:15px; line-height:2; color:var(--p-ink); font-weight:600;
}
.drm-post__body blockquote p:last-child{ margin-bottom:0; }
.drm-post__tablewrap{ overflow-x:auto; margin:0 0 22px; -webkit-overflow-scrolling:touch; }
.drm-post__body table{ inline-size:100%; border-collapse:separate; border-spacing:0; font-size:13.5px; min-inline-size:420px; }
.drm-post__body th, .drm-post__body td{ padding:11px 12px; text-align:start; }
.drm-post__body thead th{ background:var(--p-card-2); color:var(--p-ink); font-weight:800; }
.drm-post__body thead th:first-child{ border-start-start-radius:var(--p-r-sm); border-end-start-radius:var(--p-r-sm); }
.drm-post__body thead th:last-child{ border-start-end-radius:var(--p-r-sm); border-end-end-radius:var(--p-r-sm); }
.drm-post__body tbody td{ border-block-end:1px solid var(--p-hairline); }
.drm-post__body tbody tr:last-child td{ border-block-end:0; }

/* منابع */
.drm-sources{ max-width:72ch; margin:26px 0 0; padding:16px 18px; background:var(--p-card); border-radius:var(--p-r-lg); }
.drm-sources h2{ margin:0 0 10px; font-size:14px; font-weight:800; color:var(--p-ink); }
.drm-sources ol{ margin:0; padding-inline-start:20px; }
.drm-sources li{ margin:0 0 7px; font-size:12.5px; line-height:1.95; color:var(--p-muted); }
.drm-sources a{ color:var(--p-primary); text-decoration:none; }
.drm-sources a:hover{ text-decoration:underline; }

/* برچسب‌ها */
.drm-tags{ display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 0; max-width:72ch; }
.drm-tags a{
  display:inline-flex; align-items:center; padding:8px 13px; border-radius:99px;
  background:var(--p-card); color:var(--p-ink);
  font-size:12px; font-weight:700; text-decoration:none;
  transition:background var(--p-dur) var(--p-ease), color var(--p-dur) var(--p-ease);
}
.drm-tags a:hover{ background:var(--p-card-2); color:var(--p-primary); }

/* ==========================================================================
   9. نوار واکنش و اشتراک‌گذاری
   ========================================================================== */
.drm-actions{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  margin:22px 0 0; padding:14px; max-width:72ch;
  background:var(--p-card); border-radius:var(--p-r-lg);
}
.drm-act{
  all:unset; box-sizing:border-box;
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  padding:9px 14px; border-radius:99px; background:#fff; color:var(--p-ink);
  font-size:12.5px; font-weight:700; line-height:1; text-decoration:none;
  transition:background var(--p-dur) var(--p-ease), color var(--p-dur) var(--p-ease);
}
.drm-act:hover{ background:var(--p-card-2); color:var(--p-primary); }
.drm-act:focus-visible{ outline:2px solid var(--p-primary); outline-offset:2px; }
.drm-act svg{ inline-size:16px; block-size:16px; fill:none; stroke:currentColor; stroke-width:1.8; }
.drm-act.is-on{ background:var(--p-primary); color:#fff; }
.drm-act.is-on svg{ fill:currentColor; stroke:currentColor; }
.drm-act__n{ font-variant-numeric:tabular-nums; }

.drm-share{ display:flex; align-items:center; gap:8px; margin-inline-start:auto; }
.drm-share__lbl{ font-size:12px; font-weight:700; color:var(--p-muted); }
.drm-share a, .drm-share button{
  all:unset; box-sizing:border-box; cursor:pointer;
  inline-size:36px; block-size:36px; display:grid; place-items:center;
  border-radius:50%; background:#fff; color:var(--p-ink);
  transition:background var(--p-dur) var(--p-ease), color var(--p-dur) var(--p-ease);
}
.drm-share a:hover, .drm-share button:hover{ background:var(--p-primary); color:#fff; }
.drm-share a:focus-visible, .drm-share button:focus-visible{ outline:2px solid var(--p-primary); outline-offset:2px; }
.drm-share svg{ inline-size:17px; block-size:17px; fill:none; stroke:currentColor; stroke-width:1.7; }

/* ==========================================================================
   10. باکس نویسنده
   ========================================================================== */
.drm-authorbox{
  display:flex; gap:14px; align-items:flex-start;
  margin:26px 0 0; padding:18px; max-width:72ch;
  background:var(--p-card); border:0; border-radius:var(--p-r-lg);
}
.drm-authorbox__body{ min-inline-size:0; display:flex; flex-direction:column; gap:7px; }
.drm-authorbox__name{ margin:0; font-size:15px; font-weight:800; line-height:1.6; }
.drm-authorbox__name a{ color:var(--p-ink); text-decoration:none; }
.drm-authorbox__name a:hover{ color:var(--p-primary); }
.drm-authorbox__role{ font-size:12px; font-weight:700; color:var(--p-primary); }
.drm-authorbox__bio{ margin:0; font-size:13px; line-height:2; color:var(--p-muted); }
.drm-authorbox__foot{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-block-start:4px; }
.drm-authorbox__count{ font-size:11.5px; font-weight:600; color:var(--p-muted); }
.drm-authorbox__link{
  display:inline-flex; align-items:center; gap:5px;
  font-size:12px; font-weight:700; color:var(--p-primary); text-decoration:none;
}
.drm-authorbox__link:hover{ opacity:.75; }
.drm-authorbox__link svg{ inline-size:12px; block-size:12px; fill:none; stroke:currentColor; stroke-width:1.9; }

/* ==========================================================================
   11. مطالب مرتبط
   ========================================================================== */
.drm-related{ margin:30px 0 0; }
.drm-sec__head{ display:flex; align-items:center; gap:9px; margin-block-end:13px; }
.drm-sec__bar{ inline-size:4px; block-size:18px; border-radius:99px; background:var(--p-primary); flex:0 0 auto; }
.drm-sec__title{ margin:0; font-size:clamp(15px,1.7vw,18px); font-weight:800; line-height:1.4; color:var(--p-ink); }

.drm-related__grid{ list-style:none; margin:0; padding:0; display:grid; gap:var(--p-gap); grid-template-columns:repeat(3,minmax(0,1fr)); }
.drm-rcard{
  position:relative; block-size:100%; display:flex; flex-direction:column; gap:9px;
  padding:8px; border:0; border-radius:var(--p-r-lg); background:var(--p-card);
  transition:background var(--p-dur) var(--p-ease), transform var(--p-dur) var(--p-ease);
}
.drm-rcard__media{ margin:0; overflow:hidden; border-radius:var(--p-r-md); background:var(--p-image-bg); aspect-ratio:4/3; }
.drm-rcard__img{ inline-size:100%; block-size:100%; object-fit:cover; display:block; }
.drm-rcard__body{ display:flex; flex-direction:column; gap:8px; flex:1 1 auto; padding:1px 3px 3px; }
.drm-rcard__cat{ align-self:flex-start; position:relative; z-index:3; font-size:11px; font-weight:700; color:var(--p-muted); text-decoration:none; }
.drm-rcard__cat:hover{ color:var(--p-muted); }
.drm-rcard__title{
  margin:0; font-size:13.5px; font-weight:800; line-height:1.85; color:var(--p-ink);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.drm-rcard__title a{ color:inherit; text-decoration:none; }
.drm-rcard__title a::after{ content:""; position:absolute; inset:0; z-index:2; }
.drm-rcard__title a:focus-visible{ outline:none; }
.drm-rcard__title a:focus-visible::after{ outline:2px solid var(--p-primary); outline-offset:-3px; border-radius:var(--p-r-lg); }
.drm-rcard__meta{ display:flex; align-items:center; gap:7px; margin-block-start:auto; font-size:11px; font-weight:600; color:var(--p-muted); }

/* ==========================================================================
   12. ستون کناری
   ========================================================================== */
.drm-side{ background:var(--p-card); border-radius:var(--p-r-lg); padding:16px; }
.drm-side__head{ display:flex; align-items:center; gap:9px; margin-block-end:12px; }
.drm-side__title{ margin:0; font-size:14px; font-weight:800; line-height:1.5; color:var(--p-ink); }
.drm-side__author{ display:flex; align-items:center; gap:11px; }
.drm-side__author .drm-post__byname a{ font-size:13px; }
.drm-side__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.drm-mini{ position:relative; display:flex; flex-direction:row-reverse; align-items:center; gap:10px; }
.drm-mini__media{ margin:0; overflow:hidden; flex:0 0 66px; inline-size:66px; aspect-ratio:4/3; border-radius:10px; background:var(--p-image-bg); }
.drm-mini__img{ inline-size:100%; block-size:100%; object-fit:cover; display:block; }
.drm-mini__body{ min-inline-size:0; display:flex; flex-direction:column; gap:6px; }
.drm-mini__title{
  margin:0; font-size:12px; font-weight:800; line-height:1.8; color:var(--p-ink);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.drm-mini__title a{ color:inherit; text-decoration:none; }
.drm-mini__title a::after{ content:""; position:absolute; inset:0; }
.drm-mini__title a:hover{ color:var(--p-ink); }
.drm-mini__meta{ font-size:10.5px; font-weight:600; color:var(--p-muted); }

/* ==========================================================================
   13. دیدگاه‌ها
   ========================================================================== */
.drm-comments{ margin:34px 0 0; max-width:72ch; }

.drm-guest{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  padding:18px; background:var(--p-card); border-radius:var(--p-r-lg); margin-block-end:16px;
}
.drm-guest__txt{ min-inline-size:0; display:flex; flex-direction:column; gap:5px; }
.drm-guest__t{ margin:0; font-size:14px; font-weight:800; color:var(--p-ink); }
.drm-guest__s{ margin:0; font-size:12.5px; line-height:1.9; color:var(--p-muted); }
.drm-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  padding:11px 20px; border:0; border-radius:99px; cursor:pointer;
  background:var(--p-primary); color:#fff;
  font-family:inherit; font-size:13px; font-weight:800; line-height:1; text-decoration:none;
  transition:filter var(--p-dur) var(--p-ease);
}
.drm-btn:hover{ filter:brightness(1.2); }
.drm-btn:focus-visible{ outline:2px solid var(--p-primary); outline-offset:3px; }
.drm-btn--ghost{ background:#fff; color:var(--p-ink); }
.drm-btn--ghost:hover{ background:var(--p-card-2); color:var(--p-primary); filter:none; }
.drm-guest .drm-btn{ margin-inline-start:auto; }

.drm-cform{ display:flex; gap:11px; padding:16px; background:var(--p-card); border-radius:var(--p-r-lg); margin-block-end:18px; }
.drm-cform__body{ flex:1 1 auto; min-inline-size:0; display:flex; flex-direction:column; gap:10px; }
.drm-cform textarea{
  inline-size:100%; min-block-size:96px; resize:vertical;
  padding:13px 14px; border:0; border-radius:var(--p-r-md); background:#fff;
  font-family:inherit; font-size:13.5px; line-height:1.95; color:var(--p-ink);
}
.drm-cform textarea::placeholder{ color:var(--p-muted); }
.drm-cform textarea:focus-visible{ outline:2px solid var(--p-primary); outline-offset:1px; }
.drm-cform__foot{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.drm-cform__hint{ font-size:11.5px; color:var(--p-muted); line-height:1.8; }
.drm-cform__replyto{
  margin:0; display:flex; align-items:center; gap:8px;
  font-size:12px; font-weight:700; color:var(--p-muted);
}
.drm-cform__replyto button{
  all:unset; cursor:pointer; color:var(--p-primary); font-weight:800; font-size:11.5px;
}
.drm-cform__replyto button:focus-visible{ outline:2px solid var(--p-primary); outline-offset:2px; border-radius:4px; }
.drm-cform__foot .drm-btn{ margin-inline-start:auto; }

.drm-comments__bar{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-block-end:14px;
}
.drm-comments__count{ font-size:13px; font-weight:800; color:var(--p-ink); margin-inline-end:auto; }
.drm-chip{
  all:unset; box-sizing:border-box; cursor:pointer;
  display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:99px;
  background:var(--p-card); color:var(--p-ink); font-size:12px; font-weight:700; line-height:1;
  transition:background var(--p-dur) var(--p-ease), color var(--p-dur) var(--p-ease);
}
.drm-chip:hover{ background:var(--p-card-2); color:var(--p-primary); }
.drm-chip[aria-pressed="true"]{ background:var(--p-primary); color:#fff; }
.drm-chip:focus-visible{ outline:2px solid var(--p-primary); outline-offset:2px; }

.drm-clist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.drm-comment{ padding:15px; background:var(--p-card); border-radius:var(--p-r-lg); }
.drm-comment__head{ display:flex; align-items:center; gap:10px; margin-block-end:10px; }
.drm-comment__who{ display:flex; flex-direction:column; gap:3px; min-inline-size:0; }
.drm-comment__name{ display:flex; align-items:center; gap:7px; font-size:13px; font-weight:800; color:var(--p-ink); }
.drm-comment__name a{ color:inherit; text-decoration:none; }
.drm-comment__name a:hover{ color:var(--p-primary); }
.drm-badge{
  display:inline-flex; align-items:center; padding:4px 8px; border-radius:6px;
  background:var(--p-primary); color:#fff; font-size:10px; font-weight:800; line-height:1;
}
.drm-badge--muted{ background:#fff; color:var(--p-muted); }
.drm-comment__time{ font-size:11px; font-weight:600; color:var(--p-muted); }
.drm-comment__text{ margin:0; font-size:13.5px; line-height:2.05; color:var(--p-text); }
.drm-comment__text p{ margin:0 0 10px; }
.drm-comment__text p:last-child{ margin-bottom:0; }
.drm-comment__text a{ color:var(--p-primary); text-decoration:underline; text-underline-offset:3px; word-break:break-all; }
.drm-comment__foot{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-block-start:11px; }
.drm-cact{
  all:unset; box-sizing:border-box; cursor:pointer;
  display:inline-flex; align-items:center; gap:6px; padding:7px 11px; border-radius:99px;
  background:#fff; color:var(--p-muted); font-size:11.5px; font-weight:700; line-height:1;
  text-decoration:none;
  transition:background var(--p-dur) var(--p-ease), color var(--p-dur) var(--p-ease);
}
.drm-cact:hover{ background:var(--p-card-2); color:var(--p-primary); }
.drm-cact:focus-visible{ outline:2px solid var(--p-primary); outline-offset:2px; }
.drm-cact.is-on{ background:var(--p-primary); color:#fff; }
.drm-cact svg{ inline-size:14px; block-size:14px; fill:none; stroke:currentColor; stroke-width:1.8; }
.drm-cact.is-on svg{ fill:currentColor; }

.drm-replies{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:10px; }
.drm-replies > li{ padding-inline-start:0; }
.drm-reply{ padding:13px; background:#fff; border-radius:var(--p-r-md); }
.drm-replies__toggle{
  all:unset; box-sizing:border-box; cursor:pointer; margin-block-start:10px;
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:700; color:var(--p-primary);
}
.drm-replies__toggle:focus-visible{ outline:2px solid var(--p-primary); outline-offset:3px; border-radius:6px; }
.drm-replies__toggle svg{ inline-size:14px; block-size:14px; fill:none; stroke:currentColor; stroke-width:2; transition:transform var(--p-dur) var(--p-ease); }
.drm-replies__toggle[aria-expanded="true"] svg{ transform:rotate(180deg); }
.drm-replies[hidden]{ display:none; }

.drm-comments__more{ display:flex; justify-content:center; margin-block-start:16px; }

/* حالت مهمان و حالت واردشده */
.drm-post:not(.is-authed) .drm-authed-only{ display:none; }
.drm-post.is-authed .drm-guest-only{ display:none; }

/* نوار دموی سوییچ حالت — در نسخه‌ی وردپرسی حذف می‌شود */
/* ==========================================================================
   14. تصاویر جانشین (فقط دمو)
   ========================================================================== */
.ph{ background-size:cover; background-position:center; }
.ph-1{ background-image:linear-gradient(135deg,#e9dccb,#b9987a); }
.ph-2{ background-image:linear-gradient(135deg,#e6ccc9,#a97b78); }
.ph-3{ background-image:linear-gradient(135deg,#2f2c2a,#12100f); }
.ph-4{ background-image:linear-gradient(135deg,#d8ded1,#8a9b83); }
.ph-5{ background-image:linear-gradient(135deg,#f2e6cf,#c9a95c); }
.ph-6{ background-image:linear-gradient(135deg,#cdd6e0,#6f8298); }
.ph-a{ background-image:linear-gradient(135deg,#c9a95c,#6c1410); }
.ph-b{ background-image:linear-gradient(135deg,#8a9b83,#2f3a2c); }
.ph-c{ background-image:linear-gradient(135deg,#a97b78,#3a2220); }
.ph-d{ background-image:linear-gradient(135deg,#6f8298,#232c36); }

/* ==========================================================================
   15. ریسپانسیو
   ========================================================================== */
@media (max-width:1080px){
  .drm-post__layout{ grid-template-columns:1fr; gap:26px; }
  .drm-post__aside{ position:static; }
  .drm-post__header, .drm-post__body, .drm-brief, .drm-toc, .drm-actions,
  .drm-authorbox, .drm-comments, .drm-tags, .drm-sources{ max-width:none; }
  .drm-related__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px){
  .drm-post{ --p-fs-body:15.5px; --p-lh-body:2.1; --p-gap:9px; padding-block:14px 28px; }
  .drm-post__crumbs{ padding:8px 0 10px; }
  .drm-post__title{ font-size:21px; line-height:1.7; }
  .drm-post__heromedia{ aspect-ratio:4/3; border-radius:var(--p-r-md); }
  .drm-post__body h2{ font-size:18px; }
  .drm-post__body h3{ font-size:15.5px; }
  .drm-post__body blockquote{ font-size:14px; }
  .drm-actions{ gap:8px; padding:12px; }
  .drm-share{ margin-inline-start:0; inline-size:100%; justify-content:space-between; }
  .drm-share__lbl{ display:none; }
  .drm-authorbox{ flex-direction:column; gap:12px; }
  .drm-related__grid{ grid-template-columns:1fr; }
  .drm-rcard{ flex-direction:row-reverse; align-items:center; gap:10px; padding:7px; border-radius:var(--p-r-md); }
  .drm-rcard__media{ flex:0 0 92px; inline-size:92px; border-radius:11px; }
  .drm-rcard__body{ gap:7px; padding:1px 0; }
  .drm-rcard__meta{ margin-block-start:0; }
  .drm-guest{ padding:15px; }
  .drm-guest .drm-btn{ margin-inline-start:0; inline-size:100%; }
  .drm-cform{ padding:13px; gap:9px; }
  .drm-cform__foot .drm-btn{ margin-inline-start:0; inline-size:100%; }
  .drm-comment{ padding:13px; }
  .drm-comments__count{ inline-size:100%; margin-inline-end:0; margin-block-end:4px; }
}

/* ==========================================================================
   16. دسترسی‌پذیری و حالت‌های سیستمی
   ========================================================================== */
@media (prefers-reduced-motion: reduce){
  .drm-post *, .drm-post *::before, .drm-post *::after{
    transition-duration:.01ms !important; animation-duration:.01ms !important; scroll-behavior:auto !important;
  }
}
@media (forced-colors: active){
  .drm-brief, .drm-toc, .drm-actions, .drm-authorbox, .drm-comment, .drm-rcard, .drm-side{ border:1px solid CanvasText; }
}
.drm-sr-only{
  position:absolute !important; inline-size:1px; block-size:1px;
  padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;
}
.drm-skip{
  position:absolute; inset-inline-start:-9999px; top:0;
  background:var(--p-primary); color:#fff; padding:10px 16px; border-radius:0 0 10px 0;
  font-size:13px; font-weight:700; text-decoration:none; z-index:100;
}
.drm-skip:focus{ inset-inline-start:0; }

/* The global a:hover recolours every link. Cards keep their own colours so a
   finger resting on a card never turns the title or the chip red. */
.drm-rcard__title a:hover{ color:var(--p-ink); }
.drm-post__cat:hover{ color:#fff; }