/* ContestProp LIVE v1.4.17 mobile layout.
 * Desktop/wall display stays fixed; phones switch to a vertical scroll layout.
 */
@media (max-width:900px){
  html,body{
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
  }

  body{
    display:block!important;
    min-width:0!important;
    min-height:100vh!important;
    background:#07101a!important;
  }

  .live-header{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:8px!important;
    width:100%!important;
    min-height:0!important;
    padding:8px!important;
    background:#000!important;
  }

  .brand-block{
    position:static!important;
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    background:#000!important;
  }
  .live-logo{
    width:auto!important;
    height:40px!important;
    max-width:150px!important;
    object-fit:contain!important;
  }
  .live-badge{font-size:13px!important;padding:5px 7px!important;border-radius:7px!important}
  .version{display:inline!important;font-size:9px!important;margin:0!important;align-self:center!important}

  .header-status-inline{
    position:static!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    width:100%!important;
    margin:2px 0 0!important;
    padding-top:7px!important;
    border-top:1px solid #162738!important;
  }
  .header-status-inline>div{align-items:flex-start!important}
  .header-status-inline .label{font-size:8px!important;margin-bottom:3px!important}
  .header-status-inline strong{font-size:15px!important}

  .event-banner{
    position:static!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    width:100%!important;
    max-width:none!important;
    padding:7px 9px!important;
    border-radius:8px!important;
    font-size:12px!important;
    line-height:1.25!important;
    white-space:normal!important;
    text-align:center!important;
  }

  .header-right{
    position:static!important;
    display:block!important;
    width:100%!important;
    margin:0!important;
  }
  .live-header-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
    width:100%!important;
  }
  .live-nav-button{
    width:100%!important;
    height:30px!important;
    padding:0 5px!important;
    font-size:8px!important;
    border-radius:8px!important;
  }

  .live-main{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-height:0!important;
    gap:8px!important;
    padding:8px!important;
  }

  .panel{width:100%!important;border-radius:10px!important;overflow:hidden!important}
  .panel-title{
    height:auto!important;
    min-height:42px!important;
    padding:8px 10px!important;
    gap:8px!important;
  }
  .panel-title>span{font-size:12px!important}
  .panel-title small{font-size:9px!important;text-align:right!important}

  .band-panel{display:block!important;height:auto!important}
  .band-stack{
    display:flex!important;
    flex-direction:column!important;
    grid-template-rows:none!important;
    gap:6px!important;
    padding:6px!important;
  }
  .band-card{
    grid-template-columns:58px minmax(0,1fr) 64px!important;
    gap:7px!important;
    min-height:84px!important;
    padding:8px!important;
  }
  .band-name{font-size:25px!important}
  .band-name small{font-size:12px!important}
  .band-status{font-size:14px!important}
  .band-region{font-size:11px!important;white-space:normal!important}
  .band-meta{font-size:9px!important;line-height:1.3!important;white-space:normal!important}
  .band-score{min-width:60px!important}
  .band-score strong{font-size:25px!important}
  .band-score span{font-size:8px!important;white-space:normal!important;text-align:right!important}

  .map-panel{
    display:grid!important;
    grid-template-rows:auto 420px!important;
    height:auto!important;
    min-height:0!important;
  }
  .map-heading{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:"title clock" "updated updated"!important;
    gap:6px 8px!important;
    min-height:66px!important;
    padding:8px 10px!important;
  }
  .map-heading>div:first-child{grid-area:title!important;display:block!important;min-width:0!important}
  .map-heading>div:first-child strong{display:block!important;font-size:12px!important}
  .map-heading>div:first-child span{display:block!important;margin-top:3px!important;font-size:8px!important;line-height:1.25!important}
  .map-updated{grid-area:updated!important;font-size:8px!important;white-space:normal!important}
  .map-clock{grid-area:clock!important;min-width:0!important;padding-left:8px!important}
  .map-clock strong{font-size:18px!important}
  .map-clock span{font-size:7px!important}
  .live-map{width:100%!important;height:420px!important;min-height:420px!important}
  .map-legend{
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    gap:6px!important;
    padding:6px 7px!important;
    font-size:8px!important;
  }
  .legend-swatch{width:9px!important;height:9px!important}

  .right-stack{display:block!important;width:100%!important;height:auto!important}
  .openings-panel{display:block!important;height:auto!important}
  .openings{
    display:flex!important;
    flex-direction:column!important;
    grid-template-rows:none!important;
    gap:6px!important;
    padding:6px!important;
  }
  .opening-row{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto!important;
    gap:5px 8px!important;
    min-height:96px!important;
    padding:8px 10px!important;
  }
  .opening-band,.opening-score strong{font-size:24px!important}
  .opening-band small{font-size:12px!important}
  .opening-region{font-size:16px!important;line-height:1.2!important}
  .opening-meta{font-size:10px!important;line-height:1.3!important;white-space:normal!important}
  .opening-score span{font-size:9px!important;white-space:normal!important;text-align:right!important}

  .live-footer{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:8px!important;
    width:100%!important;
    min-height:0!important;
    padding:10px!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .feed-line{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    width:100%!important;
    overflow:visible!important;
  }
  .feed-line #sourceNote{display:block!important;flex:1 0 100%!important;max-width:none!important;font-size:9px!important}
  .space-footer{
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:flex-start!important;
    gap:5px!important;
    width:100%!important;
    overflow:visible!important;
  }
  .space-footer-metric{display:inline-flex!important;align-items:center!important}
  .footer-right{
    display:flex!important;
    justify-content:space-between!important;
    gap:8px!important;
    width:100%!important;
  }
  .footer-right #warningText{display:block!important;max-width:none!important;white-space:normal!important;font-size:9px!important}
  .footer-right #refreshCountdown{margin-left:auto!important;white-space:nowrap!important}
}

@media (max-width:480px){
  .live-logo{height:36px!important;max-width:132px!important}
  .live-badge{font-size:12px!important;padding:4px 6px!important}
  .header-status-inline strong{font-size:14px!important}
  .band-card{grid-template-columns:52px minmax(0,1fr) 56px!important;min-height:82px!important}
  .band-name,.band-score strong{font-size:23px!important}
  .map-panel{grid-template-rows:auto 360px!important}
  .live-map{height:360px!important;min-height:360px!important}
  .opening-row{min-height:92px!important;padding:8px!important}
  .opening-band,.opening-score strong{font-size:22px!important}
  .opening-region{font-size:15px!important}
}