/* Naijapolis engineering blog. It sits on top of landing.css (same sky, cards, buttons, footer and day/night); this file adds the article, the diagrams and the series cards.
   No inline styles anywhere: the page policy forbids them, so diagrams are styled here. */
.blog{--muted:var(--soft);--card:var(--paper);--gfill:#d6efdf;--yfill:#fdeeb8;--tfill:#fbdccd;--bfill:#d4e9f7;--blue:#2a6fb0;--codebg:#2b2118;--code:#f6ecd6;--faint:#b9a88a}
body.blog[data-time=night]{--gfill:#173a2a;--yfill:#3c3418;--tfill:#432519;--bfill:#1a2d4a;--blue:#7ab4ea;--codebg:#0d1030;--code:#f6ecd6;--faint:#5b5f93}
.navlink{font:600 16px var(--body);text-decoration:none;padding:8px 12px;border-radius:999px}.navlink:hover{background:color-mix(in srgb,var(--paper) 70%,transparent)}
@media(max-width:480px){.navlink{display:none}}
.post-hero{padding-bottom:clamp(40px,6vw,64px)}
.post-hero h1{font-size:clamp(34px,6.4vw,68px)}
.post-hero .kaabo a{color:inherit;text-underline-offset:3px}
.post-hero .fine{margin-top:16px}

/* ---------- the article ---------- */
.post{max-width:46rem;margin:0 auto;padding:clamp(28px,5vw,56px) max(18px,env(safe-area-inset-left)) clamp(48px,8vw,90px)}
.post article{font-size:18px;line-height:1.72}
.post p,.post li{max-width:65ch}.post p{margin:.85rem 0}.post ul,.post ol{padding-left:1.35rem;margin:.7rem 0}.post li{margin:.45rem 0}
.post .lead{font-size:clamp(19px,2.3vw,22px);line-height:1.6;color:var(--ink)}
.post h2{font-size:clamp(25px,3.6vw,34px);line-height:1.15;margin:3rem 0 .7rem}
.post a{color:var(--green);text-underline-offset:3px;font-weight:500}
body[data-time=night].blog .post a{color:#6ee0a3}
.post code{font:500 .86em/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:color-mix(in srgb,var(--gold) 22%,var(--paper));padding:.12em .4em;border-radius:6px}
pre.code{background:var(--codebg);color:var(--code);border-radius:20px;padding:1.1rem 1.3rem;overflow-x:auto;margin:1.4rem 0;font-size:.82rem;line-height:1.6;tab-size:2;box-shadow:0 10px 28px rgba(60,40,10,.18);-webkit-overflow-scrolling:touch}
pre.code code{background:none;padding:0;font-size:inherit;color:inherit;white-space:pre}
pre.code[data-lang]::before{content:attr(data-lang);display:block;font:700 11px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem}
.note{background:var(--paper);border:1px solid var(--line);border-left:6px solid var(--green);border-radius:20px;padding:1rem 1.3rem;margin:2rem 0;box-shadow:0 6px 20px rgba(90,50,10,.07)}
.note b{display:block;margin-bottom:.25rem;font:800 18px var(--display);color:var(--green)}
body[data-time=night].blog .note b{color:#6ee0a3}
.note p{margin:0}
.tw{overflow-x:auto;margin:1.4rem 0;border:1px solid var(--line);border-radius:20px;background:var(--paper);box-shadow:0 6px 20px rgba(90,50,10,.07)}
table{border-collapse:collapse;width:100%;min-width:30rem;font-size:.95rem}
th,td{text-align:left;vertical-align:top;padding:.7rem 1rem;border-bottom:1px solid var(--line)}
th{font-weight:700;color:var(--soft);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}tr:last-child td{border-bottom:0}
.toc{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:.7rem 1.2rem;margin:0 0 1.6rem;box-shadow:0 6px 20px rgba(90,50,10,.07)}
.toc summary{cursor:pointer;font:800 17px var(--display)}.toc ol{margin:.5rem 0;padding-left:1.3rem}.toc li{margin:.25rem 0}.toc li[aria-current]{font-weight:800}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:3.5rem 0 0}
.pn a{display:block;text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:1rem 1.2rem;font:800 18px/1.25 var(--display);box-shadow:0 6px 20px rgba(90,50,10,.07);transition:transform .25s,box-shadow .25s}
.pn a:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.pn small{display:block;color:var(--green);font:700 13px var(--body);letter-spacing:.04em;margin-bottom:.3rem}
body[data-time=night].blog .pn small{color:#6ee0a3}
.pn .next{text-align:right;grid-column:2}.pn .prev{grid-column:1}
@media (max-width:520px){.pn{grid-template-columns:1fr}.pn .next,.pn .prev{grid-column:1;text-align:left}}

/* ---------- the overview ---------- */
.pcard{display:block;text-decoration:none;color:inherit;height:100%}
.pcard .ico{font:800 24px var(--display)}
.pcard .ptag{display:block;font:700 12px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--green);font-style:normal;margin-bottom:6px}
body[data-time=night].blog .pcard .ptag{color:#6ee0a3}
.pcard .more{display:inline-block;margin-top:14px;font:700 15px var(--body);color:var(--green)}
body[data-time=night].blog .pcard .more{color:#6ee0a3}
.map-wrap .fig{margin:0;border:0;box-shadow:none;background:none;padding:0}
.map-wrap .fig figcaption{text-align:center;margin:10px auto 4px}
.honest{padding:clamp(60px,9vw,100px) 18px}
.honest-in{max-width:46rem;margin:0 auto;text-align:left}
.honest h2{font-size:clamp(28px,4.6vw,44px)}.honest h3{font-size:22px;margin:1.8rem 0 .2rem}
.honest p{margin:.8rem 0;color:var(--soft);font-size:18px;line-height:1.65}.honest .btn{margin-top:.6rem}

/* ---------- figures and diagrams ---------- */
.fig{margin:2rem 0;background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:clamp(10px,2vw,20px) clamp(10px,2vw,20px) 12px;box-shadow:0 6px 20px rgba(90,50,10,.07)}
.fig figcaption{font-size:15px;line-height:1.55;color:var(--soft);margin:.8rem .4rem .2rem;max-width:62ch}
.dg{display:block;width:100%;height:auto;max-width:580px;margin:0 auto;overflow:visible}
.dg text{fill:var(--ink);font:500 15px Figtree,system-ui,sans-serif}
.dg .sm{font-size:13px;fill:var(--soft);font-weight:400}.dg .bd{font-weight:700}
.dg .bx{fill:var(--paper);stroke:var(--faint);stroke-width:1.6}
.dg .bx.g{fill:var(--gfill);stroke:var(--green)}.dg .bx.y{fill:var(--yfill);stroke:var(--gold)}.dg .bx.t{fill:var(--tfill);stroke:var(--terra)}.dg .bx.b{fill:var(--bfill);stroke:var(--blue)}
.dg .zone{fill:none;stroke:var(--faint);stroke-width:1.4;stroke-dasharray:3 5}
.dg .ln{stroke:var(--soft);stroke-width:2;fill:none}.dg .ln.t{stroke:var(--terra)}.dg .ln.thick{stroke:var(--green);stroke-width:3}.dg .ln.dash{stroke-dasharray:5 5}.dg .ln.off{stroke:var(--faint)}
.dg .mk{fill:var(--soft)}
.dg .ax{stroke:var(--soft);stroke-width:1.5}
.dg .fill{fill:var(--gfill);stroke:none}
.dg .nd{stroke-width:2}.dg .nd.on{fill:var(--green);stroke:var(--green)}.dg .nd.off{fill:var(--paper);stroke:var(--faint)}
.dg .gen{fill:var(--gold);stroke:var(--gold)}.dg .gen+text{fill:#2b2118}
.dg .slab{stroke:var(--soft);stroke-width:1.5}.dg .s0{fill:var(--yfill)}.dg .s1{fill:var(--gfill)}.dg .s2{fill:var(--tfill)}.dg .s3{fill:var(--bfill)}.dg .s4{fill:var(--paper)}
.dg .h{stroke:none}.dg .h0{fill:#bfe3ee}.dg .h1{fill:#e8d9a8}.dg .h2{fill:#c9b87a}.dg .h3{fill:#a08f55}.dg .h4{fill:#6e6137}
.dg .row{fill:none;stroke:var(--ink);stroke-width:2}
.dg .sea{fill:#8dc3dc}.dg .land{fill:#b8a566;stroke:#6e6137;stroke-width:1.5}
.dg .win{fill:var(--gfill);stroke:var(--green);stroke-dasharray:5 4}
.dg .nt{fill:var(--green)}.dg .nt.past{fill:var(--faint)}
.dg .stall{fill:var(--tfill);stroke:var(--terra);stroke-dasharray:4 4}
.dg .dot{fill:var(--green)}.dg .dot.empty{fill:var(--faint);opacity:.6}
.dg .cell{fill:var(--bg);stroke:var(--line);stroke-width:1.2}.dg .cell.on{fill:var(--green);stroke:var(--green)}
.dg .lane{stroke:none}.dg .lane.old{fill:var(--faint)}.dg .lane.new{fill:var(--green)}.dg .lane.gap{fill:var(--tfill);stroke:var(--terra);stroke-dasharray:3 3}.dg .lane.ok{fill:var(--gfill);stroke:var(--green)}
.dg .badge{font-weight:800;fill:var(--green);font-size:16px}
.dg .nl{fill:#fff;font-weight:600}
body[data-time=night].blog .dg .nl{fill:#06210f}
body[data-time=night].blog .dg .badge{fill:#6ee0a3}
.i7{background:#d9e0f7;color:#2f3f8f}
.dg .bark{fill:none;stroke:#7a5a3e;stroke-width:14;stroke-linecap:round}.dg .bark.thin{stroke-width:7}.dg .bark.thinner{stroke-width:3.5;stroke:#7a5a3e}
.dg .leafc{stroke:none;opacity:.8}.dg .leafc.l0{fill:#4f9a43}.dg .leafc.l1{fill:#7bbd4e}.dg .leafc.l2{fill:#2f7a3b}
.dg .crown{fill:#5aa545;stroke:#2f6d35;stroke-width:1.5}.dg .trunk{fill:#7a5a3e}
.dg .pt{stroke:none}.dg .pt.a{fill:#fff;stroke:#c9b87a;stroke-width:1}.dg .pt.b{fill:#e0307f}.dg .pt.k1{fill:#e8374f}.dg .pt.k2{fill:#c0213c}.dg .pt.k3{fill:#ff7a8c}
.dg .ct{fill:#f2b705}.dg .ct.k2{fill:#fff2a8}.dg .ct.k3{fill:#a3203a}
.dg .gnd{fill:#c9b87a;stroke:#6e6137;stroke-width:1.5}.dg .wtr{fill:#8dc3dc;stroke:none}
body[data-time=night].blog .dg .pt.a{fill:#f1e8d2}
.dg .mx{stroke:var(--paper);stroke-width:1}.dg .mx.o{fill:#7bbd4e}.dg .mx.m{fill:#9aa0a8}.dg .mx.p{fill:#e8603c}.dg .mx.x{fill:#c9b87a}
.dg .cb{fill:var(--green)}.dg .cb.fl{fill:#1f6a3d;opacity:1}body[data-time=night].blog .dg .cb.fl{fill:#a6e8c4}