/* Slots */
.slot-card {
  border: 2px dashed #444;
  border-radius: .75rem;
  cursor: pointer;
  transition: border-color .2s, background .2s;
  min-height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #1a1a2e;
  color: #fff;
}
.slot-card:hover { border-color: #dc3545; background: #1f1218; }
.slot-card.preenchido { border-style: solid; border-color: #198754; background: #0f1f14; }
.slot-card img { border-radius: 50%; object-fit: cover; object-position: top; width: 52px; height: 52px; }

.slot-nome { font-weight: 600; font-size: .85rem; color: #fff; }

/* Barra de nota */
.barra-nota { height: 14px; border-radius: 10px; overflow: hidden; background: #333; }
.barra-nota-inner { height: 100%; border-radius: 10px; transition: width .8s ease; }

/* Cards de personagem no modal */
.char-opt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  background: #1a1a2e;
  border: 1px solid #333;
  border-radius: 8px;
  padding: 8px 6px 6px;
  cursor: pointer;
  transition: border-color .15s, background .15s, transform .1s;
  width: 76px;
  min-height: 80px;
  position: relative;
  color: #fff;
}
.char-opt:hover:not(:disabled) { border-color: #dc3545; background: #2a0a0e; transform: translateY(-2px); }
.char-opt:disabled { opacity: .3; cursor: not-allowed; }
.char-opt img { border-radius: 50%; object-fit: cover; object-position: top; width: 36px; height: 36px; display: block; }
.char-nome {
  font-size: .68rem; font-weight: 600; text-align: center; line-height: 1.2;
  color: #fff; max-width: 68px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.char-meta-badge {
  position: absolute; top: 3px; right: 3px;
  background: #dc3545; color: #fff;
  font-size: .48rem; font-weight: 700;
  padding: 1px 3px; border-radius: 3px; letter-spacing: .04em;
}

/* Grupos do modal */
.grupo-funcao { border-bottom: 1px solid #222; padding-bottom: 12px; }
.grupo-funcao:last-child { border-bottom: none; }