/* Mobile gameplay: keep the actual decision controls always available without forcing scroll. */
@media (max-width:700px){
  .app-shell:has(> .event-card),
  .app-shell:has(> .season-cta),
  .app-shell:has(> .pro-offers),
  .app-shell:has(> .pro-stage),
  .app-shell:has(> .return-card),
  .app-shell:has(> .card [data-action="amateur-transfer"]),
  .app-shell:has(> .card [data-action="pro-transfer"]){
    padding-bottom:clamp(320px,62dvh,510px);
  }

  .app-shell > .event-card,
  .app-shell > .season-cta,
  .app-shell > .pro-offers,
  .app-shell > .pro-stage,
  .app-shell > .return-card,
  .app-shell > .card:has([data-action="amateur-transfer"]),
  .app-shell > .card:has([data-action="pro-transfer"]){
    position:fixed;
    z-index:44;
    left:max(9px,env(safe-area-inset-left));
    right:max(9px,env(safe-area-inset-right));
    bottom:max(8px,env(safe-area-inset-bottom));
    width:auto;
    margin:0;
    max-height:calc(100dvh - 74px);
    overflow:hidden;
    padding:12px;
    border-radius:18px;
    background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(248,251,252,.99));
    box-shadow:0 -16px 44px rgba(19,58,78,.22),0 0 0 1px rgba(8,126,174,.06);
    backdrop-filter:blur(14px);
  }

  .app-shell > .event-card::before,
  .app-shell > .season-cta::before,
  .app-shell > .pro-offers::before,
  .app-shell > .pro-stage::before,
  .app-shell > .return-card::before,
  .app-shell > .card:has([data-action="amateur-transfer"])::before,
  .app-shell > .card:has([data-action="pro-transfer"])::before{
    content:"";
    display:block;
    width:38px;
    height:4px;
    margin:-3px auto 8px;
    border-radius:999px;
    background:#c7d6dd;
  }

  .app-shell > .event-card h3,
  .app-shell > .season-cta h3,
  .app-shell > .pro-offers h3,
  .app-shell > .pro-stage h3,
  .app-shell > .return-card h3,
  .app-shell > .card:has([data-action="amateur-transfer"]) h3,
  .app-shell > .card:has([data-action="pro-transfer"]) h3{
    font-size:17px;
    line-height:1.15;
    margin:3px 0 5px;
  }

  .app-shell > .event-card > p,
  .app-shell > .season-cta > p,
  .app-shell > .pro-offers > p,
  .app-shell > .pro-stage > p,
  .app-shell > .return-card > p,
  .app-shell > .card:has([data-action="amateur-transfer"]) > p,
  .app-shell > .card:has([data-action="pro-transfer"]) > p{
    font-size:11px;
    line-height:1.32;
    margin:0 0 8px;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }

  .app-shell > .event-card .kicker,
  .app-shell > .season-cta .kicker,
  .app-shell > .pro-offers .kicker,
  .app-shell > .pro-stage .kicker,
  .app-shell > .return-card .kicker,
  .app-shell > .card:has([data-action="amateur-transfer"]) .kicker,
  .app-shell > .card:has([data-action="pro-transfer"]) .kicker{
    font-size:9px;
    line-height:1.1;
  }

  .app-shell > .event-card .choice-grid,
  .app-shell > .pro-offers .choice-grid,
  .app-shell > .pro-stage .choice-grid,
  .app-shell > .return-card .choice-grid,
  .app-shell > .card:has([data-action="amateur-transfer"]) .choice-grid,
  .app-shell > .card:has([data-action="pro-transfer"]) .choice-grid{
    gap:6px;
  }

  .app-shell > .event-card .choice,
  .app-shell > .pro-offers .choice,
  .app-shell > .pro-stage .choice,
  .app-shell > .return-card .choice,
  .app-shell > .card:has([data-action="amateur-transfer"]) .choice,
  .app-shell > .card:has([data-action="pro-transfer"]) .choice{
    min-height:50px;
    padding:8px 10px;
    gap:8px;
    border-radius:12px;
  }

  .app-shell > .event-card .choice strong,
  .app-shell > .pro-offers .choice strong,
  .app-shell > .pro-stage .choice strong,
  .app-shell > .return-card .choice strong,
  .app-shell > .card:has([data-action="amateur-transfer"]) .choice strong,
  .app-shell > .card:has([data-action="pro-transfer"]) .choice strong{
    font-size:12px;
    line-height:1.2;
  }

  .app-shell > .event-card .choice small,
  .app-shell > .pro-offers .choice small,
  .app-shell > .pro-stage .choice small,
  .app-shell > .return-card .choice small,
  .app-shell > .card:has([data-action="amateur-transfer"]) .choice small,
  .app-shell > .card:has([data-action="pro-transfer"]) .choice small{
    font-size:9px;
    line-height:1.2;
    margin-top:2px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .app-shell > .event-card .mini-logo,
  .app-shell > .pro-offers .mini-logo,
  .app-shell > .pro-stage .mini-logo,
  .app-shell > .return-card .mini-logo,
  .app-shell > .card:has([data-action="amateur-transfer"]) .mini-logo,
  .app-shell > .card:has([data-action="pro-transfer"]) .mini-logo{
    width:30px;
    height:30px;
    flex-basis:30px;
    border-radius:8px;
  }

  .app-shell > .season-cta .btn.big{
    min-height:48px;
    font-size:13px;
  }

  /* Keep enough useful career context visible behind the play sheet. */
  .app-shell:has(> .event-card) .club-card .history-note,
  .app-shell:has(> .season-cta) .club-card .history-note,
  .app-shell:has(> .pro-offers) .club-card .history-note,
  .app-shell:has(> .pro-stage) .club-card .history-note,
  .app-shell:has(> .return-card) .club-card .history-note,
  .app-shell:has(> .card [data-action="amateur-transfer"]) .club-card .history-note,
  .app-shell:has(> .card [data-action="pro-transfer"]) .club-card .history-note{
    display:none;
  }
}

@media (max-width:700px) and (max-height:680px){
  .app-shell > .event-card,
  .app-shell > .season-cta,
  .app-shell > .pro-offers,
  .app-shell > .pro-stage,
  .app-shell > .return-card,
  .app-shell > .card:has([data-action="amateur-transfer"]),
  .app-shell > .card:has([data-action="pro-transfer"]){
    padding:9px 10px;
  }

  .app-shell > .event-card > p,
  .app-shell > .pro-offers > p,
  .app-shell > .pro-stage > p,
  .app-shell > .return-card > p{
    -webkit-line-clamp:1;
    margin-bottom:6px;
  }

  .app-shell > .event-card .choice,
  .app-shell > .pro-offers .choice,
  .app-shell > .pro-stage .choice,
  .app-shell > .return-card .choice,
  .app-shell > .card:has([data-action="amateur-transfer"]) .choice,
  .app-shell > .card:has([data-action="pro-transfer"]) .choice{
    min-height:44px;
    padding:7px 9px;
  }

  .app-shell > .event-card .choice small,
  .app-shell > .pro-offers .choice small,
  .app-shell > .pro-stage .choice small,
  .app-shell > .return-card .choice small,
  .app-shell > .card:has([data-action="amateur-transfer"]) .choice small,
  .app-shell > .card:has([data-action="pro-transfer"]) .choice small{
    display:none;
  }
}
