/* Compact, equally sized wheels for one or two commanders, fitted to the player's tableau. */
#commander-table[data-screen=tracker] .ct-player-dialog:has(#ct-assign-damage){
  --damage-gap:clamp(4px,calc(var(--menu-height)*.025),6px);
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:max-content max-content minmax(0,1fr);
  gap:var(--damage-gap);
  padding:clamp(8px,calc(var(--menu-height)*.04),10px);
  overflow:hidden;
}
#commander-table[data-screen=tracker] .ct-player-dialog:has(#ct-assign-damage)>#ct-dialog-title{
  margin:0 22px;
  padding:0;
  min-height:0;
  font-size:clamp(13px,calc(var(--menu-width)*.043),17px);
  line-height:1.15;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#commander-table[data-screen=tracker] .ct-player-dialog:has(#ct-assign-damage)>p{
  margin:0 22px;
  font-size:clamp(11px,calc(var(--menu-width)*.035),13px);
  line-height:1.2;
  color:#c1c6dc;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#commander-table[data-screen=tracker] .ct-player-dialog:has(#ct-assign-damage)>.ct-close{
  top:5px;right:5px;width:26px;min-width:26px;height:26px;min-height:26px;border-radius:8px;
}
#commander-table .ct-player-dialog #ct-assign-damage{
  display:grid;
  grid-template-rows:minmax(0,1fr) max-content;
  align-items:stretch;
  justify-items:center;
  gap:var(--damage-gap);
  min-width:0;min-height:0;width:100%;margin:0;
}
#commander-table #ct-assign-damage .ct-damage-wheels{
  display:flex;
  justify-content:center;
  align-items:stretch;
  gap:10px;
  width:min(100%,274px);
  height:100%;min-height:0;max-height:160px;
  align-self:center;
}
#commander-table #ct-assign-damage .ct-damage-wheel-column{
  flex:0 0 calc((100% - 10px)/2);
  display:grid;
  grid-template-rows:max-content minmax(0,1fr);
  gap:4px;
  min-width:0;min-height:0;margin:0;padding:0;border:0;background:none;
}
#commander-table #ct-assign-damage .ct-damage-wheel-column h4{
  margin:0;width:100%;min-width:0;
  font-size:clamp(11px,calc(var(--menu-width)*.035),13px);
  font-weight:500;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#commander-table #ct-assign-damage .ct-damage-wheel{
  container-type:size;
  display:grid;
  grid-template-rows:minmax(0,1fr) minmax(0,4fr) minmax(0,1fr);
  justify-items:center;
  align-items:center;
  box-sizing:border-box;
  width:100%;height:100%;min-width:0;min-height:0;
  margin:0;padding:2px 0;gap:0;overflow:hidden;
  background:linear-gradient(180deg,#111a4a35,#24106445);
  border:1px solid #929ab466;border-radius:10px;
  touch-action:none;user-select:none;-webkit-user-select:none;cursor:ns-resize;
}
#commander-table #ct-assign-damage .ct-damage-wheel:focus{outline:none}
#commander-table #ct-assign-damage .ct-damage-wheel:focus-visible{outline:2px solid #e5c84a;outline-offset:-3px}
#commander-table #ct-assign-damage .ct-damage-wheel>output{
  font-size:min(58px,70cqh)!important;line-height:1;font-weight:700;color:#e5c84a;
}
#commander-table #ct-assign-damage .ct-damage-wheel>span{
  font-size:min(16px,14cqh);min-height:0;height:1em;line-height:1;color:#c1c6dc;opacity:.55;
}
#commander-table #ct-assign-damage>button{
  width:min(100%,274px);min-height:30px;height:32px;
  padding:4px 8px;font-size:13px;line-height:1.15;border-radius:9px;
  background:#e5c84a1f;border:1px solid #e5c84a66;color:#e5c84a;
}
/* Keep the wheel legible when a phone tableau leaves less vertical space. */
#commander-table[data-screen=tracker] .ct-player-dialog[data-damage-compact=true]:has(#ct-assign-damage){--damage-gap:3px;padding:6px}
#commander-table[data-screen=tracker] .ct-player-dialog[data-damage-compact=true]>#ct-dialog-title{font-size:13px}
#commander-table[data-screen=tracker] .ct-player-dialog[data-damage-compact=true]>p{font-size:11px}
#commander-table .ct-player-dialog[data-damage-compact=true] #ct-assign-damage h4{font-size:11px}
#commander-table .ct-player-dialog[data-damage-compact=true] #ct-assign-damage>button{height:28px;min-height:28px;font-size:12px}
#commander-table[data-screen=tracker] .ct-player-dialog[data-damage-short=true]:has(#ct-assign-damage){grid-template-columns:1fr 1fr;grid-template-rows:max-content minmax(0,1fr);align-items:center}
#commander-table[data-screen=tracker] .ct-player-dialog[data-damage-short=true]>#ct-dialog-title{margin:0;font-size:12px}
#commander-table[data-screen=tracker] .ct-player-dialog[data-damage-short=true]>p{margin:0 26px 0 0;font-size:10px}
#commander-table .ct-player-dialog[data-damage-short=true] #ct-assign-damage{grid-column:1/-1;height:100%}
