/* Progress.tz v2.9.21 — Index UI Repair */

:root{
  --home-bg:#f4f7fb;
  --home-surface:#ffffff;
  --home-surface-2:#f8fafc;
  --home-text:#172033;
  --home-strong:#0f172a;
  --home-muted:#667085;
  --home-line:#dfe6ee;
  --home-blue:#17345e;
  --home-blue-soft:#edf4ff;
  --home-green:#86c93a;
  --home-green-soft:#eff8e5;
  --home-shadow:0 10px 28px rgba(23,52,94,.075);
  --home-radius:18px;
}

html[data-theme="dark"],
body[data-theme="dark"],
html.dark,
body.dark,
.dark-mode{
  --home-bg:#071321;
  --home-surface:#0d1b2a;
  --home-surface-2:#102338;
  --home-text:#f7f9fc;
  --home-strong:#ffffff;
  --home-muted:#9fb0c3;
  --home-line:#294056;
  --home-blue:#74a9f7;
  --home-blue-soft:#173353;
  --home-green:#92d43f;
  --home-green-soft:#203818;
  --home-shadow:0 12px 32px rgba(0,0,0,.24);
}

html,body{
  background:var(--home-bg)!important;
  color:var(--home-text)!important;
}

/* Consistent public width */
body > main,
main,
.site-main,
.home-main,
.page-main{
  width:min(1480px,calc(100% - 32px))!important;
  max-width:1480px!important;
  margin-inline:auto!important;
}

/* Section rhythm */
main > section,
.home-main > section,
.site-main > section{
  margin-block:0 26px!important;
}

:is(.hero,.hero-section,.home-hero){
  margin-bottom:24px!important;
}

:is(.trending,.trending-progress,.trending-section){
  margin-top:0!important;
  margin-bottom:24px!important;
}

/* Headings */
:is(h1,h2,h3){
  color:var(--home-strong)!important;
}

/* Trending/category chips */
:is(
  .category-filter a,
  .categories a,
  .filter-chip,
  .category-chip,
  .trending a
){
  border-color:var(--home-line)!important;
}

/*
 Latest Stories / Shorts:
 target the known Progress card containers from prior releases.
*/
:is(
  .progress-shorts-social,
  .progress-shorts-grid,
  .shorts-grid,
  .shorts-feed,
  .progress-shorts-feed,
  .latest-stories-grid,
  .stories-grid,
  [data-shorts-feed]
){
  width:100%!important;
  max-width:none!important;
}

/* Desktop 3-column Instagram-inspired grid */
@media (min-width:1200px){
  :is(
    .progress-shorts-social,
    .progress-shorts-grid,
    .shorts-grid,
    .shorts-feed,
    .progress-shorts-feed,
    .latest-stories-grid,
    .stories-grid,
    [data-shorts-feed]
  ){
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:20px!important;
    align-items:start!important;
  }
}

/* Landscape tablet / smaller desktop */
@media (min-width:900px) and (max-width:1199px){
  :is(
    .progress-shorts-social,
    .progress-shorts-grid,
    .shorts-grid,
    .shorts-feed,
    .progress-shorts-feed,
    .latest-stories-grid,
    .stories-grid,
    [data-shorts-feed]
  ){
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:20px!important;
    align-items:start!important;
  }
}

/* Mobile + portrait tablet */
@media (max-width:899px){
  :is(
    .progress-shorts-social,
    .progress-shorts-grid,
    .shorts-grid,
    .shorts-feed,
    .progress-shorts-feed,
    .latest-stories-grid,
    .stories-grid,
    [data-shorts-feed]
  ){
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:18px!important;
  }
}

/* Story cards */
:is(
  .ps-post,
  [data-ps-post="1"],
  .short-card,
  .shorts-card,
  .progress-short-card,
  .story-card,
  .latest-story-card,
  article.story
){
  min-width:0!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  overflow:hidden!important;
  border:1px solid var(--home-line)!important;
  border-radius:var(--home-radius)!important;
  background:var(--home-surface)!important;
  color:var(--home-text)!important;
  box-shadow:var(--home-shadow)!important;
}

/* Media-first Instagram rhythm */
:is(
  .ps-post,
  [data-ps-post="1"],
  .short-card,
  .shorts-card,
  .progress-short-card,
  .story-card,
  .latest-story-card,
  article.story
) :is(
  .ps-media,
  .feature-media,
  .featured-media,
  .media-wrap,
  .story-media,
  picture
){
  width:100%!important;
  overflow:hidden!important;
  background:var(--home-surface-2)!important;
}

:is(
  .ps-post,
  [data-ps-post="1"],
  .short-card,
  .shorts-card,
  .progress-short-card,
  .story-card,
  .latest-story-card,
  article.story
) img,
:is(
  .ps-post,
  [data-ps-post="1"],
  .short-card,
  .shorts-card,
  .progress-short-card,
  .story-card,
  .latest-story-card,
  article.story
) video{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  object-fit:cover!important;
}

/* Desktop square crop */
@media (min-width:1200px){
  :is(
    .ps-post,[data-ps-post="1"],.short-card,.shorts-card,
    .progress-short-card,.story-card,.latest-story-card,article.story
  ) :is(.ps-media,.feature-media,.featured-media,.media-wrap,.story-media,picture){
    aspect-ratio:1/1!important;
  }

  :is(
    .ps-post,[data-ps-post="1"],.short-card,.shorts-card,
    .progress-short-card,.story-card,.latest-story-card,article.story
  ) :is(.ps-media,.feature-media,.featured-media,.media-wrap,.story-media,picture) :is(img,video){
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
}

/* Tablet 4:3 crop */
@media (min-width:900px) and (max-width:1199px){
  :is(
    .ps-post,[data-ps-post="1"],.short-card,.shorts-card,
    .progress-short-card,.story-card,.latest-story-card,article.story
  ) :is(.ps-media,.feature-media,.featured-media,.media-wrap,.story-media,picture){
    aspect-ratio:4/3!important;
  }

  :is(
    .ps-post,[data-ps-post="1"],.short-card,.shorts-card,
    .progress-short-card,.story-card,.latest-story-card,article.story
  ) :is(.ps-media,.feature-media,.featured-media,.media-wrap,.story-media,picture) :is(img,video){
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
}

/* Compact content */
:is(
  .ps-body,
  .story-body,
  .story-copy,
  .card-body,
  .short-body
){
  background:var(--home-surface)!important;
  color:var(--home-text)!important;
}

:is(
  .ps-title,
  .story-title,
  .card-title
),
:is(
  .ps-title a,
  .story-title a,
  .card-title a
){
  color:var(--home-strong)!important;
  text-decoration:none!important;
}

/* Clamp summary/excerpt */
:is(
  .ps-excerpt,
  .story-excerpt,
  .card-excerpt,
  .short-excerpt,
  .story-summary
){
  color:var(--home-muted)!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  overflow:hidden!important;
  line-height:1.55!important;
}

/*
 Hide long inline full-story body on homepage cards.
 The JS adds .progress-index-long-body to confidently detected long content blocks.
*/
.progress-index-long-body{
  display:none!important;
}

.progress-index-expand-control{
  display:none!important;
}

/* Metrics, tags, actions */
:is(.views,.shares,[data-metric="views"],[data-metric="shares"]){
  background:var(--home-blue-soft)!important;
  color:var(--home-blue)!important;
}

:is(.likes,.comments,[data-metric="likes"],[data-metric="comments"]){
  background:var(--home-green-soft)!important;
  color:var(--home-green)!important;
}

:is(.ps-tag,.tag,.tag-pill,.progress-public-tag,.progress-public-tag-v29148){
  background:var(--home-blue-soft)!important;
  color:var(--home-blue)!important;
  border-color:var(--home-line)!important;
}

:is(
  .ps-tag:nth-child(even),
  .tag:nth-child(even),
  .tag-pill:nth-child(even),
  .progress-public-tag:nth-child(even),
  .progress-public-tag-v29148:nth-child(even)
){
  background:var(--home-green-soft)!important;
  color:var(--home-green)!important;
}

/* Read full story button/link */
:is(
  .ps-read-more-footer a,
  .ps-full-story,
  .read-full-story,
  .open-full-story
){
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  padding:10px 14px!important;
  border-radius:12px!important;
  background:var(--home-blue-soft)!important;
  color:var(--home-blue)!important;
  text-decoration:none!important;
  font-weight:800!important;
}

/* Load More always spans grid */
:is(
  .progress-shorts-social,
  .progress-shorts-grid,
  .shorts-grid,
  .shorts-feed,
  .progress-shorts-feed,
  .latest-stories-grid,
  .stories-grid,
  [data-shorts-feed]
) > :is(
  .load-more,
  .load-more-wrap,
  .shorts-load-more,
  [data-load-more],
  .feed-status,
  .feed-empty
){
  grid-column:1/-1!important;
  width:100%!important;
}

/* Most discussed + Progress Brief */
:is(
  .most-discussed,
  .most-discussed-section,
  .progress-brief,
  .newsletter-brief,
  .subscribe-card
){
  background:var(--home-surface)!important;
  color:var(--home-text)!important;
  border-color:var(--home-line)!important;
}

/* Footer */
footer,.site-footer{
  background:var(--home-surface)!important;
  color:var(--home-muted)!important;
  border-color:var(--home-line)!important;
}

@media(max-width:700px){
  body > main,
  main,
  .site-main,
  .home-main,
  .page-main{
    width:min(100% - 20px,1480px)!important;
  }
}