/* social-v1.css — the "More from Everything Econ" block, one design site-wide (Luke, 4 Oct 2026).
   Markup lives in tools/social.py; tools/site_patch.py stamps it and links this sheet.
   Own variables so it looks the same whatever a page calls its colours. */
:root{--mf-card:#ffffff;--mf-line:#dfe3ec;--mf-ink:#12213f;--mf-muted:#5c6a86;--mf-icon:#111318;--mf-glyph:#ffffff}
@media (prefers-color-scheme: dark){
 :root{--mf-card:#1a1d22;--mf-line:#2e333d;--mf-ink:#e8eaf0;--mf-muted:#a3acbd;--mf-icon:#f2f3f5;--mf-glyph:#111318}
}
.mfsec{border-top:1px solid var(--mf-line);margin-top:20px;padding-top:16px}
.mfsec .mfk{display:block;margin:0 0 10px;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--mf-muted)}
.mfsec .mfgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mfsec .mfc{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 11px;background:var(--mf-card);border:1px solid var(--mf-line);border-radius:12px;color:var(--mf-ink);text-decoration:none;box-shadow:none;transition:border-color .12s}
.mfsec .mfc:hover{border-color:var(--mf-ink)}
.mfsec .mfc:focus-visible{outline:2px solid var(--mf-ink);outline-offset:2px}
.mfsec .mfi{flex:0 0 auto;width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:var(--mf-icon);color:var(--mf-glyph)}
.mfsec .mfi svg{width:17px;height:17px;display:block}
.mfsec .tx{min-width:0;display:flex;flex-direction:column;gap:1px}
.mfsec .tx b{display:block;font-size:13.5px;font-weight:700;line-height:1.2;color:var(--mf-ink)}
.mfsec .tx i{display:block;font-style:normal;font-size:11.5px;font-weight:500;color:var(--mf-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:640px){.mfsec .mfgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}