/* Spielerdatenbank (com_schachspieler): Liste und Profil */
.schachspieler {
	--sb-plus: #1a7f37;
	--sb-minus: #b42318;
	--sb-linie: var(--color-primary, #212529);
	--sb-raster: rgba(0, 0, 0, 0.09);
	--sb-gedaempft: #5c636a;
}

/* Filter: vier Felder + Zuruecksetzen ueber die ganze Breite */
.sb-filter {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
	gap: 0.75rem 1rem;
	align-items: end;
	margin-bottom: 1.25rem;
}
@media (max-width: 991.98px) {
	.sb-filter {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.sb-filter-knoepfe {
		grid-column: 1 / -1;
	}
}
.sb-filter .form-control,
.sb-filter .form-select,
.sb-filter .btn {
	height: 2.75rem;
}
.sb-reset.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #212529;
	background: #fff;
	color: #212529;
	text-decoration: none;
	white-space: nowrap;
}
.sb-reset.btn:hover,
.sb-reset.btn:focus-visible {
	background: #212529;
	border-color: #212529;
	color: #fff;
	text-decoration: none;
}
.sb-filter label {
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	margin-bottom: 0.25rem;
}
.sb-filter-knoepfe {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}
.sb-stand {
	color: var(--sb-gedaempft);
	font-size: 0.875rem;
	margin-bottom: 0.75rem;
}

/* Tabelle */
.sb-tabelle {
	width: 100%;
	margin-bottom: 1rem;
	font-variant-numeric: tabular-nums;
}
.sb-tabelle th,
.sb-tabelle td {
	vertical-align: middle;
	padding: 0.5rem 0.75rem;
}
.sb-tabelle thead th {
	white-space: nowrap;
	border-bottom-width: 2px;
}
.sb-tabelle tbody th {
	font-weight: 400;
}
.sb-pos {
	width: 3.5rem;
	color: var(--sb-gedaempft);
}
.sb-zahl {
	text-align: right;
	white-space: nowrap;
}
.sb-tabelle .sb-status {
	text-align: right;
	white-space: nowrap;
}
.sb-elo {
	font-weight: 700;
}
.sb-name a {
	font-weight: 700;
	text-decoration: none;
}
.sb-name a:hover,
.sb-name a:focus {
	text-decoration: underline;
}
.sb-titel {
	display: inline-block;
	min-width: 2.2em;
	margin-right: 0.35rem;
	padding: 0 0.3em;
	border: 1px solid currentColor;
	border-radius: 3px;
	font-size: 0.75em;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
}
.sb-verein-mobil {
	display: none;
}
.sb-var-plus { color: var(--sb-plus); }
.sb-var-minus { color: var(--sb-minus); }
.sb-var-null,
.sb-var-leer { color: var(--sb-gedaempft); }

.sb-badge {
	display: inline-block;
	padding: 0.1em 0.55em;
	border-radius: 1em;
	font-size: 0.8rem;
	white-space: nowrap;
}
.sb-aktiv { background: #e6f4ea; color: #145c2a; }
.sb-inaktiv { background: #eceff1; color: #4a5258; }

.sb-blaettern {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
}
.sb-limit {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
.sb-limit select {
	width: auto;
}

/* Profil */
.sb-zurueck {
	margin-bottom: 1rem;
}
.sb-kopf {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 1rem;
	margin-bottom: 2rem;
}
.sb-profil-name {
	margin: 0;
}
.sb-fakten {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 1.25rem;
	margin: 0 0 3.5rem;
}
.sb-fakten > div {
	padding: 0.9rem 1rem;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 4px;
}
.sb-fakten dt {
	font-size: 0.8rem;
	font-weight: 400;
	color: var(--sb-gedaempft);
	text-transform: uppercase;
	letter-spacing: 0.03em;
}
.sb-fakten dd {
	margin: 0.2rem 0 0;
}
.sb-fakten small {
	display: block;
	color: var(--sb-gedaempft);
}
.sb-gross {
	font-size: 1.6rem;
	line-height: 1.2;
	font-variant-numeric: tabular-nums;
}
.sb-abschnitt {
	margin-bottom: 3.5rem;
}
.sb-abschnitt > h2 {
	margin-bottom: 1.25rem;
}
.sb-grafik-rahmen {
	width: 100%;
	overflow-x: auto;
}
.sb-grafik {
	display: block;
	width: 100%;
	height: auto;
}
.sb-grafik-breit {
	aspect-ratio: 760 / 300;
}
.sb-grafik-schmal {
	display: none;
	aspect-ratio: 360 / 260;
}
/* Handy und kleine Tablets: schmale Variante mit groesserer Schrift, passt immer ganz auf den Bildschirm */
@media (max-width: 767.98px) {
	.sb-grafik-breit {
		display: none;
	}
	.sb-grafik-schmal {
		display: block;
	}
}
.sb-raster {
	stroke: var(--sb-raster);
	stroke-width: 1;
}
.sb-raster-jahr {
	stroke-dasharray: 2 3;
}
.sb-achse {
	fill: var(--sb-gedaempft);
}
.sb-linie {
	fill: none;
	stroke: var(--sb-linie);
	stroke-width: 2.5;
	stroke-linejoin: round;
}
.sb-punkt {
	fill: #fff;
	stroke: var(--sb-linie);
	stroke-width: 1.5;
}
.sb-jahre .sb-balken-spalte {
	width: 30%;
	position: relative;
}
.sb-balken {
	display: block;
	height: 0.6rem;
	border-radius: 2px;
}
.sb-balken-plus {
	margin-left: 50%;
	background: var(--sb-plus);
}
.sb-balken-minus {
	margin-left: auto;
	margin-right: 50%;
	background: var(--sb-minus);
}
.sb-hinweis {
	color: var(--sb-gedaempft);
	font-size: 0.85rem;
}

/* Sortierbare Spaltenkoepfe */
.sb-tabelle thead th {
	padding: 0;
}
.sb-tabelle thead th.sb-pos {
	padding: 0.5rem 0.75rem;
}
.sb-sort {
	display: block;
	padding: 0.5rem 0.75rem;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
}
.sb-sort:hover,
.sb-sort:focus-visible {
	background: rgba(0, 0, 0, 0.05);
	text-decoration: none;
}
.sb-pfeil {
	display: inline-block;
	width: 1em;
	font-size: 0.75em;
	color: var(--sb-gedaempft);
	opacity: 0.6;
}
.sb-sortiert .sb-pfeil {
	color: inherit;
	opacity: 1;
}
.sb-tabelle thead abbr {
	text-decoration: none;
	cursor: inherit;
}

/* Ergebnis wird nachgeladen */
.sb-ergebnis {
	transition: opacity 0.15s;
}
.sb-ergebnis.sb-laedt {
	opacity: 0.55;
	pointer-events: none;
}

/* Tooltip an der Elo-Grafik */
.sb-grafik-rahmen {
	position: relative;
}
.sb-grafik {
	cursor: crosshair;
	touch-action: pan-y;
}
.sb-grafik:focus {
	outline: none;
}
.sb-grafik.sb-tastatur:focus {
	outline: 2px solid var(--sb-linie);
	outline-offset: 4px;
}
.sb-fokus-linie {
	stroke: var(--sb-linie);
	stroke-width: 1;
	stroke-dasharray: 3 3;
	opacity: 0.6;
}
.sb-fokus-punkt {
	fill: var(--sb-linie);
	stroke: #fff;
	stroke-width: 2.5;
}
.sb-tooltip {
	position: absolute;
	z-index: 2;
	min-width: 7.5rem;
	padding: 0.5rem 0.75rem;
	border-radius: 6px;
	background: #212529;
	color: #fff;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.22);
	font-variant-numeric: tabular-nums;
	line-height: 1.25;
	text-align: center;
	pointer-events: none;
	white-space: nowrap;
}
.sb-tooltip::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -6px;
	margin-left: -6px;
	border: 6px solid transparent;
	border-bottom: 0;
	border-top-color: #212529;
}
.sb-tooltip.sb-tooltip-unten::after {
	top: -6px;
	bottom: auto;
	border: 6px solid transparent;
	border-top: 0;
	border-bottom-color: #212529;
}
.sb-tooltip-datum {
	display: block;
	font-size: 0.75rem;
	opacity: 0.75;
}
.sb-tooltip-elo {
	display: block;
	font-size: 1.35rem;
	font-weight: 700;
}
.sb-tooltip-zeile {
	display: block;
	font-size: 0.85rem;
}
.sb-tooltip .sb-var-plus { color: #6fdc8c; }
.sb-tooltip .sb-var-minus { color: #ff8a80; }
.sb-tooltip .sb-var-null { color: #c7ccd1; }
.sb-grafik-hilfe {
	margin-top: 0.35rem;
}

/* Partien im Profil */
.sb-bilanz {
	font-size: 1.05rem;
	margin-bottom: 1rem;
}
.sb-saisons {
	margin-bottom: 0.5rem;
}
.sb-saisons th a {
	text-decoration: none;
}
.sb-saison {
	margin-top: 1rem;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 4px;
}
.sb-saison > summary {
	padding: 0.75rem 1rem;
	font-weight: 700;
	cursor: pointer;
	list-style-position: inside;
}
.sb-saison[open] > summary {
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
.sb-saison .table-responsive {
	margin: 0;
}
.sb-partien {
	margin: 0;
}
.sb-partien .sb-datum {
	white-space: nowrap;
	color: var(--sb-gedaempft);
}
.sb-farbe {
	display: inline-block;
	width: 0.9rem;
	height: 0.9rem;
	border: 1.5px solid #343a40;
	border-radius: 50%;
	vertical-align: -0.1rem;
}
/* Farbkreis als Block: sitzt genau in der Zeilenmitte (inline haengt er an der Grundlinie) */
.sb-partien .sb-farbe {
	display: block;
	margin: 0 auto;
}
.sb-nur-schmal { display: none; }
.sb-farbe-weiss { background: #fff; }
.sb-farbe-schwarz { background: #343a40; }
.sb-aktion {
	text-align: right;
	white-space: nowrap;
}
/* Nachspielen: deutlicher Knopf; die ganze Zeile ist anklickbar (profil.js, Gegner-Link bleibt eigenstaendig) */
.sb-partien tbody tr {
	cursor: pointer;
}
/* Partie ohne PGN (nur Ergebnis von Chess-Results): keine Partieseite */
.sb-partien tbody tr.sb-ohne-pgn {
	cursor: default;
}
.sb-nur-ergebnis {
	display: inline-block;
	font-size: 0.75rem;
	line-height: 1.2;
	color: var(--sb-gedaempft);
	white-space: normal;
	text-align: right;
	max-width: 5.5rem;
}
.sb-nachspielen {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	min-width: 2.25rem;
	height: 2.25rem;
	padding: 0 0.7rem;
	border: 1px solid #2f5a40;
	border-radius: 0.4rem;
	background: #3b6e4f;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
	color: #fff;
	font-size: 0.85rem;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.sb-nachspielen svg {
	width: 1rem;
	height: 1rem;
	fill: currentColor;
	flex: none;
}
.sb-partien tbody tr:hover .sb-nachspielen,
.sb-nachspielen:focus-visible {
	background: #2f5a40;
	color: #fff;
	text-decoration: none;
}
.sb-nachspielen:focus-visible {
	outline: 2px solid #3b6e4f;
	outline-offset: 2px;
}

/* Hinweis am Profilende: Fehler melden (volle Breite) */
.sb-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem 2rem;
	margin-top: 3.5rem;
	padding: 1.5rem 1.75rem;
	border-radius: 0.5rem;
	background: #eef4f0;
	border-left: 4px solid #3b6e4f;
}
.sb-cta-text {
	flex: 1 1 22rem;
}
.sb-cta h2 {
	margin: 0 0 0.35rem;
	font-size: 1.25rem;
}
.sb-cta p {
	margin: 0;
}
.sb-cta .sb-cta-knopf.btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1.2rem;
	border: 1px solid #2f5a40;
	border-radius: 0.4rem;
	background: #3b6e4f;
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.sb-cta .sb-cta-knopf.btn:hover,
.sb-cta .sb-cta-knopf.btn:focus-visible {
	background: #2f5a40;
	border-color: #2f5a40;
	color: #fff;
}
.sb-cta-knopf svg {
	width: 1.15rem;
	height: 1.15rem;
	fill: currentColor;
}

/* Jugend-GP: Platz 1-3 als Medaille */
.sb-platz {
	display: inline-block;
	min-width: 2em;
	text-align: center;
}
.sb-platz-1,
.sb-platz-2,
.sb-platz-3 {
	padding: 0.05em 0.45em;
	border-radius: 999px;
	font-weight: 700;
}
.sb-platz-1 { background: #f3e2a6; color: #5c4700; }
.sb-platz-2 { background: #e3e6ea; color: #3c434a; }
.sb-platz-3 { background: #ecd3bd; color: #5e3a1c; }
.sb-jgp td:nth-child(2) { white-space: nowrap; }

/* Partie nachspielen */
.sb-partie-kopf {
	margin-bottom: 1.5rem;
}
.sb-partie-titel {
	margin: 0 0 0.75rem;
	font-size: clamp(1.2rem, 2.6vw, 1.75rem);
}
/* Anzeigetafel: Name | Punkte, zwei Zeilen */
.sb-tafel {
	display: grid;
	grid-template-columns: minmax(0, max-content) 3em;
	justify-content: start;
	gap: 0.35rem 1.25rem;
	align-items: center;
}
.sb-tafel-name {
	line-height: 1.25;
}
.sb-tafel-punkte {
	width: 2.4em;
	padding: 0.1em 0.4em;
	border-radius: 4px;
	background: #212529;
	color: #fff;
	text-align: center;
	font-variant-numeric: tabular-nums;
}
.sb-partie-elo {
	font-size: 0.65em;
	font-weight: 400;
	color: var(--sb-gedaempft);
}
.sb-partie-info {
	color: var(--sb-gedaempft);
}
.sb-brett-rahmen {
	max-width: 860px;
	margin-bottom: 1rem;
}
/* Platz fuer das Brett reservieren, bevor das Skript es zeichnet (kein Springen) */
.sb-brett {
	min-height: min(90vw, 560px);
}
/* Viewer im hellen Schema der Website (Standard ist dunkel). Der Viewer ersetzt das Element und uebernimmt die Klasse. */
.lpv.sb-brett {
	--c-lpv-accent: #3b6e4f;
	--c-lpv-accent-over: #fff;
	--c-lpv-bg: #fff;
	--c-lpv-bg-pane: #fff;
	--c-lpv-bg-movelist: #fafafa;
	--c-lpv-bg-player: #f3f4f5;
	--c-lpv-bg-controls: #f3f4f5;
	--c-lpv-bg-variation: #f3f4f5;
	--c-lpv-border: #dee2e6;
	--c-lpv-font: #212529;
	--c-lpv-font-bg: #212529;
	--c-lpv-font-shy: #6c757d;
	--c-lpv-current-move: #3b6e4f;
	--c-lpv-fbt-hover: #e9ecef;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.08);
}
/* klassisches Brett: a1 dunkel; 2x2-Kachel aus vier Feldern */
.sb-brett cg-board {
	background: conic-gradient(#b58863 0 25%, #f0d9b5 0 50%, #b58863 0 75%, #f0d9b5 0) 0 0 / 25% 25%;
}
.sb-brett .cg-wrap coords coord {
	color: #6b4f2c;
	text-shadow: none;
}
.sb-pgn {
	white-space: pre-wrap;
	font-size: 0.85rem;
}

/* Partie: Brett + Seitenleiste */
.sb-partie-raster {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 2rem;
	align-items: start;
}
@media (max-width: 1099.98px) {
	.sb-partie-raster {
		grid-template-columns: minmax(0, 1fr);
	}
}
.sb-partie-raster .sb-brett-rahmen {
	max-width: none;
}
.sb-steuerung {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.75rem;
	margin: 0.75rem 0;
}
.sb-steuerung[hidden] {
	display: none;
}
.sb-steuerung-gruppe {
	display: flex;
	gap: 0.4rem;
	flex-wrap: wrap;
}
.sb-knopf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	min-width: 2.75rem;
	height: 2.75rem;
	padding: 0 0.7rem;
	border: 1px solid #ced4da;
	border-radius: 6px;
	background: #fff;
	color: #212529;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s;
}
.sb-knopf svg {
	width: 1.25rem;
	height: 1.25rem;
	fill: currentColor;
	flex: none;
}
.sb-knopf:hover:not(:disabled),
.sb-knopf:focus-visible {
	background: #f1f3f5;
	border-color: #adb5bd;
}
.sb-knopf:focus-visible {
	outline: 2px solid #3b6e4f;
	outline-offset: 2px;
}
.sb-knopf:disabled {
	opacity: 0.4;
	cursor: default;
}
.sb-knopf-play {
	background: #3b6e4f;
	border-color: #3b6e4f;
	color: #fff;
	min-width: 3.5rem;
}
.sb-knopf-play:hover:not(:disabled),
.sb-knopf-play:focus-visible {
	background: #2f5a40;
	border-color: #2f5a40;
}
.sb-knopf-play .sb-icon-pause,
.sb-knopf-play[aria-pressed="true"] .sb-icon-play {
	display: none;
}
.sb-knopf-play[aria-pressed="true"] .sb-icon-pause {
	display: block;
}

.sb-partie-seite {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}
.sb-seitenblock h2 {
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0 0 0.5rem;
	color: var(--sb-gedaempft);
}
.sb-partieliste {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 6px;
}
.sb-partieliste li + li {
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.sb-partieliste a {
	display: block;
	padding: 0.55rem 0.75rem;
	text-decoration: none;
	color: inherit;
}
.sb-partieliste a:hover,
.sb-partieliste a:focus-visible {
	background: #f6f7f8;
}
.sb-pl-namen {
	display: block;
	font-weight: 700;
	line-height: 1.3;
}
.sb-pl-info {
	display: block;
	font-size: 0.8rem;
	color: var(--sb-gedaempft);
}

@media (max-width: 575.98px) {
	.sb-verein { display: none; }
	.sb-verein-mobil {
		display: block;
		font-size: 0.8rem;
		color: var(--sb-gedaempft);
	}
	.sb-tabelle th,
	.sb-tabelle td {
		padding: 0.45rem 0.4rem;
	}
	.sb-pos { width: 2.5rem; }
	.sb-sort { padding: 0.45rem 0.4rem; }
	.sb-tabelle thead th.sb-pos { padding: 0.45rem 0.4rem; }
	.sb-filter {
		gap: 0.6rem 0.75rem;
	}
	/* Status auf dem Handy unter dem Namen (nur "inaktiv"), eigene Spalte ausgeblendet */
	.sb-tabelle .sb-status { display: none; }
	.sb-verein-mobil .sb-badge { margin-left: 0.3rem; font-size: 0.7rem; padding: 0 0.45em; }
	.sb-jahre .sb-balken-spalte { display: none; }
	.sb-nur-breit { display: none; }
	.sb-nur-schmal { display: inline; }
	.sb-cta { margin-top: 2.5rem; padding: 1.25rem; }
	.sb-cta .sb-cta-knopf.btn { width: 100%; justify-content: center; }
	.sb-nachspielen { padding: 0; width: 2.25rem; }
	.sb-partien th, .sb-partien td { padding-left: 0.35rem; padding-right: 0.35rem; }
	.sb-knopf-text span { display: none; }
	/* Anzeigetafel einzeilig je Spieler (sonst Umbruch nach dem Laden der Webschrift) */
	.sb-partie-titel { font-size: 1.05rem; }
	.sb-tafel-name {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.sb-fakten { margin-bottom: 2.5rem; }
	.sb-abschnitt { margin-bottom: 2.5rem; }
	.sb-fakten {
		grid-template-columns: 1fr 1fr;
		gap: 0.6rem;
	}
	.sb-fakten > div { padding: 0.6rem 0.7rem; }
	.sb-gross { font-size: 1.3rem; }
}

.sb-filter .form-control,
.sb-filter .form-select {
	width: 100%;
	max-width: none;
}