.tier-section {
	margin: 2rem 0;
}
.tier-header {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	padding: 0.6rem 1.2rem;
	background: #1a1a2e;
	border-left: 4px solid #9482C9;
	border-radius: 4px;
	margin-bottom: 1rem;
}
.tier-header h2 {
	margin: 0;
	font-size: 1.2rem;
	color: #e0d8f0;
}
.tier-header .tier-desc {
	font-size: 0.85rem;
	color: #aaa;
	margin-left: auto;
}
.tier-header .tier-count {
	background: #9482C9;
	color: #fff;
	border-radius: 999px;
	padding: 2px 10px;
	font-size: 0.85rem;
	font-weight: bold;
}
.tier-body {
	display: grid;
	grid-template-columns: 1fr 260px;
	gap: 1.5rem;
	align-items: start;
}
@media (max-width: 760px) {
	.tier-body { grid-template-columns: 1fr; }
}
.chart-wrap {
	background: #111;
	border-radius: 8px;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
}
.chart-wrap h3 {
	margin: 0;
	font-size: 0.9rem;
	color: #bbb;
	text-align: center;
}
.chart-wrap canvas {
	max-width: 220px;
	max-height: 220px;
}
.chart-legend {
	width: 100%;
	font-size: 0.8rem;
	color: #ccc;
}
.chart-legend span {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 2px;
	margin-right: 4px;
	vertical-align: middle;
}
table { width: 100%; border-collapse: collapse; }
th { background: #1a1a2e; color: #ccc; padding: 6px 10px; text-align: left; font-size: 0.85rem; }
td { padding: 5px 10px; border-bottom: 1px solid #222; font-size: 0.88rem; }
tr:hover td { background: #1e1e2e; }
tr.is-profil td { background: #12121f; }
.s-name strong { color: #e0d8f0; }
.count-cell { text-align: right; color: #bbb; font-weight: bold; }
.role-badge {
	display: inline-block;
	padding: 1px 7px;
	border-radius: 4px;
	font-size: 0.78rem;
	margin: 1px 2px;
	font-weight: bold;
	white-space: nowrap;
}
.search-container { margin-bottom: 0.5rem; }
.search-container input {
	width: 100%;
	padding: 6px 10px;
	background: #111;
	border: 1px solid #333;
	border-radius: 4px;
	color: #ddd;
	font-size: 0.9rem;
}
.tier-icon { font-size: 1.3rem; }
.tier-veteran  .tier-header { border-color: #f0c040; }
.tier-veteran  .tier-count  { background: #b8860b; }
.tier-regulaer .tier-header { border-color: #69CCF0; }
.tier-regulaer .tier-count  { background: #0070DE; }
.tier-gelegenheit .tier-header { border-color: #ABD473; }
.tier-gelegenheit .tier-count  { background: #5a7a2e; }