/* Mobile full-headline fix — news + officials */
/* Desktop/tablet: give headlines more breathing room too. */
.story-body h3{
  -webkit-line-clamp:3;
}

@media (max-width:760px){
  /* Prioritize readable news text over thumbnail/media columns. */
  .story-card,
  .official-feed-box .story-card{
    display:block!important;
    width:100%!important;
    min-height:0!important;
    padding:16px!important;
    margin:0 0 14px!important;
    overflow:visible!important;
  }

  /* No blank / reserved media area on phones. */
  .story-card .story-thumb,
  .official-feed-box .story-card .story-thumb{
    display:none!important;
  }

  /* Critical fix: remove the old grid-column:2 placement. */
  .story-card .story-body,
  .official-feed-box .story-card .story-body{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    grid-column:auto!important;
    grid-row:auto!important;
    padding:0!important;
    margin:0!important;
  }

  .story-topic-line,
  .official-feed-box .story-topic-line{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    width:100%!important;
    min-height:0!important;
    margin-bottom:9px!important;
    font-size:11px!important;
  }

  .story-topic-line .story-source-mini,
  .official-feed-box .story-topic-line .story-source-mini{
    display:inline!important;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:normal!important;
    font-size:11.5px!important;
    line-height:1.35!important;
    color:#9ab2c6!important;
  }

  .story-time-inline,
  .official-feed-box .story-time-inline{
    display:inline!important;
    margin-left:auto!important;
    font-size:10.5px!important;
    white-space:nowrap!important;
  }

  /* Full readable headline: do not truncate or line-clamp on mobile. */
  .story-body h3,
  .official-feed-box .story-body h3{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:7px 0 10px!important;
    font-size:19px!important;
    line-height:1.35!important;
    font-weight:800!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    -webkit-line-clamp:unset!important;
    -webkit-box-orient:initial!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
  }

  /* Keep the useful explanation visible under the headline. */
  .story-summary,
  .official-feed-box .story-summary{
    display:-webkit-box!important;
    margin:0 0 10px!important;
    font-size:13.5px!important;
    line-height:1.58!important;
    color:#b6c8d7!important;
    -webkit-line-clamp:4!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  .story-tags,
  .official-feed-box .story-tags{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:7px!important;
    margin:10px 0 0!important;
  }

  .story-tags span,
  .official-feed-box .story-tags span{
    display:inline-flex!important;
    font-size:11px!important;
    line-height:1.25!important;
    padding:5px 9px!important;
  }

  .story-actions,
  .official-feed-box .story-actions{
    display:flex!important;
    width:100%!important;
    margin-top:11px!important;
    padding-top:0!important;
  }

  .story-action,
  .official-feed-box .story-action{
    min-height:40px!important;
    font-size:12px!important;
  }

  /* Score + source + details become a clean bottom action row. */
  .story-confidence,
  .official-feed-box .story-confidence{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    gap:9px!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    margin-top:13px!important;
    padding:13px 0 0!important;
    border-left:0!important;
    border-top:1px solid #153c57!important;
    grid-column:auto!important;
    grid-row:auto!important;
    align-items:center!important;
  }

  .evidence-compact,
  .official-feed-box .evidence-compact{
    display:block!important;
  }

  .evidence-number,
  .official-feed-box .evidence-number{
    width:48px!important;
    height:48px!important;
    margin:0!important;
    font-size:18px!important;
  }

  .evidence-copy,
  .official-feed-box .evidence-copy{
    display:none!important;
  }

  .source-link-side,
  .official-feed-box .source-link-side,
  .story-confidence .story-open,
  .official-feed-box .story-open{
    min-height:44px!important;
    font-size:13px!important;
    width:100%!important;
  }

  .source-link-side,
  .official-feed-box .source-link-side{
    grid-column:2!important;
  }

  .story-confidence .story-open,
  .official-feed-box .story-open{
    grid-column:1/-1!important;
  }

  /* Officials selected-story panel should use the entire screen width. */
  .official-focus-card{
    margin:0 8px 12px!important;
  }

  .official-feed-box{
    width:100%!important;
    padding:8px!important;
    overflow:visible!important;
  }

  .official-feed-head h3{
    font-size:20px!important;
    line-height:1.4!important;
    overflow-wrap:anywhere!important;
  }

  .official-feed-head b{
    font-size:14px!important;
  }
}

@media (max-width:430px){
  .story-card,
  .official-feed-box .story-card{
    padding:14px!important;
  }

  .story-body h3,
  .official-feed-box .story-body h3{
    font-size:18px!important;
    line-height:1.38!important;
  }

  .story-summary,
  .official-feed-box .story-summary{
    font-size:13px!important;
  }

  .story-confidence,
  .official-feed-box .story-confidence{
    grid-template-columns:50px minmax(0,1fr)!important;
  }
}