/* SPORTS INTEL MOBILE APP V13 — DETAIL UI/UX FINAL */
@media (max-width:720px){

  .detail-page{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0 12px 86px!important;
  }
  .detail-page > .page-head{
    margin:8px 0 10px!important;
    padding:0!important;
  }
  .detail-page > .page-head h1{
    font-size:21px!important;
    line-height:1.2!important;
  }
  .detail-page > .page-head p{
    font-size:10px!important;
    line-height:1.45!important;
  }
  .detail-page > .page-head .page-actions{
    margin-top:9px!important;
  }

  .match-hero2{
    display:block!important;
    width:100%!important;
    margin:0 0 10px!important;
  }
  .match-summary.card{
    width:100%!important;
    margin:0!important;
    padding:13px 10px 14px!important;
    border-radius:15px!important;
    overflow:hidden!important;
  }
  .match-summary .crumb{
    margin:0 0 10px!important;
    text-align:center!important;
    color:#738da2!important;
    font-size:9px!important;
  }
  .match-summary .hero-teams{
    width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr)!important;
    grid-template-areas:"home score away"!important;
    gap:5px!important;
    align-items:center!important;
  }
  .match-summary .hero-teams > .hero-team:first-child{
    grid-area:home!important;
    grid-column:auto!important;
    grid-row:auto!important;
    order:1!important;
  }
  .match-summary .hero-teams > .hero-center{
    grid-area:score!important;
    grid-column:auto!important;
    grid-row:auto!important;
    order:2!important;
  }
  .match-summary .hero-teams > .hero-team.away{
    grid-area:away!important;
    grid-column:auto!important;
    grid-row:auto!important;
    order:3!important;
  }
  .match-summary .hero-team,
  .match-summary .hero-team.away{
    min-width:0!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:center!important;
    gap:5px!important;
    text-align:center!important;
  }
  .match-summary .hero-team.away{
    flex-direction:column-reverse!important;
  }
  .match-summary .hero-team img{
    width:46px!important;
    height:46px!important;
    max-width:46px!important;
    max-height:46px!important;
    margin:0 auto!important;
    object-fit:contain!important;
  }
  .match-summary .hero-team > div{
    width:100%!important;
    min-width:0!important;
  }
  .match-summary .hero-team b{
    display:block!important;
    width:100%!important;
    margin:0!important;
    color:#f4f8fb!important;
    font-size:11px!important;
    line-height:1.18!important;
    font-weight:900!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .match-summary .hero-team small{
    display:block!important;
    margin-top:3px!important;
    color:#6f8da5!important;
    font-size:8px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
  }
  .match-summary .hero-center{
    min-width:0!important;
    width:76px!important;
    margin:0 auto!important;
    padding:0!important;
    position:static!important;
    transform:none!important;
    text-align:center!important;
    align-self:center!important;
    justify-self:center!important;
  }
  .match-summary .hero-center b{
    display:block!important;
    margin:0!important;
    color:#fff!important;
    font-size:23px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:-.6px!important;
    white-space:nowrap!important;
  }
  .match-summary .hero-center small{
    display:block!important;
    margin-top:6px!important;
    color:#6588a4!important;
    font-size:7px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }

  .probability-card.card{
    width:100%!important;
    margin:10px 0 0!important;
    padding:13px!important;
    border-radius:14px!important;
  }
  .probability-card h3{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    flex-wrap:wrap!important;
    font-size:10px!important;
  }
  .probability-card h3 small{
    margin-left:0!important;
    font-size:8px!important;
  }
  .probability-triple{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .probability-triple>div{
    min-width:0!important;
    padding:9px 4px!important;
  }
  .probability-triple span{font-size:8px!important}
  .probability-triple b{font-size:19px!important}
  .probability-card .conf-line{
    gap:8px!important;
    align-items:center!important;
    font-size:9px!important;
  }
  .probability-card .conf-line b{
    white-space:nowrap!important;
    font-size:13px!important;
  }

  .sport-analysis-card.card{
    width:100%!important;
    margin:10px 0 0!important;
    padding:0!important;
    border-radius:14px!important;
    overflow:hidden!important;
  }
  .sport-analysis-head{
    padding:12px!important;
    gap:8px!important;
  }
  .sport-analysis-head h2{
    margin:4px 0 2px!important;
    font-size:15px!important;
  }
  .sport-analysis-head p{
    margin:0!important;
    font-size:8px!important;
    line-height:1.45!important;
  }
  .analysis-quality{
    min-width:82px!important;
  }
  .analysis-quality strong{
    font-size:15px!important;
  }

  .sport-value-strip{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .sport-value-strip>div{
    min-width:0!important;
    padding:10px!important;
  }
  .sport-value-strip>div:last-child{
    grid-column:1/-1!important;
  }
  .sport-value-strip small{font-size:7px!important}
  .sport-value-strip b{font-size:13px!important}

  .detail-grid{
    display:block!important;
    width:100%!important;
  }
  .panel2.card{
    width:100%!important;
    margin:10px 0 0!important;
    padding:12px!important;
    border-radius:14px!important;
  }
  .panel2 h2{font-size:13px!important}

  .baseball-matchup-pro{
    padding:10px!important;
  }
  .baseball-matchup-head{
    gap:6px!important;
  }
  .pitcher-versus{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  .pitcher-card,
  .pitcher-card.away{
    width:100%!important;
    min-width:0!important;
    text-align:left!important;
  }
  .pitcher-edge-center{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:7px 10px!important;
    order:2!important;
  }
  .pitcher-card:first-child{order:1!important}
  .pitcher-card.away{order:3!important}
  .pitcher-stat-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .pitcher-stat-grid>div{
    min-width:0!important;
    padding:8px 3px!important;
  }

  .history-table{
    min-width:520px!important;
  }
  .si11-table-scroll{
    margin:0!important;
  }
}

@media (max-width:390px){
  .detail-page{
    padding-left:9px!important;
    padding-right:9px!important;
  }
  .match-summary.card{
    padding-left:7px!important;
    padding-right:7px!important;
  }
  .match-summary .hero-teams{
    grid-template-columns:minmax(0,1fr) 68px minmax(0,1fr)!important;
    gap:3px!important;
  }
  .match-summary .hero-center{
    width:68px!important;
  }
  .match-summary .hero-center b{
    font-size:21px!important;
  }
  .match-summary .hero-team img{
    width:40px!important;
    height:40px!important;
  }
  .match-summary .hero-team b{
    font-size:10px!important;
  }
  .probability-triple b{
    font-size:17px!important;
  }
  .pitcher-stat-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}