/* ══════════════════════════════════════════════════════
   The blog — one small stylesheet, on purpose
   ══════════════════════════════════════════════════════
   The marketing pages load dashboard.css, the depth layer and landing.css:
   about 680 KB before a word is drawn. A post is read, not operated, and
   search engines weigh how fast it paints, so the blog carries its own
   stylesheet instead: the platform's tokens, its header and footer, and a
   reading column. Built by server/bin/blog.php; see that file. */

:root{
  --bg:#0A0C10;--bg-1:#11151C;--bg-2:#171C25;--bg-3:#1F2632;
  --line:#242C38;--line-2:#1A212B;
  --fg:#EDF1F6;--fg-2:#A9B4C2;--fg-3:#8A96A6;--ink:#D6DDE6;
  --gold:#E8B647;--gold-lt:#F7D488;--gold-dp:#B8862A;--gold-pale:rgba(232,182,71,.09);--gold-line:rgba(232,182,71,.30);
  --up:#0ECB81;
  --f-display:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
  --f-body:'Inter',system-ui,-apple-system,sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --r:12px;--ease:cubic-bezier(.16,1,.3,1);
}
html[lang="fa"]{--f-display:'Vazirmatn',system-ui,sans-serif;--f-body:'Vazirmatn',system-ui,sans-serif;}
html[lang="ar"]{--f-display:'IBM Plex Sans Arabic',system-ui,sans-serif;--f-body:'IBM Plex Sans Arabic',system-ui,sans-serif;}

*{box-sizing:border-box;}
html{background:var(--bg);-webkit-text-size-adjust:100%;scroll-padding-top:84px;}
body{margin:0;background:
  radial-gradient(900px 420px at 80% -120px,rgba(232,182,71,.07),transparent 70%),var(--bg);
  color:var(--fg);font:400 16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;}
a{color:inherit;}
img{max-width:100%;height:auto;}
.bl-wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 20px;}

/* ── Header ── */
.bl-nav{position:sticky;top:0;z-index:20;backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);
  background:rgba(10,12,16,.78);border-bottom:1px solid var(--line-2);}
.bl-nav-in{display:flex;align-items:center;gap:22px;height:64px;}
.bl-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 15px/1 var(--f-display);letter-spacing:.18em;color:var(--fg);direction:ltr;}
.bl-brand img{border-radius:7px;}
.bl-links{display:flex;gap:4px;margin-inline-start:12px;}
.bl-links a{padding:8px 11px;border-radius:8px;text-decoration:none;font-size:14px;color:var(--fg-2);transition:color .2s,background .2s;}
.bl-links a:hover{color:var(--fg);background:var(--bg-2);}
.bl-links a[aria-current]{color:var(--gold-lt);}
.bl-nav-end{display:flex;align-items:center;gap:10px;margin-inline-start:auto;}
.bl-login{font-size:14px;color:var(--fg-2);text-decoration:none;padding:8px 6px;}
.bl-login:hover{color:var(--fg);}
.bl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;white-space:nowrap;
  background:linear-gradient(145deg,var(--gold-lt),var(--gold) 45%,var(--gold-dp));color:#150F02;
  font:700 14px/1 var(--f-display);padding:14px 22px;border-radius:10px;box-shadow:0 6px 22px rgba(232,182,71,.18);
  transition:transform .2s var(--ease),box-shadow .2s;}
.bl-btn:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(232,182,71,.24);}
.bl-btn.sm{padding:10px 15px;font-size:13px;}
@media(max-width:860px){.bl-links{display:none;}}

/* ── Index ── */
.bl-index{padding-bottom:72px;}
.bl-hero{padding:64px 0 28px;max-width:760px;}
.bl-eyebrow{margin:0 0 12px;font:700 12px/1 var(--f-display);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);}
html[lang="fa"] .bl-eyebrow,html[lang="ar"] .bl-eyebrow{letter-spacing:0;font-size:14px;}
.bl-hero h1{margin:0;font:800 clamp(34px,5vw,52px)/1.08 var(--f-display);letter-spacing:-.025em;text-wrap:balance;}
.bl-dek{margin:16px 0 0;font-size:18px;line-height:1.6;color:var(--fg-2);max-width:62ch;text-wrap:pretty;}
.bl-langs{display:flex;gap:8px;margin-top:22px;}
.bl-langs a{font-size:13px;text-decoration:none;color:var(--fg-2);padding:6px 12px;border:1px solid var(--line);border-radius:999px;}
.bl-langs a[aria-current]{color:var(--gold-lt);border-color:var(--gold-line);background:var(--gold-pale);}
.bl-cats{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 26px;}
.bl-cats button{font:500 13px/1 var(--f-body);color:var(--fg-2);background:var(--bg-1);border:1px solid var(--line);
  border-radius:999px;padding:9px 14px;cursor:pointer;}
.bl-cats button.on{color:var(--gold-lt);border-color:var(--gold-line);background:var(--gold-pale);}
.bl-empty{color:var(--fg-3);}

.bl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:18px;}
.bl-card{background:linear-gradient(176deg,rgba(255,255,255,.04),rgba(255,255,255,0) 40%),var(--bg-1);
  border:1px solid var(--line-2);border-radius:var(--r);transition:border-color .25s var(--ease),transform .25s var(--ease);}
.bl-card[hidden]{display:none;}
.bl-card:hover{border-color:var(--gold-line);transform:translateY(-2px);}
.bl-card a{display:flex;flex-direction:column;gap:10px;height:100%;padding:22px;text-decoration:none;}
.bl-card-img{border-radius:8px;aspect-ratio:16/9;object-fit:cover;width:100%;margin-bottom:4px;}
.bl-card h2{margin:0;font:700 19px/1.3 var(--f-display);letter-spacing:-.01em;color:var(--fg);text-wrap:balance;}
.bl-card p{margin:0;color:var(--fg-2);font-size:14.5px;line-height:1.6;}
.bl-card .bl-meta{margin-top:auto;padding-top:6px;}
.bl-card.big a{padding:30px;}
.bl-card.big h2{font-size:clamp(24px,3vw,32px);}
.bl-card.big p{font-size:16px;max-width:70ch;}
.bl-chip{align-self:flex-start;font:600 11.5px/1 var(--f-body);color:var(--gold-lt);background:var(--gold-pale);
  border:1px solid var(--gold-line);border-radius:999px;padding:6px 10px;}
.bl-meta{font-size:13px;color:var(--fg-3);}

/* ── Post ── */
.bl-post{padding-bottom:72px;}
.bl-crumbs{display:flex;flex-wrap:wrap;gap:8px;padding:28px 0 0;font-size:13px;color:var(--fg-3);}
.bl-crumbs a{text-decoration:none;color:var(--fg-2);}
.bl-crumbs a:hover{color:var(--gold-lt);}
.bl-head{max-width:780px;padding:26px 0 8px;}
.bl-head .bl-chip{display:inline-block;margin-bottom:16px;}
.bl-head h1{margin:0;font:800 clamp(30px,4.6vw,46px)/1.12 var(--f-display);letter-spacing:-.025em;text-wrap:balance;}
.bl-head .bl-dek{font-size:19px;}
.bl-head .bl-meta{margin:18px 0 0;}
.bl-trans{margin:10px 0 0;font-size:13.5px;color:var(--fg-3);}
.bl-trans a{color:var(--gold-lt);}
.bl-cover{display:block;width:100%;max-height:520px;object-fit:cover;border-radius:var(--r);margin:22px 0 4px;border:1px solid var(--line-2);}

.bl-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;margin-top:28px;}
@media(min-width:1100px){
  .bl-layout{grid-template-columns:minmax(0,720px) 260px;justify-content:space-between;}
  .bl-toc{order:2;position:sticky;top:96px;align-self:start;}
}
.bl-toc details{background:var(--bg-1);border:1px solid var(--line-2);border-radius:var(--r);padding:14px 16px;}
.bl-toc summary{cursor:pointer;font:700 12px/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);list-style:none;}
html[lang="fa"] .bl-toc summary,html[lang="ar"] .bl-toc summary{letter-spacing:0;font-size:13px;}
.bl-toc summary::-webkit-details-marker{display:none;}
.bl-toc ol{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;}
.bl-toc a{display:block;padding:6px 0;font-size:14px;line-height:1.45;color:var(--fg-2);text-decoration:none;}
.bl-toc a:hover{color:var(--gold-lt);}
.bl-toc .l3 a{padding-inline-start:14px;font-size:13.5px;color:var(--fg-3);}

/* The reading column: 18px on a 1.8 line, ink a step off white so a long
   read does not glare, and ~70 characters to the line. */
.prose{max-width:720px;font-size:18px;line-height:1.8;color:var(--ink);min-width:0;}
html[lang="fa"] .prose,html[lang="ar"] .prose{font-size:18.5px;line-height:2;}
.prose>*:first-child{margin-top:0;}
.prose p{margin:0 0 1.15em;}
.prose h2{margin:2.1em 0 .6em;font:700 28px/1.25 var(--f-display);letter-spacing:-.015em;color:var(--fg);}
.prose h3{margin:1.7em 0 .5em;font:700 21px/1.3 var(--f-display);color:var(--fg);}
.prose h4{margin:1.5em 0 .4em;font:700 18px/1.35 var(--f-display);color:var(--fg);}
.prose a{color:var(--gold-lt);text-decoration-thickness:1px;text-underline-offset:3px;}
.prose a:hover{color:var(--gold);}
.prose strong{color:var(--fg);font-weight:600;}
.prose ul,.prose ol{margin:0 0 1.2em;padding-inline-start:1.3em;}
.prose li{margin:.35em 0;}
.prose li::marker{color:var(--gold);}
.prose blockquote{margin:1.6em 0;padding:4px 0 4px 20px;border-inline-start:3px solid var(--gold);color:var(--fg);}
[dir="rtl"] .prose blockquote{padding:4px 20px 4px 0;}
.prose blockquote p{margin:.4em 0;}
.prose code{font:500 .86em/1 var(--f-mono);background:var(--bg-2);border:1px solid var(--line);border-radius:5px;padding:2px 6px;direction:ltr;unicode-bidi:isolate;}
.prose pre{margin:1.4em 0;padding:16px 18px;background:var(--bg-1);border:1px solid var(--line-2);border-radius:10px;overflow-x:auto;direction:ltr;}
.prose pre code{background:none;border:0;padding:0;font-size:14px;line-height:1.6;}
.prose hr{border:0;height:1px;background:var(--line);margin:2.4em 0;}
.prose figure{margin:1.8em 0;}
.prose figure img{border-radius:10px;border:1px solid var(--line-2);display:block;}
.prose figcaption{margin-top:8px;font-size:14px;color:var(--fg-3);text-align:center;}
.prose .tbl{overflow-x:auto;margin:1.5em 0;border:1px solid var(--line-2);border-radius:10px;}
.prose table{border-collapse:collapse;width:100%;font-size:15.5px;line-height:1.5;}
.prose th,.prose td{padding:11px 14px;text-align:start;border-bottom:1px solid var(--line-2);vertical-align:top;}
.prose th{font:600 13px/1.3 var(--f-display);letter-spacing:.04em;color:var(--fg-2);background:var(--bg-1);}
.prose tr:last-child td{border-bottom:0;}
.bl-risk{margin-top:2.4em!important;padding-top:16px;border-top:1px solid var(--line-2);font-size:14px;line-height:1.6;color:var(--fg-3);}

.bl-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin:48px 0 0;padding:28px 30px;max-width:1120px;
  border:1px solid var(--gold-line);border-radius:var(--r);
  background:linear-gradient(115deg,rgba(232,182,71,.12),rgba(232,182,71,.02) 55%),var(--bg-1);}
.bl-cta h2{margin:0;font:700 22px/1.3 var(--f-display);}
.bl-cta p{margin:6px 0 0;color:var(--fg-2);max-width:58ch;}
.bl-related{margin-top:56px;}
.bl-related>h2{margin:0;font:700 22px/1.3 var(--f-display);}

/* ── Footer ── */
.bl-foot{border-top:1px solid var(--line-2);padding:26px 0 40px;}
.bl-foot-in{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:13.5px;color:var(--fg-3);}
.bl-foot a{color:var(--fg-2);text-decoration:none;}
.bl-foot a:hover{color:var(--gold-lt);}

@media(max-width:600px){
  .bl-wrap{padding:0 16px;}
  .bl-nav-in{gap:12px;height:58px;}
  .bl-login{display:none;}
  .bl-hero{padding:40px 0 18px;}
  .bl-card a,.bl-card.big a{padding:20px;}
  .prose{font-size:17px;}
  .prose h2{font-size:24px;}
  .bl-cta{padding:22px;}
  .bl-cta .bl-btn{width:100%;}
}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
@media(prefers-reduced-motion:reduce){*{transition:none!important;}}