/* RPG Statistiken CSS - Rogue RPG BB */

/* ===== CSS VARIABLEN ===== */
:root {
	--rpgstats-primary: #6366f1;
	--rpgstats-primary-light: #818cf8;
	--rpgstats-secondary: #10b981;
	--rpgstats-bg: #ffffff;
	--rpgstats-bg-alt: #f8fafc;
	--rpgstats-text: #1e293b;
	--rpgstats-text-muted: #64748b;
	--rpgstats-border: #e2e8f0;
	--rpgstats-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
	--rpgstats-radius: 12px;
}

/* ===== ANIMATIONEN ===== */
@keyframes rpgstats-fadeIn {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes rpgstats-scaleIn {
	from { transform: scale(0.9); opacity: 0; }
	to { transform: scale(1); opacity: 1; }
}

@keyframes rpgstats-barGrow {
	from { width: 0; }
	to { width: calc(var(--percentage,0) * 1%); }
}

@keyframes rpgstats-vbarGrow {
	from { height: 0; }
	to { height: calc(var(--percentage,0) * 1%); }
}

@keyframes rpgstats-donutDraw {
	from { stroke-dasharray: 0 220; }
}

@keyframes rpgstats-sparklineGrow {
	from { transform: scaleY(0); }
	to { transform: scaleY(1); }
}

@keyframes rpgstats-pointPop {
	from { transform: scale(0); opacity: 0; }
	to { transform: scale(1); opacity: 1; }
}

@keyframes rpgstats-distGrow {
	from { width: 0; }
	to { width: calc(var(--percentage,0) * 1%); }
}

@keyframes rpgstats-tagPop {
	from { transform: scale(0.8); opacity: 0; }
	to { transform: scale(1); opacity: 1; }
}

/* ===== LAYOUT ===== */
.rpgstats-wrapper {
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px;
	animation: rpgstats-fadeIn 0.5s ease-out;
}

.rpgstats-header {
	text-align: center;
	margin-bottom: 30px;
}

.rpgstats-header h1 {
	font-size: 2rem;
	color: var(--rpgstats-primary);
	margin: 0;
}

/* ===== NAVIGATION ===== */
.rpgstats-nav {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-bottom: 30px;
	flex-wrap: wrap;
}

.rpgstats-nav__link {
	padding: 12px 24px;
	background: var(--rpgstats-bg);
	border: 2px solid var(--rpgstats-border);
	border-radius: 30px;
	color: var(--rpgstats-text);
	text-decoration: none;
	font-weight: 500;
	transition: all 0.3s ease;
}

.rpgstats-nav__link:hover {
	border-color: var(--rpgstats-primary);
	color: var(--rpgstats-primary);
}

.rpgstats-nav__link--active {
	background: var(--rpgstats-primary);
	border-color: var(--rpgstats-primary);
	color: white !important;
}

/* ===== SECTIONS ===== */
.rpgstats-section {
	background: var(--rpgstats-bg);
	border-radius: var(--rpgstats-radius);
	box-shadow: var(--rpgstats-shadow);
	padding: 25px;
	margin-bottom: 25px;
	animation: rpgstats-scaleIn 0.4s ease-out;
}

.rpgstats-section h3 {
	margin: 0 0 20px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--rpgstats-border);
	color: var(--rpgstats-text);
	font-size: 1.25rem;
}

/* ===== SUMMARY BOXES ===== */
.rpgstats-summary {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 20px;
}

.rpgstats-box {
	background: linear-gradient(135deg, var(--rpgstats-primary), var(--rpgstats-primary-light));
	border-radius: var(--rpgstats-radius);
	padding: 25px 15px;
	text-align: center;
	color: white;
	transition: transform 0.3s ease;
}

.rpgstats-box:nth-child(2) { background: linear-gradient(135deg, #ec4899, #f472b6); }
.rpgstats-box:nth-child(3) { background: linear-gradient(135deg, #10b981, #34d399); }
.rpgstats-box:nth-child(4) { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.rpgstats-box:nth-child(5) { background: linear-gradient(135deg, #8b5cf6, #a78bfa); }

.rpgstats-box:hover {
	transform: translateY(-5px);
}

.rpgstats-box__icon {
	font-size: 2rem;
	margin-bottom: 10px;
}

.rpgstats-box__value {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.2;
}

.rpgstats-box__label {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	opacity: 0.9;
	margin-top: 5px;
}

/* ===== HORIZONTAL BARS ===== */
.rpgstats-bars {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rpgstats-bar {
	display: grid;
	grid-template-columns: 120px 1fr 80px;
	align-items: center;
	gap: 15px;
}

.rpgstats-bar__label {
	font-weight: 500;
	color: var(--rpgstats-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 0.85rem;
}

.rpgstats-bar__track {
	height: 24px;
	background: var(--rpgstats-bg-alt);
	border-radius: 12px;
	overflow: hidden;
}

.rpgstats-bar__fill {
	height: 100%;
	border-radius: 12px;
	width: calc(var(--percentage,0) * 1%);
	background: linear-gradient(90deg, hsl(var(--hue,220), 70%, 55%), hsl(var(--hue,220), 70%, 65%));
	animation: rpgstats-barGrow 1s ease-out forwards;
}

.rpgstats-bar:nth-child(1) .rpgstats-bar__fill { animation-delay: 0s; }
.rpgstats-bar:nth-child(2) .rpgstats-bar__fill { animation-delay: 0.05s; }
.rpgstats-bar:nth-child(3) .rpgstats-bar__fill { animation-delay: 0.1s; }
.rpgstats-bar:nth-child(4) .rpgstats-bar__fill { animation-delay: 0.15s; }
.rpgstats-bar:nth-child(5) .rpgstats-bar__fill { animation-delay: 0.2s; }
.rpgstats-bar:nth-child(6) .rpgstats-bar__fill { animation-delay: 0.25s; }
.rpgstats-bar:nth-child(7) .rpgstats-bar__fill { animation-delay: 0.3s; }
.rpgstats-bar:nth-child(8) .rpgstats-bar__fill { animation-delay: 0.35s; }
.rpgstats-bar:nth-child(9) .rpgstats-bar__fill { animation-delay: 0.4s; }
.rpgstats-bar:nth-child(10) .rpgstats-bar__fill { animation-delay: 0.45s; }
.rpgstats-bar:nth-child(11) .rpgstats-bar__fill { animation-delay: 0.5s; }
.rpgstats-bar:nth-child(12) .rpgstats-bar__fill { animation-delay: 0.55s; }

.rpgstats-bar__fill--month {
	background: linear-gradient(90deg, var(--rpgstats-primary), var(--rpgstats-primary-light));
}

.rpgstats-bar__fill--distribution {
	background: linear-gradient(90deg, var(--rpgstats-secondary), #34d399);
}

.rpgstats-bar__value {
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	text-align: right;
	font-size: 0.85rem;
}

/* ===== CHARACTER BARS ===== */
.rpgstats-charbars {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rpgstats-charbar {
	display: grid;
	grid-template-columns: 36px 100px 1fr 90px;
	align-items: center;
	gap: 10px;
}

.rpgstats-charbar:nth-child(1) .rpgstats-bar__fill { animation-delay: 0s; }
.rpgstats-charbar:nth-child(2) .rpgstats-bar__fill { animation-delay: 0.1s; }
.rpgstats-charbar:nth-child(3) .rpgstats-bar__fill { animation-delay: 0.2s; }
.rpgstats-charbar:nth-child(4) .rpgstats-bar__fill { animation-delay: 0.3s; }
.rpgstats-charbar:nth-child(5) .rpgstats-bar__fill { animation-delay: 0.4s; }

.rpgstats-charbar__avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--rpgstats-border);
}

.rpgstats-charbar__name {
	font-weight: 500;
	color: var(--rpgstats-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ===== DONUT CHARTS ===== */
.rpgstats-donut-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 30px;
}

.rpgstats-donut-container {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.rpgstats-donut-title {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 15px;
}

.rpgstats-donut-wrapper {
	position: relative;
	width: 160px;
	height: 160px;
}

.rpgstats-donut {
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
}

.rpgstats-donut__segment {
	fill: none;
	stroke-width: 28;
	animation: rpgstats-donutDraw 1.2s ease-out forwards;
}

.rpgstats-donut__segment:nth-child(1) { animation-delay: 0s; }
.rpgstats-donut__segment:nth-child(2) { animation-delay: 0.15s; }
.rpgstats-donut__segment:nth-child(3) { animation-delay: 0.3s; }
.rpgstats-donut__segment:nth-child(4) { animation-delay: 0.45s; }
.rpgstats-donut__segment:nth-child(5) { animation-delay: 0.6s; }

.rpgstats-donut__center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}

.rpgstats-donut__center-value {
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--rpgstats-text);
}

.rpgstats-donut__center-label {
	font-size: 0.7rem;
	color: var(--rpgstats-text-muted);
}

/* ===== DONUT LEGEND ===== */
.rpgstats-donut-legend {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 15px;
	width: 100%;
	max-width: 180px;
}

.rpgstats-legend-item {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.8rem;
}

.rpgstats-legend-color {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.rpgstats-legend-text {
	flex: 1;
	color: var(--rpgstats-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rpgstats-legend-value {
	font-weight: 600;
	color: var(--rpgstats-text-muted);
}

/* ===== BOARD SUMMARY ===== */
.rpgstats-board-summary {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 15px;
	margin-bottom: 30px;
}

.rpgstats-board-stat {
	text-align: center;
	padding: 15px 10px;
}

.rpgstats-board-stat__value {
	font-size: 2rem;
	font-weight: 700;
	color: var(--rpgstats-primary);
}

.rpgstats-board-stat__label {
	font-size: 0.75rem;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
}

/* ===== TABLE ===== */
.rpgstats-table {
	width: 100%;
	border-collapse: collapse;
}

.rpgstats-table th,
.rpgstats-table td {
	padding: 12px 15px;
	text-align: left;
	border-bottom: 1px solid var(--rpgstats-border);
}

.rpgstats-table th {
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
	font-size: 0.75rem;
}

.rpgstats-table tbody tr:hover {
	background: var(--rpgstats-bg-alt);
}

.rpgstats-player-row a {
	color: var(--rpgstats-primary);
	text-decoration: none;
	font-weight: 500;
}

/* ===== SEARCH ===== */
.rpgstats-search {
	margin-bottom: 20px;
}

.rpgstats-search input {
	width: 100%;
	max-width: 350px;
	padding: 10px 18px;
	border: 2px solid var(--rpgstats-border);
	border-radius: 25px;
	font-size: 0.95rem;
}

.rpgstats-search input:focus {
	outline: none;
	border-color: var(--rpgstats-primary);
}

/* ===== TIME FILTER ===== */
.rpgstats-timefilter {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 25px;
}

.rpgstats-timefilter__btn {
	padding: 8px 18px;
	background: var(--rpgstats-bg);
	border: 2px solid var(--rpgstats-border);
	border-radius: 20px;
	color: var(--rpgstats-text);
	text-decoration: none;
	font-size: 0.85rem;
	transition: all 0.3s;
}

.rpgstats-timefilter__btn:hover {
	border-color: var(--rpgstats-primary);
	color: var(--rpgstats-primary);
}

.rpgstats-timefilter__btn--active {
	background: var(--rpgstats-primary);
	border-color: var(--rpgstats-primary);
	color: white !important;
}

/* ===== AVERAGES ===== */
.rpgstats-averages {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 20px;
}

.rpgstats-avg {
	text-align: center;
	padding: 15px;
}

.rpgstats-avg__label {
	font-size: 0.8rem;
	color: var(--rpgstats-text-muted);
	margin-bottom: 8px;
}

.rpgstats-avg__value {
	font-size: 1.6rem;
	font-weight: 700;
	color: var(--rpgstats-text);
}

.rpgstats-avg__scale {
	height: 8px;
	background: linear-gradient(90deg, #10b981, #f59e0b, #ef4444);
	border-radius: 4px;
	margin: 12px 0 6px;
	position: relative;
}

.rpgstats-avg__marker {
	position: absolute;
	top: -4px;
	width: 16px;
	height: 16px;
	background: white;
	border: 3px solid var(--rpgstats-text);
	border-radius: 50%;
	transform: translateX(-50%);
}

.rpgstats-avg__range {
	display: flex;
	justify-content: space-between;
	font-size: 0.7rem;
	color: var(--rpgstats-text-muted);
}

/* ===== CHARACTER DETAIL ===== */
.rpgstats-char-select {
	margin-bottom: 20px;
}

.rpgstats-char-select label {
	margin-right: 10px;
	font-weight: 500;
}

.rpgstats-char-select select {
	padding: 8px 12px;
	border: 2px solid var(--rpgstats-border);
	border-radius: 8px;
	min-width: 220px;
}

.rpgstats-char-detail {
	background: var(--rpgstats-bg-alt);
	border-radius: var(--rpgstats-radius);
	padding: 20px;
}

.rpgstats-char-detail__header {
	display: flex;
	gap: 15px;
	align-items: center;
	margin-bottom: 20px;
}

.rpgstats-char-detail__avatar {
	width: 55px;
	height: 55px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid var(--rpgstats-border);
}

.rpgstats-char-detail__info h4 {
	margin: 0 0 5px;
}

.rpgstats-char-detail__info h4 a {
	color: var(--rpgstats-primary);
	text-decoration: none;
}

.rpgstats-char-detail__info p {
	margin: 0;
	color: var(--rpgstats-text-muted);
	font-size: 0.85rem;
}

.rpgstats-char-detail__stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
	gap: 12px;
	margin-bottom: 20px;
}

.rpgstats-mini-stat {
	text-align: center;
	padding: 12px 8px;
	background: var(--rpgstats-bg);
	border-radius: 8px;
}

.rpgstats-mini-stat__value {
	display: block;
	font-size: 1.3rem;
	font-weight: 700;
	color: var(--rpgstats-primary);
}

.rpgstats-mini-stat__label {
	font-size: 0.7rem;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
}

/* ===== CHARACTER AVERAGES ===== */
.rpgstats-char-detail__averages {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid var(--rpgstats-border);
}

.rpgstats-char-detail__averages h5 {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 0 0 12px;
}

.rpgstats-char-avg-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
	gap: 10px;
}

.rpgstats-char-avg {
	text-align: center;
	padding: 10px;
	background: linear-gradient(135deg, var(--rpgstats-bg-alt), white);
	border-radius: 8px;
	border: 1px solid var(--rpgstats-border);
}

.rpgstats-char-avg__value {
	display: block;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--rpgstats-secondary);
}

.rpgstats-char-avg__label {
	font-size: 0.65rem;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
	margin-top: 2px;
	display: block;
}

/* ===== SPARKLINE ===== */
.rpgstats-sparkline {
	display: flex;
	align-items: flex-end;
	gap: 0;
	height: 50px;
	padding: 10px 0;
	position: relative;
	background: linear-gradient(180deg, rgba(99,102,241,0.05) 0%, transparent 100%);
	border-radius: 8px;
}

.rpgstats-sparkline::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: var(--rpgstats-border);
}

.rpgstats-sparkline__point {
	flex: 1;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	height: 100%;
	position: relative;
}

.rpgstats-sparkline__point::before {
	content: "";
	width: 8px;
	height: 8px;
	background: var(--rpgstats-primary);
	border-radius: 50%;
	position: absolute;
	bottom: calc(var(--height,0) - 4px);
	box-shadow: 0 0 0 3px rgba(99,102,241,0.2);
	animation: rpgstats-pointPop 0.5s ease-out forwards;
	z-index: 2;
}

.rpgstats-sparkline__point::after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 2px;
	height: var(--height);
	background: linear-gradient(180deg, var(--rpgstats-primary), transparent);
	opacity: 0.4;
}

.rpgstats-sparkline__point:nth-child(1)::before { animation-delay: 0s; }
.rpgstats-sparkline__point:nth-child(2)::before { animation-delay: 0.05s; }
.rpgstats-sparkline__point:nth-child(3)::before { animation-delay: 0.1s; }
.rpgstats-sparkline__point:nth-child(4)::before { animation-delay: 0.15s; }
.rpgstats-sparkline__point:nth-child(5)::before { animation-delay: 0.2s; }
.rpgstats-sparkline__point:nth-child(6)::before { animation-delay: 0.25s; }
.rpgstats-sparkline__point:nth-child(7)::before { animation-delay: 0.3s; }
.rpgstats-sparkline__point:nth-child(8)::before { animation-delay: 0.35s; }
.rpgstats-sparkline__point:nth-child(9)::before { animation-delay: 0.4s; }
.rpgstats-sparkline__point:nth-child(10)::before { animation-delay: 0.45s; }
.rpgstats-sparkline__point:nth-child(11)::before { animation-delay: 0.5s; }
.rpgstats-sparkline__point:nth-child(12)::before { animation-delay: 0.55s; }

.rpgstats-sparkline-wrap {
	margin-top: 10px;
}

.rpgstats-sparkline-labels {
	display: flex;
	justify-content: space-between;
	margin-top: 5px;
}

.rpgstats-sparkline__label {
	font-size: 0.65rem;
	color: var(--rpgstats-text-muted);
	flex: 1;
	text-align: center;
}

/* ===== BACK LINK ===== */
.rpgstats-back {
	margin-bottom: 20px;
}

.rpgstats-back a {
	color: var(--rpgstats-primary);
	text-decoration: none;
}

.rpgstats-player-header {
	margin-bottom: 10px;
}

.rpgstats-player-header h2 {
	margin: 0;
	color: var(--rpgstats-text);
	font-size: 1.5rem;
}

/* ===== MESSAGES ===== */
.rpgstats-message {
	padding: 20px;
	border-radius: var(--rpgstats-radius);
	text-align: center;
}

.rpgstats-message--error {
	background: #fef2f2;
	color: #dc2626;
}

.rpgstats-message--info {
	background: #eff6ff;
	color: #2563eb;
}

/* ===== MINI AVATARS ===== */
.rpgstats-char-link {
	color: var(--rpgstats-primary);
	text-decoration: none;
	transition: color 0.2s;
}

.rpgstats-char-link:hover {
	color: var(--rpgstats-primary-light);
	text-decoration: underline;
}

.rpgstats-char-list {
	font-size: 0.9rem;
	line-height: 1.6;
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}

.rpgstats-mini-avatar-link {
	display: inline-block;
	transition: transform 0.2s;
}

.rpgstats-mini-avatar-link:hover {
	transform: scale(1.15);
}

.rpgstats-mini-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--rpgstats-border);
	transition: border-color 0.2s;
}

.rpgstats-mini-avatar-link:hover .rpgstats-mini-avatar {
	border-color: var(--rpgstats-primary);
}

.rpgstats-player-link {
	color: var(--rpgstats-primary);
	font-weight: 600;
	text-decoration: none;
}

.rpgstats-player-link:hover {
	text-decoration: underline;
}

/* ===== TOP 3 ===== */
.rpgstats-section-title {
	margin: 0 0 20px;
	color: var(--rpgstats-text);
	font-size: 1.25rem;
}

.rpgstats-top3-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 20px;
}

.rpgstats-top3-card {
	background: var(--rpgstats-bg-alt);
	border-radius: var(--rpgstats-radius);
	padding: 20px;
	border: 1px solid var(--rpgstats-border);
}

.rpgstats-top3-card__title {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--rpgstats-border);
}

.rpgstats-top3-card__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rpgstats-top3-row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 10px;
	background: var(--rpgstats-bg);
	border-radius: 8px;
	transition: transform 0.2s;
}

.rpgstats-top3-row:hover {
	transform: translateX(5px);
}

.rpgstats-top3-rank {
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--rpgstats-primary);
	color: white;
	font-weight: 700;
	font-size: 0.8rem;
	border-radius: 50%;
	flex-shrink: 0;
}

.rpgstats-top3-row:nth-child(1) .rpgstats-top3-rank {
	background: linear-gradient(135deg, #fbbf24, #f59e0b);
}

.rpgstats-top3-row:nth-child(2) .rpgstats-top3-rank {
	background: linear-gradient(135deg, #94a3b8, #64748b);
}

.rpgstats-top3-row:nth-child(3) .rpgstats-top3-rank {
	background: linear-gradient(135deg, #d97706, #b45309);
}

.rpgstats-top3-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--rpgstats-border);
	flex-shrink: 0;
}

.rpgstats-top3-name {
	flex: 1;
	font-weight: 500;
	color: var(--rpgstats-primary);
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rpgstats-top3-name:hover {
	text-decoration: underline;
}

.rpgstats-top3-value {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	white-space: nowrap;
}

.rpgstats-top3-icon {
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
	flex-shrink: 0;
}

.rpgstats-top3-row--scene .rpgstats-top3-name {
	font-size: 0.85rem;
}

/* ===== VERTICAL BARS ===== */
.rpgstats-vbars {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	height: 200px;
	gap: 8px;
	padding: 20px 10px 0;
	border-bottom: 2px solid var(--rpgstats-border);
	margin-bottom: 10px;
}

.rpgstats-vbar {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 1;
	max-width: 60px;
	height: 100%;
}

.rpgstats-vbar__column {
	flex: 1;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.rpgstats-vbar__fill {
	width: 100%;
	background: linear-gradient(180deg, var(--rpgstats-primary), var(--rpgstats-primary-light));
	border-radius: 6px 6px 0 0;
	height: calc(var(--percentage,0) * 1%);
	animation: rpgstats-vbarGrow 1s ease-out forwards;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	min-height: 2px;
	position: relative;
}

.rpgstats-vbar__value {
	font-size: 0.7rem;
	font-weight: 700;
	color: white;
	padding: 4px 2px;
	text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

.rpgstats-vbar__fill[style*="--percentage:0"] .rpgstats-vbar__value {
	color: var(--rpgstats-text-muted);
	text-shadow: none;
	position: absolute;
	top: -20px;
}

.rpgstats-vbar__label {
	font-size: 0.7rem;
	color: var(--rpgstats-text-muted);
	margin-top: 8px;
	text-align: center;
}

.rpgstats-vbar:nth-child(1) .rpgstats-vbar__fill { animation-delay: 0s; }
.rpgstats-vbar:nth-child(2) .rpgstats-vbar__fill { animation-delay: 0.05s; }
.rpgstats-vbar:nth-child(3) .rpgstats-vbar__fill { animation-delay: 0.1s; }
.rpgstats-vbar:nth-child(4) .rpgstats-vbar__fill { animation-delay: 0.15s; }
.rpgstats-vbar:nth-child(5) .rpgstats-vbar__fill { animation-delay: 0.2s; }
.rpgstats-vbar:nth-child(6) .rpgstats-vbar__fill { animation-delay: 0.25s; }
.rpgstats-vbar:nth-child(7) .rpgstats-vbar__fill { animation-delay: 0.3s; }
.rpgstats-vbar:nth-child(8) .rpgstats-vbar__fill { animation-delay: 0.35s; }
.rpgstats-vbar:nth-child(9) .rpgstats-vbar__fill { animation-delay: 0.4s; }
.rpgstats-vbar:nth-child(10) .rpgstats-vbar__fill { animation-delay: 0.45s; }
.rpgstats-vbar:nth-child(11) .rpgstats-vbar__fill { animation-delay: 0.5s; }
.rpgstats-vbar:nth-child(12) .rpgstats-vbar__fill { animation-delay: 0.55s; }

/* ===== DISTRIBUTION TAGS ===== */
.rpgstats-dist-cloud {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}

.rpgstats-dist-tag {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: var(--rpgstats-bg-alt);
	border: 2px solid var(--rpgstats-border);
	border-radius: 25px;
	transition: all 0.2s;
	animation: rpgstats-tagPop 0.5s ease-out forwards;
}

.rpgstats-dist-tag:hover {
	border-color: var(--rpgstats-primary);
	transform: translateY(-2px);
}

.rpgstats-dist-tag__name {
	font-weight: 500;
	color: var(--rpgstats-text);
}

.rpgstats-dist-tag__count {
	background: var(--rpgstats-primary);
	color: white;
	padding: 2px 8px;
	border-radius: 12px;
	font-size: 0.8rem;
	font-weight: 600;
}

/* ===== AGE STATISTICS ===== */
.rpgstats-age-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 25px;
}

.rpgstats-age-left {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.rpgstats-age-averages h4,
.rpgstats-age-ranges h4,
.rpgstats-age-dist h4 {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 0 0 12px;
}

.rpgstats-age-avg-cards {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-start;
}

.rpgstats-age-avg-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 8px 14px;
	border-radius: 8px;
	color: white;
	text-align: center;
	min-width: 60px;
	max-width: 100px;
}

/* Gesamt-Durchschnitt: city-primary Farbe */
.rpgstats-age-avg-card--primary { background: linear-gradient(135deg, var(--rpgstats-primary), var(--rpgstats-primary-light)); }
/* Maennlich / erster Gender */
.rpgstats-age-avg-card--secondary { background: linear-gradient(135deg, #3b82f6, #60a5fa); }
.rpgstats-age-avg-card--blue { background: linear-gradient(135deg, #3b82f6, #60a5fa); }
.rpgstats-age-avg-card--pink { background: linear-gradient(135deg, #ec4899, #f472b6); }
.rpgstats-age-avg-card--purple { background: linear-gradient(135deg, #8b5cf6, #a78bfa); }
.rpgstats-age-avg-card--green { background: linear-gradient(135deg, #10b981, #34d399); }
.rpgstats-age-avg-card--orange { background: linear-gradient(135deg, #f59e0b, #fbbf24); }

.rpgstats-age-avg-card__icon {
	font-size: 1rem;
	margin-bottom: 2px;
}

.rpgstats-age-avg-card__value {
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1;
}

.rpgstats-age-avg-card__label {
	font-size: 0.55rem;
	opacity: 0.9;
	margin-top: 2px;
	text-transform: uppercase;
}

/* ===== AGE DISTRIBUTION SECTION ===== */
.rpgstats-age-dist {
	background: var(--rpgstats-bg-alt);
	border-radius: 10px;
	padding: 15px;
}

.rpgstats-age-dist-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.rpgstats-age-dist-card {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: var(--rpgstats-bg);
	border-radius: 8px;
	border: 1px solid var(--rpgstats-border);
	transition: all 0.2s;
}

.rpgstats-age-dist-card:hover {
	border-color: var(--rpgstats-primary);
	transform: translateY(-1px);
}

.rpgstats-age-dist-card__name {
	font-weight: 600;
	color: var(--rpgstats-text);
	font-size: 0.8rem;
}

.rpgstats-age-dist-card__avg {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--rpgstats-primary);
}

.rpgstats-age-dist-card__count {
	font-size: 0.7rem;
	color: var(--rpgstats-text-muted);
	padding: 2px 6px;
	background: var(--rpgstats-bg-alt);
	border-radius: 10px;
}

/* ===== AGE RANGE BARS ===== */
.rpgstats-age-range-bars {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rpgstats-age-range {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.rpgstats-age-range__header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}

.rpgstats-age-range__name {
	font-weight: 600;
	font-size: 0.85rem;
	color: var(--rpgstats-text);
}

.rpgstats-age-range__count {
	font-size: 0.75rem;
	color: var(--rpgstats-text-muted);
	font-weight: 600;
}

.rpgstats-age-range__track {
	height: 10px;
	background: var(--rpgstats-bg-alt);
	border-radius: 5px;
	overflow: hidden;
}

.rpgstats-age-range__fill {
	height: 100%;
	background: linear-gradient(90deg, #f59e0b, #fbbf24);
	border-radius: 5px;
	width: calc(var(--percentage,0) * 1%);
	animation: rpgstats-barGrow 0.8s ease-out forwards;
}

.rpgstats-age-range__desc {
	font-size: 0.7rem;
	color: var(--rpgstats-text-muted);
}

.rpgstats-age-range:nth-child(1) .rpgstats-age-range__fill { animation-delay: 0s; background: linear-gradient(90deg, #10b981, #34d399); }
.rpgstats-age-range:nth-child(2) .rpgstats-age-range__fill { animation-delay: 0.1s; background: linear-gradient(90deg, #3b82f6, #60a5fa); }
.rpgstats-age-range:nth-child(3) .rpgstats-age-range__fill { animation-delay: 0.2s; background: linear-gradient(90deg, #8b5cf6, #a78bfa); }
.rpgstats-age-range:nth-child(4) .rpgstats-age-range__fill { animation-delay: 0.3s; background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.rpgstats-age-range:nth-child(5) .rpgstats-age-range__fill { animation-delay: 0.4s; background: linear-gradient(90deg, #ef4444, #f87171); }
.rpgstats-age-range:nth-child(6) .rpgstats-age-range__fill { animation-delay: 0.5s; background: linear-gradient(90deg, #64748b, #94a3b8); }

/* ===== PLAYER DEMOGRAPHICS ===== */
.rpgstats-demographics-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 25px;
}

.rpgstats-demo-card {
	background: var(--rpgstats-bg-alt);
	border-radius: var(--rpgstats-radius);
	padding: 20px;
}

.rpgstats-demo-card h4 {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 0 0 15px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--rpgstats-border);
}

/* ===== GENDER BARS ===== */
.rpgstats-gender-bars {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rpgstats-gender-bar__header {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
}

.rpgstats-gender-bar__icon {
	font-size: 1.1rem;
}

.rpgstats-gender-bar__name {
	font-weight: 600;
	color: var(--rpgstats-text);
	flex: 1;
}

.rpgstats-gender-bar__count {
	font-size: 0.85rem;
	color: var(--rpgstats-text-muted);
	font-weight: 600;
}

.rpgstats-gender-bar__track {
	height: 12px;
	background: var(--rpgstats-border);
	border-radius: 6px;
	overflow: hidden;
}

.rpgstats-gender-bar__fill {
	height: 100%;
	border-radius: 6px;
	background: var(--color);
	width: calc(var(--percentage,0) * 1%);
	animation: rpgstats-barGrow 0.8s ease-out forwards;
}

.rpgstats-gender-bar:nth-child(1) .rpgstats-gender-bar__fill { animation-delay: 0s; }
.rpgstats-gender-bar:nth-child(2) .rpgstats-gender-bar__fill { animation-delay: 0.1s; }
.rpgstats-gender-bar:nth-child(3) .rpgstats-gender-bar__fill { animation-delay: 0.2s; }

/* ===== PLAYER AGE STATS ===== */
.rpgstats-player-age-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-bottom: 15px;
}

.rpgstats-player-age-stat {
	text-align: center;
	padding: 15px 10px;
	background: var(--rpgstats-bg);
	border-radius: 10px;
}

.rpgstats-player-age-stat__value {
	display: block;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--rpgstats-primary);
}

.rpgstats-player-age-stat__label {
	font-size: 0.7rem;
	color: var(--rpgstats-text-muted);
	text-transform: uppercase;
}

/* ===== AGE BY GENDER ===== */
.rpgstats-age-by-gender h5 {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--rpgstats-text-muted);
	margin: 0 0 10px;
	text-transform: uppercase;
}

.rpgstats-age-gender-list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.rpgstats-age-gender-item {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 12px;
	background: var(--rpgstats-bg);
	border-radius: 8px;
}

.rpgstats-age-gender-item__icon {
	font-size: 1rem;
}

.rpgstats-age-gender-item__name {
	font-weight: 500;
	color: var(--rpgstats-text);
	font-size: 0.85rem;
}

.rpgstats-age-gender-item__value {
	font-weight: 700;
	color: var(--rpgstats-secondary);
	font-size: 0.85rem;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
	.rpgstats-bar {
		grid-template-columns: 1fr;
	}
	
	.rpgstats-charbar {
		grid-template-columns: 36px 1fr;
	}
	
	.rpgstats-nav {
		flex-direction: column;
	}
	
	.rpgstats-top3-grid {
		grid-template-columns: 1fr;
	}
	
	.rpgstats-vbars {
		height: 150px;
		gap: 4px;
	}
	
	.rpgstats-vbar__label {
		font-size: 0.6rem;
	}
	
	.rpgstats-dist-cloud {
		justify-content: flex-start;
	}
	
	.rpgstats-age-grid {
		grid-template-columns: 1fr;
	}
	
	.rpgstats-demographics-grid {
		grid-template-columns: 1fr;
	}
	
	.rpgstats-player-age-stats {
		grid-template-columns: repeat(3, 1fr);
	}
}