/* Cross-browser scale math for desktop Dev UI tuning.
   Firefox rejects the legacy percentage-division calc() form. The runtime
   variables are unitless factors, but compact/tablet layouts keep their
   existing fixed responsive sizes from styles.css. */
:root{
  --badge-scale:1;
  --coach-text-scale:1;
}

@media (min-width:901px) and (min-height:521px){
  .avatar{
    width:calc(48px * var(--badge-scale));
    height:calc(48px * var(--badge-scale));
    flex:0 0 calc(48px * var(--badge-scale));
  }

  .coach-drag-handle{font-size:calc(8px * var(--coach-text-scale))}
  .coach-guide small{font-size:calc(7px * var(--coach-text-scale))}
  .coach-guide b,.coach-guide span{font-size:calc(10px * var(--coach-text-scale))}
  .coach-guide b{font:700 calc(13px * var(--coach-text-scale))/1.28 Georgia,serif}
  .coach-selection b{font-size:calc(9px * var(--coach-text-scale))}
  .coach-selection span,.coach-meta,.coach-toggle{font-size:calc(8px * var(--coach-text-scale))}
  .coach-off-button{font-size:calc(9px * var(--coach-text-scale))}

  /* Wider opponent/table cards make the centered trick stage taller.
     Expand the vertical playfield symmetrically so the supported Dev UI
     maximum remains clear of both hands without moving default geometry. */
  .seat-top{
    top:clamp(-5px,calc(11px - (var(--opponent-card-width) - 96px)),11px);
  }
  .seat-bottom{
    bottom:clamp(-12px,calc(4px - (var(--opponent-card-width) - 96px)),4px);
  }
}