:root{
  --mpdp-accent: #1f7ad1;
  --mpdp-accent-2: #7ee8fa;
  --mpdp-bg: #ffffff;
  --mpdp-text: #0b1220;
  --mpdp-muted: #6b7280;
  --mpdp-max-width: 840px;
  --mpdp-font-family: Vazir, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial;
  --mpdp-rounded: 14px;
  --mpdp-gap: 20px;
}

/* main card */
.mpdp-card { max-width: var(--mpdp-max-width); margin: 28px auto; background: var(--mpdp-bg); border-radius: var(--mpdp-rounded); box-shadow: 0 10px 30px rgba(7,12,18,0.06); padding: 22px; font-family: var(--mpdp-font-family); color: var(--mpdp-text); }
.mpdp-card-inner { background: transparent; border-radius: calc(var(--mpdp-rounded) - 6px); padding: 12px; margin-bottom: 14px; }

/* PROGRESS BAR */
#mpdp-progress { position: fixed; top: 12px; left: 50%; transform: translateX(-50%); width: calc(100% - 48px); max-width: var(--mpdp-max-width); height: 8px; border-radius: 999px; z-index: 99999; pointer-events:none; background: rgba(0,0,0,0.04); }
#mpdp-progress .mpdp-bar { width:0; height:100%; border-radius:999px; background: linear-gradient(90deg,var(--mpdp-accent),var(--mpdp-accent-2)); box-shadow: 0 6px 20px rgba(31,122,209,0.12); transition: width .12s linear; }
/* minimal mobile progress */
@media (max-width:768px){
  #mpdp-progress{ top:6px; height:3px; background: rgba(0,0,0,0.02); left:8px; right:8px; transform:none; width: calc(100% - 16px); max-width:none; }
  #mpdp-progress .mpdp-bar { height:100%; border-radius:3px; background: var(--mpdp-accent); box-shadow:none; }
}

/* header and reading-time */
.mpdp-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom: 12px; flex-wrap:wrap; }
.mpdp-reading-time { display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--mpdp-accent); font-family: var(--mpdp-font-family); background: rgba(31,122,209,0.05); padding:8px 12px; border-radius: 999px; }
.mpdp-reading-num { color: var(--mpdp-accent); font-weight:800; font-family: var(--mpdp-font-family); }

/* share buttons */
.mpdp-share { display:flex; gap:8px; align-items:center; }
.mpdp-share-btn { display:inline-flex; gap:8px; align-items:center; background:transparent; border:1px solid rgba(7,12,18,0.06); padding:8px 10px; border-radius:10px; font-weight:700; cursor:pointer; text-decoration:none; color:var(--mpdp-text); }
.mpdp-share-btn svg { color: var(--mpdp-accent); }
.mpdp-share-label { display:inline-block; line-height:1; }

/* featured image */
.mpdp-featured-wrap { border-radius: calc(var(--mpdp-rounded) - 6px); overflow:hidden; margin-bottom: 14px; display:block; }
.mpdp-img { width:100%; height:auto; display:block; transition: filter .4s ease, transform .4s ease, opacity .4s ease; }
.mpdp-blur { filter: blur(24px) scale(1.02); transform: scale(1.02); }
.mpdp-loaded { filter: none; transform: none; }

/* TOC mobile dropdown */
.mpdp-toc-dropdown .mpdp-toc-toggle { display:block; width:100%; background:transparent; border:1px solid rgba(7,12,18,0.06); padding:10px 12px; text-align:right; border-radius:10px; font-weight:700; cursor:pointer; }
.mpdp-toc-mobile { margin-top:10px; }
.mpdp-toc-list { list-style:none; margin:0; padding:0; }
.mpdp-toc-item { margin:6px 0; }
.mpdp-toc-list a { color: var(--mpdp-accent); text-decoration:none; font-weight:700; }
.mpdp-toc-sub { margin-right:10px; padding-right:8px; border-right: 2px dashed rgba(31,122,209,0.06); }

/* floating TOC desktop */
.mpdp-toc-floating { position: fixed; top: 140px; width: 260px; max-width: 26vw; z-index: 9999; padding: 12px; border-radius: 12px; background: rgba(255,255,255,0.96); box-shadow: 0 20px 40px rgba(7,12,18,0.06); transition: transform .18s ease, opacity .18s ease; }
.mpdp-toc-right { right: calc(50% - var(--mpdp-max-width)/2 - 12px); }
.mpdp-toc-left { left: calc(50% - var(--mpdp-max-width)/2 - 12px); }
.mpdp-toc-floating .mpdp-toc-collapse { margin-top:8px; display:block; border:none; background:transparent; cursor:pointer; font-size:18px; }

/* content */
.mpdp-post-wrap { padding: 6px 6px 0 6px; }
.mpdp-post-content { font-size:18px; line-height:1.9; color:var(--mpdp-text); -webkit-font-smoothing:antialiased; }
.mpdp-post-content p { margin: 0 0 1.1em 0; padding: 0; }
.mpdp-post-content.mpdp-justify p { text-align: justify; text-justify: inter-word; }
.mpdp-post-content blockquote, .mpdp-post-content pre, .mpdp-post-content code, .mpdp-post-content ul, .mpdp-post-content ol { text-align: start; }

/* author box */
.mpdp-author-box { margin-top:22px; padding-top:14px; border-top:1px solid rgba(7,12,18,0.04); }
.mpdp-author-inner { display:flex; gap:12px; align-items:flex-start; }
.mpdp-author-avatar-wrap img { border-radius:50%; width:84px; height:84px; object-fit:cover; border:2px solid rgba(7,12,18,0.04); }
.mpdp-author-name { margin:0; font-weight:800; }
.mpdp-author-bio { margin:6px 0 0 0; color:var(--mpdp-muted); }

/* RELATED: image larger & compact text */
.mpdp-related { margin-top:20px; padding-top:12px; border-top:1px solid rgba(7,12,18,0.04); }
.mpdp-related-list { display:grid; grid-template-columns: repeat(2, 1fr); gap:12px; align-items:start; }
.mpdp-related-item { display:flex; gap:12px; align-items:center; }
.mpdp-related-thumb-wrap { flex: 0 0 160px; }
.mpdp-related-thumb { width:160px; height:100px; object-fit:cover; border-radius:8px; display:block; }
.mpdp-related-meta { flex: 1 1 auto; }
.mpdp-related-item-title { font-weight:700; font-size:15px; color:var(--mpdp-text); margin:0; }

/* responsive */
@media (max-width:1024px){ .mpdp-toc-floating { display:none; } .mpdp-card{ padding:18px; } .mpdp-related-list { grid-template-columns: repeat(3,1fr); } }
@media (max-width:720px){
  #mpdp-progress{ top:6px; height:3px; background: rgba(0,0,0,0.02); left:8px; right:8px; transform:none; width: calc(100% - 16px); max-width:none; }
  .mpdp-card{ margin:16px 10px; padding:14px; }
  .mpdp-related-list{ grid-template-columns: repeat(2,1fr); }
  .mpdp-post-content { font-size:16px; }
}
@media (max-width:420px){
  .mpdp-related-list{ grid-template-columns: 1fr; }
  .mpdp-toc-mobile{ margin-top:8px; }
}

/* dark mode */
body.mpdp-theme-dark {
  --mpdp-bg: #071428;
  --mpdp-text: #dbe9ff;
  --mpdp-muted: #9fb8d9;
}
body.mpdp-theme-dark .mpdp-card { background: rgba(8,18,38,0.64); box-shadow: 0 10px 30px rgba(2,6,12,0.6); }

/* utilities */
.mpdp-sr-only { position:absolute!important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap; }
