#create-character-modal { width: 440px; max-width: calc(100vw - 16px); }

#create-character-modal .create-character-rules {
  margin: 0 0 10px;
  padding-left: 18px;
  font-size: 12px;
  line-height: 1.5;
  color: #ddd;
}

#create-character-modal .create-character-rules li { margin-bottom: 3px; }

#create-character-name,
#create-character-sex {
  width: 100%;
  box-sizing: border-box;
  height: 32px;
  margin-bottom: 8px;
}

#create-character-error {
  margin: 0 0 6px;
  font-size: 12px;
  color: #ff6b6b;
}

#create-character-modal .modal-footer { display: flex; justify-content: flex-end; gap: 6px; }

#select-character .modal-footer { display: flex; justify-content: flex-end; gap: 6px; }
#select-character #create-character-open { margin-right: auto; }

@media(max-width:600px) {
  #create-character-name,
  #create-character-sex { height: 40px; font-size: 16px; }
}