/* Content engagement placement for pages and cards, revision 20260816c. */
.page-engagement { grid-column:1/-1; margin-top:20px; padding-top:18px; border-top:1px solid rgba(222,219,200,.14); }
.article-actions .moke-engagement { margin-right:auto; }
.metric-card .moke-engagement { margin:16px 0; padding:14px 0; border-top:1px solid rgba(222,219,200,.12); border-bottom:1px solid rgba(222,219,200,.12); }
.card-meta-row { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:30px; margin-bottom:10px; }
.card-meta-row .date { margin-bottom:0; }
.card-engagement { display:inline-flex; align-items:center; gap:3px; min-width:0; color:rgba(222,219,200,.48); font:650 11px/1 "JetBrains Mono",ui-monospace,monospace; white-space:nowrap; }
.card-engagement .card-metric { display:inline-flex; align-items:center; gap:5px; min-height:30px; padding:5px 8px; border:0; border-radius:999px; background:transparent; color:inherit; font:inherit; }
.card-engagement i { color:rgba(214,83,88,.86); font-size:12px; font-style:normal; }
.card-engagement b { color:rgba(222,219,200,.76); font-size:11px; }
.card-like,.card-share { cursor:pointer; transition:.18s ease; }
.card-like:hover,.card-like.active,.card-share:hover,.card-share.shared { background:rgba(183,0,0,.1); color:rgba(222,219,200,.86); }
.card-like.active i { color:#e66f75; }
.card-share.share-error { border-color:rgba(220,90,90,.48); color:#e68c8c; }
.card-like.action-error { color:#e68c8c; }
.card-like:disabled,.card-share:disabled { cursor:wait; opacity:.58; }
.skill-card-engagement { flex:0 0 auto; justify-content:flex-end; min-height:22px; margin-left:auto; padding-left:4px; border-left:1px solid rgba(222,219,200,.07); }
.skill-card-engagement .card-metric { min-height:30px; padding:5px 7px; }
.skill-card-engagement i { font-size:12px; }
.skill-card-engagement b { font-size:11px; }
@media (max-width:700px) {
  .page-engagement { margin-top:14px; padding-top:14px; }
  .article-actions .moke-engagement { width:100%; }
  .card-meta-row { align-items:flex-start; }
  .card-engagement { gap:0; }
  .card-engagement .card-metric { padding-inline:6px; }
}