.player-title {
    display: inline-block;
    padding: 2px 5px; /* 缩小整体间距 */
    border-radius: 5px;
    font-weight: bold;
    white-space: nowrap;
    margin-left: 5px;
    font-size: 0.8em; /* 缩小字体尺寸 */
    text-align: center;
}

/* 已定义的样式 */

.player-title.all {
    background-color: #001f3f; /* 深蓝色 */
    color: white;
}

.player-title.legendary { /* 传奇 */
    background-color: #333;
    color: white;
}

.player-title.champion { /* 冠军 */
    background-color: #FFD700;
    color: black;
}

.player-title.hero { /* 英雄 */
    background-color: #FF6347;
    color: white;
}

.player-title.master { /* 大师 */
    background-color: #800080;
    color: white;
}

/* 新增的称号样式 */
.player-title.expert { /* 专家 */
    background-color: #1E90FF;
    color: white;
}

.player-title.elite { /* 精英 */
    background-color: #32CD32;
    color: white;
}

.player-title.strong { /* 强者 */
    background-color: #228B22; /* 深绿色 */
    color: white;
}

.player-title.veteran { /* 老手 */
    background-color: #8B4513; /* 棕色 */
    color: white;
}

.player-title.warrior { /* 勇士 */
    background-color: #CD5C5C; /* 浅红色 */
    color: white;
}

.player-title.vanguard { /* 先锋 */
    background-color: #4682B4; /* 浅蓝色 */
    color: white;
}

.player-title.apprentice { /* 学徒 */
    background-color: #778899; /* 灰蓝色 */
    color: white;
}

.player-title.farmer { /* 农夫 */
    background-color: #A9A9A9; /* 深灰色 */
    color: white;
}

/* 默认样式，未匹配到的称号 */
.player-title.default {
    background-color: #808080; /* 默认灰色 */
    color: white;
}

/* 通用样式 */
.player-title {
    display: inline-block;
    padding: 2px 5px;
    border-radius: 5px;
    font-weight: bold;
    white-space: nowrap; /* 防止回行 */
    margin-left: 5px;
    font-size: 0.8em;
    text-align: center;
    vertical-align: middle; /* 居中对齐 */
}

/* 表格单元格，防止回行 */
.table td, .table th {
    white-space: nowrap; /* 防止内容回行 */
    text-overflow: ellipsis; /* 超出显示省略号 */
    overflow: hidden; /* 隐藏溢出的内容 */
}

/* 针对移动端的调整 */
@media (max-width: 768px) {
    /* 列表字体整体稍微缩小 */
    .table td, .table th {
        font-size: 0.9em;
    }

    /* 调整标题样式 */
    .player-title {
        font-size: 0.7em; /* 在移动端进一步缩小称号字体 */
    }

    /* 去掉表格横向间距 */
    .table {
        margin: 0; /* 表格占满整个屏幕宽度 */
    }

    /* 调整按钮的排列方式，避免内容挤压 */
    .btn {
        white-space: nowrap; /* 防止按钮内容回行 */
    }
}