/* Swahili Social 0.17.3 — interface refresh.
 * Loaded last. Theme-aware (uses --sts-* variables) and tuned for phones:
 * no blur, no endless animation, off-screen posts are not painted. */

/* ---------- Lighter on low-end phones ---------- */
.sts-header-brand-word{animation:none!important;will-change:auto!important;filter:none!important;transform:none!important;background-size:100% 100%!important}
.sts-bottom-nav,.sts-feed-header,.sts-brand-header,.sts-share-modal{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.sts-bottom-nav{background:var(--sts-panel)!important;border:1px solid var(--sts-line)!important;box-shadow:0 6px 20px rgba(0,0,0,.25)!important}
.sts-feed-header{background:var(--sts-bg)!important}
html[data-sts-theme="light"] .sts-bottom-nav{box-shadow:0 6px 20px rgba(36,39,45,.14)!important}
.sts-post-card{content-visibility:auto;contain-intrinsic-size:auto 340px}
.sts-post-card.sts-menu-open,.sts-post-card:focus-within{content-visibility:visible}

/* ---------- Header, search, tabs ---------- */
.sts-feed-header{padding:0 14px!important}
.sts-search-bar{margin:10px 0 6px!important;padding:3px 4px 3px 14px!important;border-radius:14px!important;background:var(--sts-panel2)!important;border:1px solid transparent!important;min-height:44px}
.sts-search-bar:focus-within{border-color:var(--sts-blue)!important}
.sts-search-bar input{font-size:15px!important}
.sts-search-bar button{border-radius:10px!important;padding:8px 14px!important;font-size:12.5px!important}
.sts-tabs{min-height:44px!important}
.sts-tabs a{padding:12px 4px 11px!important;font-size:15px!important;border-bottom-width:3px!important;border-radius:3px 3px 0 0}

/* ---------- Section headings ---------- */
.sts-section-title{padding:18px 16px 8px!important;font-size:18px!important;letter-spacing:-.01em}
.sts-section-title small{font-size:12px;font-weight:500;color:var(--sts-muted)}

/* ---------- Post card ---------- */
.sts-post-card{padding:16px 16px 8px!important;border-bottom:1px solid var(--sts-line)!important}
.sts-post-card:hover{background:var(--sts-bg)!important}
html[data-sts-theme="light"] .sts-post-card:hover{background:var(--sts-bg)!important}
.sts-post-head{gap:12px!important;align-items:center!important}
.sts-post-avatar{width:44px!important;height:44px!important;flex:0 0 44px!important}
.sts-post-author-row{flex-wrap:wrap!important;row-gap:1px!important;column-gap:6px!important;align-items:center}
.sts-post-author{font-size:15.5px!important;font-weight:800!important;letter-spacing:-.005em}
.sts-post-author-row .sts-post-handle{order:3!important;flex:0 0 100%!important;max-width:100%!important;width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:12.5px!important;font-weight:500!important;color:var(--sts-muted);line-height:1.25}
.sts-post-author-row .sts-follow-btn{order:2;margin-left:auto!important;padding:5px 13px!important;font-size:12px!important;border-color:var(--sts-line)!important;color:var(--sts-text)!important}
.sts-post-author-row .sts-follow-btn.following{background:var(--sts-panel2)!important;color:var(--sts-muted)!important}
.sts-post-author-row details.sts-more{order:2}
.sts-more>summary{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:var(--sts-muted);font-size:15px;list-style:none}
.sts-post-body{margin:10px 0 0!important;padding-left:0!important;font-size:16.5px!important;line-height:1.5!important;font-weight:450!important;letter-spacing:.002em}
.sts-post-media,.sts-link-preview,.sts-embed{margin-top:12px!important}
.sts-post-media img,.sts-link-preview{border-radius:16px!important}
.sts-link-preview{border-color:var(--sts-line)!important}
.sts-post-body a{color:var(--sts-blue)}

/* action bar */
.sts-actions{margin:6px -8px 0!important;padding:0!important;max-width:none!important;display:flex!important;align-items:center;justify-content:space-between;color:var(--sts-muted)}
.sts-actions>a,.sts-actions>button,.sts-actions summary{
  display:inline-flex!important;align-items:center;gap:6px;min-height:42px;padding:0 10px!important;border-radius:999px;
  font-size:14px!important;font-weight:650!important;color:var(--sts-muted)!important;line-height:1;list-style:none;cursor:pointer;background:none!important
}
.sts-actions summary::-webkit-details-marker{display:none}
.sts-actions>a:hover,.sts-actions>button:hover,.sts-actions summary:hover{background:var(--sts-panel2)!important;color:var(--sts-text)!important}
.sts-comment-action{gap:6px!important}
.sts-comment-icon{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.sts-actions .sts-like{font-size:15px!important}
.sts-actions .sts-like.liked{color:#ff4d6a!important}
.sts-actions .sts-share-trigger{font-size:13.5px!important}
.sts-translate-btn{font-size:13px!important}
.sts-repost-menu{position:relative}

/* reposted / quoted */
.sts-reposted-by{font-size:12.5px;color:var(--sts-muted);margin-bottom:8px;font-weight:600}
.sts-repost-card{border-radius:16px!important;border-color:var(--sts-line)!important}

/* ---------- Cards and lists ---------- */
.sts-news-card{padding:12px 16px!important;gap:12px!important;border-bottom:1px solid var(--sts-line)!important}
.sts-news-thumb{border-radius:12px!important}
.sts-news-title{font-size:16px!important;line-height:1.28!important}
.sts-right-card{border-radius:16px!important}
.sts-empty{padding:48px 24px!important}
.sts-hero{padding:24px 18px!important}

/* ---------- Bottom bar ---------- */
.sts-bottom-nav{border-radius:22px!important}
.sts-bottom-link{font-size:10.5px!important}
.sts-bottom-link.active,.sts-bottom-link.active b{color:var(--sts-text)!important}
.sts-bottom-post{box-shadow:0 6px 16px rgba(229,57,53,.32)!important}

/* ---------- Tap feedback without layout cost ---------- */
.sts-tap-pending{opacity:.78}
a,button,summary{-webkit-tap-highlight-color:transparent}
img{image-rendering:auto}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* ---------- 0.17.1 palette: graphite + ivory, one teal brand colour ----------
   Red is kept only for hearts / alerts. Primary actions use the brand teal. */
:root{--sts-brand:#2dd4bf;--sts-brand-ink:#04211d;--sts-brand-soft:rgba(45,212,191,.14);--sts-heart:#ff5a74}
html[data-sts-theme="light"]{--sts-brand:#0a7468;--sts-brand-ink:#fff;--sts-brand-soft:rgba(10,116,104,.10);--sts-heart:#e11d48}
.sts-bottom-post,.sts-search-bar button,.sts-search-bar button[type=submit]{background:var(--sts-brand)!important;color:var(--sts-brand-ink)!important;border-color:transparent!important}
.sts-bottom-post{box-shadow:0 6px 18px var(--sts-brand-soft),0 2px 6px rgba(0,0,0,.18)!important}
.sts-tabs a.active{border-bottom-color:var(--sts-brand)!important;box-shadow:none}
.sts-tabs a.active::after{background:var(--sts-brand)!important}
.sts-actions .sts-like.liked,.stsc-like.is-liked{color:var(--sts-heart)!important}
.sts-country-join{color:var(--sts-brand)!important;border-color:var(--sts-brand)!important;background:transparent!important}
.sts-country-join.joined,.sts-country-join.is-joined{background:var(--sts-brand-soft)!important}
.sts-follow-btn:not(.following){background:var(--sts-brand)!important;color:var(--sts-brand-ink)!important;border-color:transparent!important}
.sts-comment-submit,.stsc-send.is-ready{background:var(--sts-brand)!important;border-color:var(--sts-brand)!important;color:var(--sts-brand-ink)!important}
a.sts-hashtag,.sts-post-content a{color:var(--sts-brand)}
html[data-sts-theme="light"] .sts-post-card:hover{background:var(--sts-bg)!important}
html[data-sts-theme="light"] .sts-bottom-nav{background:rgba(255,255,255,.86)!important;border-color:var(--sts-line)!important}
html[data-sts-theme="light"] .sts-follow-btn:not(.following),html body.sts-body .sts-follow-btn:not(.following){background:var(--sts-brand)!important;color:var(--sts-brand-ink)!important;border-color:transparent!important}
html body .sts-bottom-post{background:var(--sts-brand)!important;color:var(--sts-brand-ink)!important}
html body a.sts-hashtag,html body .sts-suggested-head a,html body .sts-post-body a.sts-hashtag{color:var(--sts-brand)!important}
html body .sts-onboarding-finish{background:var(--sts-brand)!important;color:var(--sts-brand-ink)!important}
.stsc-text a,.stsc-mention{color:var(--sts-brand)!important}

/* ---------- 0.17.2 soft cards + modern icons ---------- */
.sts-ico,.sts-comment-icon{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
html body .sts-post-card{margin:8px 10px!important;padding:14px 16px 8px!important;border:1px solid var(--sts-line)!important;border-radius:22px!important;background:var(--sts-panel)!important;box-shadow:0 1px 0 rgba(255,255,255,.02) inset}
html[data-sts-theme="light"] body .sts-post-card,html[data-sts-theme="light"] .sts-post-card{border-color:transparent!important;box-shadow:0 1px 2px rgba(60,45,20,.05),0 6px 18px rgba(60,45,20,.05)!important}
html body .sts-post-card:hover{background:var(--sts-panel)!important}
html body .sts-center,html body .sts-profile-shell,html body .sts-news-page{border-left:0!important;border-right:0!important}
html body .sts-feed-header{border-bottom-color:transparent!important}
/* action bar: icon + count, no heavy glyphs */
html body .sts-actions{display:flex!important;align-items:center!important;gap:4px!important;margin:10px -6px 0!important;padding:0!important;border:0!important;flex-wrap:nowrap!important}
html body .sts-actions>a,html body .sts-actions .sts-repost-menu>summary,html body .sts-actions .sts-share-trigger{display:inline-flex!important;align-items:center;gap:6px;min-height:38px;padding:0 10px!important;border-radius:999px!important;background:transparent!important;border:0!important;color:var(--sts-muted)!important;font-size:13px!important;font-weight:600;text-decoration:none!important;cursor:pointer;list-style:none;transition:background .15s,color .15s,transform .15s}
html body .sts-actions .sts-repost-menu>summary::-webkit-details-marker{display:none}
html body .sts-actions>a:hover,html body .sts-actions .sts-repost-menu>summary:hover,html body .sts-actions .sts-share-trigger:hover{background:var(--sts-brand-soft)!important;color:var(--sts-text)!important}
html body .sts-actions>a:active,html body .sts-actions .sts-share-trigger:active{transform:scale(.92)}
html body .sts-actions .sts-like.liked{color:var(--sts-heart)!important}
html body .sts-actions .sts-like.liked .sts-ico{fill:currentColor;animation:stsPop .28s ease}
html body .sts-actions .sts-repost-menu>summary.active{color:var(--sts-brand)!important}
html body .sts-actions .sts-share-trigger{margin-left:auto!important}
html body .sts-actions .sts-translate-btn{margin-left:auto!important;padding:0 10px!important;min-height:30px;border:0!important;background:transparent!important;color:var(--sts-muted)!important;font-size:12px!important;font-weight:600}
html body .sts-actions .sts-translate-btn+.sts-share-trigger{margin-left:0!important}
@keyframes stsPop{0%{transform:scale(.6)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
html body .sts-repost-options a{display:flex;align-items:center;gap:8px}
html body .sts-repost-options .sts-ico{width:18px;height:18px}

/* ======================================================================
   0.17.3 — COMPACT FEED
   Open full-width posts (no boxes), but tight: small gaps, normal-size text and
   photos. Tune the numbers here, hard-refresh.
   ====================================================================== */
:root{
  --sts-post-gap:14px;          /* space between two posts (half above, half below the thin line) */
  --sts-post-pad-x:14px;        /* left / right padding of a post */
  --sts-name-size:14px;
  --sts-meta-size:12px;
  --sts-text-size:15.5px;       /* post text */
  --sts-text-leading:1.42;
  --sts-count-size:13.5px;      /* numbers beside the icons */
  --sts-icon-size:21px;
  --sts-media-max:380px;        /* tallest a photo can be */
  --sts-media-radius:12px;
  --sts-sep:#1d2127;            /* the band between posts (it replaces spacing, adds none) */
}
html[data-sts-theme="light"]{--sts-sep:#ece7dd}
html:root body .sts-post-card,
html[data-sts-theme="light"]:root body .sts-post-card{
  position:relative;margin:0!important;
  padding:6px var(--sts-post-pad-x) 0!important;border-bottom:6px solid var(--sts-sep)!important;
  border-top:0!important;border-left:0!important;border-right:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;
  contain-intrinsic-size:auto 230px;
}
html:root body .sts-post-card:hover,
html[data-sts-theme="light"]:root body .sts-post-card:hover{background:transparent!important}

html:root body .sts-post-card .sts-post-head{gap:9px!important;align-items:center!important}
html:root body .sts-post-card .sts-post-avatar{width:34px!important;height:34px!important;flex:0 0 34px!important}
html:root body .sts-post-card .sts-post-author{font-size:var(--sts-name-size)!important;font-weight:750!important}
html:root body .sts-post-card .sts-post-author-row .sts-post-handle{font-size:var(--sts-meta-size)!important;line-height:1.25!important}
html:root body .sts-post-card .sts-post-author-row .sts-follow-btn{padding:3px 10px!important;font-size:11.5px!important}
html:root body .sts-post-card .sts-reposted-by{font-size:var(--sts-meta-size)!important;margin-bottom:6px!important}

html:root body .sts-post-card .sts-post-body{margin:6px 0 0!important;padding:0!important;font-size:var(--sts-text-size)!important;line-height:var(--sts-text-leading)!important}
html:root body .sts-post-card .sts-post-body>.sts-post-media{margin:8px 0 0!important;gap:3px!important}
html:root body .sts-post-card .sts-post-media a{display:block}
html:root body .sts-post-card .sts-post-media img{border-radius:var(--sts-media-radius)!important;max-height:var(--sts-media-max)!important;width:100%;object-fit:cover}
html:root body .sts-post-card .sts-link-preview,
html:root body .sts-post-card .sts-embed,
html:root body .sts-post-card .sts-poll,
html:root body .sts-post-card .sts-quoted-original{margin-top:8px!important}

html:root body .sts-post-card .sts-actions{
  display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:0!important;
  margin:4px -8px 0!important;padding:0!important;max-width:none!important;color:var(--sts-muted)!important;
}
html:root body .sts-post-card .sts-actions>a,
html:root body .sts-post-card .sts-actions .sts-repost-menu>summary,
html:root body .sts-post-card .sts-actions .sts-share-trigger{
  display:inline-flex!important;align-items:center;gap:5px;min-height:34px;padding:0 8px!important;border-radius:999px!important;line-height:1;
  font-size:var(--sts-count-size)!important;font-weight:600!important;color:var(--sts-muted)!important;
}
html:root body .sts-post-card .sts-actions .sts-action-count{font-size:var(--sts-count-size)!important;font-weight:600}
html:root body .sts-post-card .sts-actions .sts-ico,
html:root body .sts-post-card .sts-actions .sts-comment-icon{width:var(--sts-icon-size)!important;height:var(--sts-icon-size)!important}
html:root body .sts-post-card .sts-actions>a.sts-like.liked{color:var(--sts-heart)!important}
html:root body .sts-post-card .sts-actions .sts-repost-menu>summary.active{color:var(--sts-brand)!important}
html:root body .sts-post-card .sts-actions .sts-share-trigger{order:4;margin-left:0!important}
html:root body .sts-post-card .sts-actions .sts-translate-btn{order:5;margin-left:auto!important;min-height:30px;padding:0 8px!important;font-size:12px!important;font-weight:600!important;color:var(--sts-muted)!important}

html:root body .sts-news-card{padding:12px 14px!important}
html:root body .sts-post-card .sts-more>summary{width:26px!important;height:26px!important;font-size:13px!important}
html:root body .sts-post-card .sts-post-author-row{row-gap:0!important}
html:root body .sts-post-card .sts-post-author{line-height:1.2!important}