/* V205 — Kariyer Köprüsü: mobile solo/online parity, complete team names and low-latency controls. */
@media (max-width:820px), (orientation:landscape) and (pointer:coarse) and (max-height:600px){
  #root .app-shell.mode-solo,
  #root .app-shell.mode-local,
  #root .app-shell.mode-online{
    min-width:0!important;
    overflow-x:clip!important;
  }

  /* Team-selection cards use the same readable structure in every mode. */
  #root .players-grid{
    align-items:stretch!important;
  }
  #root .player-card{
    min-width:0!important;
    overflow:visible!important;
  }
  #root .player-card__head{
    align-items:center!important;
  }
  #root .player-label{
    min-width:0!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    line-height:1.12!important;
  }
  #root .club-search{
    min-width:0!important;
  }
  #root .club-search input{
    min-width:0!important;
    width:100%!important;
    text-overflow:ellipsis!important;
  }
  #root .club-summary{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    align-items:stretch!important;
  }
  #root .club-summary>div:first-child{
    grid-column:1/-1!important;
    min-height:48px!important;
  }
  #root .club-summary>div{
    height:auto!important;
  }
  #root .club-summary b{
    display:block!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    line-height:1.16!important;
    font-size:8px!important;
  }
  #root .club-summary>div:first-child b{
    font-size:9.5px!important;
    line-height:1.15!important;
  }
  #root .search-menu button,
  #root .search-menu button>span{
    min-width:0!important;
  }
  #root .search-menu button b{
    display:block!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    line-height:1.15!important;
  }

  /* Match screen: solo, same-device and online share one stable mobile scene. */
  #root .app-shell.is-match-started{
    width:calc(100% - 8px)!important;
    max-width:none!important;
    margin:4px auto 14px!important;
    padding-top:4px!important;
    overflow:visible!important;
  }
  #root .app-shell.is-match-started .main-grid,
  #root .app-shell.is-match-started .game-card,
  #root .app-shell.is-match-started .round-arena,
  #root .app-shell.is-match-started .round-content{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  #root .app-shell.is-match-started .main-grid{
    display:block!important;
    margin:0!important;
    padding:0 0 96px!important;
  }
  #root .app-shell.is-match-started .game-card{
    padding:0!important;
    border-radius:18px!important;
    overflow:visible!important;
  }
  #root .app-shell.is-match-started .section-title{
    display:none!important;
  }
  #root .app-shell.is-match-started .round-arena{
    margin:0!important;
    scroll-margin-top:4px!important;
    overflow:visible!important;
  }

  /* Full team names: badges sit above the text so neither side loses width. */
  #root .app-shell.is-match-started .round-scoreboard{
    position:sticky!important;
    top:4px!important;
    z-index:270!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr)!important;
    align-items:stretch!important;
    gap:5px!important;
    min-height:126px!important;
    padding:7px 6px!important;
    overflow:visible!important;
  }
  #root .app-shell.is-match-started .round-team,
  #root .app-shell.is-match-started .round-team--right{
    min-width:0!important;
    min-height:112px!important;
    padding:6px 5px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:40px auto!important;
    align-content:center!important;
    align-items:center!important;
    justify-items:center!important;
    gap:5px!important;
    text-align:center!important;
    overflow:visible!important;
  }
  #root .app-shell.is-match-started .round-team .club-badge,
  #root .app-shell.is-match-started .round-team--right .club-badge{
    order:0!important;
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    justify-self:center!important;
  }
  #root .app-shell.is-match-started .round-team>div:not(.club-badge),
  #root .app-shell.is-match-started .round-team--right>div:not(.club-badge){
    order:1!important;
    display:grid!important;
    align-content:start!important;
    justify-items:center!important;
    width:100%!important;
    min-width:0!important;
    gap:2px!important;
    text-align:center!important;
  }
  #root .app-shell.is-match-started .round-team>div>b{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    color:#fff!important;
    font-size:11px!important;
    font-weight:900!important;
    line-height:1.12!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    hyphens:auto!important;
  }
  #root .app-shell.is-match-started .round-team .club-badge>b{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    font-size:11px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }
  #root .app-shell.is-match-started .round-team span:not(.club-badge){
    display:block!important;
    width:100%!important;
    max-width:none!important;
    color:rgba(255,255,255,.88)!important;
    font-size:7.5px!important;
    line-height:1.12!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
  }
  #root .app-shell.is-match-started .timer-ring{
    align-self:center!important;
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
  }

  /* Online player labels and opponent information may be longer than solo labels. */
  #root .app-shell.is-match-started .opponent-strip,
  #root .app-shell.is-match-started .opponent-strip--online{
    min-width:0!important;
    height:auto!important;
  }
  #root .app-shell.is-match-started .opponent-strip>div{
    min-width:0!important;
  }
  #root .app-shell.is-match-started .opponent-strip b,
  #root .app-shell.is-match-started .opponent-strip small{
    display:block!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
  }
  #root .app-shell.is-match-started .round-match-meta{
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
    gap:5px!important;
  }
  #root .app-shell.is-match-started .round-score-player{
    min-width:0!important;
    gap:5px!important;
  }
  #root .app-shell.is-match-started .round-score-player span{
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    line-height:1.08!important;
    font-size:8px!important;
  }
  #root .app-shell.is-match-started .solo-player-chip{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-align:center!important;
  }

  /* Larger input and two immediate actions: identical in all game modes. */
  #root .app-shell.is-match-started .answer-box{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }
  #root .app-shell.is-match-started .answer-box input{
    grid-column:1/-1!important;
    width:100%!important;
    min-width:0!important;
    height:48px!important;
    min-height:48px!important;
    padding:0 11px!important;
    font-size:16px!important;
  }
  #root .app-shell.is-match-started .answer-box button{
    grid-column:auto!important;
    width:100%!important;
    min-width:0!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 7px!important;
    font-size:10px!important;
    line-height:1.08!important;
  }

  /* Touches are accepted immediately; remove expensive visual work during a live round. */
  #root .app-shell.is-match-started button,
  #root .app-shell.is-match-started input,
  #root .player-card button,
  #root .game-actions button{
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  #root .app-shell.is-match-started .answer-box button,
  #root .app-shell.is-match-started .player-suggestions button,
  #root .game-actions button{
    transition:none!important;
    will-change:auto!important;
  }
  #root .app-shell.is-match-started .player-suggestions{
    overscroll-behavior:contain!important;
    contain:layout style!important;
  }
  #root .app-shell.is-match-started .player-suggestions button{
    contain:layout paint!important;
  }
}

@media (max-width:380px) and (orientation:portrait){
  #root .app-shell.is-match-started .round-scoreboard{
    grid-template-columns:minmax(0,1fr) 50px minmax(0,1fr)!important;
    gap:4px!important;
    padding-inline:4px!important;
  }
  #root .app-shell.is-match-started .round-team,
  #root .app-shell.is-match-started .round-team--right{
    padding-inline:4px!important;
  }
  #root .app-shell.is-match-started .round-team>div>b{font-size:10px!important}
  #root .app-shell.is-match-started .timer-ring{width:49px!important;height:49px!important;min-width:49px!important}
  #root .club-summary>div:first-child b{font-size:8.8px!important}
}

@media (orientation:landscape) and (pointer:coarse) and (max-height:600px){
  #root .app-shell.is-match-started .round-scoreboard{
    position:relative!important;
    top:auto!important;
    min-height:92px!important;
    grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr)!important;
  }
  #root .app-shell.is-match-started .round-team,
  #root .app-shell.is-match-started .round-team--right{
    min-height:78px!important;
    grid-template-columns:38px minmax(0,1fr)!important;
    grid-template-rows:auto!important;
    text-align:left!important;
    justify-items:start!important;
  }
  #root .app-shell.is-match-started .round-team--right{
    grid-template-columns:minmax(0,1fr) 38px!important;
    text-align:right!important;
    justify-items:end!important;
  }
  #root .app-shell.is-match-started .round-team--right .club-badge{order:2!important}
  #root .app-shell.is-match-started .round-team--right>div:not(.club-badge){order:1!important;justify-items:end!important;text-align:right!important}
  #root .app-shell.is-match-started .round-team>div:not(.club-badge){justify-items:start!important;text-align:left!important}
  #root .app-shell.is-match-started .round-team .club-badge{width:38px!important;height:38px!important;min-width:38px!important}
  #root .app-shell.is-match-started .answer-box{grid-template-columns:minmax(0,1fr) 110px 78px!important}
  #root .app-shell.is-match-started .answer-box input{grid-column:auto!important}
}