/* ==========================================================================
   Kellerkicker Bergedorf – Theme-Styles
   Dunkel mit Trikot-Muster, Montserrat, Neon-Grün als Akzent.
   ========================================================================== */

:root {
	--kk-keller: #141514;
	--kk-tief: #0c0d0c;
	--kk-panel: rgba(12, 13, 12, 0.9);
	--kk-flaeche: #1b1d1b;
	--kk-linie: #2f3a33;
	--kk-gruen: #1f6b3e;
	--kk-gruen-dunkel: #1f5a35;
	--kk-neon: #7dffa8;
	--kk-salbei: #8fbf9f;
	--kk-text: #e8efe9;
	--kk-leise: #c4d0c7;
	--kk-stern: #f2c94c;
	--kk-papier: #f4f3ee;
	--kk-rot: #ff8f8f;
	--kk-glow: 0 0 10px rgba(80, 255, 140, 0.7), 0 0 34px rgba(80, 255, 140, 0.35);
	--kk-rand-neon: 0 0 0 1px rgba(125, 255, 168, 0.65), 0 0 24px rgba(80, 255, 140, 0.22), inset 0 0 30px rgba(80, 255, 140, 0.08);
	--kk-breite: 1200px;
	--kk-seite: clamp(1rem, 4vw, 1.5rem);
	--kk-kopf-hoehe: 76px;
	--kk-admin: var(--wp-admin--admin-bar--height, 0px);
	--kk-muster: url("../images/pattern.svg");
}

@media (max-width: 600px) {
	:root { --kk-admin: 0px; --kk-kopf-hoehe: 68px; }
}

html { scroll-padding-top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 16px); }

body {
	background-color: var(--kk-keller);
	background-image: var(--kk-muster);
	background-size: 240px 260px;
	color: var(--kk-text);
	-webkit-font-smoothing: antialiased;
}

@media (max-width: 700px) {
	body { background-size: 180px 195px; }
}

.wp-site-blocks { padding: 0; overflow-x: clip; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.wp-site-blocks > main, .wp-site-blocks > #swup { flex: 1 0 auto; }
.wp-site-blocks > * + * { margin-block-start: 0; }

:where(a) { text-underline-offset: 0.18em; }
:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 3px; }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important;
	width: 1px; word-wrap: normal !important;
}

.kk-symbol { flex: none; vertical-align: middle; }

/* --------------------------------------------------------------------------
   Bausteine
   -------------------------------------------------------------------------- */

.kk-neon-text, .is-style-kk-neon { color: var(--kk-neon) !important; text-shadow: var(--kk-glow); }

.kk-ueberzeile, .is-style-kk-kicker {
	font-size: 0.8125rem !important;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--kk-salbei);
	margin: 0;
}
.kk-ueberzeile a { color: inherit; text-decoration: none; }
.kk-ueberzeile a:hover { color: var(--kk-neon); }

.kk-stern { color: var(--kk-stern); }

.kk-streifen, hr.is-style-kk-streifen {
	display: block;
	height: 10px;
	border: 0 !important;
	margin: 0 !important;
	max-width: none !important;
	width: 100%;
	background: linear-gradient(var(--kk-gruen-dunkel) 0 3px, transparent 3px 7px, var(--kk-gruen-dunkel) 7px 10px) !important;
	opacity: 1;
}

.kk-knopf, .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	min-height: 48px;
	padding: 0.9rem 1.6rem;
	border: 0;
	border-radius: 999px;
	background: var(--kk-gruen);
	color: #fff;
	font: inherit;
	font-weight: 800;
	font-size: 0.875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: box-shadow 0.2s, background-color 0.2s;
}
.kk-knopf:hover, .wp-block-button__link:hover { color: #fff; background: #24804a; box-shadow: 0 0 0 1px var(--kk-neon), 0 0 26px rgba(80, 255, 140, 0.45); }
.kk-knopf--neon, .is-style-outline .wp-block-button__link {
	background: transparent !important;
	color: var(--kk-neon) !important;
	box-shadow: var(--kk-rand-neon);
}
.kk-knopf--neon:hover, .is-style-outline .wp-block-button__link:hover { background: rgba(125, 255, 168, 0.08) !important; }
.kk-knopf--rand { background: transparent; color: var(--kk-leise); box-shadow: inset 0 0 0 1px #3d4a41; }
.kk-knopf--rand:hover { background: rgba(255, 255, 255, 0.04); color: var(--kk-text); }

.kk-mehr {
	display: inline-flex; align-items: center; gap: 0.4em;
	margin-top: 0.75rem; padding: 0.6rem 0;
	font-weight: 800; font-size: 0.8125rem; letter-spacing: 0.1em; text-transform: uppercase;
	color: var(--kk-neon); text-decoration: none;
}
.kk-mehr:hover { text-shadow: var(--kk-glow); }

.kk-marke {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 1.9em; padding: 0.2em 0.55em; border-radius: 999px;
	font-size: 0.75rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; vertical-align: middle;
	background: #2a2f2b; color: var(--kk-leise);
}
.kk-marke--sieg { background: var(--kk-gruen); color: #fff; }
.kk-marke--remis { background: #4a4422; color: #ffe9a3; }
.kk-marke--niederlage { background: #3a2526; color: #ffc6c6; }

.kk-leer { color: var(--kk-leise); font-style: italic; }

/* Platzhalter in eckigen Klammern: nur für Angemeldete sichtbar. */
body:not(.logged-in) [data-kk-platzhalter] { display: none !important; }
[data-kk-platzhalter] { outline: 1px dashed var(--kk-stern); outline-offset: 4px; color: var(--kk-stern); }

/* Karten-Stile für Gruppen */
.is-style-kk-karte, .is-style-kk-karte-neon {
	background: var(--kk-flaeche);
	border: 1px solid var(--kk-linie);
	border-radius: 20px;
	padding: clamp(1.25rem, 3vw, 2rem) !important;
}
.is-style-kk-karte-neon { background: #121a14; border-color: transparent; box-shadow: var(--kk-rand-neon); }

/* --------------------------------------------------------------------------
   Kopfbereich
   -------------------------------------------------------------------------- */

.wp-site-blocks > header.wp-block-template-part,
.wp-site-blocks > .kk-kopfbereich {
	position: sticky;
	top: var(--kk-admin);
	z-index: 100;
}

.kk-kopf {
	background: rgba(14, 15, 14, 0.96);
	border-bottom: 1px solid rgba(125, 255, 168, 0.35);
	/* Kein backdrop-filter: würde das feste Handy-Menü an den Kopfbereich binden. */
}

.kk-kopf__innen {
	max-width: calc(var(--kk-breite) + 2 * var(--kk-seite));
	margin: 0 auto;
	padding: 10px var(--kk-seite);
	display: flex;
	align-items: center;
	gap: 1.25rem;
	min-height: var(--kk-kopf-hoehe);
	box-sizing: border-box;
	transition: min-height 0.2s, padding 0.2s;
}
.kk-kopf__logo { flex: none; display: block; line-height: 0; }
.kk-kopf__logo img { width: 56px; height: 56px; filter: drop-shadow(0 0 14px rgba(80, 255, 140, 0.45)); transition: width 0.2s, height 0.2s; }
html.kk-gescrollt .kk-kopf__innen { min-height: 60px; padding-top: 6px; padding-bottom: 6px; }
html.kk-gescrollt .kk-kopf__logo img { width: 44px; height: 44px; }

/* Desktop-Menü */
.kk-nav { flex: 1 1 auto; display: none; }
.kk-nav__liste { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; gap: clamp(0.9rem, 1.6vw, 1.6rem); }
.kk-nav__punkt { position: relative; }
.kk-nav__link, .kk-nav__knopf {
	display: inline-flex; align-items: center; gap: 0.35em;
	min-height: 44px; padding: 0; border: 0; background: none; cursor: pointer;
	font: inherit; font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.07em; text-transform: uppercase;
	color: var(--kk-text); text-decoration: none; white-space: nowrap;
}
.kk-nav__knopf .kk-symbol { transition: transform 0.2s; }
.kk-nav__punkt.ist-aktiv > .kk-nav__link,
.kk-nav__punkt.ist-aktiv > .kk-nav__knopf,
.kk-nav__knopf[aria-expanded="true"] { color: var(--kk-neon); }
.kk-nav__knopf[aria-expanded="true"] .kk-symbol { transform: rotate(180deg); }
.kk-nav__punkt.ist-aktiv > .kk-nav__link::after,
.kk-nav__punkt.ist-aktiv > .kk-nav__knopf::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 2px;
	background: var(--kk-neon); box-shadow: 0 0 10px rgba(80, 255, 140, 0.8); border-radius: 2px;
}

.kk-nav__dd {
	position: absolute; top: calc(100% + 12px); left: -14px; z-index: 5;
	width: 300px; padding: 12px; border-radius: 16px;
	background: #0e0f0e;
	box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.6), 0 0 30px rgba(80, 255, 140, 0.2), 0 24px 60px rgba(0, 0, 0, 0.6);
	opacity: 0; visibility: hidden; transform: translateY(-6px);
	transition: opacity 0.16s, transform 0.16s, visibility 0s linear 0.16s;
}
.kk-nav__dd::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.kk-nav__dd--breit { width: 520px; }
.kk-nav__punkt:nth-child(n+4) .kk-nav__dd { left: auto; right: -14px; }
.kk-nav__dd ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.kk-nav__dd--breit ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kk-nav__unter { display: block; padding: 11px 14px; border-radius: 10px; color: var(--kk-text); text-decoration: none; }
.kk-nav__unter:hover, .kk-nav__unter:focus-visible { background: rgba(125, 255, 168, 0.08); color: var(--kk-text); }
.kk-nav__unter:hover .kk-nav__unter-titel, .kk-nav__unter[aria-current] .kk-nav__unter-titel { color: var(--kk-neon); }
.kk-nav__unter-titel { display: block; font-weight: 800; font-size: 0.9375rem; }
.kk-nav__unter-text { display: block; margin-top: 2px; font-size: 0.8125rem; font-weight: 500; color: #9fb3a5; line-height: 1.4; }

.kk-nav__punkt.ist-offen > .kk-nav__dd { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
@media (hover: hover) {
	.kk-nav__punkt.hat-kinder:hover > .kk-nav__dd { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
	.kk-nav__link:hover, .kk-nav__knopf:hover { color: var(--kk-neon); }
}

/* Aktionen rechts */
.kk-kopf__aktionen { margin-left: auto; display: flex; align-items: center; gap: 12px; flex: none; }
.kk-kopf__spiel { display: none; align-items: center; gap: 8px; min-height: 44px; padding: 0.55rem 1.1rem; font-size: 0.8125rem; white-space: nowrap; }
@media (max-width: 1299px) { .kk-kopf__spiel-text { display: none; } }
.kk-kopf__spiel-label { flex: none; }
.kk-kopf__spiel-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-weight: 600; text-transform: none; letter-spacing: 0; opacity: 0.85; }
.kk-kopf__spiel-label + .kk-kopf__spiel-text::before { content: "· "; }
.kk-kopf__stand { flex: none; font-weight: 900; font-variant-numeric: tabular-nums; }
.kk-kopf__livepunkt { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #ff5a5a; box-shadow: 0 0 8px #ff5a5a; animation: kk-livepuls 1.6s ease-in-out infinite; }
@keyframes kk-livepuls { 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) { .kk-kopf__livepunkt { animation: none; } }

.kk-musikknopf, .kk-kopf__burger {
	display: inline-flex; align-items: center; justify-content: center;
	width: 48px; height: 48px; border: 0; border-radius: 50%; padding: 0; cursor: pointer;
	background: transparent; color: var(--kk-neon);
	box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.6), 0 0 18px rgba(80, 255, 140, 0.25);
	text-decoration: none; flex: none;
}
.kk-musikknopf:hover, .kk-kopf__burger:hover { background: rgba(125, 255, 168, 0.08); color: var(--kk-neon); }
.kk-musikknopf[aria-pressed="true"] { background: var(--kk-gruen); color: #fff; }
.kk-musikknopf__play, .kk-musikknopf__pause { display: inline-flex; line-height: 0; }
.kk-musikknopf__pause, .kk-musikknopf[aria-pressed="true"] .kk-musikknopf__play { display: none; }
.kk-musikknopf[aria-pressed="true"] .kk-musikknopf__pause { display: inline-flex; }

.kk-kopf__burger-zu { display: none; }
.kk-kopf__burger[aria-expanded="true"] .kk-kopf__burger-auf { display: none; }
.kk-kopf__burger[aria-expanded="true"] .kk-kopf__burger-zu { display: inline-flex; }
.kk-kopf__burger-auf, .kk-kopf__burger-zu { line-height: 0; }

@media (min-width: 1200px) {
	.kk-nav { display: block; }
	.kk-kopf__spiel { display: inline-flex; }
	.kk-kopf__burger { display: none; }
	.kk-mobil { display: none !important; }
}

/* Musikleiste */
.kk-musikleiste { background: #0b130e; border-top: 1px solid rgba(125, 255, 168, 0.25); }
.kk-musikleiste__zeile {
	max-width: calc(var(--kk-breite) + 2 * var(--kk-seite)); margin: 0 auto; box-sizing: border-box;
	padding: 6px var(--kk-seite); display: flex; align-items: center; gap: 12px; font-size: 0.8125rem;
}
.kk-musikleiste__text { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--kk-leise); }
.kk-musikleiste__text strong { color: var(--kk-neon); text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.75rem; margin-right: 0.4em; }
@media (max-width: 500px) { .kk-musikleiste__text strong { display: none; } }
.kk-musikleiste__knoepfe { display: inline-flex; align-items: center; gap: 4px; flex: none; }
.kk-musikleiste__knopf {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border: 0; border-radius: 50%; padding: 0; cursor: pointer;
	background: transparent; color: var(--kk-text);
}
.kk-musikleiste__knopf:hover { color: var(--kk-neon); background: rgba(125, 255, 168, 0.08); }
.kk-musikleiste__knopf--gross { box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.6); color: var(--kk-neon); }
.kk-musikleiste__knopf--gross[aria-pressed="true"] { background: var(--kk-gruen); color: #fff; box-shadow: none; }
.kk-musikleiste__knopf .kk-musikknopf__play, .kk-musikleiste__knopf .kk-musikknopf__pause { line-height: 0; }
.kk-musikleiste__knopf--gross .kk-musikknopf__pause, .kk-musikleiste__knopf--gross[aria-pressed="true"] .kk-musikknopf__play { display: none; }
.kk-musikleiste__knopf--gross[aria-pressed="true"] .kk-musikknopf__pause { display: inline-flex; }

@keyframes kk-eq { 0%, 100% { height: 4px; } 50% { height: 14px; } }
.kk-eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 14px; flex: none; }
.kk-eq span { display: block; width: 3px; height: 4px; background: var(--kk-neon); border-radius: 2px; }
html.kk-musik-laeuft .kk-eq span { animation: kk-eq 0.9s ease-in-out infinite; }
html.kk-musik-laeuft .kk-eq span:nth-child(2) { animation-delay: 0.2s; }
html.kk-musik-laeuft .kk-eq span:nth-child(3) { animation-delay: 0.45s; }
html.kk-musik-laeuft .kk-eq span:nth-child(4) { animation-delay: 0.1s; }
@media (prefers-reduced-motion: reduce) { html.kk-musik-laeuft .kk-eq span { animation: none; height: 10px; } }

.kk-kopf { position: relative; }

/* Mobiles Menü */
.kk-mobil {
	position: fixed; left: 0; right: 0; bottom: 0;
	top: calc(var(--kk-kopf-oben, var(--kk-kopf-hoehe)) + var(--kk-admin));
	background: #0a0b0a; overflow-y: auto; overscroll-behavior: contain;
	padding: 8px var(--kk-seite) 32px; z-index: 90;
}
.kk-mobil[hidden] { display: none; }
.kk-mobil__liste { list-style: none; margin: 0; padding: 0; }
.kk-mobil__liste > li { border-bottom: 1px solid #26302a; }
.kk-mobil__link {
	display: flex; align-items: center; justify-content: space-between; width: 100%;
	min-height: 56px; padding: 0; border: 0; background: none; cursor: pointer; text-align: left;
	font: inherit; font-weight: 900; font-size: 1.25rem; text-transform: uppercase; letter-spacing: 0.04em;
	color: var(--kk-text); text-decoration: none;
}
.kk-mobil__link[aria-current], .kk-mobil__knopf[aria-expanded="true"], .kk-mobil__liste > li.ist-aktiv > .kk-mobil__link { color: var(--kk-neon); }
.kk-mobil__knopf .kk-symbol { transition: transform 0.2s; }
.kk-mobil__knopf[aria-expanded="true"] .kk-symbol { transform: rotate(180deg); }
.kk-mobil__unter { list-style: none; margin: 0 0 14px 2px; padding: 0 0 6px 14px; border-left: 2px solid var(--kk-neon); }
.kk-mobil__unter a { display: flex; align-items: center; min-height: 44px; font-weight: 600; color: var(--kk-leise); text-decoration: none; }
.kk-mobil__unter a[aria-current] { color: var(--kk-neon); }
.kk-mobil__aktionen { display: grid; gap: 12px; margin-top: 24px; }
html.kk-menue-offen { overflow: hidden; }

/* --------------------------------------------------------------------------
   Hauptbereich, Seitenkopf
   -------------------------------------------------------------------------- */

.kk-main { min-height: 60vh; }
.kk-main > * { margin-block-start: 0; }

.kk-seitenkopf { background: linear-gradient(rgba(14, 15, 14, 0.55), rgba(14, 15, 14, 0.85)); }
.kk-seitenkopf__innen, .kk-seitenkopf > * {
	max-width: var(--kk-breite); margin-left: auto; margin-right: auto;
}
.kk-seitenkopf { padding: clamp(3rem, 8vw, 6rem) var(--kk-seite) clamp(2.25rem, 5vw, 3.5rem); }
.kk-seitenkopf__titel { margin: 0.6rem 0 0; font-size: clamp(2.5rem, 7vw, 4.75rem); line-height: 0.95; font-weight: 900; text-transform: uppercase; overflow-wrap: anywhere; hyphens: auto; }
.kk-seitenkopf__text { margin: 1.1rem 0 0; max-width: 640px; font-size: 1.1875rem; color: var(--kk-leise); }
.kk-seitenkopf .wp-block-buttons { margin-top: 1.5rem; }

.kk-inhalt {
	padding: clamp(2.5rem, 6vw, 4.5rem) var(--kk-seite) clamp(3rem, 7vw, 5.5rem);
	background: rgba(14, 15, 14, 0.82);
}
.kk-inhalt > .alignwide { max-width: var(--kk-breite); }
.kk-inhalt h2 { margin-top: 2.75rem; }
.kk-inhalt h2:first-child { margin-top: 0; }
.kk-inhalt p, .kk-inhalt li { color: var(--kk-leise); }
.kk-inhalt strong { color: var(--kk-text); }
.kk-inhalt a:not(.kk-knopf):not(.wp-block-button__link):not(.kk-spiel__link):not(.kk-unterseite) { color: var(--kk-neon); }

/* --------------------------------------------------------------------------
   Startseite
   -------------------------------------------------------------------------- */

.kk-main--start .wp-block-post-content > * { margin-block-start: 0; }
.kk-abschnitt {
	padding: clamp(3rem, 7vw, 5.5rem) var(--kk-seite) !important;
	max-width: none !important;
}
.kk-abschnitt > * { max-width: var(--kk-breite); margin-left: auto !important; margin-right: auto !important; }
.kk-abschnitt--band { background: rgba(12, 13, 12, 0.92); }

.kk-hero {
	display: grid !important;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
	align-items: center;
	gap: clamp(2rem, 5vw, 3.5rem);
	max-width: var(--kk-breite);
	margin: 0 auto !important;
	padding: clamp(3.5rem, 9vw, 6.5rem) var(--kk-seite) clamp(2.5rem, 6vw, 4.5rem) !important;
	box-sizing: content-box;
}
.kk-hero > * { margin: 0 !important; max-width: none !important; }
.kk-hero__titel { margin: 1.25rem 0 0 !important; font-size: clamp(2.9rem, 7.4vw, 5.6rem) !important; line-height: 0.95 !important; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.kk-hero__text p { font-size: clamp(1.0625rem, 1.6vw, 1.2rem); color: var(--kk-leise); max-width: 540px; }
.kk-hero__text > * + * { margin-top: 1.5rem !important; }
.kk-hero__text .wp-block-buttons { gap: 14px; margin-top: 2.25rem !important; }
.kk-hero__logo { display: flex; justify-content: center; }
.kk-hero__logo img { width: 100%; max-width: 420px; height: auto; filter: drop-shadow(0 0 40px rgba(80, 255, 140, 0.35)) drop-shadow(0 30px 60px rgba(0, 0, 0, 0.6)); }
@media (max-width: 800px) {
	.kk-hero { grid-template-columns: 1fr; }
	.kk-hero__logo { order: 2; }
	.kk-hero__logo img { max-width: 240px; }
}

.kk-split {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(2rem, 6vw, 4rem);
	align-items: center;
}
.kk-split > * { margin: 0 !important; }
@media (max-width: 800px) { .kk-split { grid-template-columns: 1fr; } }
.kk-abschnitt.kk-split { max-width: calc(var(--kk-breite) + 2 * var(--kk-seite)) !important; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box; }
.kk-abschnitt.kk-split > * { max-width: none; }
.kk-split__text > * + * { margin-top: 1rem; }
.kk-split__text h2 { margin-top: 0.75rem; font-size: clamp(2.5rem, 6vw, 3.5rem); }
.kk-abschnitt--rookie { padding-top: 0 !important; }
.kk-abschnitt h2 { margin-top: 0; }

/* Bilderreihe (mehrere Polaroids nebeneinander) */
.kk-bilderreihe { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 2.5rem; align-items: start; margin-top: 2rem !important; margin-bottom: 2.5rem !important; }
.kk-bilderreihe > * { margin: 0 !important; max-width: 360px; }
.kk-bilderreihe > *:nth-child(2n) { transform: rotate(2deg); }

/* Aufklappbare Abschnitte */
.wp-block-details { margin: 1.5rem 0; border-radius: 16px; background: var(--kk-panel); border: 1px solid var(--kk-linie); padding: 0 20px; }
.wp-block-details summary { cursor: pointer; padding: 16px 0; font-weight: 800; color: var(--kk-text); list-style-position: inside; }
.wp-block-details[open] summary { color: var(--kk-neon); border-bottom: 1px solid var(--kk-linie); margin-bottom: 1rem; }
.wp-block-details > :last-child { margin-bottom: 1.25rem; }
.kk-inhalt h3 { margin-top: 2rem; }

.kk-zeile-titel { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.5rem 1.5rem; margin-bottom: 1.75rem !important; }
.kk-zeile-titel > * { margin: 0 !important; }

/* --------------------------------------------------------------------------
   Polaroid (Bild- und Galerie-Stil)
   -------------------------------------------------------------------------- */

.is-style-kk-polaroid, .is-style-kk-polaroids .wp-block-image {
	position: relative;
	background: var(--kk-papier);
	padding: 14px 14px 0 !important;
	transform: rotate(-2.5deg);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55), 0 0 40px rgba(80, 255, 140, 0.12);
	max-width: 440px;
	margin-left: auto !important; margin-right: auto !important;
	box-sizing: border-box;
}
.is-style-kk-polaroid img, .is-style-kk-polaroids .wp-block-image img {
	display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain;
	background-color: var(--kk-keller); background-image: var(--kk-muster); background-size: 140px 152px;
	border-radius: 0 !important;
}
.is-style-kk-polaroid.kk-freigestellt img { background: radial-gradient(circle at 50% 40%, #4a544e 0%, #262c28 55%, #121513 100%); padding: 7% 7% 0; box-sizing: border-box; object-position: bottom; }
.is-style-kk-polaroid figcaption, .is-style-kk-polaroids .wp-block-image figcaption {
	margin: 0 !important; padding: 14px 4px 22px !important; text-align: left !important;
	font-family: var(--wp--preset--font-family--schreibmaschine) !important; font-size: 1.15rem !important;
	color: #1b1c1b !important; background: none !important; position: static !important;
}
.is-style-kk-polaroid::before, .is-style-kk-polaroid::after {
	content: ""; position: absolute; width: 110px; height: 28px; background: rgba(125, 255, 168, 0.35); z-index: 2;
}
.is-style-kk-polaroid::before { top: -12px; left: 34px; transform: rotate(-6deg); }
.is-style-kk-polaroid::after { bottom: 16px; right: -6px; transform: rotate(8deg); }
.is-style-kk-polaroids { gap: 2.25rem !important; }
.wp-block-gallery.is-style-kk-polaroids { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); align-items: start !important; gap: 2.5rem 2rem !important; }
/* WordPress-Galerie (auch „zugeschnitten“) übersteuern: Polaroid so hoch wie das Bild. */
.wp-block-gallery.is-style-kk-polaroids figure.wp-block-image:not(#individual-image) {
	display: block !important; width: auto !important; height: auto !important; max-width: none !important;
	margin: 0 !important; padding: 12px 12px 0 !important; align-self: start !important; flex: none !important;
}
.wp-block-gallery.is-style-kk-polaroids figure.wp-block-image:not(#individual-image):not(:has(figcaption)) { padding-bottom: 40px !important; }
.wp-block-gallery.is-style-kk-polaroids figure.wp-block-image:not(#individual-image) img {
	display: block !important; flex: none !important; width: 100% !important; height: auto !important; max-height: none !important;
	aspect-ratio: auto !important; object-fit: contain !important; background: none !important;
}
.wp-block-gallery.is-style-kk-polaroids figure.wp-block-image:not(#individual-image) figcaption {
	position: static !important; inset: auto !important; max-height: none !important; overflow: visible !important;
	background: none !important; color: #1b1c1b !important; text-shadow: none !important;
	padding: 12px 4px 18px !important; margin: 0 !important; text-align: left !important; font-size: 1.05rem !important;
	font-family: var(--wp--preset--font-family--schreibmaschine) !important;
}
.wp-block-gallery.is-style-kk-polaroids figure.wp-block-image:not(#individual-image)::before { display: none !important; }
.is-style-kk-polaroids .wp-block-image:nth-child(2n) { transform: rotate(2deg); }
.is-style-kk-polaroids .wp-block-image:nth-child(3n) { transform: rotate(-1deg); }
.is-style-kk-polaroids.wp-block-gallery.has-nested-images figure.wp-block-image figcaption { color: #1b1c1b; }

/* --------------------------------------------------------------------------
   Countdown
   -------------------------------------------------------------------------- */

.kk-countdown { padding: 0 var(--kk-seite) clamp(3rem, 6vw, 4.5rem); }
.kk-countdown__karte {
	max-width: var(--kk-breite); margin: 0 auto; box-sizing: border-box;
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); gap: 1.75rem; align-items: center;
	padding: clamp(1.5rem, 3vw, 2.25rem); border-radius: 22px; background: var(--kk-panel); box-shadow: var(--kk-rand-neon);
	text-align: center;
}
.kk-countdown__team { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.kk-countdown__team img { width: 88px; height: 88px; object-fit: contain; }
.kk-countdown__wappen {
	width: 88px; height: 88px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	border: 2px dashed #3d4a41; color: var(--kk-salbei); font-weight: 900; font-size: 2rem; box-sizing: border-box;
}
.kk-countdown__name { font-weight: 900; font-size: 1.125rem; text-transform: uppercase; line-height: 1.2; overflow-wrap: anywhere; }
.kk-countdown__kennung { margin: 0; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-countdown__uhr { display: flex; justify-content: center; gap: clamp(8px, 2vw, 18px); margin: 14px 0; }
.kk-countdown__feld { min-width: 64px; display: flex; flex-direction: column; align-items: center; }
.kk-countdown__zahl { font-size: clamp(2.25rem, 5vw, 3.4rem); font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-countdown__einheit { margin-top: 6px; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-countdown__info { margin: 0; color: var(--kk-leise); font-size: 0.9375rem; }
.kk-countdown__los { margin: 10px 0 0; font-weight: 900; color: var(--kk-neon); text-transform: uppercase; }
@media (max-width: 700px) {
	.kk-countdown__karte { grid-template-columns: 1fr 1fr; gap: 1rem; }
	.kk-countdown__mitte { grid-column: 1 / -1; order: -1; }
	.kk-countdown__team img, .kk-countdown__wappen { width: 56px; height: 56px; font-size: 1.4rem; }
	.kk-countdown__name { font-size: 0.9375rem; }
	.kk-countdown__feld { min-width: 0; flex: 1; padding: 10px 0; border-radius: 12px; background: var(--kk-tief); }
}

/* --------------------------------------------------------------------------
   Kacheln (Spielbetrieb)
   -------------------------------------------------------------------------- */

.kk-kacheln { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 700px) { .kk-kacheln { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 2vw, 20px); } .kk-kachel { padding: clamp(18px, 2.4vw, 26px); } }
.kk-kachel { padding: 26px; border-radius: 20px; background: var(--kk-flaeche); border: 1px solid var(--kk-linie); }
.kk-kachel--neon { background: #121a14; border-color: transparent; box-shadow: var(--kk-rand-neon); }
.kk-kachel__liste { list-style: none; margin: 12px 0 0; padding: 0; font-size: 1.25rem; font-weight: 800; line-height: 1.8; color: var(--kk-text); }
.kk-kachel__gross { margin: 12px 0 0; font-size: 2rem; font-weight: 900; line-height: 1.1; color: var(--kk-text); display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.kk-kachel__mittel { margin: 12px 0 0; font-size: 1.375rem; font-weight: 900; line-height: 1.2; color: var(--kk-text); }
.kk-kachel__text { margin: 8px 0 0; color: var(--kk-leise); }

/* --------------------------------------------------------------------------
   Spiele
   -------------------------------------------------------------------------- */

.kk-spiele__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.kk-spiel__link {
	display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 18px; align-items: center;
	padding: 16px 20px; border-radius: 16px; background: var(--kk-panel); border: 1px solid var(--kk-linie);
	color: var(--kk-text); text-decoration: none; transition: box-shadow 0.2s, border-color 0.2s;
}
.kk-spiel__link:hover { border-color: transparent; box-shadow: var(--kk-rand-neon); color: var(--kk-text); }
.kk-spiel--offen .kk-spiel__link { border-style: dashed; }
.kk-spiel__wann, .kk-spiel__wer, .kk-spiel__ergebnis { display: flex; flex-direction: column; gap: 2px; }
.kk-spiel__datum { font-weight: 900; font-size: 1.0625rem; font-variant-numeric: tabular-nums; }
.kk-spiel__runde, .kk-spiel__ort, .kk-spiel__tore { font-size: 0.8125rem; color: var(--kk-salbei); }
.kk-spiel__gegner { font-weight: 800; font-size: 1.125rem; overflow-wrap: anywhere; }
.kk-spiel__gegner:has(.kk-spiel__logo) { display: inline-flex; align-items: center; gap: 10px; }
.kk-spiel__logo { flex: none; width: 28px; height: 28px; }
.kk-spiel__ergebnis { align-items: flex-end; text-align: right; }
.kk-spiel__punkte { font-weight: 900; font-size: 1.5rem; line-height: 1; font-variant-numeric: tabular-nums; }
.kk-spiel--sieg .kk-spiel__punkte { color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-spiel__ergebnis .kk-marke { margin-top: 4px; }
.kk-spiel__zeit { font-weight: 800; color: var(--kk-neon); }
@media (max-width: 640px) {
	.kk-spiel__link { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 14px; padding: 14px 16px; }
	.kk-spiel__wann { grid-column: 1 / -1; flex-direction: row; gap: 10px; align-items: baseline; }
}

/* Spielkopf */
.kk-spielkopf { background: linear-gradient(rgba(14, 15, 14, 0.55), rgba(14, 15, 14, 0.88)); padding: clamp(3rem, 7vw, 5rem) var(--kk-seite) clamp(2rem, 5vw, 3rem); }
.kk-spielkopf__innen, .kk-vif, .kk-spielkopf__bild { max-width: 900px; margin-left: auto; margin-right: auto; text-align: center; }
.kk-spielkopf__paarung { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: clamp(0.75rem, 3vw, 2rem); margin-top: 1.5rem; }
.kk-spielkopf__team { margin: 0; font-weight: 900; text-transform: uppercase; font-size: clamp(1.125rem, 3vw, 1.875rem); line-height: 1.15; overflow-wrap: anywhere; }
.kk-spielkopf__paarung .kk-spielkopf__team:first-child { text-align: right; }
.kk-spielkopf__paarung .kk-spielkopf__team:last-child { text-align: left; }
.kk-spielkopf__wappen { display: flex; align-items: center; justify-content: center; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #2c5a3d, #12321f); box-shadow: inset 0 0 0 2px rgba(125, 255, 168, 0.45); color: var(--kk-neon); font-size: clamp(1.5rem, 4vw, 2.25rem); font-weight: 900; }
.kk-spielkopf__team:has(.kk-spielkopf__logo) { display: flex; flex-direction: column; gap: 12px; }
.kk-spielkopf__paarung .kk-spielkopf__team:first-child:has(.kk-spielkopf__logo) { align-items: flex-end; }
.kk-spielkopf__paarung .kk-spielkopf__team:last-child:has(.kk-spielkopf__logo) { align-items: flex-start; }
.kk-spielkopf__paarung:has(.kk-spielkopf__logo) { align-items: start; }
.kk-spielkopf__paarung:has(.kk-spielkopf__logo) .kk-spielkopf__stand { margin-top: clamp(4px, 2vw, 14px); }
.kk-spielkopf__logo { width: clamp(56px, 10vw, 84px); height: clamp(56px, 10vw, 84px); object-fit: contain; }
.kk-spielkopf__stand { margin: 0; font-size: clamp(2.75rem, 9vw, 5.5rem); font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; }
.kk-spielkopf__vs { color: var(--kk-salbei); font-size: 0.5em; }
.kk-spielkopf__zusatz { display: flex; justify-content: center; align-items: center; gap: 14px; margin: 1rem 0 0; color: var(--kk-leise); font-weight: 700; }
.kk-spielkopf__fakten { list-style: none; margin: 1.5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; color: var(--kk-leise); }
.kk-spielkopf__fakten li { display: inline-flex; align-items: center; gap: 6px; }
.kk-vif { margin-top: 2rem; padding: 22px 26px; border-radius: 18px; background: #121a14; box-shadow: var(--kk-rand-neon); text-align: left; }
.kk-vif__titel { margin: 0 0 10px; font-weight: 900; font-size: 1.125rem; color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-vif__titel span { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--kk-salbei); text-shadow: none; margin-left: 0.5em; }
.kk-vif ul { margin: 0; padding-left: 1.2em; color: var(--kk-text); }
.kk-vif li + li { margin-top: 6px; }
.kk-spielkopf__bild { margin-top: 2rem; }
.kk-spielkopf__bild img { max-width: 100%; max-height: 620px; height: auto; border-radius: 14px; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5); }
.kk-bericht h2 { font-size: var(--wp--preset--font-size--gross); text-transform: uppercase; }

/* --------------------------------------------------------------------------
   Team
   -------------------------------------------------------------------------- */

.kk-team__liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 14px; }
.kk-spielerkarte {
	display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center;
	padding: 20px 12px; border-radius: 18px; background: var(--kk-panel); border: 1px solid var(--kk-linie);
}
.kk-spielerkarte__kreis, .kk-spielerkarte__bild {
	width: 72px; height: 72px; border-radius: 50%; margin-bottom: 8px; object-fit: cover;
	display: flex; align-items: center; justify-content: center;
	background: var(--kk-gruen-dunkel); font-weight: 900; font-size: 1.375rem; color: #fff;
	box-shadow: 0 0 0 2px rgba(125, 255, 168, 0.35);
}
.kk-spielerkarte__name { font-weight: 800; color: var(--kk-text); line-height: 1.25; overflow-wrap: anywhere; }
.kk-spielerkarte__rolle { font-size: 0.8125rem; color: var(--kk-salbei); font-weight: 600; }
.kk-spielerkarte__seit { font-size: 0.75rem; color: #8fa293; }
@media (max-width: 500px) {
	.kk-team__liste { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
	.kk-spielerkarte { padding: 14px 6px; }
	.kk-spielerkarte__kreis, .kk-spielerkarte__bild { width: 52px; height: 52px; font-size: 1.0625rem; }
	.kk-spielerkarte__name { font-size: 0.875rem; }
}

/* --------------------------------------------------------------------------
   Rückkick
   -------------------------------------------------------------------------- */

.kk-chronik__liste { list-style: none; margin: 0; padding: 0; }
.kk-chronik--zeitleiste .kk-chronik__liste { position: relative; padding-left: 28px; }
.kk-chronik--zeitleiste .kk-chronik__liste::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(var(--kk-neon), rgba(125, 255, 168, 0.15)); }
.kk-chronik--zeitleiste .kk-chronik__eintrag { position: relative; padding-bottom: 1.75rem; }
.kk-chronik--zeitleiste .kk-chronik__eintrag::before {
	content: ""; position: absolute; left: -27px; top: 7px; width: 14px; height: 14px; border-radius: 50%;
	background: var(--kk-keller); border: 2px solid var(--kk-neon); box-shadow: 0 0 10px rgba(80, 255, 140, 0.6);
}
.kk-chronik__datum { margin: 0; font-weight: 900; font-size: 1.125rem; color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-chronik__text { margin-top: 4px; color: var(--kk-leise); }
.kk-chronik__text > :first-child { margin-top: 0; }
.kk-chronik__text > :last-child { margin-bottom: 0; }
.kk-chronik--kacheln .kk-chronik__liste { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 28px; }
.kk-chronik--kacheln .kk-chronik__eintrag { border-top: 2px solid var(--kk-neon); padding-top: 18px; }

/* --------------------------------------------------------------------------
   Statistik, Tabellen
   -------------------------------------------------------------------------- */

.kk-statistik__zahlen { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
.kk-statistik__zahlen li { padding: 20px; border-radius: 16px; background: var(--kk-panel); border: 1px solid var(--kk-linie); display: flex; flex-direction: column; gap: 6px; }
.kk-statistik__zahl { font-size: 1.875rem; font-weight: 900; line-height: 1; color: var(--kk-text); font-variant-numeric: tabular-nums; }
.kk-statistik__name { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-tabelle-rahmen { overflow-x: auto; margin-bottom: 1.5rem; border-radius: 14px; border: 1px solid var(--kk-linie); background: #0f110f; }
.kk-tabelle, .kk-inhalt .wp-block-table table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.kk-tabelle caption { text-align: left; padding: 14px 16px 6px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-tabelle th, .kk-tabelle td, .kk-inhalt .wp-block-table th, .kk-inhalt .wp-block-table td { padding: 12px 16px; border: 0; border-top: 1px solid #222a25; text-align: left; color: var(--kk-text); }
.kk-tabelle thead th { font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-salbei); }

/* --------------------------------------------------------------------------
   Listen-Stile: Linkkarten, Dokumente
   -------------------------------------------------------------------------- */

ul.is-style-kk-linkliste, ul.is-style-kk-dokumente { list-style: none; padding: 0 !important; margin-left: 0; display: grid; gap: 10px; }
.is-style-kk-linkliste li, .is-style-kk-dokumente li { margin: 0; }
.is-style-kk-linkliste a, .is-style-kk-dokumente a, .kk-linkkarte a {
	display: flex; align-items: center; justify-content: space-between; gap: 14px;
	min-height: 56px; padding: 12px 18px; border-radius: 14px;
	background: var(--kk-panel); border: 1px solid var(--kk-linie);
	color: var(--kk-text) !important; text-decoration: none; font-weight: 700;
}
.is-style-kk-linkliste a::after, .kk-linkkarte a::after {
	content: "↗"; color: var(--kk-neon); font-weight: 900; flex: none;
}
.kk-linkkarte a .kk-symbol { display: none; }
.is-style-kk-dokumente a::before {
	content: "PDF"; flex: none; order: -1; padding: 4px 8px; border-radius: 6px;
	background: var(--kk-gruen-dunkel); color: #fff; font-size: 0.6875rem; font-weight: 900; letter-spacing: 0.08em;
}
.is-style-kk-dokumente a { justify-content: flex-start; }
.is-style-kk-linkliste a:hover, .is-style-kk-dokumente a:hover, .kk-linkkarte a:hover { box-shadow: var(--kk-rand-neon); border-color: transparent; }
.kk-linkkarte { margin: 0; }

/* --------------------------------------------------------------------------
   Einbettungen (nach Klick)
   -------------------------------------------------------------------------- */

.kk-einbettung { margin: 1.25rem 0; border-radius: 18px; overflow: hidden; background: var(--kk-tief); box-shadow: 0 0 0 1px var(--kk-linie); }
.kk-einbettung--youtube.ist-geladen { aspect-ratio: 16 / 9; }
.kk-einbettung:not(.ist-geladen) { min-height: 200px; display: flex; }
.kk-einbettung:not(.ist-geladen) .kk-einbettung__platzhalter { flex: 1; }
.kk-einbettung--spotify { min-height: 152px; }
.kk-einbettung__platzhalter {
	height: 100%; box-sizing: border-box; padding: 24px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px;
	background-image: linear-gradient(rgba(12, 13, 12, 0.88), rgba(12, 13, 12, 0.94)), var(--kk-muster); background-size: auto, 160px 173px;
}
.kk-einbettung__symbol { color: var(--kk-neon); }
.kk-einbettung__titel { margin: 0; font-weight: 800; font-size: 1.0625rem; color: var(--kk-text) !important; }
.kk-einbettung__hinweis { margin: 0; font-size: 0.8125rem; color: #9fb3a5 !important; }
.kk-einbettung__knoepfe { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 6px; }
.kk-einbettung__extern { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 700; font-size: 0.875rem; }
.kk-einbettung iframe { display: block; width: 100%; height: 100%; border: 0; }
.kk-einbettung--spotify iframe { height: 152px; }
.kk-einbettung--liste.ist-geladen iframe { height: 352px; }
.kk-einbettungen { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.kk-einbettungen .kk-einbettung { margin: 0; }

/* --------------------------------------------------------------------------
   Unterseiten-Kacheln
   -------------------------------------------------------------------------- */

.kk-unterseiten { list-style: none; margin: 0; padding: 0 !important; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.kk-unterseite {
	position: relative; display: flex; flex-direction: column; gap: 6px; height: 100%; box-sizing: border-box;
	padding: 24px 24px 56px; border-radius: 18px; background: var(--kk-panel); border: 1px solid var(--kk-linie);
	color: var(--kk-text) !important; text-decoration: none;
}
.kk-unterseite:hover { border-color: transparent; box-shadow: var(--kk-rand-neon); }
.kk-unterseite__titel { font-weight: 900; font-size: 1.25rem; text-transform: uppercase; }
.kk-unterseite__text { color: var(--kk-leise); font-size: 0.9375rem; }
.kk-unterseite__pfeil { position: absolute; left: 24px; bottom: 20px; color: var(--kk-neon); }

/* --------------------------------------------------------------------------
   Playlist, Rookie, Kontakt
   -------------------------------------------------------------------------- */

.kk-playlist { background: linear-gradient(180deg, rgba(12, 13, 12, 0.94), rgba(10, 22, 14, 0.96)); border-top: 1px solid rgba(125, 255, 168, 0.25); padding: clamp(40px, 6vw, 72px) var(--kk-seite); }
.kk-playlist__innen { display: block; max-width: var(--kk-breite); margin: 0 auto; }
.kk-playlist__kopf { display: block; width: 100%; margin-bottom: 1.5rem; }
.kk-playlist__kopf .kk-ueberzeile { margin: 0; }
.kk-playlist__titel { margin: 0.2rem 0 0; font-weight: 900; font-size: clamp(1.75rem, 4vw, 2.5rem); text-transform: uppercase; line-height: 1.05; }
.kk-playlist__raster { display: grid; gap: 24px; }
@media (min-width: 900px) { .kk-playlist__raster--zwei { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: stretch; } }

/* Eigene Songs */
.kk-tracks { display: flex; flex-direction: column; border-radius: 20px; background: rgba(8, 10, 8, 0.85); box-shadow: var(--kk-rand-neon); overflow: hidden; }
@media (min-width: 900px) { .kk-playlist__raster--zwei .kk-tracks { min-height: 352px; } }
.kk-tracks__kopf { display: flex; align-items: center; gap: 18px; padding: 22px 22px 18px; background: linear-gradient(135deg, rgba(31, 107, 62, 0.55), rgba(31, 107, 62, 0.05) 70%); }
.kk-tracks__cover { width: 88px; height: 88px; flex: none; border-radius: 14px; background: #0c120e; padding: 6px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); object-fit: contain; }
.kk-tracks__info { flex: 1; min-width: 0; }
.kk-tracks__art { margin: 0; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-tracks__name { margin: 2px 0 0; font-weight: 900; font-size: clamp(1.375rem, 3vw, 1.75rem); text-transform: uppercase; line-height: 1.1; }
.kk-tracks__zahl { margin: 4px 0 0; font-size: 0.875rem; color: var(--kk-leise); }
.kk-tracks__start { flex: none; width: 60px; height: 60px; border-radius: 50%; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; background: var(--kk-neon); color: #0b1a10; box-shadow: var(--kk-glow, 0 0 24px rgba(125, 255, 168, 0.45)); transition: transform 0.15s; }
.kk-tracks__start:hover { transform: scale(1.06); }
.kk-tracks__start .kk-musikknopf__pause, .kk-tracks__start[aria-pressed="true"] .kk-musikknopf__play { display: none; }
.kk-tracks__start[aria-pressed="true"] .kk-musikknopf__pause { display: inline-flex; }
.kk-tracks__start span { line-height: 0; }
.kk-tracks__liste { list-style: none; margin: 0; padding: 6px 10px 12px; overflow-y: auto; max-height: 520px; flex: 1; scrollbar-width: thin; scrollbar-color: rgba(125, 255, 168, 0.45) transparent; overscroll-behavior: contain; }
.kk-tracks__liste::-webkit-scrollbar { width: 6px; }
.kk-tracks__liste::-webkit-scrollbar-track { background: transparent; }
.kk-tracks__liste::-webkit-scrollbar-thumb { background: rgba(125, 255, 168, 0.45); border-radius: 3px; }
.kk-track { width: 100%; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 12px; border: 0; border-radius: 12px; background: transparent; color: var(--kk-text); font: inherit; text-align: left; cursor: pointer; }
.kk-track:hover { background: rgba(125, 255, 168, 0.07); }
.kk-track.ist-aktiv { background: rgba(125, 255, 168, 0.1); }
.kk-track__nr { display: flex; justify-content: center; color: var(--kk-leise); font-variant-numeric: tabular-nums; }
.kk-track__nr .kk-eq, .kk-track.ist-aktiv .kk-track__ziffer { display: none; }
.kk-track.ist-aktiv .kk-track__nr .kk-eq { display: inline-flex; }
.kk-track__text { display: flex; flex-direction: column; min-width: 0; }
.kk-track__titel { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kk-track.ist-aktiv .kk-track__titel { color: var(--kk-neon); }
.kk-track__kuenstler { font-size: 0.8125rem; color: var(--kk-leise); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kk-track__dauer { font-size: 0.8125rem; color: var(--kk-leise); font-variant-numeric: tabular-nums; }

/* Spotify-Karte */
.kk-spotifykarte { border-radius: 20px; overflow: hidden; min-height: 300px; display: flex; background: radial-gradient(circle at 85% 15%, rgba(125, 255, 168, 0.22), transparent 55%), linear-gradient(160deg, #1f6b3e 0%, #12321f 55%, #0b140e 100%); box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.25); }
.kk-spotifykarte > * { flex: 1; }
.kk-spotifykarte .kk-einbettung { margin: 0; border-radius: 0; background: transparent; box-shadow: none; min-height: 300px; }
.kk-spotifykarte .kk-einbettung.ist-geladen { min-height: 352px; }
.kk-spotifykarte .kk-einbettung.ist-geladen { background: #121212; }
.kk-spotifykarte__vorschau { display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 28px; position: relative; text-align: left; }
.kk-spotifykarte__vorschau::before { content: ""; position: absolute; top: 24px; right: 24px; width: 96px; height: 96px; background: var(--kk-muster); background-size: 48px 52px; opacity: 0.35; border-radius: 14px; }
.kk-spotifykarte__name { margin: 0; font-weight: 900; font-size: clamp(2rem, 5vw, 3rem); text-transform: uppercase; line-height: 1; color: #fff; }
.kk-spotifykarte__text { margin: 4px 0 14px; color: rgba(255, 255, 255, 0.78); }
.kk-spotifykarte .kk-einbettung__knoepfe { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.kk-spotifykarte .kk-knopf .kk-symbol { margin-right: 4px; }
.kk-spotifykarte .kk-einbettung__platzhalter { background: none; justify-content: flex-end; align-items: stretch; }
.kk-spotifykarte .kk-einbettung__hinweis { margin: 14px 0 0; font-size: 0.75rem; color: rgba(255, 255, 255, 0.6) !important; }
.kk-spotifykarte .kk-einbettung__hinweis a { color: rgba(255, 255, 255, 0.85); }
.kk-spotifykarte .kk-einbettung.ist-geladen { display: flex; }
.kk-spotifykarte iframe { flex: 1 1 auto; align-self: stretch; height: auto !important; min-height: 352px; }
@media (max-width: 600px) {
	.kk-tracks__kopf { padding: 18px 16px 14px; gap: 14px; }
	.kk-tracks__cover { width: 64px; height: 64px; }
	.kk-tracks__start { width: 52px; height: 52px; }
	.kk-spotifykarte__vorschau { padding: 22px; }
	.kk-spotifykarte__vorschau::before { width: 64px; height: 64px; top: 18px; right: 18px; }
}

.kk-rookie {
	max-width: var(--kk-breite); margin: 0 auto; box-sizing: border-box;
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px;
	padding: clamp(1.5rem, 4vw, 2.5rem); border-radius: 24px; background: var(--kk-panel); box-shadow: var(--kk-rand-neon);
}
.kk-rookie__text { flex: 1 1 420px; }
.kk-rookie__titel { margin: 10px 0 0; font-size: clamp(2rem, 5vw, 2.75rem); line-height: 1; }
.kk-rookie p:not(.kk-ueberzeile) { color: var(--kk-leise); margin: 14px 0 0; }
@media (max-width: 600px) { .kk-rookie .kk-knopf { width: 100%; } }

.kk-kontakt { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.kk-kontakt__adresse { margin: 0; color: var(--kk-leise); }

/* --------------------------------------------------------------------------
   Impressum, Datenschutz
   -------------------------------------------------------------------------- */

.kk-recht h2 { font-size: var(--wp--preset--font-size--gross); margin-top: 2.5rem; }
.kk-dse__hinweis { font-size: 0.875rem; color: var(--kk-salbei) !important; }
.kk-dse__inhalt { padding: 18px 22px; border-radius: 16px; background: var(--kk-panel); border: 1px solid var(--kk-linie); }
.kk-dse__inhalt ol { margin: 0; padding-left: 1.3em; columns: 2 240px; }
.kk-steckbrief { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 18px; margin: 1rem 0 0; padding: 18px 22px; border-radius: 16px; background: #121a14; box-shadow: inset 0 0 0 1px var(--kk-linie); }
.kk-steckbrief dt { font-weight: 800; color: var(--kk-salbei); font-size: 0.875rem; }
.kk-steckbrief dd { margin: 0; color: var(--kk-leise); font-size: 0.9375rem; }
@media (max-width: 560px) { .kk-steckbrief { grid-template-columns: 1fr; } .kk-steckbrief dd { margin-bottom: 8px; } }

/* --------------------------------------------------------------------------
   Fußbereich
   -------------------------------------------------------------------------- */

.kk-fuss { background: var(--kk-tief); color: #8fa293; font-size: 0.875rem; }
.kk-fuss__innen {
	max-width: var(--kk-breite); margin: 0 auto; padding: 36px var(--kk-seite) 18px;
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 22px;
}
.kk-fuss__logo { display: inline-flex; align-items: center; gap: 12px; color: var(--kk-text); text-decoration: none; font-weight: 800; }
.kk-fuss__logo img { width: 52px; height: 52px; }
.kk-fuss__links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 22px; }
.kk-fuss__links a { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; color: #b4c3b8; text-decoration: none; }
.kk-fuss__links a:hover { color: var(--kk-neon); }
.kk-fuss__zeile { max-width: var(--kk-breite); margin: 0 auto; padding: 0 var(--kk-seite) 32px; font-size: 0.8125rem; color: #7f9184; }
@media (max-width: 600px) {
	.kk-fuss__innen { flex-direction: column; align-items: flex-start; }
}

/* --------------------------------------------------------------------------
   Editor
   -------------------------------------------------------------------------- */

.editor-styles-wrapper { background-color: var(--kk-keller); }
.kk-editor-leer { padding: 18px; border: 1px dashed #3d4a41; border-radius: 12px; color: var(--kk-salbei); font-size: 0.875rem; }
.kk-editor-block .kk-kopf, .kk-editor-block .kk-mobil { position: static; }

/* --------------------------------------------------------------------------
   Seitenwechsel (swup)
   -------------------------------------------------------------------------- */

#swup { transition: opacity 0.18s; }
html.is-animating #swup { opacity: 0.25; }
@media (prefers-reduced-motion: reduce) { #swup { transition: none; } }

/* --------------------------------------------------------------------------
   Polaroid-Wand (Galerie im Stil „Polaroids“)
   -------------------------------------------------------------------------- */

.kk-polaroidwand {
	list-style: none; margin: 2rem auto 0 !important; padding: 0 !important;
	columns: 3 260px; column-gap: clamp(1.25rem, 3vw, 2.5rem);
	max-width: var(--kk-breite) !important;
}
.kk-polaroidwand > li { break-inside: avoid; margin: 0 0 clamp(1.5rem, 3vw, 2.5rem); padding: 6px; }
.kk-polaroid {
	margin: 0; padding: 12px 12px 36px; background: var(--kk-papier);
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5), 0 0 30px rgba(80, 255, 140, 0.1);
	transform: rotate(-1.5deg);
}
.kk-polaroidwand > li:nth-child(2n) .kk-polaroid { transform: rotate(1.5deg); }
.kk-polaroidwand > li:nth-child(3n) .kk-polaroid { transform: rotate(-0.5deg); }
.kk-polaroid:has(figcaption) { padding-bottom: 0; }
.kk-polaroid__bild { display: block; width: 100%; height: auto; }
.kk-polaroid figcaption {
	padding: 12px 4px 16px; font-family: var(--wp--preset--font-family--schreibmaschine); font-size: 1.05rem; line-height: 1.35; color: #1b1c1b;
}
@media (hover: hover) {
	.kk-polaroid { transition: transform 0.2s; }
	.kk-polaroidwand > li .kk-polaroid:hover { transform: rotate(0) scale(1.02); }
}

/* Fokus nach Seitenwechsel: Überschrift bekommt den Fokus für Screenreader, aber ohne Rahmen. */
[tabindex="-1"]:focus, [tabindex="-1"]:focus-visible { outline: none !important; }

/* Ligatabellen */
.kk-ligatabelle { overflow-x: auto; width: 100%; max-width: var(--wp--style--global--content-size, 760px) !important; margin: 1.25rem auto 1.5rem !important; border-radius: 16px; border: 1px solid var(--kk-linie); background: var(--kk-panel); -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: rgba(125, 255, 168, 0.4) transparent; box-sizing: border-box; }
.kk-ligatabelle::-webkit-scrollbar { height: 6px; }
.kk-ligatabelle::-webkit-scrollbar-track { background: transparent; }
.kk-ligatabelle::-webkit-scrollbar-thumb { background: rgba(125, 255, 168, 0.4); border-radius: 3px; }
.kk-ligatabelle thead { border-bottom: 0 !important; }
.kk-ligatabelle thead th { border-bottom: 1px solid rgba(125, 255, 168, 0.3) !important; }
.kk-ligatabelle table { width: 100%; min-width: 600px; margin: 0; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: 0.875rem; }
.kk-ligatabelle th, .kk-ligatabelle td { padding: 10px 9px; border: 0 !important; border-top: 1px solid #222a25 !important; text-align: right; color: var(--kk-leise); white-space: nowrap; }
.kk-ligatabelle th:nth-child(2), .kk-ligatabelle td:nth-child(2) { text-align: left; white-space: normal; min-width: 150px; }
.kk-ligatabelle th:last-child, .kk-ligatabelle td:last-child { padding-right: 18px; }
.kk-ligatabelle th:first-child, .kk-ligatabelle td:first-child { text-align: center; width: 3em; }
.kk-ligatabelle thead th { border-top: 0 !important; font-size: 0.6875rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-ligatabelle tr:has(strong) td { background: rgba(125, 255, 168, 0.08); color: var(--kk-neon); }
.kk-ligatabelle tr:has(strong) td strong { color: var(--kk-neon); }
.kk-ligatabelle figcaption { padding: 10px 14px 14px; font-size: 0.8125rem; color: #9fb3a5; text-align: left; margin: 0; }

/* Aktuelle Saison */
.kk-saison-aktuell { margin-top: 2.5rem; padding: clamp(20px, 4vw, 32px); border-radius: 20px; background: var(--kk-panel); box-shadow: var(--kk-rand-neon); }
.kk-saison-aktuell > .kk-ueberzeile { margin: 0; }
.kk-saison-aktuell > h2 { margin: 0.25rem 0 0; }
.kk-saison-aktuell__liga { margin: 0.25rem 0 1.25rem; color: var(--kk-salbei); font-weight: 700; }
.kk-saison-aktuell__knoepfe { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.5rem; }

/* --------------------------------------------------------------------------
   Spielseite: Analyse, Spielbericht, Fotos
   -------------------------------------------------------------------------- */
.kk-bericht { padding-top: clamp(1.5rem, 4vw, 2.5rem); }
.kk-spielnavi { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 auto 2rem !important; }
.kk-spielnavi__link { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 16px; border-radius: 999px; background: rgba(125, 255, 168, 0.08); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.35); color: var(--kk-text) !important; font-weight: 700; font-size: 0.875rem; text-decoration: none; transition: background 0.2s, box-shadow 0.2s; }
.kk-spielnavi__link::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--kk-salbei); }
.kk-spielnavi__link--analyse::before { background: #8fc7ff; }
.kk-spielnavi__link--bericht::before { background: var(--kk-neon); }
.kk-spielnavi__link--fotos::before { background: var(--kk-stern); }
.kk-spielnavi__link:hover { background: rgba(125, 255, 168, 0.16); box-shadow: inset 0 0 0 1px var(--kk-neon); }

.kk-spieltext { scroll-margin-top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 24px); margin-top: clamp(2rem, 5vw, 3.5rem) !important; }
.kk-spieltext:first-child, .kk-spielnavi + .kk-spieltext { margin-top: 0 !important; }
.kk-spieltext__ueberzeile { margin: 0 0 0.35rem !important; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.22em; text-transform: uppercase; color: var(--kk-salbei) !important; }
.kk-spieltext > h2 { margin-top: 0 !important; padding-bottom: 0.6rem; border-bottom: 2px solid rgba(125, 255, 168, 0.25); }
.kk-spieltext h3 { margin: 2rem 0 0.6rem; font-size: clamp(1.125rem, 2.4vw, 1.3rem); line-height: 1.25; color: var(--kk-text); }
.kk-spieltext p { line-height: 1.75; }
.kk-spieltext ul, .kk-spieltext ol { padding-left: 0; list-style: none; margin: 1rem 0 1.5rem; }
.kk-spieltext ul > li, .kk-spieltext ol > li { position: relative; padding: 0.5rem 0 0.5rem 1.6rem; border-bottom: 1px solid rgba(125, 255, 168, 0.08); }
.kk-spieltext ul > li::before { content: ""; position: absolute; left: 0.2rem; top: 1.05rem; width: 8px; height: 8px; border-radius: 2px; background: var(--kk-neon); box-shadow: 0 0 10px rgba(125, 255, 168, 0.5); }
.kk-spieltext ol { counter-reset: kk-punkt; }
.kk-spieltext ol > li { counter-increment: kk-punkt; padding-left: 2.2rem; }
.kk-spieltext ol > li::before { content: counter(kk-punkt); position: absolute; left: 0; top: 0.55rem; width: 1.5rem; height: 1.5rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 800; color: #0b1a10; background: var(--kk-neon); }
.kk-spieltext blockquote { margin: 1.5rem 0; padding: 0.5rem 0 0.5rem 1.25rem; border-left: 3px solid var(--kk-neon); font-size: 1.15rem; font-style: italic; }
.kk-spieltext .kk-ueberzeile { display: inline-block; margin: 0.25rem 0 1rem; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.06); font-size: 0.6875rem; letter-spacing: 0.12em; }

/* Analyse als Karte */
.kk-spieltext--analyse { position: relative; padding: clamp(22px, 4vw, 40px); border-radius: 22px; background: linear-gradient(160deg, rgba(143, 199, 255, 0.07), rgba(12, 13, 12, 0.92) 45%); box-shadow: inset 0 0 0 1px rgba(143, 199, 255, 0.22), 0 20px 50px rgba(0, 0, 0, 0.35); }
.kk-spieltext--analyse .kk-spieltext__ueberzeile { color: #8fc7ff !important; }
.kk-spieltext--analyse > h2 { border-bottom-color: rgba(143, 199, 255, 0.25); }
.kk-spieltext--analyse h3 { font-size: 0.8125rem; letter-spacing: 0.16em; text-transform: uppercase; color: #8fc7ff; margin-top: 1.75rem; }

/* Spielbericht als Artikel */
.kk-spieltext--bericht > h2 + p, .kk-spieltext--bericht > h2 + .kk-ueberzeile + p, .kk-spieltext--bericht > h2 + h3 + p { font-size: 1.15rem; color: var(--kk-text); }
.kk-spieltext--bericht h3 { position: relative; padding-left: 16px; }
.kk-spieltext--bericht h3::before { content: ""; position: absolute; left: 0; top: 0.15em; bottom: 0.15em; width: 4px; border-radius: 2px; background: var(--kk-neon); box-shadow: 0 0 12px rgba(125, 255, 168, 0.6); }

/* Aufklappbare Analyse (ältere Spiele) */
.kk-spieltext--klappbar details { border-radius: 18px; background: rgba(12, 13, 12, 0.9); box-shadow: inset 0 0 0 1px rgba(143, 199, 255, 0.25); overflow: hidden; }
.kk-spieltext--klappbar summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; font-weight: 800; font-size: 1.0625rem; color: var(--kk-text); }
.kk-spieltext--klappbar summary::-webkit-details-marker { display: none; }
.kk-spieltext--klappbar summary::after { content: "+"; flex: none; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; color: #0b1a10; background: #8fc7ff; transition: transform 0.25s; }
.kk-spieltext--klappbar details[open] summary::after { transform: rotate(45deg); }
.kk-spieltext--klappbar details > :not(summary) { margin-left: 22px; margin-right: 22px; }
.kk-spieltext--klappbar details > :last-child { margin-bottom: 22px; }

/* Vorheriges / nächstes Spiel */
.kk-spielwechsel { max-width: 900px; margin: clamp(2.5rem, 6vw, 4rem) auto 0; padding: 0 var(--kk-seite) clamp(2.5rem, 6vw, 4rem); }
.kk-spielwechsel__raster { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.kk-spielwechsel__karte { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; border-radius: 18px; background: var(--kk-panel); box-shadow: inset 0 0 0 1px var(--kk-linie); color: var(--kk-text); text-decoration: none; transition: box-shadow 0.2s, transform 0.2s; }
.kk-spielwechsel__karte--nach { text-align: right; }
.kk-spielwechsel__karte:hover { box-shadow: var(--kk-rand-neon); transform: translateY(-2px); color: var(--kk-text); }
.kk-spielwechsel__richtung { font-size: 0.75rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--kk-neon); }
.kk-spielwechsel__gegner { font-weight: 800; font-size: 1.0625rem; overflow-wrap: anywhere; }
.kk-spielwechsel__info { font-size: 0.875rem; color: var(--kk-leise); }
.kk-spielwechsel__saison { text-align: center; margin: 1.25rem 0 0; }
.kk-spielwechsel__saison a { color: var(--kk-neon); font-weight: 700; }
@media (max-width: 560px) { .kk-spielwechsel__raster { grid-template-columns: 1fr; } .kk-spielwechsel__karte--nach { text-align: left; } .kk-spielwechsel__raster > span:empty { display: none; } }

.kk-spieltext > h2 { font-size: clamp(1.6rem, 3.6vw, 2.25rem) !important; line-height: 1.1; }

/* --------------------------------------------------------------------------
   Animationen (nur CSS + ein kleines Skript, keine Bibliothek).
   Alles entfällt bei „Bewegung reduzieren“ im Betriebssystem.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {

	/* Startseite: Headline flackert einmal an wie eine Neonröhre, Logo schwebt. */
	.kk-hero__titel .kk-neon-text { animation: kk-neon-an 1.6s ease-out 0.25s both; }
	.kk-hero__titel { animation: kk-hoch 0.8s cubic-bezier(.2, .7, .2, 1) both; }
	.kk-hero__text > p:first-child { animation: kk-hoch 0.8s cubic-bezier(.2, .7, .2, 1) 0.05s both; }
	.kk-hero__text > p:not(:first-child), .kk-hero__text .wp-block-buttons { animation: kk-hoch 0.8s cubic-bezier(.2, .7, .2, 1) 0.35s both; }
	.kk-hero__logo img { animation: kk-einschweben 1s cubic-bezier(.2, .7, .2, 1) 0.15s both, kk-schweben 7s ease-in-out 1.2s infinite; }

	/* Spielkopf: Ergebnis springt herein. */
	.kk-spielkopf__stand .kk-neon-text { display: inline-block; animation: kk-ergebnis 0.9s cubic-bezier(.2, 1.4, .3, 1) 0.15s both; }
	.kk-spielkopf__logo { animation: kk-einschweben 0.7s cubic-bezier(.2, .7, .2, 1) both; }

	/* Beim Scrollen einblenden (Klassen setzt das Skript). */
	/* translate/scale statt transform, damit gedrehte Polaroids ihre Drehung behalten. */
	.kk-einblenden { opacity: 0; translate: 0 28px; scale: 0.97; transition: opacity 0.7s cubic-bezier(.2, .7, .2, 1), translate 0.7s cubic-bezier(.2, .7, .2, 1), scale 0.7s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--kk-i, 0) * 70ms); }
	.kk-einblenden.ist-sichtbar { opacity: 1; translate: none; scale: none; }

	/* Polaroids: beim Darüberfahren gerade rücken und anheben. */
	.is-style-kk-polaroid:not(.kk-einblenden), .is-style-kk-polaroids .wp-block-image:not(.kk-einblenden), .kk-polaroidwand .kk-polaroid { transition: transform 0.45s cubic-bezier(.2, .8, .2, 1), box-shadow 0.45s; }
	.is-style-kk-polaroid.kk-einblenden.ist-sichtbar { transition: opacity 0.7s, translate 0.7s cubic-bezier(.2, .7, .2, 1), scale 0.7s, transform 0.45s cubic-bezier(.2, .8, .2, 1), box-shadow 0.45s; }
	.is-style-kk-polaroid:hover, .is-style-kk-polaroids .wp-block-image:hover { transform: rotate(0deg) translateY(-6px) scale(1.02) !important; box-shadow: 0 30px 60px rgba(0, 0, 0, 0.6), 0 0 50px rgba(80, 255, 140, 0.22); z-index: 3; }

	/* Knöpfe: Lichtstreif beim Darüberfahren. */
	.kk-knopf, .wp-block-button__link { position: relative; overflow: hidden; isolation: isolate; }
	.kk-knopf::after, .wp-block-button__link::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.28) 50%, transparent 65%); transform: translateX(-120%); transition: transform 0.6s ease; pointer-events: none; }
	.kk-knopf:hover::after, .wp-block-button__link:hover::after { transform: translateX(120%); }

	/* Countdown: Ziffer tickt. */
	.kk-countdown__zahl.ist-neu { animation: kk-tick 0.35s ease-out; }

	/* Leselinie oben auf Spielseiten (Scroll-getriebene Animation, ohne Skript). */
	@supports (animation-timeline: scroll()) {
		html.kk-lesezeile body::before { content: ""; position: fixed; top: var(--kk-admin); left: 0; right: 0; height: 3px; z-index: 200; background: linear-gradient(90deg, var(--kk-gruen), var(--kk-neon)); box-shadow: 0 0 12px rgba(125, 255, 168, 0.7); transform-origin: 0 50%; animation: kk-lesen linear both; animation-timeline: scroll(root); }
	}
}

/* Karten: Lichtkegel folgt dem Mauszeiger (Position setzt das Skript). */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.kk-kachel, .kk-unterseite, .kk-spiel__link, .kk-spielwechsel__karte, .kk-tracks, .kk-saison-aktuell { background-image: radial-gradient(420px circle at var(--kk-mx, -999px) var(--kk-my, -999px), rgba(125, 255, 168, 0.1), transparent 45%); }
}

@keyframes kk-hoch { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes kk-einschweben { from { opacity: 0; transform: translateY(20px) scale(0.92); } to { opacity: 1; transform: none; } }
@keyframes kk-schweben { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes kk-ergebnis { from { opacity: 0; transform: scale(0.6); filter: blur(8px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes kk-tick { 0% { transform: translateY(-30%); opacity: 0.2; } 100% { transform: none; opacity: 1; } }
@keyframes kk-lesen { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes kk-neon-an {
	0% { opacity: 0.1; text-shadow: none; }
	8% { opacity: 1; } 10% { opacity: 0.2; } 14% { opacity: 1; } 22% { opacity: 0.35; } 26% { opacity: 1; }
	100% { opacity: 1; }
}
@media print { .kk-einblenden { opacity: 1 !important; translate: none !important; scale: none !important; } }
@media (max-width: 600px) {
	.kk-spielkopf__team { font-size: clamp(0.8125rem, 3.6vw, 1rem); overflow-wrap: normal; word-break: normal; hyphens: auto; }
	.kk-spielkopf__stand { font-size: clamp(2.25rem, 12vw, 3rem); }
	.kk-spielkopf__paarung { gap: 0.6rem; }
}
@media (max-width: 420px) {
	.kk-spielkopf__team { font-size: 0.75rem; letter-spacing: 0; }
	.kk-spielkopf__stand { font-size: 2.1rem; }
	.kk-spielkopf__paarung { gap: 0.5rem; }
}

/* Individualstatistik */
.kk-spielerstat__rahmen table { min-width: 560px; }
.kk-spielerstat__rahmen tbody th { text-align: left !important; font-weight: 800; color: var(--kk-text); }
.kk-spielerstat__rahmen thead th:first-child { text-align: left !important; }
.kk-spielerstat__quote { display: inline-flex; align-items: center; gap: 10px; justify-content: flex-end; min-width: 120px; }
.kk-spielerstat__balken { display: inline-block; width: 64px; height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--kk-neon) var(--kk-q), rgba(255, 255, 255, 0.1) var(--kk-q)); }
.kk-spielerstat__quelle { margin: 0; padding: 10px 14px 14px; font-size: 0.8125rem; color: #9fb3a5 !important; }
.kk-spielerstat__quelle a { color: var(--kk-neon); }

/* Sonderhefte */
.kk-hefte { list-style: none; padding: 0; margin: 1.5rem auto 2.5rem !important; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: clamp(1.25rem, 3vw, 2rem); perspective: 1200px; }
.kk-heft { display: flex; flex-direction: column; gap: 10px; color: var(--kk-text) !important; text-decoration: none; }
.kk-heft__cover { position: relative; display: block; aspect-ratio: 210 / 297; border-radius: 4px 12px 12px 4px; overflow: hidden; background: #0e1a12; box-shadow: -6px 0 0 rgba(0, 0, 0, 0.35) inset, 0 18px 40px rgba(0, 0, 0, 0.55); transform-origin: left center; transition: transform 0.45s cubic-bezier(.2, .8, .2, 1), box-shadow 0.45s; }
.kk-heft__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kk-heft__cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, 0.35) 0, rgba(255, 255, 255, 0.08) 3%, transparent 8%), linear-gradient(115deg, transparent 55%, rgba(255, 255, 255, 0.12) 60%, transparent 70%); pointer-events: none; }
.kk-heft__cover--ohne { display: flex; flex-direction: column; justify-content: space-between; padding: 18px 16px 18px 22px; background: radial-gradient(circle at 80% 15%, rgba(125, 255, 168, 0.28), transparent 50%), linear-gradient(160deg, #1f6b3e, #0b140e 75%); }
.kk-heft__marke { font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.22em; text-transform: uppercase; color: var(--kk-neon); }
.kk-heft__gross { font-size: clamp(1.6rem, 3vw, 2.1rem); font-weight: 900; line-height: 0.95; text-transform: uppercase; hyphens: manual; }
.kk-heft__jahr { font-size: 1.5rem; font-weight: 900; color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-heft__titel { font-weight: 800; line-height: 1.3; }
.kk-heft__aktion { display: inline-flex; align-items: center; gap: 6px; font-size: 0.8125rem; font-weight: 700; color: var(--kk-neon); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.kk-heft:hover .kk-heft__cover { transform: rotateY(-14deg) translateX(4px); box-shadow: -6px 0 0 rgba(0, 0, 0, 0.35) inset, 18px 24px 50px rgba(0, 0, 0, 0.6), 0 0 40px rgba(80, 255, 140, 0.18); }
}

/* Damals → heute */
.kk-vergleich { display: grid !important; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: clamp(0.75rem, 3vw, 2.5rem); margin: 2rem auto 2.5rem !important; }
.kk-vergleich__seite { margin: 0 !important; }
.kk-vergleich__seite .is-style-kk-polaroid { max-width: 360px; }
.kk-vergleich__seite--heute .is-style-kk-polaroid { transform: rotate(2deg); }
.kk-vergleich__pfeil { color: #0b1a10 !important; margin: 0 !important; width: clamp(44px, 6vw, 64px); height: clamp(44px, 6vw, 64px); border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--kk-neon); color: #0b1a10; box-shadow: var(--kk-glow); }
.kk-vergleich__pfeil .kk-symbol { stroke-width: 2.6; }
@media (max-width: 640px) {
	.kk-vergleich { grid-template-columns: 1fr; justify-items: center; }
	.kk-vergleich__pfeil .kk-symbol { transform: rotate(90deg); }
}
@media (prefers-reduced-motion: no-preference) {
	.kk-vergleich__pfeil { animation: kk-pfeil 2.4s ease-in-out infinite; }
}
@keyframes kk-pfeil { 0%, 100% { translate: 0 0; } 50% { translate: 6px 0; } }
.kk-bilderreihe--klein .is-style-kk-polaroid { max-width: 240px; }

/* Kickerkeller */
.kk-keller { margin: 1.5rem auto 2.5rem !important; }
.kk-keller__gross { margin: 0 !important; }
.kk-keller__gross img { width: 100%; max-height: 78vh; object-fit: cover; object-position: center 22%; border-radius: 22px; box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.35), 0 0 60px rgba(80, 255, 140, 0.25), 0 30px 70px rgba(0, 0, 0, 0.6); }

.kk-spielerkarte__kreis--lang { font-size: 0.8125rem !important; letter-spacing: -0.01em; }
.kk-nav__uebersicht { grid-column: 1 / -1; padding-bottom: 4px; margin-bottom: 2px; border-bottom: 1px solid var(--kk-linie); }
.kk-nav__uebersicht .kk-nav__unter-titel { color: var(--kk-neon); }
.is-style-kk-polaroid.kk-plakat img { aspect-ratio: auto; }
.is-style-kk-polaroid.kk-plakat { max-width: 420px; }
.kk-werbung { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 300px); gap: 2rem; align-items: center; margin: 1.5rem auto 2.5rem !important; }
.kk-werbung > * { margin: 0 !important; }
.kk-werbung .kk-plakat { transform: rotate(2.5deg); }
@media (max-width: 640px) { .kk-werbung { grid-template-columns: 1fr; } .kk-werbung .kk-plakat { max-width: 320px; } }

/* Countdown-Leiste unten */
.kk-leiste { position: fixed; left: 50%; bottom: max(12px, env(safe-area-inset-bottom)); z-index: 150; width: min(calc(100% - 24px), 760px); transform: translateX(-50%); display: flex; align-items: stretch; border-radius: 999px; background: rgba(12, 14, 12, 0.92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.4), 0 12px 40px rgba(0, 0, 0, 0.55), 0 0 30px rgba(80, 255, 140, 0.15); transition: opacity 0.3s, transform 0.3s; }
.kk-leiste[hidden] { display: none; }
.kk-leiste.ist-verdeckt { opacity: 0; transform: translate(-50%, 140%); pointer-events: none; }
.kk-leiste__link { flex: 1; min-width: 0; display: flex; align-items: center; gap: 14px; padding: 9px 8px 9px 18px; color: var(--kk-text) !important; text-decoration: none; }
.kk-leiste__punkt { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--kk-neon); box-shadow: 0 0 10px var(--kk-neon); }
@media (prefers-reduced-motion: no-preference) { .kk-leiste__punkt { animation: kk-puls 1.8s ease-in-out infinite; } }
@keyframes kk-puls { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
.kk-leiste__text { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 4px 12px; flex-wrap: wrap; }
.kk-leiste__label { font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--kk-neon); }
.kk-leiste__gegner { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.kk-leiste__gegner img { width: 22px; height: 22px; }
.kk-leiste__wann { font-size: 0.8125rem; color: var(--kk-leise); white-space: nowrap; }
.kk-leiste__uhrbox { flex: none; display: flex; align-items: center; }
.kk-leiste__uhr { display: flex; gap: 6px; font-variant-numeric: tabular-nums; }
.kk-leiste__uhr > span { display: flex; align-items: baseline; gap: 1px; padding: 4px 7px; border-radius: 8px; background: rgba(125, 255, 168, 0.1); }
.kk-leiste__uhr b { font-weight: 900; color: var(--kk-neon); }
.kk-leiste__uhr i { font-style: normal; font-size: 0.625rem; color: var(--kk-salbei); }
.kk-leiste__uhrbox:has(.kk-leiste__live:not([hidden])) .kk-leiste__uhr { display: none; }
.kk-leiste__live { font-weight: 900; color: var(--kk-neon); text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8125rem; }
.kk-leiste__zu { flex: none; width: 40px; border: 0; border-radius: 0 999px 999px 0; background: transparent; color: var(--kk-leise); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.kk-leiste__zu:hover { color: var(--kk-text); }
html.kk-hat-leiste .kk-fuss { padding-bottom: 84px; }
@media (max-width: 600px) {
	.kk-leiste { border-radius: 18px; }
	.kk-leiste__link { padding: 8px 4px 8px 14px; gap: 10px; }
	.kk-leiste__label { display: none; }
	.kk-leiste__text { flex-direction: column; gap: 0; }
	.kk-leiste__gegner { font-size: 0.875rem; }
	.kk-leiste__wann { font-size: 0.75rem; }
	.kk-leiste__sek { display: none !important; }
	.kk-leiste__uhr { gap: 4px; }
	.kk-leiste__uhr > span { padding: 3px 5px; }
	.kk-leiste__zu { border-radius: 0 18px 18px 0; }
}

/* Instagram (kleine Box) */
.kk-insta { padding: clamp(20px, 4vw, 36px) var(--kk-seite); }
.kk-insta__karte { max-width: 460px; margin: 0 auto; display: flex; align-items: center; gap: 14px; padding: 12px 14px 12px 12px; border-radius: 18px; color: var(--kk-text) !important; text-decoration: none; background: rgba(12, 14, 12, 0.9); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.3); transition: box-shadow 0.25s, transform 0.25s; }
.kk-insta__karte:hover { box-shadow: var(--kk-rand-neon); transform: translateY(-2px); }
.kk-insta__symbol { flex: none; width: 44px; height: 44px; border-radius: 13px; display: flex; align-items: center; justify-content: center; color: #0b1a10; background: linear-gradient(135deg, var(--kk-neon), #2fbf6b); }
.kk-insta__symbol .kk-symbol { width: 24px; height: 24px; }
.kk-insta__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.kk-insta__text .kk-ueberzeile { margin: 0; font-size: 0.625rem; }
.kk-insta__name { font-weight: 800; font-size: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kk-insta__zeile { display: none; }
.kk-insta__knopf { flex: none; padding: 8px 14px !important; min-height: 0 !important; font-size: 0.75rem !important; }
.kk-fuss__insta { display: inline-flex; align-items: center; gap: 6px; }
.kk-mobil__aktionen .kk-symbol { vertical-align: -3px; }
@media (max-width: 420px) { .kk-insta__knopf { font-size: 0 !important; padding: 10px !important; gap: 0 !important; } .kk-insta__name { font-size: 0.9375rem; } }

/* --------------------------------------------------------------------------
   Liveticker
   -------------------------------------------------------------------------- */
.kk-ticker { max-width: 820px; margin: clamp(1.5rem, 4vw, 2.5rem) auto 0; padding: 0 var(--kk-seite); scroll-margin-top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 16px); }
.kk-ticker__kopf { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 18px 22px; border-radius: 20px 20px 0 0; background: linear-gradient(135deg, rgba(31, 107, 62, 0.55), rgba(12, 13, 12, 0.95) 70%); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.3); }
.kk-ticker__kopf .kk-ueberzeile { margin: 0; }
.kk-ticker__titel { margin: 2px 0 0 !important; font-size: clamp(1.25rem, 3vw, 1.6rem) !important; text-transform: uppercase; }
.kk-ticker__status { display: inline-flex; align-items: center; gap: 10px; }
.kk-ticker--live .kk-ticker__status::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: #ff4d4d; box-shadow: 0 0 12px #ff4d4d; }
@media (prefers-reduced-motion: no-preference) { .kk-ticker--live .kk-ticker__status::before { animation: kk-puls 1.4s ease-in-out infinite; } }
.kk-ticker__stand { text-align: right; }
.kk-ticker__punkte { display: block; font-size: clamp(2.25rem, 7vw, 3.25rem); font-weight: 900; line-height: 1; color: var(--kk-neon); text-shadow: var(--kk-glow); font-variant-numeric: tabular-nums; }
.kk-ticker__punkte.ist-neu { animation: kk-ergebnis 0.6s cubic-bezier(.2, 1.4, .3, 1); }
.kk-ticker__info { font-size: 0.8125rem; color: var(--kk-leise); }

.kk-ticker__eingabe { display: grid; gap: 10px; padding: 14px; background: #0b100c; box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.2); }
.kk-ticker__reihe { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.kk-ticker__knopf { min-height: 42px; padding: 8px 14px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, 0.08); color: var(--kk-text); font: inherit; font-weight: 800; font-size: 0.875rem; cursor: pointer; }
.kk-ticker__knopf:hover { background: rgba(125, 255, 168, 0.16); }
.kk-ticker__knopf:disabled { opacity: 0.5; }
.kk-ticker__reihe--status .kk-ticker__knopf { flex: 1 1 0; }
.kk-ticker__knopf--s { background: rgba(125, 255, 168, 0.22); color: var(--kk-neon); }
.kk-ticker__knopf--u { background: rgba(242, 201, 76, 0.18); color: var(--kk-stern); }
.kk-ticker__knopf--n { background: rgba(255, 143, 143, 0.16); color: var(--kk-rot); }
.kk-ticker__feld { display: flex; flex-direction: column; gap: 3px; flex: 1 1 120px; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-ticker__feld--kurz { flex: 0 1 80px; }
.kk-ticker__eingabe input[type=text], .kk-ticker__eingabe textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--kk-linie); border-radius: 12px; background: #050705; color: var(--kk-text); font: inherit; font-size: 1rem; }
.kk-ticker__eingabe input:focus, .kk-ticker__eingabe textarea:focus { outline: 2px solid var(--kk-neon); outline-offset: 1px; }
.kk-ticker__satzknoepfe { display: flex; gap: 6px; flex: 2 1 260px; }
.kk-ticker__satzknoepfe .kk-ticker__knopf { flex: 1 1 0; }
.kk-ticker__reihe--text textarea { flex: 1 1 220px; resize: vertical; min-height: 46px; }
.kk-ticker__foto { position: relative; flex: none; width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.08); color: var(--kk-text); cursor: pointer; }
.kk-ticker__foto input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.hat-foto .kk-ticker__foto { background: var(--kk-neon); color: #0b1a10; }
.kk-ticker__senden { min-height: 46px; }
.kk-ticker__meldung { margin: 0; font-size: 0.8125rem; color: var(--kk-stern); }
.kk-ticker__meldung:empty { display: none; }
.kk-ticker__bericht { margin: 4px 0 0; }

.kk-ticker__liste { list-style: none; margin: 0; padding: 6px 0 0; border-radius: 0 0 20px 20px; background: rgba(12, 13, 12, 0.92); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.2); }
.kk-ticker__liste:empty { display: none; }
.kk-tick { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; padding: 14px 18px; border-top: 1px solid rgba(125, 255, 168, 0.08); }
.kk-tick:first-child { border-top: 0; }
.kk-tick.ist-neu { animation: kk-hoch 0.5s ease-out; }
.kk-tick__zeit { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--kk-salbei); padding-top: 2px; }
.kk-tick__kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 4px; }
.kk-tick__marke { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; background: rgba(255, 255, 255, 0.08); }
.kk-tick--s .kk-tick__marke { background: rgba(125, 255, 168, 0.18); color: var(--kk-neon); }
.kk-tick--u .kk-tick__marke { background: rgba(242, 201, 76, 0.16); color: var(--kk-stern); }
.kk-tick--n .kk-tick__marke { background: rgba(255, 143, 143, 0.14); color: var(--kk-rot); }
.kk-tick--status .kk-tick__marke { background: var(--kk-neon); color: #0b1a10; }
.kk-tick__wer { font-weight: 800; color: var(--kk-text); }
.kk-tick__text { margin: 0 !important; color: var(--kk-text) !important; line-height: 1.6; }
.kk-tick__foto { display: block; margin-top: 10px; max-width: 100%; max-height: 420px; border-radius: 12px; object-fit: cover; }
.kk-tick__weg { align-self: start; width: 30px; height: 30px; border: 0; border-radius: 50%; background: transparent; color: var(--kk-leise); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.kk-tick__weg:hover { background: rgba(255, 143, 143, 0.15); color: var(--kk-rot); }
.kk-ticker__leer { margin: 0; padding: 16px 18px; border-radius: 0 0 20px 20px; background: rgba(12, 13, 12, 0.92); color: var(--kk-leise); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.2); }
@media (max-width: 600px) {
	.kk-tick { grid-template-columns: 44px minmax(0, 1fr) auto; padding: 12px 14px; gap: 10px; }
	.kk-ticker__kopf { padding: 14px 16px; }
	.kk-ticker__reihe--status .kk-ticker__knopf { flex: 1 1 calc(50% - 4px); }
}
.kk-leiste__livestand { flex: none; align-self: center; margin-right: 6px; padding: 4px 12px; border-radius: 10px; font-weight: 900; font-size: 1.25rem; color: var(--kk-neon); background: rgba(125, 255, 168, 0.12); font-variant-numeric: tabular-nums; }
.kk-leiste__link.ist-live .kk-leiste__punkt { background: #ff4d4d; box-shadow: 0 0 10px #ff4d4d; }
.kk-countdown__livepunkt { display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 50%; background: #ff4d4d; box-shadow: 0 0 10px #ff4d4d; vertical-align: 1px; }
.kk-countdown__livestand { margin: 0.25rem 0 0.75rem !important; font-size: clamp(2.75rem, 9vw, 4.5rem); font-weight: 900; line-height: 1; color: var(--kk-neon); text-shadow: var(--kk-glow); font-variant-numeric: tabular-nums; }
.kk-ticker__reihe[hidden] { display: none; }
.kk-ticker__hinweis { margin: 0; font-size: 0.8125rem; color: var(--kk-leise); }

/* Datenschutz-Banner */
.kk-banner { position: fixed; left: max(16px, env(safe-area-inset-left)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 200; width: min(calc(100% - 32px), 480px); max-height: calc(100vh - 32px); overflow-y: auto; padding: 22px 22px 18px; border-radius: 18px; background: rgba(12, 14, 12, 0.96); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.35), 0 18px 50px rgba(0, 0, 0, 0.6); color: var(--kk-text); opacity: 0; transform: translateY(24px); transition: opacity 0.25s, transform 0.25s; }
.kk-banner[hidden] { display: none; }
.kk-banner.ist-offen { opacity: 1; transform: none; }
.kk-banner.ist-ausgeklappt { width: min(calc(100% - 32px), 520px); }
.kk-banner__zu { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--kk-leise); cursor: pointer; }
.kk-banner__zu:hover, .kk-banner__zu:focus-visible { background: var(--kk-flaeche); color: var(--kk-text); }
.kk-banner__titel { margin: 0 40px 8px 0; font-family: var(--wp--preset--font-family--anzeige, inherit); font-size: 1.125rem; font-weight: 700; color: var(--kk-neon); }
.kk-banner__text { margin: 0 0 16px; font-size: 0.875rem; line-height: 1.55; color: var(--kk-leise); }
.kk-banner__text a { color: var(--kk-neon); }
.kk-banner__knoepfe { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.kk-banner__knoepfe .kk-knopf { flex: 1 1 170px; justify-content: center; white-space: nowrap; padding: 10px 14px; font-size: 0.875rem; }
.kk-banner__knoepfe .kk-knopf[hidden] { display: none; }
.kk-banner__einst { flex-basis: 100%; order: 3; padding: 4px 0; border: 0; background: none; color: var(--kk-leise); font: inherit; font-size: 0.8125rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; text-align: center; }
.kk-banner__einst:hover { color: var(--kk-text); }
.kk-banner__gruppen { display: grid; gap: 8px; margin: 0 0 16px; }
.kk-banner__gruppen[hidden] { display: none; }
.kk-banner__gruppe { border: 1px solid var(--kk-linie); border-radius: 12px; background: rgba(255, 255, 255, 0.02); }
.kk-banner__gruppe summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; font-weight: 700; font-size: 0.9375rem; cursor: pointer; list-style: none; }
.kk-banner__gruppe summary::-webkit-details-marker { display: none; }
.kk-banner__gruppe summary::after { content: ""; width: 8px; height: 8px; margin-left: 4px; border-right: 2px solid var(--kk-leise); border-bottom: 2px solid var(--kk-leise); transform: rotate(45deg); transition: transform 0.2s; }
.kk-banner__gruppe[open] summary::after { transform: rotate(-135deg); }
.kk-banner__gruppe summary > span:first-child { flex: 1; }
.kk-banner__gruppe > p { margin: 0; padding: 0 14px 12px; font-size: 0.8125rem; line-height: 1.5; color: var(--kk-leise); }
.kk-banner__immer { font-size: 0.75rem; font-weight: 600; color: var(--kk-salbei); }
.kk-banner__dienst { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 10px 14px 12px; border-top: 1px solid var(--kk-linie); }
.kk-banner__dienst strong { font-size: 0.875rem; }
.kk-banner__dienst p { margin: 2px 0 0; font-size: 0.8125rem; line-height: 1.45; color: var(--kk-leise); }
.kk-schalter { position: relative; flex: none; display: inline-flex; cursor: pointer; }
.kk-schalter input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.kk-schalter__bahn { width: 42px; height: 24px; border-radius: 999px; background: var(--kk-linie); transition: background 0.2s; }
.kk-schalter__bahn::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--kk-text); transition: transform 0.2s; }
.kk-schalter input:checked + .kk-schalter__bahn { background: var(--kk-gruen); box-shadow: 0 0 12px rgba(80, 255, 140, 0.35); }
.kk-schalter input:checked + .kk-schalter__bahn::after { transform: translateX(18px); background: var(--kk-neon); }
.kk-schalter input:focus-visible + .kk-schalter__bahn { outline: 2px solid var(--kk-neon); outline-offset: 2px; }
html.kk-banner-offen .kk-leiste { opacity: 0; pointer-events: none; }
.kk-fuss__knopf { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: none; color: #b4c3b8; font: inherit; cursor: pointer; text-decoration: inherit; }
.kk-fuss__knopf:hover { color: var(--kk-neon); }
@media (max-width: 600px) {
	.kk-banner, .kk-banner.ist-ausgeklappt { left: 12px; right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); width: auto; padding: 18px 16px 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.kk-banner { transition: none; transform: none; }
}
.kk-ticker[hidden] { display: none; }

/* Gegnerlogos immer rund (Logos vom TFVHH sind meist quadratisch mit weißem Rand). */
img.kk-gegnerlogo { aspect-ratio: 1; border-radius: 50%; object-fit: cover; background: #fff; box-shadow: 0 0 0 2px rgba(232, 239, 233, 0.12); }

/* Alte, zwischengespeicherte Seiten: früheren Shop-Knopf im Kopf ausblenden. */
.kk-kopf__shop { display: none !important; }

/* Applaus im Liveticker */
.kk-tick__applaus { display: flex; gap: 8px; margin-top: 10px; }
.kk-applaus { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; min-width: 52px; padding: 4px 12px; border: 1px solid var(--kk-linie); border-radius: 999px; background: rgba(255, 255, 255, 0.03); color: var(--kk-text); font: inherit; font-size: 0.875rem; font-weight: 700; cursor: pointer; transition: border-color 0.2s, background 0.2s; }
.kk-applaus:hover { border-color: rgba(125, 255, 168, 0.5); }
.kk-applaus > span[aria-hidden] { font-size: 1.05rem; line-height: 1; }
.kk-applaus.ist-gedrueckt { border-color: rgba(125, 255, 168, 0.65); background: rgba(125, 255, 168, 0.1); }
.kk-applaus__zahl:empty { display: none; }
.kk-applaus.ist-neu > span[aria-hidden] { animation: kk-applaus 0.45s cubic-bezier(.2, .7, .2, 1.4); }
@keyframes kk-applaus { 0% { transform: scale(1); } 40% { transform: scale(1.5) rotate(-8deg); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .kk-applaus.ist-neu > span[aria-hidden] { animation: none; } }

/* Direkter Vergleich (Spielseite) */
.kk-duell { margin-top: 1.5rem; padding: 22px 26px; border-radius: 18px; background: #121a14; box-shadow: 0 0 0 1px var(--kk-linie); text-align: left; }
.kk-duell__titel { margin: 0 0 14px; font-weight: 900; font-size: 1.125rem; color: var(--kk-text); }
.kk-duell__titel span { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--kk-salbei); margin-left: 0.5em; }
.kk-duell__zahlen { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; }
.kk-duell__zahlen li { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 12px; background: rgba(255, 255, 255, 0.03); }
.kk-duell__zahlen b { font-size: 1.5rem; font-weight: 900; font-variant-numeric: tabular-nums; color: var(--kk-neon); }
.kk-duell__zahlen span { font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--kk-leise); }
.kk-duell__snu b span { font-size: inherit; letter-spacing: 0; text-transform: none; }
.kk-duell__snu .kk-s { color: var(--kk-neon); }
.kk-duell__snu .kk-u { color: var(--kk-stern); }
.kk-duell__snu .kk-n { color: var(--kk-rot); }
.kk-duell__liste { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.kk-duell__spiel { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 4px 12px; border-radius: 999px; border: 1px solid var(--kk-linie); color: var(--kk-leise) !important; font-size: 0.8125rem; text-decoration: none; }
.kk-duell__spiel b { color: var(--kk-text); }
.kk-duell__spiel--sieg { border-color: rgba(125, 255, 168, 0.5); }
.kk-duell__spiel--remis { border-color: rgba(242, 201, 76, 0.5); }
.kk-duell__spiel--niederlage { border-color: rgba(255, 143, 143, 0.5); }
a.kk-duell__spiel:hover { background: rgba(255, 255, 255, 0.05); }
.kk-duell__spiel.ist-aktuell { background: rgba(125, 255, 168, 0.08); }

/* Rekorde */
.kk-rekorde { max-width: var(--kk-breite); margin-inline: auto; }
.kk-rekorde__summen { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.kk-rekorde__summen li { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border-radius: 16px; background: #121a14; box-shadow: 0 0 0 1px var(--kk-linie); }
.kk-rekorde__summen b { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 900; font-variant-numeric: tabular-nums; color: var(--kk-text); }
.kk-rekorde__summen span { font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kk-leise); }
.kk-rekorde__karten { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.kk-rekord { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px 22px 20px; border-radius: 18px; overflow: hidden; background: radial-gradient(circle at 100% 0, rgba(125, 255, 168, 0.14), transparent 55%), #121a14; box-shadow: var(--kk-rand-neon); }
.kk-rekord__titel { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-rekord__wert { font-size: clamp(2rem, 5vw, 2.75rem); font-weight: 900; line-height: 1.05; color: var(--kk-neon); text-shadow: var(--kk-glow); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kk-rekord__text { font-size: 0.875rem; color: var(--kk-leise) !important; }
a.kk-rekord__text { text-decoration: underline; text-underline-offset: 3px; }
a.kk-rekord__text:hover { color: var(--kk-neon) !important; }
.kk-rekorde__quelle { margin-top: 1.25rem; font-size: 0.8125rem; color: var(--kk-leise); }

/* Spielerkarten verlinken aufs Profil (Link über die ganze Karte) */
.kk-spielerkarte { position: relative; }
.kk-spielerkarte__link { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.kk-spielerkarte__link:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 3px; }
.kk-spielerkarte:has(.kk-spielerkarte__link:hover) { transform: translateY(-3px); box-shadow: var(--kk-rand-neon); }

/* Spielerprofil */
.kk-profil { max-width: 980px; margin: 0 auto; padding: clamp(2.5rem, 6vw, 4.5rem) var(--kk-seite) clamp(2rem, 5vw, 3.5rem); }
.kk-profil__kopf { display: flex; align-items: center; gap: clamp(18px, 4vw, 36px); flex-wrap: wrap; }
.kk-profil__bild, .kk-profil__kreis { flex: none; width: clamp(110px, 18vw, 160px); height: clamp(110px, 18vw, 160px); border-radius: 50%; object-fit: cover; box-shadow: var(--kk-rand-neon); }
.kk-profil__kreis { display: grid; place-items: center; background: #121a14; font-weight: 900; font-size: clamp(2.2rem, 5vw, 3.2rem); color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-profil__name { margin: 0.1em 0 0.15em; font-size: clamp(2.4rem, 7vw, 4rem); line-height: 1; text-transform: uppercase; }
.kk-profil__fakten { margin: 0; color: var(--kk-leise); }
.kk-profil__text { margin-top: 1.5rem; max-width: 65ch; }
.kk-profil__karten { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.kk-profil__karten li { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border-radius: 16px; background: #121a14; box-shadow: 0 0 0 1px var(--kk-linie); }
.kk-profil__karten span { font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-profil__karten b { font-size: clamp(1.8rem, 4vw, 2.4rem); font-weight: 900; color: var(--kk-neon); font-variant-numeric: tabular-nums; }
.kk-profil__karten small { color: var(--kk-leise); font-size: 0.8125rem; }
.kk-profil__titel { margin: 2.5rem 0 1rem; font-size: clamp(1.4rem, 3vw, 1.9rem); text-transform: uppercase; }
.kk-profil__tabelle th small { display: block; font-weight: 400; font-size: 0.75rem; color: var(--kk-leise); }
.kk-profil__quelle { margin-top: 0.75rem; font-size: 0.8125rem; color: var(--kk-leise); }
.kk-profil__partner { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.kk-profil__partner li { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, 0.03); box-shadow: 0 0 0 1px var(--kk-linie); }
.kk-profil__partner b { font-size: 1.25rem; color: var(--kk-text); }
.kk-profil__partner span { font-size: 0.8125rem; color: var(--kk-leise); }

/* Saisonrückblick (wischbare Karten) */
.kk-rueckblick { max-width: var(--kk-breite); margin: 1.5rem auto 2.5rem !important; }
.kk-rueckblick__kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.kk-rueckblick__titel { margin: 0; font-weight: 900; font-size: clamp(1.25rem, 3vw, 1.6rem); text-transform: uppercase; color: var(--kk-text); }
.kk-rueckblick__steuer { display: flex; gap: 8px; }
.kk-rueckblick__knopf { width: 44px; height: 44px; border-radius: 50%; border: 0; background: transparent; color: var(--kk-neon); font-size: 1.6rem; line-height: 1; cursor: pointer; box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.6); }
.kk-rueckblick__knopf:hover { background: rgba(125, 255, 168, 0.08); }
.kk-rueckblick__karten { list-style: none; margin: 0; padding: 4px 4px 12px; display: grid; grid-auto-flow: column; grid-auto-columns: min(78vw, 320px); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; scrollbar-width: none; }
.kk-rueckblick__karten::-webkit-scrollbar { display: none; }
.kk-rueckblick__karten:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 4px; border-radius: 22px; }
.kk-rbkarte { position: relative; scroll-snap-align: start; aspect-ratio: 4 / 5; display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; padding: 26px 24px; border-radius: 22px; overflow: hidden; background: radial-gradient(circle at 85% 12%, rgba(125, 255, 168, 0.28), transparent 50%), linear-gradient(160deg, #1f6b3e 0%, #12321f 55%, #0b140e 100%); box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.3), 0 18px 40px rgba(0, 0, 0, 0.35); color: #fff; }
.kk-rbkarte:nth-child(3n+2) { background: radial-gradient(circle at 15% 85%, rgba(242, 201, 76, 0.22), transparent 55%), linear-gradient(200deg, #173d27 0%, #0f1f15 60%, #0b0f0c 100%); }
.kk-rbkarte:nth-child(3n) { background: radial-gradient(circle at 80% 80%, rgba(125, 255, 168, 0.2), transparent 50%), linear-gradient(140deg, #0d1a11 0%, #1f5a35 100%); }
.kk-rbkarte::before { content: ""; position: absolute; inset: auto -40px -40px auto; width: 180px; height: 180px; background: var(--kk-muster); background-size: 48px 52px; opacity: 0.12; transform: rotate(-12deg); pointer-events: none; }
.kk-rbkarte__nr { position: absolute; top: 18px; right: 20px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; color: rgba(255, 255, 255, 0.55); }
.kk-rbkarte__label { font-size: 0.8125rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--kk-neon); }
.kk-rbkarte { container-type: inline-size; }
.kk-rbkarte__wert { font-size: clamp(2.2rem, 17cqi, 4.4rem); font-weight: 900; line-height: 0.95; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: #fff; text-shadow: var(--kk-glow); white-space: nowrap; }
.kk-rbkarte__wert:not(:has(*)) { overflow-wrap: normal; }
.kk-rbkarte__einheit { font-size: 1.25rem; font-weight: 800; text-transform: uppercase; }
.kk-rbkarte__text { font-size: 0.9375rem; line-height: 1.45; color: rgba(255, 255, 255, 0.82); }
.kk-rbkarte__gross { color: #fff; font-size: clamp(2rem, 14cqi, 3.2rem); font-weight: 900; line-height: 1; text-transform: uppercase; }
.kk-rbkarte--intro { justify-content: center; }
.kk-rbkarte__logo { width: 96px; height: 96px; margin-bottom: 8px; filter: drop-shadow(0 0 18px rgba(80, 255, 140, 0.45)); }
.kk-rbkarte__hinweis { margin-top: auto; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); }
.kk-rbkarte--liste { justify-content: flex-start; padding-top: 48px; }
.kk-rbkarte__liste { margin: 6px 0 0; padding-left: 1.1em; display: grid; gap: 10px; font-size: 0.9375rem; line-height: 1.4; }
.kk-rbkarte--outro { justify-content: center; text-align: left; }
.kk-rbkarte__teilen { margin-top: 14px; align-self: flex-start; }
.kk-rbkarte__meldung { min-height: 1.2em; font-size: 0.8125rem; color: rgba(255, 255, 255, 0.75); }
.kk-rueckblick__punkte { display: flex; justify-content: center; gap: 6px; margin-top: 6px; }
.kk-rueckblick__punkt { width: 7px; height: 7px; border-radius: 50%; background: var(--kk-linie); transition: width 0.25s, background 0.25s; }
.kk-rueckblick__punkt.ist-aktiv { width: 22px; border-radius: 4px; background: var(--kk-neon); }
@media (prefers-reduced-motion: reduce) { .kk-rueckblick__karten { scroll-behavior: auto; } }
.kk-spielkopf__teilen { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; margin: 1.25rem 0 0; }
.kk-spielkopf__teilen .kk-knopf { min-height: 40px; padding: 0.5rem 1rem; font-size: 0.75rem; }
.kk-spielkopf__meldung { flex-basis: 100%; text-align: center; font-size: 0.8125rem; color: var(--kk-leise); }
.kk-spielkopf__meldung:empty { display: none; }
.kk-countdown__teilen { margin: 14px 0 0; }
.kk-countdown__teilen-knopf { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0.45rem 1rem; border-radius: 999px; font-size: 0.8125rem; font-weight: 700; color: var(--kk-neon) !important; text-decoration: none; box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.5); }
.kk-countdown__teilen-knopf:hover { background: rgba(125, 255, 168, 0.08); }

/* Spielerprofil: alles in einem festen Kasten, damit das Muster nicht durchscheint */
.kk-profil { box-sizing: border-box; max-width: 1020px; margin: clamp(1.5rem, 4vw, 3rem) auto; padding: clamp(1.5rem, 4vw, 3rem); border-radius: 28px; background: #101210; box-shadow: 0 0 0 1px var(--kk-linie), 0 24px 60px rgba(0, 0, 0, 0.45); }
.kk-profil__karten li, .kk-profil__partner li { background: #161a16; }
.kk-profil__rahmen { background: #0c0d0c; border-radius: 18px; }
.kk-profil__tabelle { background: transparent; }
.kk-profil__tabelle td, .kk-profil__tabelle th { color: var(--kk-text); }
.kk-profil__tabelle tbody tr:nth-child(odd) { background: rgba(255, 255, 255, 0.025); }
@media (max-width: 700px) {
	.kk-profil { margin: 1rem 12px; padding: 1.4rem 1.1rem; border-radius: 22px; }
	.kk-profil__kopf { flex-direction: column; align-items: flex-start; gap: 14px; }
	.kk-profil__karten { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.kk-profil__karten li { padding: 14px; }
	.kk-profil__karten b { font-size: 1.7rem; }
	/* Tabelle wird zu einer Karte je Saison. */
	.kk-profil__rahmen { overflow: visible; background: transparent; box-shadow: none; border: 0; }
	.kk-profil__tabelle, .kk-profil__tabelle tbody, .kk-profil__tabelle tr, .kk-profil__tabelle th, .kk-profil__tabelle td { display: block; width: auto; }
	.kk-profil__tabelle thead { display: none; }
	.kk-profil__tabelle tr { margin-bottom: 12px; padding: 14px 16px; border-radius: 16px; background: #161a16 !important; box-shadow: 0 0 0 1px var(--kk-linie); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
	.kk-profil__tabelle th[scope="row"] { grid-column: 1 / -1; padding: 0 0 6px; border: 0; font-size: 1.15rem; color: var(--kk-neon); }
	.kk-profil .kk-profil__tabelle td, .kk-profil .kk-profil__tabelle th { padding: 0 !important; border: 0 !important; text-align: left; font-size: 0.9375rem; font-variant-numeric: tabular-nums; background: none; }
	.kk-profil .kk-profil__tabelle th[scope="row"] { padding-bottom: 6px !important; font-size: 1.15rem; }
	.kk-profil__tabelle td::before { content: attr(data-label); display: block; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-salbei); }
	.kk-profil__partner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.kk-profil__aktuell { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: rgba(125, 255, 168, 0.14); color: var(--kk-neon); font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; vertical-align: middle; }
.kk-musikleiste__zu { margin-left: 6px; opacity: 0.75; }
.kk-musikleiste__zu:hover { opacity: 1; }
/* Polaroid ohne Bildunterschrift: trotzdem der breite weiße Rand unten. */
.is-style-kk-polaroid:not(:has(figcaption)) { padding-bottom: clamp(44px, 12%, 64px) !important; }

/* ---------- Kickerkeller-Arcade ---------- */
.kk-arcade { box-sizing: border-box; max-width: 860px; margin: clamp(1.5rem, 4vw, 2.5rem) auto !important; padding: clamp(1.4rem, 4vw, 2.5rem); border-radius: 28px; background: #101210; box-shadow: 0 0 0 1px var(--kk-linie), 0 24px 60px rgba(0, 0, 0, 0.45); scroll-margin-top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 16px); }
.kk-arcade__kopf .kk-ueberzeile { margin: 0 0 0.4rem; }
.kk-arcade__titel { margin: 0 0 0.6rem; font-size: clamp(1.5rem, 4vw, 2.1rem); line-height: 1.15; }
.kk-arcade__text { margin: 0; color: var(--kk-leise); max-width: 62ch; }
.kk-arcade__buehne { margin-top: 1.4rem; }
.kk-arcade__start { min-width: 200px; }
.kk-arcade__frage { margin: 0 0 0.9rem; font-weight: 700; }
.kk-arcade__knoepfe { display: flex; flex-wrap: wrap; gap: 10px; }
.kk-arcade__knoepfe .kk-knopf { flex: 0 1 auto; }
/* Quiz und Test */
.kk-quiz__kopf { display: flex; justify-content: space-between; gap: 12px; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-quiz__punkte { color: var(--kk-neon); }
.kk-quiz__zeit { height: 6px; margin: 10px 0 18px; border-radius: 999px; background: #222823; overflow: hidden; }
.kk-quiz__zeit span { display: block; height: 100%; background: var(--kk-neon); box-shadow: 0 0 12px rgba(80, 255, 140, 0.6); transform-origin: left center; }
.kk-quiz__zeit--fortschritt span { transition: transform 0.3s; }
.kk-quiz__frage { margin: 0 0 1rem; font-size: clamp(1.1rem, 3vw, 1.35rem); font-weight: 700; line-height: 1.35; }
.kk-quiz__antworten { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.kk-quiz__antwort { padding: 14px 16px; border: 0; border-radius: 14px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-text); font: inherit; font-size: 1rem; line-height: 1.35; text-align: left; cursor: pointer; transition: box-shadow 0.15s, background-color 0.15s; }
.kk-quiz__antwort:hover:not(:disabled), .kk-quiz__antwort:focus-visible { background: #1d241f; box-shadow: inset 0 0 0 1px var(--kk-neon); outline: none; }
.kk-quiz__antwort:disabled { cursor: default; opacity: 0.6; }
.kk-quiz__antwort.ist-richtig { opacity: 1; background: rgba(125, 255, 168, 0.12); box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-quiz__antwort.ist-falsch { opacity: 1; background: rgba(255, 143, 143, 0.1); box-shadow: inset 0 0 0 2px var(--kk-rot); }
.kk-quiz__info { margin: 1rem 0; color: var(--kk-leise); }
.kk-quiz__info strong { color: var(--kk-text); }
/* Spielfelder */
.kk-spielfeld { display: flex; flex-direction: column; align-items: center; }
.kk-spielfeld__canvas { display: block; width: 100%; height: auto; border-radius: 18px; box-shadow: 0 0 0 1px var(--kk-linie), 0 14px 40px rgba(0, 0, 0, 0.5); touch-action: none; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; cursor: crosshair; }
.kk-spielfeld__canvas:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 3px; }
.kk-spielfeld--schuss .kk-spielfeld__canvas { aspect-ratio: 600 / 760; max-width: min(100%, calc((100svh - 230px) * 600 / 760)); }
.kk-spielfeld--duell .kk-spielfeld__canvas { aspect-ratio: 600 / 1000; max-width: min(100%, calc((100svh - 260px) * 0.6)); }
.kk-spielfeld__anzeige { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; width: 100%; max-width: min(100%, calc((100svh - 260px) * 0.6)); margin-bottom: 10px; }
.kk-spielfeld__stand { margin: 0; font-size: 1rem; font-weight: 700; color: var(--kk-leise); }
.kk-spielfeld__stand b { margin: 0 4px; color: var(--kk-neon); font-size: 1.4rem; font-variant-numeric: tabular-nums; text-shadow: var(--kk-glow); }
.kk-spielfeld__stufe { font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-spielfeld__hinweis { margin: 12px 0 0; max-width: 46ch; color: var(--kk-leise); font-size: 0.875rem; text-align: center; }
/* Ergebnis */
.kk-arcade__ergebnis { text-align: center; }
.kk-arcade__ergebnis .kk-ueberzeile { margin: 0; }
.kk-arcade__wert { margin: 0.2rem 0 0; color: var(--kk-neon); font-size: clamp(2.6rem, 10vw, 4.2rem); font-weight: 900; line-height: 1.05; text-shadow: var(--kk-glow); overflow-wrap: anywhere; }
.kk-arcade__einheit { margin: 0.4rem 0 0; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.kk-arcade__emoji { margin: 0.6rem 0 0; font-size: 2rem; letter-spacing: 0.15em; }
.kk-arcade__erklaerung { max-width: 52ch; margin: 0.9rem auto 0; color: var(--kk-leise); }
.kk-arcade__ergebnis .kk-arcade__knoepfe { justify-content: center; margin-top: 1.3rem; }
.kk-arcade__eintragen { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: 10px; max-width: 520px; margin: 1.5rem auto 0; padding: 1rem; border-radius: 16px; background: #161a17; box-shadow: inset 0 0 0 1px var(--kk-linie); }
.kk-arcade__eintragen label { display: flex; flex-direction: column; gap: 6px; flex: 1 1 220px; font-size: 0.875rem; color: var(--kk-leise); text-align: left; }
.kk-arcade__eintragen input { box-sizing: border-box; width: 100%; padding: 12px 14px; border: 0; border-radius: 12px; background: #0c0d0c; box-shadow: inset 0 0 0 1px #3d4a41; color: var(--kk-text); font: inherit; font-size: 1rem; }
.kk-arcade__eintragen input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-arcade__eintragen small { flex-basis: 100%; color: var(--kk-leise); opacity: 0.8; }
.kk-arcade__meldung { min-height: 1.4em; margin: 0.8rem 0 0; color: var(--kk-salbei); }
/* Bestenliste */
.kk-arcade__liste { margin-top: 1.8rem; padding-top: 1.4rem; border-top: 1px solid var(--kk-linie); }
.kk-arcade__listentitel { margin: 0 0 0.6rem; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-arcade__liste ol { margin: 0; padding: 0; list-style: none; counter-reset: kkplatz; }
.kk-arcade__liste li { display: grid; grid-template-columns: 2.2em minmax(0, 1fr) auto auto; align-items: baseline; gap: 10px; padding: 8px 0; border-bottom: 1px solid #1f2621; counter-increment: kkplatz; }
.kk-arcade__liste li::before { content: counter(kkplatz) "."; color: var(--kk-salbei); font-weight: 800; font-variant-numeric: tabular-nums; }
.kk-arcade__liste li:first-child::before { color: var(--kk-stern); }
.kk-arcade__liste li.kk-arcade__leer { display: block; color: var(--kk-leise); }
.kk-arcade__liste li.kk-arcade__leer::before { content: none; }
.kk-arcade__name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kk-arcade__extra { color: var(--kk-leise); font-size: 0.8125rem; white-space: nowrap; }
.kk-arcade__liste b { color: var(--kk-neon); font-variant-numeric: tabular-nums; }
@media (max-width: 600px) {
	.kk-arcade { margin: 1rem 12px !important; padding: 1.3rem 1rem; border-radius: 22px; }
	.kk-arcade__start { width: 100%; }
	.kk-arcade__wahl .kk-knopf { width: 100%; }
	.kk-arcade__liste li { grid-template-columns: 2em minmax(0, 1fr) auto; }
	.kk-arcade__extra { grid-column: 2; grid-row: 2; margin-top: -6px; }
	.kk-arcade__liste b { grid-column: 3; grid-row: 1; }
}
/* Kellerduell am Handy: Steuerleiste für zwei Daumen */
.kk-steuerung { display: flex; gap: 10px; width: 100%; max-width: 520px; margin-top: 12px; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-steuerung__flaeche { flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between; min-height: 68px; padding: 0 18px; border-radius: 18px; background: repeating-linear-gradient(90deg, #161a17 0 14px, #1a201c 14px 16px); box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-salbei); font-size: 1.9rem; font-weight: 800; touch-action: none; -webkit-tap-highlight-color: transparent; }
.kk-steuerung__flaeche.ist-aktiv { box-shadow: inset 0 0 0 2px var(--kk-neon); color: var(--kk-neon); }
.kk-steuerung__text { font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; }
.kk-steuerung__schuss { flex: 0 0 108px; min-height: 68px; border: 0; border-radius: 18px; background: var(--kk-gruen); box-shadow: 0 0 0 1px var(--kk-neon), 0 0 22px rgba(80, 255, 140, 0.35); color: #fff; font: inherit; font-size: 0.9375rem; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; touch-action: none; -webkit-tap-highlight-color: transparent; transition: transform 0.06s, background-color 0.06s; }
.kk-steuerung__schuss.ist-aktiv { transform: scale(0.95); background: #2a9a58; }
.kk-spielfeld--duell .kk-spielfeld__canvas { -webkit-touch-callout: none; }
@media (pointer: coarse) {
	.kk-spielfeld--duell .kk-spielfeld__canvas, .kk-spielfeld--duell .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 185px) * 0.6)); }
	.kk-spielfeld--duell .kk-spielfeld__anzeige { margin-bottom: 6px; }
	.kk-spielfeld--duell .kk-spielfeld__hinweis { font-size: 0.8125rem; }
}
/* Während eines Kellerduells verschwinden die schwebenden Leisten. */
html.kk-arcade-aktiv .kk-leiste, html.kk-arcade-aktiv [data-kk-musikleiste] { opacity: 0 !important; visibility: hidden; pointer-events: none; }
.kk-spielfeld__stand { white-space: nowrap; }
@media (pointer: coarse) {
	.kk-spielfeld--duell .kk-spielfeld__anzeige { max-width: 520px; }
	.kk-spielfeld--duell .kk-spielfeld__stand b { font-size: 1.25rem; }
	.kk-steuerung { margin-top: 10px; }
	.kk-steuerung__flaeche, .kk-steuerung__schuss { min-height: 62px; }
}
.kk-spielfeld__stufe { white-space: nowrap; }
/* Kickerfiguren als Spielerbild */
.kk-figur { display: block; width: 100%; height: 100%; }
.kk-spielerkarte__figur { display: block; width: 72px; height: 72px; margin-bottom: 8px; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 2px rgba(125, 255, 168, 0.35); transition: box-shadow 0.2s, transform 0.2s; }
.kk-spielerkarte:hover .kk-spielerkarte__figur { box-shadow: 0 0 0 2px var(--kk-neon), 0 0 22px rgba(80, 255, 140, 0.35); }
.kk-profil__figur { flex: none; display: block; width: clamp(110px, 18vw, 160px); height: clamp(110px, 18vw, 160px); border-radius: 50%; overflow: hidden; box-shadow: var(--kk-rand-neon); }
@media (max-width: 500px) { .kk-spielerkarte__figur { width: 66px; height: 66px; } }
@media (min-width: 501px) { .kk-spielerkarte__figur { width: 88px; height: 88px; } }
/* Torwart-Duell */
.kk-spielfeld--torwart .kk-spielfeld__canvas { aspect-ratio: 600 / 820; max-width: min(100%, calc((100svh - 260px) * 600 / 820)); }
.kk-spielfeld--torwart .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 260px) * 600 / 820)); }
@media (pointer: coarse) {
	.kk-spielfeld--torwart .kk-spielfeld__canvas, .kk-spielfeld--torwart .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 150px) * 600 / 820)); }
}
/* Wer war's? */
.kk-raten__karte { padding: 1.1rem 1.2rem; border-radius: 16px; background: #161a17; box-shadow: inset 0 0 0 1px var(--kk-linie); }
.kk-raten__frage { margin: 0 0 0.6rem; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-raten__hinweise { margin: 0 0 0.9rem; padding: 0; list-style: none; }
.kk-raten__hinweise li { position: relative; padding: 6px 0 6px 22px; font-size: 1.05rem; line-height: 1.4; border-bottom: 1px dashed #26302a; }
.kk-raten__hinweise li:last-child { border-bottom: 0; }
.kk-raten__hinweise li::before { content: ""; position: absolute; left: 2px; top: 0.95em; width: 9px; height: 9px; border-radius: 50%; background: var(--kk-neon); box-shadow: 0 0 8px rgba(80, 255, 140, 0.7); }
.kk-raten__mehr { font-size: 0.75rem; padding: 10px 16px; }
.kk-raten__auswahl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 1rem; }
.kk-raten__antwort { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 12px 6px; border: 0; border-radius: 16px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-text); font: inherit; font-weight: 800; cursor: pointer; transition: box-shadow 0.15s, background-color 0.15s, opacity 0.15s; }
.kk-raten__antwort:hover:not(:disabled), .kk-raten__antwort:focus-visible { background: #1d241f; box-shadow: inset 0 0 0 1px var(--kk-neon); outline: none; }
.kk-raten__antwort:disabled { cursor: default; opacity: 0.55; }
.kk-raten__antwort.ist-richtig { opacity: 1; background: rgba(125, 255, 168, 0.12); box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-raten__antwort.ist-falsch { opacity: 1; background: rgba(255, 143, 143, 0.1); box-shadow: inset 0 0 0 2px var(--kk-rot); }
.kk-raten__figur { display: block; width: 72px; height: 72px; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 2px rgba(125, 255, 168, 0.35); }
.kk-raten__name { font-size: 0.9375rem; overflow-wrap: anywhere; text-align: center; }
.kk-quiz__info a { color: var(--kk-neon); }
@media (max-width: 600px) {
	.kk-raten__auswahl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kk-raten__hinweise li { font-size: 1rem; }
}
.kk-raten__tipp { margin: -0.3rem 0 0.6rem; font-size: 0.8125rem; color: var(--kk-leise); }
/* Keller-Memory */
.kk-memo__kopf { margin-bottom: 12px; }
.kk-memo__gitter { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; max-width: 560px; margin: 0 auto; }
.kk-memo__karte { position: relative; aspect-ratio: 3 / 4; padding: 0; border: 0; background: none; cursor: pointer; perspective: 800px; -webkit-tap-highlight-color: transparent; }
.kk-memo__karte:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 3px; border-radius: 14px; }
.kk-memo__innen { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform 0.45s cubic-bezier(.2, .7, .2, 1); }
.kk-memo__karte.ist-offen .kk-memo__innen, .kk-memo__karte.ist-gefunden .kk-memo__innen { transform: rotateY(180deg); }
.kk-memo__rueck, .kk-memo__vorn { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border-radius: 14px; -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; }
.kk-memo__rueck { background: repeating-linear-gradient(0deg, #133a25 0 18%, #164530 18% 19%), #133a25; box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.35); }
.kk-memo__rueck img { width: 58%; height: auto; opacity: 0.9; filter: drop-shadow(0 0 8px rgba(80, 255, 140, 0.35)); }
.kk-memo__karte:hover:not(:disabled) .kk-memo__rueck { box-shadow: inset 0 0 0 2px var(--kk-neon), 0 0 18px rgba(80, 255, 140, 0.3); }
.kk-memo__vorn { transform: rotateY(180deg); padding: 6px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-text); }
.kk-memo__figur { display: block; width: 82%; aspect-ratio: 1; border-radius: 50%; overflow: hidden; }
.kk-memo__vorn--figur:only-child .kk-memo__figur { width: 92%; }
.kk-memo__name { font-size: 0.8125rem; font-weight: 800; line-height: 1.1; text-align: center; overflow-wrap: anywhere; }
.kk-memo__gross { font-size: clamp(0.95rem, 3.6vw, 1.3rem); font-weight: 900; line-height: 1.1; text-align: center; overflow-wrap: anywhere; color: var(--kk-neon); }
.kk-memo__team { max-width: 100%; font-size: 0.5625rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; text-align: center; overflow-wrap: anywhere; color: var(--kk-salbei); }
.kk-memo__karte.ist-gefunden { cursor: default; }
.kk-memo__karte.ist-gefunden .kk-memo__vorn { background: rgba(125, 255, 168, 0.1); box-shadow: inset 0 0 0 2px var(--kk-neon), 0 0 18px rgba(80, 255, 140, 0.25); }
@media (prefers-reduced-motion: reduce) { .kk-memo__innen { transition: none; } }
@media (max-width: 420px) { .kk-memo__gitter { gap: 7px; } .kk-memo__name { font-size: 0.6875rem; } }
/* Jet-Schuss */
.kk-jet__feld { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 300px; margin-top: 12px; padding: 18px; border-radius: 20px; background: linear-gradient(#14402a, #0d2b1c); box-shadow: 0 0 0 1px var(--kk-linie); cursor: pointer; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; touch-action: manipulation; -webkit-tap-highlight-color: transparent; transition: background-color 0.1s, box-shadow 0.1s; }
.kk-jet__feld:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 3px; }
.kk-jet__szene { width: min(100%, 320px); height: auto; overflow: visible; }
.kk-jet__ball { transition: none; }
.kk-jet__figur { transform-origin: 150px 144px; }
.kk-jet__feld.ist-warten .kk-jet__figur { animation: kk-jet-zittern 0.6s ease-in-out infinite; }
.kk-jet__feld.ist-los { background: linear-gradient(#1f6b3e, #14402a); box-shadow: 0 0 0 2px var(--kk-neon), 0 0 40px rgba(80, 255, 140, 0.45); }
.kk-jet__feld.ist-los .kk-jet__ball, .kk-jet__feld.ist-treffer .kk-jet__ball { transform: translateY(-96px); transition: transform 0.12s ease-in; }
.kk-jet__feld.ist-los .kk-jet__figur { transform: scaleY(1.12) translateY(-6px); }
.kk-jet__feld.ist-fehlstart { box-shadow: 0 0 0 2px var(--kk-rot); }
.kk-jet__text { margin: 10px 0 0; min-height: 1.6em; font-size: clamp(1.1rem, 4vw, 1.5rem); font-weight: 900; text-align: center; color: var(--kk-text); }
.kk-jet__feld.ist-los .kk-jet__text { color: var(--kk-neon); text-shadow: var(--kk-glow); font-size: clamp(1.6rem, 7vw, 2.4rem); }
.kk-jet__feld.ist-fehlstart .kk-jet__text { color: var(--kk-rot); }
.kk-jet__zeiten { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.kk-jet__zeiten li { padding: 4px 10px; border-radius: 999px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; font-weight: 800; font-variant-numeric: tabular-nums; }
@keyframes kk-jet-zittern { 0%, 100% { transform: none; } 50% { transform: translateX(1.5px); } }
@media (prefers-reduced-motion: reduce) { .kk-jet__feld.ist-warten .kk-jet__figur { animation: none; } }
/* Höher oder tiefer */
.kk-hoeher__buehne { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; margin-top: 12px; }
.kk-hoeher__karte { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 12px; border-radius: 18px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; text-align: center; transition: box-shadow 0.2s, background-color 0.2s; }
.kk-hoeher__gegner { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.kk-hoeher__logo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; background: #fff; box-shadow: 0 0 0 2px rgba(125, 255, 168, 0.35); }
.kk-hoeher__name { font-weight: 900; font-size: 1.05rem; line-height: 1.2; overflow-wrap: anywhere; }
.kk-hoeher__info { margin: 0; font-size: 0.8125rem; color: var(--kk-leise); }
.kk-hoeher__stand { margin: 6px 0 0; font-size: 1.1rem; font-weight: 800; color: var(--kk-leise); font-variant-numeric: tabular-nums; }
.kk-hoeher__stand b { font-size: clamp(2.2rem, 7vw, 3rem); font-weight: 900; color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-hoeher__karte.ist-verdeckt .kk-hoeher__stand b { color: var(--kk-leise); text-shadow: none; }
.kk-hoeher__klein { margin: 0; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-hoeher__karte.ist-richtig { background: rgba(125, 255, 168, 0.1); box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-hoeher__karte.ist-falsch { background: rgba(255, 143, 143, 0.08); box-shadow: inset 0 0 0 2px var(--kk-rot); }
.kk-hoeher__mitte { display: flex; flex-direction: column; align-items: stretch; gap: 10px; max-width: 200px; }
.kk-hoeher__frage { margin: 0; font-weight: 700; text-align: center; }
.kk-hoeher__ergebnis { margin: 0; font-weight: 900; text-align: center; color: var(--kk-text); }
@media (max-width: 640px) {
	.kk-hoeher__buehne { grid-template-columns: 1fr 1fr; }
	.kk-hoeher__mitte { grid-column: 1 / -1; grid-row: 2; max-width: none; display: grid; grid-template-columns: 1fr 1fr; }
	.kk-hoeher__frage, .kk-hoeher__ergebnis { grid-column: 1 / -1; }
	.kk-hoeher__logo { width: 48px; height: 48px; }
}
.kk-hoeher__mitte .kk-knopf { white-space: nowrap; padding-left: 12px; padding-right: 12px; }
/* Arcade-Teaser auf der Startseite */
.kk-arcadeteaser { padding-top: clamp(2.5rem, 6vw, 4.5rem); padding-bottom: clamp(2.5rem, 6vw, 4.5rem); }
.kk-arcadeteaser__innen { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.kk-arcadeteaser__text .kk-ueberzeile { margin: 0 0 0.5rem; }
.kk-arcadeteaser__titel { margin: 0 0 1rem; font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.05; }
.kk-arcadeteaser__text > p { color: var(--kk-leise); }
.kk-arcadeteaser__live { display: flex; align-items: baseline; gap: 10px; padding: 12px 14px; border-radius: 14px; background: #121612; box-shadow: inset 0 0 0 1px var(--kk-linie); font-size: 0.9375rem; }
.kk-arcadeteaser__live strong { color: var(--kk-neon); }
.kk-arcadeteaser__punkt { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--kk-neon); box-shadow: 0 0 10px rgba(80, 255, 140, 0.8); translate: 0 -1px; animation: kk-puls 1.6s ease-in-out infinite; }
.kk-arcadeteaser__knoepfe { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.4rem; }
.kk-arcadeteaser__spiele { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.kk-arcadeteaser__spiel a { display: flex; flex-direction: column; gap: 6px; height: 100%; box-sizing: border-box; padding: 16px; border-radius: 18px; background: #121612; box-shadow: inset 0 0 0 1px var(--kk-linie); color: var(--kk-text); text-decoration: none; transition: box-shadow 0.2s, background-color 0.2s, translate 0.2s; }
.kk-arcadeteaser__spiel svg { width: 34px; height: 34px; color: var(--kk-neon); filter: drop-shadow(0 0 6px rgba(80, 255, 140, 0.45)); }
.kk-arcadeteaser__spiel strong { font-size: 1rem; line-height: 1.2; }
.kk-arcadeteaser__spiel span { font-size: 0.8125rem; line-height: 1.35; color: var(--kk-leise); }
.kk-arcadeteaser__spiel a:hover, .kk-arcadeteaser__spiel a:focus-visible { background: #172019; box-shadow: inset 0 0 0 1px var(--kk-neon), 0 0 26px rgba(80, 255, 140, 0.18); translate: 0 -3px; outline: none; }
@media (max-width: 900px) {
	.kk-arcadeteaser__innen { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	/* Am Handy: Spiele als Wischleiste. */
	.kk-arcadeteaser__spiele { display: flex; gap: 10px; margin: 0 calc(-1 * var(--kk-seite)); padding: 4px var(--kk-seite) 10px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 var(--kk-seite); -webkit-overflow-scrolling: touch; scrollbar-width: none; }
	.kk-arcadeteaser__spiele::-webkit-scrollbar { display: none; }
	.kk-arcadeteaser__spiel { flex: 0 0 62%; scroll-snap-align: start; }
	.kk-arcadeteaser__knoepfe .wp-block-button { flex: 1 1 auto; }
	.kk-arcadeteaser__knoepfe .wp-block-button__link { width: 100%; box-sizing: border-box; text-align: center; }
}
@media (prefers-reduced-motion: reduce) { .kk-arcadeteaser__punkt { animation: none; } }
.kk-profil__teilen { margin-top: 14px; }
/* Bildvorschau zum Teilen und Speichern */
.kk-vorschau { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center; padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom)); background: rgba(6, 7, 6, 0.86); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.kk-vorschau__kasten { display: flex; flex-direction: column; align-items: center; gap: 14px; max-height: 100%; }
.kk-vorschau__bild { display: block; max-width: min(92vw, 420px); max-height: calc(100svh - 240px); width: auto; height: auto; border-radius: 18px; box-shadow: 0 0 0 1px rgba(125, 255, 168, 0.4), 0 20px 60px rgba(0, 0, 0, 0.6); -webkit-touch-callout: default; }
.kk-vorschau__knoepfe { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.kk-vorschau__tipp { margin: 0; max-width: 40ch; font-size: 0.8125rem; color: var(--kk-leise); text-align: center; }
html.kk-vorschau-offen { overflow: hidden; }
/* Passmaschine und Kellerassi Invaders */
.kk-spielfeld--pass .kk-spielfeld__canvas { aspect-ratio: 600 / 720; max-width: min(100%, calc((100svh - 260px) * 600 / 720)); }
.kk-spielfeld--pass .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 260px) * 600 / 720)); }
.kk-spielfeld--invaders .kk-spielfeld__canvas { aspect-ratio: 150 / 210; max-width: min(100%, calc((100svh - 220px) * 150 / 210)); }
.kk-spielfeld__canvas--pixel { image-rendering: pixelated; image-rendering: crisp-edges; border-radius: 6px; box-shadow: 0 0 0 3px #1f6b3e, 0 0 0 5px rgba(125, 255, 168, 0.5), 0 0 40px rgba(80, 255, 140, 0.25); }
@media (pointer: coarse) {
	.kk-spielfeld--pass .kk-spielfeld__canvas, .kk-spielfeld--pass .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 150px) * 600 / 720)); }
	.kk-spielfeld--invaders .kk-spielfeld__canvas { max-width: min(100%, calc((100svh - 130px) * 150 / 210)); }
}

/* Kellerradio: Spulen, Zufall, ±10 s */
.kk-spulen {
	-webkit-appearance: none; appearance: none; flex: 1; min-width: 0; height: 22px; margin: 0; background: transparent; cursor: pointer;
	--kk-fort: 0%;
}
.kk-spulen:disabled { cursor: default; opacity: 0.45; }
.kk-spulen::-webkit-slider-runnable-track { height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--kk-neon) var(--kk-fort), rgba(255, 255, 255, 0.16) var(--kk-fort)); }
.kk-spulen::-moz-range-track { height: 4px; border-radius: 4px; background: rgba(255, 255, 255, 0.16); }
.kk-spulen::-moz-range-progress { height: 4px; border-radius: 4px; background: var(--kk-neon); }
.kk-spulen::-webkit-slider-thumb { -webkit-appearance: none; width: 14px; height: 14px; margin-top: -5px; border-radius: 50%; background: var(--kk-neon); border: 0; box-shadow: 0 0 10px rgba(125, 255, 168, 0.6); }
.kk-spulen::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: var(--kk-neon); border: 0; }
.kk-spulen:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 2px; border-radius: 4px; }
.kk-musikleiste__spulen {
	max-width: calc(var(--kk-breite) + 2 * var(--kk-seite)); margin: 0 auto; box-sizing: border-box;
	padding: 0 var(--kk-seite) 6px; display: flex; align-items: center; gap: 10px;
}
.kk-musikleiste__zeit, .kk-radio__zeit { flex: none; font-size: 0.75rem; color: var(--kk-leise); font-variant-numeric: tabular-nums; min-width: 6.5em; text-align: right; }
.kk-musikleiste__zufall[aria-pressed="true"], .kk-radio__zufall[aria-pressed="true"] { color: var(--kk-neon); background: rgba(125, 255, 168, 0.14); }
.kk-radio { padding: 12px 22px 14px; border-bottom: 1px solid rgba(125, 255, 168, 0.12); }
.kk-radio__zeile { display: flex; align-items: center; gap: 12px; }
.kk-radio__knoepfe { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.kk-radio__knopf {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; height: 44px; padding: 0 10px;
	border: 0; border-radius: 22px; background: transparent; color: var(--kk-text); cursor: pointer; font: inherit; font-size: 0.8125rem; font-weight: 700;
}
.kk-radio__knopf:hover:not(:disabled) { color: var(--kk-neon); background: rgba(125, 255, 168, 0.08); }
.kk-radio__knopf:disabled { opacity: 0.4; cursor: default; }
.kk-radio__zufall { box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.35); margin-right: auto; }
@media (max-width: 420px) { .kk-radio { padding: 10px 16px 12px; } .kk-radio__zufall span { display: none; } .kk-radio__zufall { margin-right: 0; } }

/* Arcade: Ball oder nicht Ball? */
.kk-ball__tisch { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(8px, 2.5vw, 16px); margin-top: 12px; padding: clamp(12px, 3vw, 22px); border-radius: 20px; background: radial-gradient(circle at 50% 50%, #1f6b3e, #123d26 70%); box-shadow: 0 0 0 1px var(--kk-linie), inset 0 0 0 6px #0d2b1c; touch-action: manipulation; user-select: none; -webkit-user-select: none; }
.kk-ball__tisch::before { content: ""; position: absolute; left: 50%; top: 8%; bottom: 8%; width: 2px; background: rgba(255, 255, 255, 0.18); }
.kk-ball__logo { position: absolute; left: 50%; top: 50%; width: 34%; max-width: 160px; transform: translate(-50%, -50%); opacity: 0.18; pointer-events: none; }
.kk-ball__tisch.ist-fehler { animation: kk-wackeln 0.35s; box-shadow: 0 0 0 2px var(--kk-rot), inset 0 0 0 6px #0d2b1c; }
.kk-ball__feld { position: relative; aspect-ratio: 1; border: 0; padding: 8%; border-radius: 50%; background: rgba(0, 0, 0, 0.22); box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.45); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kk-ball__feld { display: block; width: 100%; min-width: 0; height: auto; margin: 0; overflow: hidden; -webkit-appearance: none; appearance: none; touch-action: manipulation; }
.kk-ball__feld svg { position: absolute; left: 8%; top: 8%; width: 84%; height: 84%; display: block; pointer-events: none; animation: kk-auftauchen 0.12s ease-out; }
@supports not (aspect-ratio: 1) { .kk-ball__feld { height: 0; padding: 0 0 100%; } }
.kk-ball__feld.ist-treffer { box-shadow: inset 0 0 0 3px var(--kk-neon), 0 0 18px rgba(80, 255, 140, 0.5); }
.kk-ball__feld.ist-falsch { box-shadow: inset 0 0 0 3px var(--kk-rot); }
.kk-ball__feld:focus-visible { outline: 2px solid var(--kk-neon); outline-offset: 2px; }
.kk-ball__kombo { position: absolute; left: 0; right: 0; top: -2px; margin: 0; text-align: center; font-weight: 900; color: var(--kk-neon); text-shadow: var(--kk-glow); pointer-events: none; }
.kk-ball__hinweis { margin: 10px 0 0; text-align: center; color: var(--kk-leise); font-size: 0.875rem; min-height: 1.4em; }
@keyframes kk-auftauchen { from { transform: scale(0.4); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes kk-wackeln { 0%, 100% { transform: none; } 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
@media (prefers-reduced-motion: reduce) { .kk-ball__feld svg, .kk-ball__tisch.ist-fehler, .kk-wort__zeile.ist-wackeln { animation: none; } }

/* Arcade: Wer gewinnt das Doppel? */
.kk-doppel__frage, .kk-impl__frage, .kk-road__titel { margin: 12px 0 0; font-weight: 800; text-align: center; }
.kk-doppel__feld { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 10px; margin-top: 12px; }
.kk-doppel__vs { align-self: center; font-weight: 900; color: var(--kk-salbei); }
.kk-doppel__karte { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 8px; border: 0; border-radius: 18px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-text); font: inherit; cursor: pointer; transition: box-shadow 0.2s, background-color 0.2s; }
.kk-doppel__karte:hover:not(:disabled) { box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-doppel__karte:disabled { cursor: default; }
.kk-doppel__figuren { display: flex; justify-content: center; }
.kk-doppel__figur { width: clamp(52px, 16vw, 84px); aspect-ratio: 1; margin: 0 -6px; }
.kk-doppel__figur svg { width: 100%; height: 100%; display: block; }
.kk-doppel__paar { font-size: clamp(1.15rem, 4.5vw, 1.5rem); font-weight: 900; color: var(--kk-neon); }
.kk-doppel__team { font-size: 0.75rem; color: var(--kk-leise); text-transform: uppercase; letter-spacing: 0.1em; }
.kk-doppel__info { display: flex; flex-direction: column; align-items: center; min-height: 2.8em; font-size: 0.8125rem; color: var(--kk-leise); text-align: center; }
.kk-doppel__info b { font-size: 1.6rem; color: var(--kk-text); }
.kk-doppel__karte.ist-richtig { background: #173a26; }
.kk-doppel__karte.ist-richtig .kk-doppel__info b { color: var(--kk-neon); }
.kk-doppel__karte.ist-gewaehlt { box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-doppel__karte.ist-falsch { box-shadow: inset 0 0 0 2px var(--kk-rot); }
.kk-doppel__ergebnis, .kk-impl__info { margin: 10px 0 0; min-height: 1.4em; text-align: center; font-weight: 700; }

/* Arcade: Im-/Explodiert */
.kk-impl__person { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 12px; }
.kk-impl__figur { width: 88px; height: 88px; border-radius: 50%; overflow: hidden; background: #121a14; box-shadow: 0 0 0 2px var(--kk-neon); }
.kk-impl__figur svg { width: 100%; height: 100%; display: block; }
.kk-impl__name { font-size: 2rem; font-weight: 900; color: var(--kk-neon); text-shadow: var(--kk-glow); }
.kk-impl__aussagen { display: grid; gap: 8px; margin-top: 12px; }
.kk-impl__aussage { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 0; border-radius: 14px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-text); font: inherit; text-align: left; cursor: pointer; }
.kk-impl__aussage:hover:not(:disabled) { box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-impl__aussage:disabled { cursor: default; }
.kk-impl__aussage small { font-size: 0.8125rem; font-weight: 800; color: var(--kk-neon); }
.kk-impl__aussage.ist-wahr { opacity: 0.65; }
.kk-impl__aussage.ist-fake { background: #173a26; box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-impl__aussage.ist-gewaehlt { opacity: 1; box-shadow: inset 0 0 0 2px var(--kk-rot); }
.kk-impl__weiter { display: block; margin: 12px auto 0; }

/* Arcade: Kellerwort */
.kk-wort__gitter { display: grid; gap: 5px; justify-content: center; margin-top: 12px; }
.kk-wort__zeile { display: grid; grid-template-columns: repeat(var(--kk-wort-n), minmax(0, 46px)); gap: 5px; }
.kk-wort__zeile.ist-wackeln { animation: kk-wackeln 0.35s; }
.kk-wort__feld { display: flex; align-items: center; justify-content: center; aspect-ratio: 1; min-width: 0; border-radius: 6px; box-shadow: inset 0 0 0 2px #34403a; font-weight: 900; font-size: clamp(0.8rem, calc(80vw / var(--kk-wort-n) / 2.2), 1.5rem); text-transform: uppercase; }
.kk-wort__feld.ist-voll { box-shadow: inset 0 0 0 2px #6d7a72; }
.kk-wort__feld.ist-g { background: #1f8a4c; box-shadow: none; color: #fff; }
.kk-wort__feld.ist-y { background: #b8942b; box-shadow: none; color: #fff; }
.kk-wort__feld.ist-x { background: #2c322e; box-shadow: none; color: var(--kk-leise); }
.kk-wort__meldung { margin: 8px 0 0; min-height: 1.4em; text-align: center; font-weight: 700; }
.kk-wort__tastatur { display: grid; gap: 6px; margin-top: 8px; }
.kk-wort__reihe { display: flex; justify-content: center; gap: 4px; }
.kk-wort__taste { flex: 1; max-width: 44px; min-width: 0; height: 50px; padding: 0; border: 0; border-radius: 6px; background: #3a423d; color: var(--kk-text); font: inherit; font-weight: 800; font-size: 0.9375rem; cursor: pointer; touch-action: manipulation; }
.kk-wort__taste--breit { flex: 1.6; max-width: 72px; font-size: 0.75rem; }
.kk-wort__taste.ist-g { background: #1f8a4c; color: #fff; }
.kk-wort__taste.ist-y { background: #b8942b; color: #fff; }
.kk-wort__taste.ist-x { background: #1d221f; color: #6d7a72; }

/* Arcade: Road to 42 */
.kk-road__strasse { position: relative; height: 18px; margin-top: 12px; border-radius: 9px; background: repeating-linear-gradient(90deg, #2c322e 0 18px, #222824 18px 36px); overflow: hidden; }
.kk-road__balken { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: linear-gradient(90deg, #1f6b3e, var(--kk-neon)); box-shadow: 0 0 14px rgba(80, 255, 140, 0.5); transition: width 0.4s ease; }
.kk-road__ziel { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-size: 0.6875rem; font-weight: 900; color: #fff; }
.kk-road__feld { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 12px; min-height: 180px; }
.kk-road__bahn { position: relative; width: 100%; height: 54px; border-radius: 12px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; overflow: hidden; }
.kk-road__zone { position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); }
.kk-road__zone--1 { width: 54%; background: rgba(125, 255, 168, 0.12); }
.kk-road__zone--2 { width: 30%; background: rgba(125, 255, 168, 0.22); }
.kk-road__zone--3 { width: 12%; background: rgba(125, 255, 168, 0.5); }
.kk-road__zeiger { position: absolute; top: 4px; bottom: 4px; width: 4px; margin-left: -2px; border-radius: 2px; background: #fff; box-shadow: 0 0 10px #fff; }
.kk-road__reflex { width: 100%; min-height: 160px; border: 0; border-radius: 18px; background: linear-gradient(#14402a, #0d2b1c); box-shadow: 0 0 0 1px var(--kk-linie); color: var(--kk-leise); font: inherit; font-size: 1.25rem; font-weight: 900; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.kk-road__reflex.ist-los { background: linear-gradient(#1f6b3e, #14402a); box-shadow: 0 0 0 2px var(--kk-neon), 0 0 40px rgba(80, 255, 140, 0.45); color: var(--kk-neon); font-size: 2rem; }
.kk-road__karte { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 14px; border-radius: 14px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; text-align: center; width: 100%; box-sizing: border-box; }
.kk-road__karte span, .kk-road__spiel span { font-size: 0.8125rem; color: var(--kk-leise); }
.kk-road__wahl { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; width: 100%; }
.kk-road__option { flex: 1 1 140px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 52px; padding: 10px; border: 0; border-radius: 14px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-text); font: inherit; font-weight: 800; cursor: pointer; }
.kk-road__option:hover:not(:disabled) { box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-road__option.ist-richtig { background: #173a26; box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-road__option.ist-falsch { box-shadow: inset 0 0 0 2px var(--kk-rot); }
.kk-road__spiel { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.kk-road__info { margin: 10px 0 0; min-height: 1.4em; text-align: center; font-weight: 800; }
.kk-road__info.ist-gut { color: var(--kk-neon); }
.kk-road__info.ist-schlecht { color: var(--kk-rot); }

/* Arcade: Kellerassi World */
.kk-spielfeld--welt .kk-spielfeld__canvas { aspect-ratio: 240 / 136; image-rendering: pixelated; cursor: default; }
.kk-welt__steuerung { display: grid; grid-template-columns: 72px 72px 1fr 1fr; gap: 10px; width: 100%; max-width: 560px; margin-top: 12px; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-welt__knopf { min-height: 64px; border: 0; border-radius: 16px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-salbei); font: inherit; font-size: 1.4rem; font-weight: 900; touch-action: none; -webkit-tap-highlight-color: transparent; cursor: pointer; }
.kk-welt__knopf--sprung, .kk-welt__knopf--schuss { grid-column: span 1; font-size: 0.875rem; letter-spacing: 0.12em; text-transform: uppercase; }
.kk-welt__knopf--sprung { grid-column: 4; background: var(--kk-gruen); color: #fff; box-shadow: 0 0 0 1px var(--kk-neon), 0 0 22px rgba(80, 255, 140, 0.35); }
.kk-welt__knopf--schuss { grid-column: 3; color: var(--kk-neon); box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-welt__knopf.ist-aktiv { transform: scale(0.95); box-shadow: inset 0 0 0 2px var(--kk-neon); color: var(--kk-neon); }
.kk-welt__knopf--sprung.ist-aktiv { background: #2a9a58; color: #fff; }
.kk-welt__weiter { margin-top: 12px; }
@media (pointer: fine) { .kk-welt__steuerung { opacity: 0.85; } }

/* Arcade-Menü */
.kk-arcademenue { box-sizing: border-box; max-width: 860px; margin: clamp(1.5rem, 4vw, 2.5rem) auto !important; scroll-margin-top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 16px); }
.kk-arcademenue__titel { margin: 0 0 12px; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-arcademenue__liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.kk-arcademenue__spiel { display: flex; flex-direction: column; gap: 4px; height: 100%; box-sizing: border-box; padding: 12px 14px; border-radius: 16px; background: #121612; box-shadow: inset 0 0 0 1px var(--kk-linie); color: var(--kk-text); text-decoration: none; transition: box-shadow 0.2s, background-color 0.2s, translate 0.2s; }
.kk-arcademenue__spiel svg { width: 28px; height: 28px; color: var(--kk-neon); filter: drop-shadow(0 0 6px rgba(80, 255, 140, 0.45)); }
.kk-arcademenue__spiel strong { font-size: 0.9375rem; line-height: 1.2; }
.kk-arcademenue__spiel span { font-size: 0.75rem; line-height: 1.35; color: var(--kk-leise); }
.kk-arcademenue__spiel .kk-arcademenue__marke { align-self: flex-start; padding: 2px 8px; border-radius: 999px; background: rgba(125, 255, 168, 0.14); color: var(--kk-neon); font-weight: 800; }
.kk-arcademenue__spiel:hover, .kk-arcademenue__spiel:focus-visible { background: #172019; box-shadow: inset 0 0 0 1px var(--kk-neon), 0 0 26px rgba(80, 255, 140, 0.18); translate: 0 -2px; outline: none; }
@media (max-width: 420px) { .kk-arcademenue__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } .kk-arcademenue__spiel { padding: 10px 12px; } }
.kk-arcade__zurueck { margin-left: 10px; font-size: 0.6875rem; letter-spacing: 0.08em; color: var(--kk-leise); text-decoration: none; white-space: nowrap; }
.kk-arcade__zurueck:hover, .kk-arcade__zurueck:focus-visible { color: var(--kk-neon); }
@media (prefers-reduced-motion: reduce) { .kk-arcademenue__spiel { transition: none; } .kk-arcademenue__spiel:hover { translate: none; } }
.kk-welt__luecke { display: none; }
.kk-welt__leiste { display: flex; justify-content: center; margin-top: 10px; }
.kk-welt__zu, .kk-welt__drehen { display: none; }
html.kk-welt-vollbild, html.kk-welt-vollbild body { overflow: hidden; }
.kk-spielfeld--welt.kk-welt--vollbild { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; background: #000; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
.kk-welt--vollbild .kk-spielfeld__canvas { border-radius: 0; box-shadow: none; max-width: none; }
.kk-welt--vollbild .kk-spielfeld__hinweis, .kk-welt--vollbild .kk-welt__leiste { display: none; }
.kk-welt--vollbild .kk-welt__steuerung { position: fixed; left: 0; right: 0; bottom: max(12px, env(safe-area-inset-bottom)); display: flex; gap: 10px; max-width: none; margin: 0; padding: 0 max(14px, env(safe-area-inset-left)) 0 max(14px, env(safe-area-inset-left)); pointer-events: none; }
.kk-welt--vollbild .kk-welt__luecke { display: block; flex: 1; }
.kk-welt--vollbild .kk-welt__knopf { pointer-events: auto; width: 68px; min-height: 68px; opacity: 0.6; background: rgba(24, 28, 25, 0.75); }
.kk-welt--vollbild .kk-welt__knopf--sprung { width: 92px; background: rgba(31, 107, 62, 0.8); }
.kk-welt--vollbild .kk-welt__knopf--schuss { width: 92px; }
.kk-welt--vollbild .kk-welt__knopf.ist-aktiv { opacity: 0.95; }
.kk-welt--vollbild .kk-welt__zu { display: block; position: fixed; top: max(10px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right)); width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(24, 28, 25, 0.8); color: #fff; font-size: 1.1rem; cursor: pointer; }
.kk-welt--vollbild .kk-welt__weiter { position: fixed; left: 50%; bottom: max(20px, env(safe-area-inset-bottom)); transform: translateX(-50%); margin: 0; }
@media (orientation: portrait) {
	.kk-welt--vollbild .kk-welt__drehen { display: block; position: fixed; top: max(14px, env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); margin: 0; padding: 6px 14px; border-radius: 999px; background: rgba(31, 107, 62, 0.9); color: #fff; font-size: 0.8125rem; font-weight: 700; pointer-events: none; animation: kk-ausblenden 4s forwards; }
}
@keyframes kk-ausblenden { 0%, 75% { opacity: 1; } 100% { opacity: 0; } }
@media (orientation: landscape) {
	.kk-welt--vollbild .kk-welt__zu { top: auto; right: auto; left: 50%; bottom: max(14px, env(safe-area-inset-bottom)); transform: translateX(-50%); opacity: 0.7; }
}

/* Kellerassi World: Joypad (Steuerkreuz links, A/B rechts) */
.kk-spielfeld--welt .kk-welt__steuerung { display: flex; align-items: center; gap: 12px; max-width: 560px; margin-top: 14px; padding: 14px 16px 22px; box-sizing: border-box; border-radius: 26px; background: linear-gradient(#171b18, #0f120f); box-shadow: inset 0 0 0 1px #2f3a33, 0 10px 30px rgba(0, 0, 0, 0.4); }
.kk-welt__pad { position: relative; display: flex; flex: 0 1 230px; height: 110px; border-radius: 20px; background: #0b0d0b; box-shadow: inset 0 0 0 2px #34403a, inset 0 6px 14px rgba(0, 0, 0, 0.6); touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; cursor: pointer; }
.kk-welt__pad::before { content: ""; position: absolute; left: 50%; top: 16px; bottom: 16px; width: 2px; margin-left: -1px; background: #2a332d; }
.kk-welt__pfeil { flex: 1; display: flex; align-items: center; justify-content: center; border-radius: 18px; color: var(--kk-salbei); font-size: 2rem; pointer-events: none; transition: background-color 0.06s, color 0.06s; }
.kk-welt__pfeil.ist-aktiv { background: rgba(125, 255, 168, 0.16); color: var(--kk-neon); }
.kk-welt__ab { position: relative; display: flex; align-items: flex-end; gap: 14px; flex: none; height: 110px; }
.kk-spielfeld--welt .kk-welt__knopf { position: relative; width: 78px; min-height: 0; height: 78px; padding: 0; border-radius: 50%; font-size: 1.5rem; letter-spacing: 0; }
.kk-spielfeld--welt .kk-welt__knopf::after { content: attr(data-text); position: absolute; left: 50%; bottom: -19px; transform: translateX(-50%); font-size: 0.625rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kk-leise); white-space: nowrap; }
.kk-spielfeld--welt .kk-welt__knopf--sprung { align-self: flex-start; width: 88px; height: 88px; }
.kk-spielfeld--welt .kk-welt__knopf--schuss { align-self: flex-end; }
.kk-spielfeld--welt .kk-welt__knopf--schuss[hidden] { display: none; }
.kk-spielfeld--welt .kk-welt__luecke { display: block; flex: 1; }
@media (max-width: 380px) {
	.kk-welt__pad { height: 96px; }
	.kk-welt__ab { height: 96px; gap: 8px; }
	.kk-spielfeld--welt .kk-welt__knopf { width: 66px; height: 66px; }
	.kk-spielfeld--welt .kk-welt__knopf--sprung { width: 76px; height: 76px; }
}
/* Vollbild hochkant: Spielfeld oben, Joypad groß darunter. */
@media (orientation: portrait) {
	.kk-spielfeld--welt.kk-welt--vollbild { flex-direction: column; justify-content: flex-start; padding-top: max(64px, env(safe-area-inset-top)); }
	.kk-welt--vollbild .kk-welt__steuerung { position: static; margin-top: auto; margin-bottom: max(24px, env(safe-area-inset-bottom)); width: calc(100% - 24px); max-width: 520px; pointer-events: auto; background: linear-gradient(#171b18, #0f120f); }
	.kk-welt--vollbild .kk-welt__pad { height: 140px; flex-basis: 250px; }
	.kk-welt--vollbild .kk-welt__ab { height: 140px; }
	.kk-welt--vollbild .kk-welt__knopf { width: 86px; height: 86px; opacity: 1; }
	.kk-welt--vollbild .kk-welt__knopf--sprung { width: 98px; height: 98px; }
}
/* Vollbild quer: halbtransparent über dem Spielfeld, Steuerkreuz links, A/B rechts. */
@media (orientation: landscape) {
	.kk-welt--vollbild .kk-welt__steuerung { background: none; box-shadow: none; padding: 0 max(14px, env(safe-area-inset-left)); }
	.kk-welt--vollbild .kk-welt__pad { pointer-events: auto; flex-basis: 190px; height: 92px; opacity: 0.6; background: rgba(11, 13, 11, 0.6); }
	.kk-welt--vollbild .kk-welt__ab { pointer-events: auto; height: 100px; opacity: 0.75; }
	.kk-welt--vollbild .kk-welt__knopf::after { display: none; }
}
@media (orientation: landscape) {
	.kk-welt--vollbild .kk-welt__zu { top: max(40px, env(safe-area-inset-top)); bottom: auto; width: 36px; height: 36px; font-size: 0.95rem; opacity: 0.55; }
}
.kk-spielfeld--welt .kk-welt__knopf--kracher { align-self: center; width: 66px; height: 66px; background: #f2c94c; color: #0a0b0a; box-shadow: 0 0 0 2px #fff3c4, 0 0 26px rgba(242, 201, 76, 0.7); font-size: 1.6rem; animation: kk-kracher 0.8s ease-in-out infinite alternate; }
.kk-spielfeld--welt .kk-welt__knopf--kracher[hidden] { display: none; }
@keyframes kk-kracher { from { transform: scale(1); } to { transform: scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .kk-spielfeld--welt .kk-welt__knopf--kracher { animation: none; } }
/* Kracher-Knopf schwebt über A/B, damit das Steuerkreuz am Handy groß bleibt. */
.kk-spielfeld--welt .kk-welt__knopf--kracher { position: absolute; left: 50%; top: -84px; margin-left: -33px; z-index: 2; }
.kk-spielfeld--welt .kk-welt__knopf--kracher::after { bottom: auto; top: -17px; color: #f2c94c; }
.kk-welt__pad { min-width: 118px; }
@media (max-width: 440px) {
	.kk-spielfeld--welt .kk-welt__steuerung { gap: 10px; padding: 12px 12px 22px; }
	.kk-welt__ab { gap: 8px; }
	.kk-spielfeld--welt .kk-welt__knopf { width: 64px; height: 64px; }
	.kk-spielfeld--welt .kk-welt__knopf--sprung { width: 76px; height: 76px; }
	.kk-spielfeld--welt .kk-welt__knopf--kracher { width: 60px; height: 60px; margin-left: -30px; top: -78px; }
}
@media (max-width: 440px) {
	.kk-spielfeld--welt:not(.kk-welt--vollbild) .kk-welt__steuerung { width: calc(100% + 2 * clamp(1.4rem, 4vw, 2.5rem) - 8px); max-width: none; margin-left: calc(-1 * clamp(1.4rem, 4vw, 2.5rem) + 4px); margin-right: calc(-1 * clamp(1.4rem, 4vw, 2.5rem) + 4px); }
}
.kk-welt__wahl { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; padding: 14px; border-radius: 18px; background: #121612; box-shadow: inset 0 0 0 1px var(--kk-linie); }
.kk-welt__wahltitel { flex-basis: 100%; margin: 0 0 4px; text-align: center; font-weight: 800; }
.kk-welt--vollbild .kk-welt__wahl { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3; max-width: 90vw; }
/* Bandenschuss des Tages */
.kk-spielfeld--pinball .kk-spielfeld__canvas { aspect-ratio: 300 / 480; max-width: min(100%, calc((100svh - 250px) * 300 / 480)); margin-inline: auto; cursor: pointer; -webkit-touch-callout: none; }
.kk-spielfeld--pinball .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 250px) * 300 / 480)); margin-inline: auto; }

/* Kellerassi Snake */
.kk-spielfeld--snake .kk-spielfeld__canvas { aspect-ratio: 240 / 304; max-width: min(100%, calc((100svh - 300px) * 240 / 304)); image-rendering: pixelated; touch-action: none; }
.kk-spielfeld--snake .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 300px) * 240 / 304)); }
.kk-snake__pfeile { display: grid; grid-template-columns: repeat(3, 64px); grid-template-rows: repeat(2, 54px); gap: 6px; margin-top: 12px; touch-action: none; user-select: none; -webkit-user-select: none; }
.kk-snake__pfeil { border: 0; border-radius: 14px; background: #181c19; box-shadow: inset 0 0 0 1px #34403a; color: var(--kk-salbei); font-size: 1.3rem; cursor: pointer; touch-action: none; -webkit-tap-highlight-color: transparent; }
.kk-snake__pfeil:active { color: var(--kk-neon); box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-snake__pfeil--hoch { grid-column: 2; grid-row: 1; }
.kk-snake__pfeil--links { grid-column: 1; grid-row: 2; }
.kk-snake__pfeil--runter { grid-column: 2; grid-row: 2; }
.kk-snake__pfeil--rechts { grid-column: 3; grid-row: 2; }

/* Regel-Schiri */
.kk-regel__szene { display: block; width: 100%; height: auto; margin-top: 12px; border-radius: 14px; box-shadow: 0 0 0 1px var(--kk-linie); }
.kk-regel__zeit { height: 6px; margin-top: 8px; border-radius: 3px; background: #2c322e; overflow: hidden; }
.kk-regel__zeit span { display: block; height: 100%; width: 100%; background: linear-gradient(90deg, #f2c94c, var(--kk-neon)); }
.kk-regel__lage { margin: 12px 0 0; min-height: 3em; font-weight: 800; font-size: 1.05rem; text-align: center; }
.kk-regel__knoepfe { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.kk-regel__knopf { min-height: 60px; border: 0; border-radius: 16px; font: inherit; font-weight: 900; font-size: 1rem; cursor: pointer; touch-action: manipulation; }
.kk-regel__knopf--ok { background: #173a26; color: var(--kk-neon); box-shadow: inset 0 0 0 2px var(--kk-neon); }
.kk-regel__knopf--foul { background: #3a1717; color: #ffb3b3; box-shadow: inset 0 0 0 2px #ff8f8f; }
.kk-regel__knopf:disabled { opacity: 0.5; cursor: default; }
.kk-regel__info { margin: 12px 0 0; min-height: 3em; font-size: 0.875rem; color: var(--kk-leise); }
.kk-regel__info.ist-richtig { color: var(--kk-neon); }
.kk-regel__info.ist-falsch { color: #ffb3b3; }
.kk-regel__quelle { margin: 8px 0 0; font-size: 0.75rem; color: var(--kk-leise); }
.kk-regel__szene { box-shadow: 0 10px 30px rgba(0,0,0,0.45), 0 0 0 1px var(--kk-linie); }
.kk-regel__legende { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 10px; margin: 8px 0 0; font-size: 0.8125rem; color: var(--kk-leise); }
.kk-regel__punkt { display: inline-block; width: 12px; height: 12px; border-radius: 50%; vertical-align: -1px; margin-right: -4px; }
.kk-regel__punkt--s { background: #111; box-shadow: 0 0 0 2px var(--kk-neon); }
.kk-regel__punkt--w { background: #f4f4f0; box-shadow: 0 0 0 1px #999; }
.kk-regel__karte { display: inline-block; width: 12px; height: 16px; margin-right: 4px; border-radius: 2px; background: #e5322d; vertical-align: -2px; transform: rotate(8deg); box-shadow: 0 1px 2px rgba(0,0,0,0.5); }
.kk-regel__mini { display: inline-block; width: 9px; height: 12px; margin-left: 3px; border-radius: 2px; box-shadow: inset 0 0 0 1.5px currentColor; vertical-align: -1px; opacity: 0.6; }
.kk-regel__mini.ist-rot { background: #e5322d; box-shadow: none; opacity: 1; }
.kk-regel__knopf { transition: transform 0.08s ease; }
.kk-regel__knopf:active:not(:disabled) { transform: scale(0.97); }

.kk-wort__hinweis { margin: 10px auto 4px; max-width: 34rem; padding: 10px 14px; border-radius: 12px; background: rgba(125, 255, 168, 0.08); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.35); font-size: 0.9375rem; line-height: 1.4; text-align: center; }
.kk-wort__hinweismarke { display: inline-block; margin-right: 4px; padding: 1px 8px; border-radius: 999px; background: var(--kk-neon); color: #0e1210; font-size: 0.6875rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; vertical-align: 1px; }

/* Pinshotball: Punkteanzeige wie ein Dot-Matrix-Display, Arcade-Knöpfe. */
.kk-spielfeld--pinball .kk-spielfeld__anzeige { position: relative; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 10px; background-color: #120a02; background-image: radial-gradient(rgba(255, 140, 30, 0.12) 1px, transparent 1.3px); background-size: 4px 4px; box-shadow: inset 0 0 0 2px #2a1a08, 0 0 0 1px #000; color: #ff9a2e; font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; text-shadow: 0 0 6px rgba(255, 140, 30, 0.75); }
.kk-spielfeld--pinball .kk-spielfeld__stand, .kk-spielfeld--pinball .kk-spielfeld__stand b, .kk-spielfeld--pinball .kk-spielfeld__stufe { color: #ff9a2e; letter-spacing: 0.08em; text-transform: uppercase; }
.kk-spielfeld--pinball .kk-spielfeld__stand b { font-size: 1.35em; }
.kk-spielfeld--pinball .kk-spielfeld__stufe { margin-left: auto; }
.kk-pin__ton { min-width: 36px; min-height: 32px; border: 0; border-radius: 8px; background: rgba(255, 154, 46, 0.12); font-size: 1rem; line-height: 1; cursor: pointer; }
.kk-pin__steuer { display: grid; grid-template-columns: 1fr 1.15fr 1fr; align-items: center; gap: 12px; width: 100%; max-width: min(100%, calc((100svh - 250px) * 300 / 480 + 40px)); margin: 14px auto 0; padding: 12px 14px; border-radius: 18px; background: linear-gradient(#1c1f1d, #0d0f0e); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 20px rgba(0, 0, 0, 0.45); touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-pin__knopf { position: relative; justify-self: center; display: grid; place-items: center; width: clamp(64px, 20vw, 84px); aspect-ratio: 1; padding: 0; border: 0; border-radius: 50%; background: #3a0d0d; box-shadow: 0 6px 0 #1a0505, 0 10px 18px rgba(0, 0, 0, 0.5); cursor: pointer; touch-action: none; -webkit-tap-highlight-color: transparent; transition: transform 0.05s, box-shadow 0.05s; }
.kk-pin__kappe { display: grid; place-items: center; width: 84%; height: 84%; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ff8f8f, #e5322d 55%, #a51612); color: #fff; font-size: 1.4rem; font-weight: 900; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); box-shadow: inset 0 -3px 6px rgba(0, 0, 0, 0.35); pointer-events: none; }
.kk-pin__knopf--p { width: 100%; max-width: 130px; aspect-ratio: auto; height: clamp(54px, 15vw, 64px); border-radius: 16px; background: #0d2b1c; box-shadow: 0 6px 0 #061409, 0 10px 18px rgba(0, 0, 0, 0.5); }
.kk-pin__knopf--p .kk-pin__kappe { width: calc(100% - 10px); height: calc(100% - 10px); border-radius: 12px; background: radial-gradient(circle at 35% 25%, #c9ffd9, var(--kk-neon) 55%, #2c9a58); color: #0e1210; font-size: clamp(0.6875rem, 3vw, 0.875rem); letter-spacing: 0.04em; text-transform: uppercase; text-shadow: none; }
.kk-pin__knopf.ist-an, .kk-pin__knopf.ist-gedrueckt { transform: translateY(5px); box-shadow: 0 1px 0 #1a0505, 0 3px 8px rgba(0, 0, 0, 0.5); }
.kk-pin__knopf.ist-an .kk-pin__kappe { filter: brightness(1.25); box-shadow: inset 0 -1px 3px rgba(0, 0, 0, 0.3), 0 0 18px rgba(255, 90, 80, 0.8); }
.kk-pin__knopf--p.ist-bereit .kk-pin__kappe { animation: kk-pin-puls 0.9s ease-in-out infinite; }
@keyframes kk-pin-puls { 50% { box-shadow: 0 0 22px rgba(125, 255, 168, 0.95); filter: brightness(1.15); } }
@media (prefers-reduced-motion: reduce) { .kk-pin__knopf--p.ist-bereit .kk-pin__kappe { animation: none; } }

/* Taximannschaft, KellerBlast, Solitaire */
.kk-spielfeld--taxi .kk-spielfeld__canvas, .kk-spielfeld--blast .kk-spielfeld__canvas { aspect-ratio: 300 / 480; max-width: min(100%, calc((100svh - 240px) * 300 / 480)); margin-inline: auto; touch-action: none; }
.kk-spielfeld--blast .kk-spielfeld__canvas { aspect-ratio: 320 / 480; max-width: min(100%, calc((100svh - 190px) * 320 / 480)); cursor: grab; }
.kk-spielfeld--solitaire .kk-spielfeld__canvas { aspect-ratio: 350 / 520; max-width: min(100%, calc((100svh - 200px) * 350 / 520)); margin-inline: auto; touch-action: none; cursor: pointer; }
.kk-spielfeld--taxi .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 240px) * 300 / 480)); margin-inline: auto; }
.kk-spielfeld--blast .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 190px) * 320 / 480)); margin-inline: auto; }
.kk-spielfeld--solitaire .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 200px) * 350 / 520)); margin-inline: auto; }
.kk-sol__leiste { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; }
.kk-sol__leiste .kk-knopf { min-height: 44px; }
.kk-spielfeld--taxi { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }
.kk-taxi__steuer { display: grid; grid-template-columns: 1.15fr 1fr 1fr 1fr 1.15fr; gap: 8px; width: 100%; max-width: 480px; margin: 12px auto 0; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-taxi__knopf { position: relative; display: grid; place-items: center; min-height: clamp(68px, 20vw, 84px); padding: 0; border: 0; border-radius: 18px; background: #1c211e; color: #fff; box-shadow: 0 5px 0 #0a0c0b, inset 0 0 0 2px rgba(255, 255, 255, 0.08); cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; transition: transform 0.05s, box-shadow 0.05s; }
.kk-taxi__knopf svg { width: 46%; max-width: 38px; height: auto; pointer-events: none; }
.kk-taxi__knopf--gas { background: #173a26; color: var(--kk-neon); }
.kk-taxi__knopf--bremse { background: #3a1717; color: #ff8f8f; }
.kk-taxi__knopf--jet { background: #3a2f10; color: #f2c94c; }
.kk-taxi__zahl { position: absolute; top: 6px; right: 8px; font-size: 0.75rem; font-weight: 900; color: #f2c94c; pointer-events: none; }
.kk-taxi__knopf.ist-an { transform: translateY(4px); box-shadow: 0 1px 0 #0a0c0b, inset 0 0 0 2px rgba(255, 255, 255, 0.22); }

/* Pac-Assi */
.kk-spielfeld--pacassi { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-spielfeld--pacassi .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 300px) * 336 / 362)); margin-inline: auto; align-items: center; }
.kk-spielfeld--pacassi .kk-spielfeld__stufe { margin-left: auto; }
.kk-pac__buehne { position: relative; width: 100%; max-width: min(100%, calc((100svh - 300px) * 336 / 362)); margin-inline: auto; }
.kk-pac__buehne .kk-spielfeld__canvas { aspect-ratio: 336 / 362; width: 100%; touch-action: none; }
.kk-pac__menue { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 18px; border-radius: 18px; background: radial-gradient(circle at 50% 35%, rgba(31, 107, 62, 0.55), rgba(5, 8, 6, 0.94) 70%); text-align: center; overflow-y: auto; }
.kk-pac__menue[hidden] { display: none; }
.kk-pac__praesentiert { margin: 0; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.18em; color: var(--kk-leise); }
.kk-pac__logo { margin: 0; font-size: clamp(2.2rem, 11vw, 3.4rem); font-weight: 900; line-height: 1; letter-spacing: 0.04em; color: #f2c94c; text-shadow: 0 0 18px rgba(242, 201, 76, 0.6), 3px 3px 0 #a0306a; }
.kk-pac__unter { margin: 0 0 6px; font-weight: 800; color: var(--kk-neon); }
.kk-pac__titel { margin: 0; font-weight: 900; letter-spacing: 0.12em; color: #f2c94c; }
.kk-pac__mknopf { min-height: 44px; padding: 8px 16px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, 0.08); color: #fff; font: inherit; font-weight: 800; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18); }
.kk-pac__mknopf:hover, .kk-pac__mknopf:focus-visible { background: rgba(125, 255, 168, 0.18); outline: 2px solid var(--kk-neon); outline-offset: 2px; }
.kk-pac__mknopf:disabled { opacity: 0.4; cursor: default; }
.kk-pac__mknopf--haupt { min-width: 70%; min-height: 54px; background: var(--kk-neon); color: #0e1210; font-size: 1.1rem; box-shadow: 0 0 24px rgba(125, 255, 168, 0.5); }
.kk-pac__reihe { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.kk-pac__reihe .kk-pac__mknopf { font-size: 0.8125rem; }
.kk-pac__fuss { margin: 6px 0 0; font-size: 0.75rem; font-weight: 900; letter-spacing: 0.16em; color: #ff8f8f; }
.kk-pac__liste { margin: 0; padding-left: 1.1em; max-width: 30rem; text-align: left; font-size: 0.8125rem; line-height: 1.45; color: #e8efe9; }
.kk-pac__gross { margin: 0; font-size: 2.6rem; font-weight: 900; color: var(--kk-neon); }
.kk-pac__klein { margin: 0; font-size: 0.8125rem; color: var(--kk-leise); }
.kk-pac__steuer { display: grid; grid-template-columns: repeat(3, clamp(58px, 18vw, 72px)); grid-template-rows: repeat(3, clamp(52px, 15vw, 64px)); grid-template-areas: ". hoch ." "links jet rechts" ". runter ."; gap: 6px; justify-content: center; margin: 12px auto 0; touch-action: none; user-select: none; -webkit-user-select: none; }
.kk-pac__steuer.ist-aus { visibility: hidden; }
.kk-pac__knopf { border: 0; border-radius: 14px; background: #1c211e; color: #fff; font-size: 1.3rem; font-weight: 900; box-shadow: 0 4px 0 #0a0c0b, inset 0 0 0 2px rgba(255, 255, 255, 0.08); cursor: pointer; touch-action: none; -webkit-tap-highlight-color: transparent; }
.kk-pac__knopf--hoch { grid-area: hoch; }
.kk-pac__knopf--links { grid-area: links; }
.kk-pac__knopf--rechts { grid-area: rechts; }
.kk-pac__knopf--runter { grid-area: runter; }
.kk-pac__knopf--jet { grid-area: jet; border-radius: 50%; background: #3a2f10; color: #f2c94c; }
.kk-pac__knopf.ist-an { transform: translateY(3px); box-shadow: 0 1px 0 #0a0c0b, inset 0 0 0 2px rgba(125, 255, 168, 0.5); }
@media (min-width: 900px) and (hover: hover) { .kk-pac__steuer { display: none; } }

.kk-pac__menue { gap: 7px; padding: 12px; }
.kk-pac__logo { font-size: clamp(2rem, 10vw, 3.2rem); }
.kk-pac__unter { margin: 0; font-size: 0.875rem; }
.kk-pac__mknopf--haupt { min-height: 48px; min-width: 64%; }
.kk-pac__reihe { flex-wrap: nowrap; gap: 6px; }
.kk-pac__reihe .kk-pac__mknopf { min-height: 38px; padding: 6px 9px; font-size: 0.75rem; }
.kk-pac__fuss { margin: 2px 0 0; }

/* Moorassi */
.kk-spielfeld--moorassi { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-spielfeld--moorassi .kk-spielfeld__canvas { aspect-ratio: 480 / 300; max-width: min(100%, 960px); margin-inline: auto; cursor: none; touch-action: none; }
.kk-spielfeld--moorassi .kk-spielfeld__anzeige { max-width: min(100%, 960px); margin-inline: auto; align-items: center; }
.kk-spielfeld--moorassi .kk-spielfeld__stufe { margin-left: auto; }
.kk-moor__steuer { display: grid; grid-template-columns: 1fr 1fr 1.2fr 1fr 1fr; gap: 8px; width: 100%; max-width: 520px; margin: 12px auto 0; touch-action: none; user-select: none; -webkit-user-select: none; }
.kk-moor__knopf { min-height: clamp(62px, 17vw, 76px); padding: 0; border: 0; border-radius: 16px; background: #1c211e; color: #fff; font-size: 1.6rem; font-weight: 900; box-shadow: 0 5px 0 #0a0c0b, inset 0 0 0 2px rgba(255, 255, 255, 0.08); cursor: pointer; touch-action: none; -webkit-tap-highlight-color: transparent; }
.kk-moor__knopf--laden { background: #3a2f10; color: #f2c94c; font-size: 1.9rem; }
.kk-moor__knopf.ist-an { transform: translateY(4px); box-shadow: 0 1px 0 #0a0c0b, inset 0 0 0 2px rgba(242, 201, 76, 0.5); }
.kk-moor__voll { margin-left: 6px; }
.kk-moor__zu { display: none; }
.kk-spielfeld--moorassi.kk-moor--vollbild { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; margin: 0; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); background: #000; }
.kk-moor--vollbild .kk-spielfeld__canvas { max-width: none; border-radius: 0; box-shadow: none; }
.kk-moor--vollbild .kk-spielfeld__anzeige { position: fixed; top: max(8px, env(safe-area-inset-top)); left: max(12px, env(safe-area-inset-left)); right: 70px; z-index: 2; max-width: none; margin: 0; pointer-events: none; text-shadow: 0 1px 3px #000; }
.kk-moor--vollbild .kk-spielfeld__anzeige button { pointer-events: auto; }
.kk-moor--vollbild .kk-moor__voll { display: none; }
.kk-moor--vollbild .kk-moor__zu { position: fixed; top: max(8px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right)); z-index: 3; display: grid; place-items: center; width: 46px; height: 46px; border: 0; border-radius: 50%; background: rgba(0, 0, 0, 0.6); color: #fff; font-size: 1.2rem; cursor: pointer; }
.kk-moor--vollbild .kk-moor__steuer { position: fixed; left: 0; right: 0; bottom: max(10px, env(safe-area-inset-bottom)); z-index: 2; max-width: none; margin: 0; padding: 0 max(12px, env(safe-area-inset-left)); grid-template-columns: 64px 64px 1fr 64px 64px; pointer-events: none; }
.kk-moor--vollbild .kk-moor__knopf { pointer-events: auto; min-height: 60px; opacity: 0.7; background: rgba(24, 28, 25, 0.75); }
.kk-moor--vollbild .kk-moor__knopf--laden { justify-self: center; width: 92px; background: rgba(58, 47, 16, 0.8); }
@media (hover: hover) and (min-width: 900px) { .kk-moor--vollbild .kk-moor__steuer { display: none; } }

.kk-arcadeteaser__alle { grid-column: 1 / -1; }
.kk-arcadeteaser__alle a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 12px 16px; border-radius: 16px; background: rgba(125, 255, 168, 0.06); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.35); color: var(--kk-neon); font-weight: 800; letter-spacing: 0.04em; text-decoration: none; transition: background 0.15s, box-shadow 0.15s; }
.kk-arcadeteaser__alle a:hover, .kk-arcadeteaser__alle a:focus-visible { background: rgba(125, 255, 168, 0.14); box-shadow: inset 0 0 0 1px var(--kk-neon), 0 0 18px rgba(125, 255, 168, 0.25); }
@media (max-width: 640px) {
	.kk-arcadeteaser__alle { flex: 0 0 62%; scroll-snap-align: start; }
	.kk-arcadeteaser__alle a { height: 100%; box-sizing: border-box; flex-direction: column; text-align: center; }
}
.kk-moor--vollbild .kk-spielfeld__anzeige { width: auto; }
.kk-moor--vollbild .kk-spielfeld__stufe { display: none; }

/* Vollbild für Arcade-Spiele (gemeinsam) */
.kk-spielfeld.kk-vollbild { position: fixed; inset: 0; z-index: 100000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; margin: 0; padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); background: #000; overflow: hidden; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-vollbild .kk-spielfeld__canvas { max-width: none !important; margin: 0 !important; flex: none; }
.kk-vollbild .kk-spielfeld__anzeige { width: min(100%, 560px) !important; max-width: none !important; margin: 0 auto !important; padding-right: 54px; }
.kk-vollbild .kk-spielfeld__hinweis, .kk-vollbild .kk-vollbild__an { display: none; }
.kk-vollbild__zu { display: none; }
.kk-vollbild .kk-vollbild__zu { position: fixed; top: max(8px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right)); z-index: 3; display: grid; place-items: center; width: 46px; height: 46px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.14); color: #fff; font-size: 1.2rem; cursor: pointer; }
.kk-vollbild__an { margin-left: 6px; }
/* Pinshotball: größere Knöpfe, nichts markierbar */
.kk-spielfeld--pinball { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-pin__steuer { max-width: 520px; padding: 14px 12px; gap: 10px; }
.kk-pin__knopf { width: clamp(80px, 25vw, 110px); }
.kk-pin__kappe { font-size: 2rem; }
.kk-pin__knopf--p { max-width: 150px; height: clamp(70px, 20vw, 88px); }
.kk-vollbild .kk-pin__steuer { width: min(100%, 560px); margin: 0 auto; }
/* Snake: größere Pfeile, nichts markierbar */
.kk-spielfeld--snake { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-snake__pfeile { grid-template-columns: repeat(3, clamp(72px, 22vw, 92px)); grid-template-rows: repeat(2, clamp(62px, 17vw, 76px)); gap: 8px; justify-content: center; margin-left: auto; margin-right: auto; }
.kk-snake__pfeil { font-size: 1.8rem; box-shadow: 0 4px 0 #0a0c0b, inset 0 0 0 1px #34403a; }

/* Reverse Kellerkicktipp */
.kk-tipp { max-width: 34rem; margin: 0 auto; user-select: none; -webkit-user-select: none; }
.kk-tipp__leiste { display: flex; justify-content: center; gap: 8px; margin: 12px 0; }
.kk-tipp__punkt { width: 14px; height: 14px; border-radius: 50%; box-shadow: inset 0 0 0 2px #34403a; }
.kk-tipp__punkt.ist-genau { background: var(--kk-neon); box-shadow: 0 0 10px rgba(125, 255, 168, 0.7); }
.kk-tipp__punkt.ist-tendenz { background: #f2c94c; }
.kk-tipp__punkt.ist-falsch { background: #e5322d; }
.kk-tipp__karte { padding: 18px; border-radius: 18px; background: #121612; box-shadow: inset 0 0 0 1px var(--kk-linie); text-align: center; }
.kk-tipp__logo { display: block; width: 56px; height: 56px; margin: 0 auto 8px; object-fit: contain; }
.kk-tipp__meta { margin: 0; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--kk-leise); }
.kk-tipp__paarung { margin: 6px 0 14px; font-size: 1.25rem; font-weight: 900; line-height: 1.25; }
.kk-tipp__felder { display: flex; align-items: flex-end; justify-content: center; gap: 10px; }
.kk-tipp__zaehler { display: grid; gap: 6px; justify-items: center; }
.kk-tipp__wer { font-size: 0.75rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kk-salbei); }
.kk-tipp__reihe { display: flex; align-items: center; gap: 6px; }
.kk-tipp__pm { width: 48px; height: 52px; border: 0; border-radius: 12px; background: #1c211e; color: var(--kk-neon); font-size: 1.6rem; font-weight: 900; cursor: pointer; box-shadow: inset 0 0 0 1px #34403a; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.kk-tipp__pm:disabled { opacity: 0.35; cursor: default; }
.kk-tipp__zahl { min-width: 2.2ch; font-size: 2.6rem; font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; }
.kk-tipp__doppelpunkt { padding-bottom: 10px; font-size: 2.2rem; font-weight: 900; color: var(--kk-leise); }
.kk-tipp__abgeben { margin-top: 16px; min-width: 60%; }
.kk-tipp__aufloesung { min-height: 1em; }
.kk-tipp__echt { margin: 16px 0 4px; font-size: 1.1rem; }
.kk-tipp__echt b { font-size: 1.6rem; color: #f2c94c; }
.kk-tipp__urteil { margin: 0 0 12px; font-weight: 900; }
.kk-tipp__urteil.ist-gut { color: var(--kk-neon); }
.kk-tipp__urteil.ist-schlecht { color: #ff8f8f; }

/* Raus mit der Kohle */
.kk-spielfeld--kohle, .kk-spielfeld--gta { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-spielfeld--kohle .kk-spielfeld__canvas, .kk-spielfeld--gta .kk-spielfeld__canvas { aspect-ratio: 320 / 200; image-rendering: pixelated; touch-action: none; }
.kk-kohle__steuer { display: grid; grid-template-columns: 1fr 1.3fr 1fr; gap: 10px; width: 100%; max-width: 520px; margin: 12px auto 0; touch-action: none; user-select: none; -webkit-user-select: none; }
.kk-kohle__knopf, .kk-gta__knopf { min-height: clamp(64px, 18vw, 80px); padding: 0; border: 0; border-radius: 16px; background: #1c211e; color: #fff; font-size: 1.7rem; font-weight: 900; box-shadow: 0 5px 0 #0a0c0b, inset 0 0 0 2px rgba(255, 255, 255, 0.08); cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; transition: transform 0.05s, box-shadow 0.05s; }
.kk-kohle__knopf--sprung { background: #0d2b1c; color: var(--kk-neon); font-size: 2rem; }
.kk-kohle__knopf.ist-an, .kk-gta__knopf.ist-an { transform: translateY(4px); box-shadow: 0 1px 0 #0a0c0b, inset 0 0 0 2px var(--kk-neon); }

/* Grand Theft Kellerassi */
.kk-gta__steuer { display: flex; justify-content: space-between; align-items: center; gap: 10px; box-sizing: border-box; width: 100%; max-width: 560px; margin: 12px auto 0; touch-action: none; user-select: none; -webkit-user-select: none; }
.kk-gta__kreuz { display: grid; grid-template-columns: repeat(3, clamp(44px, 13vw, 64px)); grid-template-rows: repeat(3, clamp(44px, 12vw, 56px)); gap: 5px; }
.kk-gta__kreuz .kk-gta__knopf { min-height: 0; font-size: 1.4rem; }
.kk-gta__knopf--hoch { grid-column: 2; grid-row: 1; }
.kk-gta__knopf--links { grid-column: 1; grid-row: 2; }
.kk-gta__knopf--rechts { grid-column: 3; grid-row: 2; }
.kk-gta__knopf--runter { grid-column: 2; grid-row: 3; }
.kk-gta__aktion { display: grid; grid-template-columns: repeat(2, clamp(48px, 14vw, 66px)); grid-template-rows: auto auto; gap: 8px; }
.kk-gta__knopf--schuss { grid-column: 1 / span 2; min-height: clamp(70px, 20vw, 86px); border-radius: 50%; aspect-ratio: auto; background: #3a0d0d; font-size: 2.2rem; }
.kk-gta__knopf--wechsel { font-size: 1.5rem; color: #f2c94c; }
.kk-gta__knopf--auto { font-size: 1.4rem; }
.kk-spielfeld.kk-vollbild .kk-kohle__steuer, .kk-spielfeld.kk-vollbild .kk-gta__steuer { margin-top: 8px; }
@media (max-width: 560px) {
	.kk-tipp__karte { padding: 14px 10px; }
	.kk-tipp__felder { align-items: center; gap: 6px; }
	.kk-tipp__reihe { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
	.kk-tipp__reihe .kk-tipp__zahl { grid-column: 1 / -1; grid-row: 1; justify-self: center; }
	.kk-tipp__pm { width: 52px; height: 48px; }
}

/* Bestenliste: Heute, Monat, Ewig */
.kk-arcade__listenkopf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-bottom: 0.6rem; }
.kk-arcade__listenkopf .kk-arcade__listentitel { margin: 0; }
.kk-arcade__reiter { display: inline-flex; padding: 3px; border-radius: 999px; background: #121612; box-shadow: inset 0 0 0 1px var(--kk-linie); }
.kk-arcade__reiter button { min-height: 34px; padding: 4px 14px; border: 0; border-radius: 999px; background: transparent; color: var(--kk-salbei); font: inherit; font-size: 0.8125rem; font-weight: 700; cursor: pointer; }
.kk-arcade__reiter button[aria-pressed="true"] { background: var(--kk-neon); color: #0e1210; }
.kk-arcade__liste ol[aria-busy="true"] { opacity: 0.5; }

/* Kellerassi des Monats */
.kk-assimonat { margin: 0 0 18px; padding: 16px 18px; border-radius: 18px; background: linear-gradient(135deg, #2a2512, #121a14); box-shadow: inset 0 0 0 1px rgba(242, 201, 76, 0.35); }
.kk-assimonat__titel { margin: 0 0 6px; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kk-stern, #f2c94c); }
.kk-assimonat__fuehrt { margin: 0; font-size: 1.125rem; }
.kk-assimonat__fuehrt strong { color: var(--kk-stern, #f2c94c); }
.kk-assimonat__liste { margin: 8px 0 0; padding-left: 1.6em; color: var(--kk-salbei); }
.kk-assimonat__liste li { padding: 2px 0; }
.kk-assimonat__liste li span { color: var(--kk-text); margin-right: 8px; }
.kk-assimonat__liste b { color: var(--kk-neon); font-variant-numeric: tabular-nums; }
.kk-assimonat__regel { margin: 10px 0 0; font-size: 0.8125rem; color: var(--kk-leise); }

/* Angry Assi */
.kk-spielfeld--angry .kk-spielfeld__canvas, .kk-spielfeld--escape .kk-spielfeld__canvas { aspect-ratio: 480 / 270; touch-action: none; }
.kk-spielfeld--angry, .kk-spielfeld--escape { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-angry__leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; width: 100%; max-width: 640px; margin: 10px auto 0; }
.kk-angry__knopf { min-height: 48px; padding: 0 16px; border: 0; border-radius: 14px; background: #1c211e; color: #fff; font: inherit; font-weight: 800; box-shadow: inset 0 0 0 1px #34403a; cursor: pointer; }
.kk-angry__knopf--weiter { background: var(--kk-neon); color: #0e1210; }
.kk-angry__info { flex: 1 1 200px; margin: 0; font-size: 0.875rem; color: var(--kk-salbei); }
.kk-angry__info b { color: var(--kk-text); margin-right: 4px; }

/* Keller Escape */
.kk-spielfeld--escape { position: relative; }
.kk-escape__text { min-height: 3.2em; margin: 10px 0 0; padding: 10px 14px; border-radius: 12px; background: #140f1a; box-shadow: inset 0 0 0 1px #3a2a4a; color: #e8dcff; font-size: 0.9375rem; }
.kk-escape__nav { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.kk-escape__raum { flex: 1; text-align: center; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: #ff8a1f; }
.kk-escape__knopf { min-width: 52px; min-height: 48px; padding: 0 14px; border: 0; border-radius: 14px; background: #1c1622; color: #fff; font: inherit; font-size: 1.1rem; font-weight: 800; box-shadow: inset 0 0 0 1px #3a2a4a; cursor: pointer; }
.kk-escape__knopf--tipp { font-size: 0.875rem; color: #9b6bff; }
.kk-escape__tasche { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.kk-escape__leer { color: var(--kk-leise); font-size: 0.875rem; }
.kk-escape__ding { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; background: #1c1622; color: #fff; font: inherit; font-size: 0.875rem; box-shadow: inset 0 0 0 1px #3a2a4a; cursor: pointer; }
.kk-escape__ding.ist-gewaehlt { box-shadow: inset 0 0 0 2px #9b6bff; background: #2a1f3a; }
.kk-escape__symbol { font-size: 1.2rem; }
.kk-escape__stellen { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.kk-escape__stelle { min-height: 36px; padding: 0 10px; border: 0; border-radius: 999px; background: transparent; color: var(--kk-salbei); font: inherit; font-size: 0.8125rem; box-shadow: inset 0 0 0 1px #34403a; cursor: pointer; }
.kk-escape__dialog { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; padding: 12px; background: rgba(0, 0, 0, 0.7); }
.kk-escape__dialog[hidden] { display: none; }
.kk-escape__karte { width: min(100%, 420px); padding: 18px; border-radius: 18px; background: #140f1a; box-shadow: 0 0 0 1px #9b6bff, 0 0 40px rgba(155, 107, 255, 0.35); text-align: center; }
.kk-escape__titel { margin: 0 0 12px; font-weight: 800; color: #ff8a1f; }
.kk-escape__raeder { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.kk-escape__rad { display: grid; justify-items: center; gap: 4px; }
.kk-escape__pm { width: 52px; height: 44px; border: 0; border-radius: 12px; background: #2a1f3a; color: #fff; font-size: 1rem; cursor: pointer; }
.kk-escape__zahl { font-size: 2rem; font-weight: 900; color: #fff; font-variant-numeric: tabular-nums; }
.kk-escape__radname { font-size: 0.75rem; color: var(--kk-salbei); }
.kk-escape__dialogknoepfe { display: flex; justify-content: center; gap: 10px; margin-top: 14px; }

/* Paket 2: Hochformat- und Querformat-Spiele, Ein-, Zwei- und Vier-Knopf-Steuerung */
.kk-spielfeld--hoch .kk-spielfeld__canvas { aspect-ratio: 240 / 360; max-width: min(100%, calc((100svh - 240px) * 240 / 360)); margin-inline: auto; touch-action: none; }
.kk-spielfeld--hoch .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 240px) * 240 / 360)); margin-inline: auto; }
.kk-spielfeld--quer .kk-spielfeld__canvas { aspect-ratio: 400 / 225; touch-action: none; }
.kk-spielfeld--hoch, .kk-spielfeld--quer { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kk-eins__steuer, .kk-zwei__steuer, .kk-vier__steuer { display: grid; gap: 10px; width: 100%; max-width: 420px; margin: 12px auto 0; touch-action: none; user-select: none; -webkit-user-select: none; }
.kk-zwei__steuer { grid-template-columns: 1fr 1fr; }
.kk-vier__steuer { grid-template-columns: repeat(4, 1fr); }
.kk-eins__knopf, .kk-zwei__knopf, .kk-vier__knopf { min-height: clamp(62px, 17vw, 78px); padding: 0; border: 0; border-radius: 16px; background: #1c211e; color: #fff; font-size: 1.7rem; font-weight: 900; box-shadow: 0 5px 0 #0a0c0b, inset 0 0 0 2px rgba(255, 255, 255, 0.08); cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; transition: transform 0.05s, box-shadow 0.05s; }
.kk-eins__knopf { background: #0d2b1c; color: var(--kk-neon); }
.kk-eins__knopf.ist-an, .kk-zwei__knopf.ist-an, .kk-vier__knopf.ist-an { transform: translateY(4px); box-shadow: 0 1px 0 #0a0c0b, inset 0 0 0 2px var(--kk-neon); }

/* Kickerkeller Tycoon */
.kk-tycoon__aktionen { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.kk-tycoon__aktionen .kk-angry__knopf { min-height: 52px; }
.kk-tycoon__ausbau { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; margin-top: 10px; }
.kk-tycoon__knopf { display: grid; gap: 2px; padding: 10px 12px; border: 0; border-radius: 14px; background: #1c211e; color: var(--kk-text); font: inherit; text-align: left; box-shadow: inset 0 0 0 1px #34403a; cursor: pointer; }
.kk-tycoon__knopf b { font-size: 0.875rem; color: var(--kk-neon); }
.kk-tycoon__knopf span { font-size: 0.75rem; color: var(--kk-salbei); }
.kk-tycoon__knopf:disabled { opacity: 0.45; cursor: default; }
.kk-fahrt__gas { background: #0d2b1c; color: var(--kk-neon); }
.kk-fahrt__bremse { background: #3a0d0d; color: #ff8f8f; }

/* ------------------------------------------------------------------
 * Arcade-Lobby und Spielseiten (ab 1.57.0)
 * ------------------------------------------------------------------ */
.kk-lobby { box-sizing: border-box; max-width: 1100px; margin: clamp(1rem, 3vw, 2rem) auto 3rem !important; display: flex; flex-direction: column; gap: clamp(28px, 5vw, 44px); scroll-margin-top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 16px); }
.kk-lobby__kopf { display: flex; flex-direction: column; gap: 2px; margin-bottom: 12px; }
.kk-lobby__h2 { margin: 0 !important; font-size: clamp(1.05rem, 2.6vw, 1.3rem); font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.kk-lobby__unter { margin: 0 !important; font-size: 0.875rem; color: var(--kk-leise); }
.kk-lobby section, .kk-lobby__gruppe { scroll-margin-top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 72px); }
.kk-lobby__heute { padding: clamp(14px, 3vw, 22px); border-radius: 24px; background: linear-gradient(160deg, #13261a, #0e130f 70%); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.28); }
.kk-lobby__heute .kk-assimonat { margin: 14px 0 0; }

.kk-spielkacheln { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.kk-spielkacheln--heute { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kk-spielkacheln--reihe { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kk-spielkachel { position: relative; display: flex; flex-direction: column; min-width: 0; border-radius: 16px; overflow: hidden; background: #141c17; box-shadow: inset 0 0 0 1px #2a3a2f; color: var(--kk-text) !important; text-decoration: none !important; transition: box-shadow 0.2s, translate 0.2s; }
.kk-spielkachel--gross { grid-column: span 2; }
.kk-spielkacheln--heute .kk-spielkachel--gross { grid-column: auto; }
.kk-spielkachel__bild { position: relative; display: block; aspect-ratio: 16 / 10; background: #0b100d; overflow: hidden; }
.kk-spielkachel__bild img, .kk-spielkachel__bild video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.kk-spielkachel__bild video { opacity: 0; transition: opacity 0.25s; }
.kk-spielkachel__bild.kk-spielt video { opacity: 1; }
.kk-spielkachel__text { display: flex; flex-direction: column; gap: 3px; padding: 10px 12px 12px; }
.kk-spielkachel__text strong { font-size: 0.9375rem; line-height: 1.2; font-weight: 800; }
.kk-spielkachel__meta { font-size: 0.75rem; color: var(--kk-leise); }
.kk-spielkachel__rekord { font-size: 0.75rem; font-weight: 700; color: var(--kk-stern); font-variant-numeric: tabular-nums; }
.kk-spielkachel:hover, .kk-spielkachel:focus-visible { box-shadow: inset 0 0 0 1px var(--kk-neon), 0 0 26px rgba(80, 255, 140, 0.18); translate: 0 -2px; outline: none; }

.kk-sprungleiste { position: sticky; top: calc(var(--kk-kopf-hoehe) + var(--kk-admin) + 8px); z-index: 5; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--kk-seite)); padding: 8px var(--kk-seite); background: linear-gradient(#0c0d0cf2 70%, #0c0d0c00); }
.kk-sprungleiste::-webkit-scrollbar { display: none; }
.kk-sprungleiste a { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px; background: #1d2a22; color: var(--kk-text) !important; font-size: 0.8125rem; font-weight: 700; text-decoration: none !important; white-space: nowrap; }
.kk-sprungleiste a span { color: var(--kk-salbei); font-weight: 600; }
.kk-sprungleiste a:hover, .kk-sprungleiste a:focus-visible { background: var(--kk-neon); color: #0b100d !important; outline: none; }
.kk-sprungleiste a:hover span, .kk-sprungleiste a:focus-visible span { color: #0b100d; }

details.kk-assimonat summary { list-style: none; cursor: pointer; display: flex; flex-direction: column; gap: 4px; }
details.kk-assimonat summary::-webkit-details-marker { display: none; }
details.kk-assimonat summary::after { content: "Wie geht das? ▾"; font-size: 0.75rem; color: var(--kk-salbei); }
details.kk-assimonat[open] summary::after { content: "Weniger ▴"; }
details.kk-assimonat .kk-assimonat__titel { margin: 0; }

/* Spielseite */
.kk-spielseite { box-sizing: border-box; max-width: 860px; margin: 0 auto 3rem; padding-top: 12px; }
.kk-spielseite__zurueck a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 700; font-size: 0.9375rem; text-decoration: none; }
.kk-spielseite__kopf { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(16px, 4vw, 32px); align-items: center; margin: 8px 0 18px; }
.kk-spielseite__bild { aspect-ratio: 16 / 10; border-radius: 20px; overflow: hidden; background: #0b100d; box-shadow: 0 0 0 1px var(--kk-linie), 0 24px 60px rgba(0, 0, 0, 0.45); view-transition-name: kk-spiel; }
.kk-spielseite__bild img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kk-spielseite__titelblock .kk-ueberzeile { margin: 0 0 6px; }
.kk-spielseite__titel { margin: 0 0 10px !important; font-size: clamp(1.8rem, 5vw, 2.6rem); line-height: 1; font-weight: 900; text-transform: uppercase; }
.kk-spielseite__steuerung { display: inline-block; margin: 0; padding: 6px 12px; border-radius: 999px; background: #1d2a22; font-size: 0.8125rem; }
.kk-spielseite__h2 { margin: 0 0 12px !important; font-size: 0.8125rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.kk-spielseite .kk-arcade { margin: 0 !important; }
.kk-arcade--seite .kk-arcade__text { margin: 0 0 4px; font-size: 1rem; color: var(--kk-leise); }
.kk-arcade--seite .kk-arcade__start { width: 100%; max-width: 420px; min-height: 58px; font-size: 1.0625rem; }
.kk-spielseite__weiter { margin-top: 32px; }
.kk-spielkacheln--klein { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 16px; }

.kk-soso { margin-top: 1.6rem; }
.kk-soso__titel { margin: 0 0 10px !important; font-size: 0.8125rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.kk-soso ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.kk-soso li { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 12px 8px; border-radius: 14px; background: #141c17; box-shadow: inset 0 0 0 1px #2a3a2f; text-align: center; font-size: 0.8125rem; line-height: 1.3; }
.kk-soso__nr { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(125, 255, 168, 0.14); color: var(--kk-neon); font-weight: 900; }

::view-transition-group(kk-spiel) { animation-duration: 0.35s; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); }
::view-transition-old(kk-spiel), ::view-transition-new(kk-spiel) { height: 100%; object-fit: cover; }

@media (max-width: 900px) {
	.kk-spielkacheln, .kk-spielkacheln--reihe, .kk-spielkacheln--klein { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.kk-spielkacheln--reihe { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.kk-spielkacheln--reihe .kk-spielkachel { flex: 0 0 44%; scroll-snap-align: start; }
}
@media (max-width: 640px) {
	.kk-lobby { margin-left: 12px !important; margin-right: 12px !important; }
	.kk-spielkacheln--heute { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kk-spielkachel__text { padding: 8px 10px 10px; }
	.kk-spielkachel__text strong { font-size: 0.875rem; }
	.kk-spielseite { padding: 4px 12px 0; }
	.kk-spielseite__kopf { grid-template-columns: 1fr; gap: 14px; }
	.kk-spielseite .kk-arcade { margin: 0 -12px !important; border-radius: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.kk-spielkachel { transition: none; }
	.kk-spielkachel:hover { translate: none; }
	.kk-spielkachel__bild video { display: none; }
	::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
.kk-spielseite__kurz { margin: 0 0 12px !important; font-size: 1rem; line-height: 1.45; color: var(--kk-leise); }
.kk-soso__mehr { margin-top: 10px; font-size: 0.875rem; color: var(--kk-leise); }
.kk-soso__mehr summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 700; color: var(--kk-neon); }
.kk-soso__mehr p { margin: 0; line-height: 1.55; }
.kk-arcade--seite .kk-arcade__buehne { margin-top: 0; }
.kk-arcade--seite .kk-arcade__start { background: var(--kk-neon); color: #0b100d; border-color: var(--kk-neon); font-weight: 900; }
.kk-arcade--seite .kk-arcade__start:hover, .kk-arcade--seite .kk-arcade__start:focus-visible { background: #b6ffd0; color: #0b100d; }
@media (max-width: 640px) { .kk-spielseite .kk-arcade { box-shadow: none; border-top: 1px solid var(--kk-linie); border-bottom: 1px solid var(--kk-linie); } }

/* ------------------------------------------------------------------
 * Auswärtsfahrt (ab 1.57.0): Pedale, Pause, Abschlusstafel. Schrift Lilita One (OFL), lokal.
 * ------------------------------------------------------------------ */
.kk-spielfeld--fahrt { position: relative; }
.kk-spielfeld--fahrt .kk-spielfeld__canvas { border-radius: 14px; box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.35), 0 18px 40px rgba(0, 0, 0, 0.5); background: #0b100d; }
.kk-spielfeld--fahrt .kk-spielfeld__stand, .kk-spielfeld--fahrt .kk-spielfeld__stufe { font-family: KKFahrt, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.04em; text-transform: uppercase; }
.kk-spielfeld--fahrt .kk-spielfeld__stand b { font-weight: 400; }
.kk-spielfeld--fahrt .kk-spielfeld__stufe { padding: 4px 10px; border-radius: 999px; background: #1d2a22; color: var(--kk-stern); font-size: 0.875rem; }
.kk-fahrt__pedale { gap: 14px; }
.kk-fahrt__pedale .kk-zwei__knopf { display: flex; align-items: center; justify-content: center; gap: 8px; font-family: KKFahrt, Montserrat, sans-serif; font-size: 1.125rem; font-weight: 400; letter-spacing: 0.06em; text-transform: uppercase; border-radius: 18px; transition: transform 0.06s, box-shadow 0.06s, filter 0.12s; }
.kk-fahrt__pedale svg { width: 34px; height: 34px; flex: none; }
.kk-fahrt__pedale .kk-fahrt__gas { background: linear-gradient(#2e9a5a, #1d6b3e); color: #eafff1; box-shadow: 0 6px 0 #0d3b22, inset 0 2px 0 rgba(255, 255, 255, 0.25); }
.kk-fahrt__pedale .kk-fahrt__bremse { background: linear-gradient(#c8434a, #8f262c); color: #fff0f0; box-shadow: 0 6px 0 #4d1216, inset 0 2px 0 rgba(255, 255, 255, 0.25); }
.kk-fahrt__pedale .kk-zwei__knopf.ist-an { transform: translateY(5px) scale(0.98); box-shadow: 0 1px 0 #000, inset 0 2px 8px rgba(0, 0, 0, 0.35); filter: brightness(1.12); }
.kk-fahrt__leiste .kk-angry__knopf { font-family: KKFahrt, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; transition: transform 0.08s, background-color 0.15s; }
.kk-fahrt__leiste .kk-angry__knopf:active { transform: scale(0.96); }
.kk-fahrt__leiste .kk-fahrt__knopf--rund { width: 48px; padding: 0; font-size: 1.15rem; }
.kk-fahrt__leiste .kk-angry__knopf--weiter { animation: kk-fahrt-winken 1.4s ease-in-out infinite; }
@keyframes kk-fahrt-winken { 0%, 100% { transform: none; } 50% { transform: translateY(-2px); box-shadow: 0 0 22px rgba(125, 255, 168, 0.45); } }

.kk-fahrt__pause { position: absolute; z-index: 5; display: grid; place-items: center; border-radius: 14px; background: rgba(6, 8, 12, 0); backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0); transition: background-color 0.2s, backdrop-filter 0.2s; }
.kk-fahrt__pause.ist-offen { background: rgba(6, 8, 12, 0.62); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.kk-fahrt__pausekarte { display: flex; flex-direction: column; gap: 8px; width: min(86%, 300px); padding: 18px; border-radius: 18px; background: linear-gradient(#1f3a2a, #0f1a14); box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.45), 0 20px 50px rgba(0, 0, 0, 0.55); text-align: center; transform: scale(0.85); opacity: 0; transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s; }
.kk-fahrt__pause.ist-offen .kk-fahrt__pausekarte { transform: none; opacity: 1; }
.kk-fahrt__pausetitel { margin: 0; font-family: KKFahrt, Montserrat, sans-serif; font-size: 2rem; line-height: 1; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; text-shadow: 2px 3px 0 #120d16; }
.kk-fahrt__pauseinfo { margin: 0 0 4px; font-size: 0.8125rem; color: #c3d2c8; }
.kk-fahrt__pausekarte .kk-angry__knopf { width: 100%; font-family: KKFahrt, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; }
.kk-vollbild .kk-fahrt__pausekarte { max-height: 90%; overflow: auto; }

.kk-fahrt-ende .kk-fahrt-ende__bild { display: block; width: min(100%, 360px); height: auto; margin: 0 auto 10px; border-radius: 14px; box-shadow: 0 0 0 1px var(--kk-linie); }
.kk-fahrt-ende .kk-arcade__wert { font-family: KKFahrt, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.02em; }
.kk-fahrt-ende .kk-ueberzeile, .kk-fahrt-ende .kk-arcade__einheit { font-family: KKFahrt, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.1em; }
.kk-fahrt-ende__liste { display: grid; gap: 6px; max-width: 420px; margin: 14px auto; padding: 0; list-style: none; text-align: left; }
.kk-fahrt-ende__liste li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; background: #141c17; box-shadow: inset 0 0 0 1px #2a3a2f; color: var(--kk-leise); font-size: 0.875rem; opacity: 0; animation: kk-fahrt-zeile 0.35s ease-out forwards; }
.kk-fahrt-ende__liste li:nth-child(2) { animation-delay: 0.06s; } .kk-fahrt-ende__liste li:nth-child(3) { animation-delay: 0.12s; } .kk-fahrt-ende__liste li:nth-child(4) { animation-delay: 0.18s; } .kk-fahrt-ende__liste li:nth-child(5) { animation-delay: 0.24s; } .kk-fahrt-ende__liste li:nth-child(6) { animation-delay: 0.3s; } .kk-fahrt-ende__liste li:nth-child(7) { animation-delay: 0.36s; }
.kk-fahrt-ende__liste li.ist-geschafft { color: var(--kk-text); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.4); }
.kk-fahrt-ende__nr { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #1d2a22; font-family: KKFahrt, Montserrat, sans-serif; color: var(--kk-salbei); }
.kk-fahrt-ende__liste li.ist-geschafft .kk-fahrt-ende__nr { background: var(--kk-neon); color: #0b100d; }
.kk-fahrt-ende__liste b { font-family: KKFahrt, Montserrat, sans-serif; font-weight: 400; color: var(--kk-salbei); }
.kk-fahrt-ende__liste li.ist-geschafft b { color: var(--kk-neon); }
@keyframes kk-fahrt-zeile { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
	.kk-fahrt__leiste .kk-angry__knopf--weiter, .kk-fahrt-ende__liste li { animation: none; opacity: 1; }
	.kk-fahrt__pausekarte, .kk-fahrt__pause { transition: none; }
}
/* Auswärtsfahrt im Vollbild quer: Pedale links und rechts neben dem Spielfeld, Knöpfe oben links. */
@media (orientation: landscape) and (max-height: 560px) {
	.kk-vollbild.kk-spielfeld--fahrt .kk-fahrt__pedale { position: fixed; left: 0; right: 0; bottom: max(14px, env(safe-area-inset-bottom)); z-index: 4; display: flex; justify-content: space-between; max-width: none; margin: 0; padding: 0 max(14px, env(safe-area-inset-left)) 0 max(14px, env(safe-area-inset-right)); pointer-events: none; }
	.kk-vollbild.kk-spielfeld--fahrt .kk-fahrt__pedale .kk-zwei__knopf { pointer-events: auto; flex-direction: column; gap: 4px; width: clamp(88px, 14vw, 120px); min-height: clamp(110px, 42vh, 170px); font-size: 0.9375rem; }
	.kk-vollbild.kk-spielfeld--fahrt .kk-fahrt__pedale svg { width: 40px; height: 40px; }
	.kk-vollbild.kk-spielfeld--fahrt .kk-fahrt__leiste { position: fixed; top: max(12px, env(safe-area-inset-top)); left: max(12px, env(safe-area-inset-left)); z-index: 4; flex-direction: column; align-items: flex-start; width: clamp(92px, 15vw, 130px); max-width: none; margin: 0; }
	.kk-vollbild.kk-spielfeld--fahrt .kk-fahrt__leiste .kk-fahrt__knopf--aufhoeren { display: none; }
	.kk-vollbild.kk-spielfeld--fahrt .kk-fahrt__leiste .kk-angry__knopf--weiter { width: 100%; min-height: 44px; padding: 6px 8px; font-size: 0.8125rem; white-space: normal; }
}
/* Auswärtsfahrt: Levelkarte (ab 1.58.0) */
.kk-fahrt__levelkarte { width: min(94%, 520px); max-height: 92%; overflow: auto; gap: 6px; padding: 14px 16px; overscroll-behavior: contain; }
.kk-fahrt__levelkarte .kk-fahrt__pausetitel { font-size: 1.6rem; }
.kk-fahrt__akt { margin: 8px 0 2px; font-family: KKFahrt, Montserrat, sans-serif; font-size: 0.875rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--kk-stern); text-align: left; }
.kk-fahrt__level { display: grid; grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); gap: 6px; }
.kk-fahrt__levelknopf { position: relative; display: grid; place-items: center; align-content: center; gap: 1px; min-height: 52px; padding: 4px 2px; border: 0; border-radius: 12px; background: #1c2a22; color: #fff; box-shadow: inset 0 0 0 1px #34403a, 0 3px 0 #0a0c0b; font: inherit; cursor: pointer; transition: transform 0.08s, background-color 0.15s; }
.kk-fahrt__levelknopf b { font-family: KKFahrt, Montserrat, sans-serif; font-weight: 400; font-size: 1.15rem; line-height: 1; }
.kk-fahrt__levelknopf span { font-size: 0.5625rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--kk-stern); }
.kk-fahrt__levelknopf svg { position: absolute; right: 4px; top: 4px; width: 14px; height: 14px; color: #8a958e; }
.kk-fahrt__levelknopf:hover:not(:disabled), .kk-fahrt__levelknopf:focus-visible { background: #24372b; outline: 2px solid var(--kk-neon); outline-offset: 1px; }
.kk-fahrt__levelknopf:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 0 0 1px #34403a; }
.kk-fahrt__levelknopf.ist-geschafft { background: #1f6b3e; box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.6), 0 3px 0 #0d3b22; }
.kk-fahrt__levelknopf.ist-boss span { color: #ff8f8f; }
.kk-fahrt__levelknopf.ist-bonus span { color: var(--kk-neon); }
.kk-fahrt__levelknopf.ist-zu { cursor: not-allowed; opacity: 0.45; background: #141a16; }

/* ------------------------------------------------------------------
 * Arcade im neuen Look (ab 1.59.0): gemeinsamer Rahmen für alle Spiele.
 * Schrift Lilita One (OFL, lokal) als „KKArcade“, wird beim Spielstart geladen.
 * ------------------------------------------------------------------ */
.kk-arcade--modern .kk-spielfeld__canvas { border-radius: 14px; box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.35), 0 18px 40px rgba(0, 0, 0, 0.5); background: #0b100d; }
.kk-arcade--modern .kk-spielfeld__stand, .kk-arcade--modern .kk-spielfeld__stufe { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.04em; text-transform: uppercase; }
.kk-arcade--modern .kk-spielfeld__stand b { font-weight: 400; }
.kk-arcade--modern .kk-spielfeld__stufe { padding: 4px 10px; border-radius: 999px; background: #1d2a22; color: var(--kk-stern); font-size: 0.875rem; }
.kk-arcade--modern .kk-angry__knopf, .kk-arcade--modern .kk-gta__knopf, .kk-arcade--modern .kk-escape__knopf, .kk-arcade--modern .kk-tycoon__knopf, .kk-arcade--modern .kk-welt__knopf, .kk-arcade--modern .kk-regel__knopf, .kk-arcade--modern .kk-taxi__knopf, .kk-arcade--modern .kk-pin__knopf, .kk-arcade--modern .kk-pac__knopf, .kk-arcade--modern .kk-eins__knopf, .kk-arcade--modern .kk-zwei__knopf, .kk-arcade--modern .kk-vier__knopf { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; transition: transform 0.08s, filter 0.12s, background-color 0.15s; }
.kk-arcade--modern .kk-angry__knopf:active, .kk-arcade--modern .kk-gta__knopf:active, .kk-arcade--modern .kk-tycoon__knopf:active, .kk-arcade--modern .kk-escape__knopf:active { transform: scale(0.96); }
.kk-arcade--modern .kk-arcade__start { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.06em; }
.kk-arcade--modern .kk-quiz__antwort, .kk-arcade--modern .kk-raten__antwort, .kk-arcade--modern .kk-road__option, .kk-arcade--modern .kk-arcade__wahl button { transition: transform 0.08s, box-shadow 0.15s, background-color 0.15s; }
.kk-arcade--modern .kk-quiz__antwort:active, .kk-arcade--modern .kk-raten__antwort:active, .kk-arcade--modern .kk-road__option:active { transform: scale(0.98); }
/* Ergebnis: große Arcade-Zahl, Banner-Überzeile */
.kk-arcade--modern .kk-arcade__ergebnis { position: relative; padding: clamp(16px, 4vw, 26px); border-radius: 20px; background: radial-gradient(circle at 50% 0%, rgba(125, 255, 168, 0.12), transparent 60%), #0f1611; box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.3); animation: kk-ergebnis-rein 0.4s cubic-bezier(0.34, 1.56, 0.64, 1); }
.kk-arcade--modern .kk-arcade__ergebnis > .kk-ueberzeile { display: inline-block; padding: 4px 14px; border-radius: 6px; background: var(--kk-stern); color: #120d16; font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: 0.9375rem; letter-spacing: 0.08em; transform: rotate(-2deg); box-shadow: 3px 3px 0 #120d16; }
.kk-arcade--modern .kk-arcade__wert { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.02em; font-size: clamp(3rem, 12vw, 5rem); -webkit-text-stroke: 2px #120d16; paint-order: stroke fill; }
.kk-arcade--modern .kk-arcade__einheit { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.12em; }
.kk-arcade--modern .kk-arcade__ergebnis .kk-knopf { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.06em; }
@keyframes kk-ergebnis-rein { from { opacity: 0; transform: scale(0.92); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .kk-arcade--modern .kk-arcade__ergebnis { animation: none; } }
.kk-arcade--modern .kk-tycoon__knopf { text-transform: none; letter-spacing: 0; background: linear-gradient(#22302a, #161d19); box-shadow: inset 0 0 0 1px #34403a, 0 3px 0 #0a0c0b; }
.kk-arcade--modern .kk-tycoon__knopf b { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: 0.9375rem; letter-spacing: 0.04em; text-transform: uppercase; }
.kk-arcade--modern .kk-tycoon__knopf span { font-family: Montserrat, sans-serif; font-weight: 500; letter-spacing: 0; text-transform: none; }
.kk-arcade--modern .kk-tycoon__knopf:not(:disabled):hover { box-shadow: inset 0 0 0 1px var(--kk-neon), 0 3px 0 #0a0c0b; }
.kk-arcade--modern .kk-gta__knopf svg { display: block; margin: auto; }
.kk-arcade--modern .kk-hook__knopf { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 1.125rem; }

/* ------------------------------------------------------------------
 * Quiz-, Karten- und Tischspiele im neuen Look (ab 1.59.0)
 * Kellerbühne mit Ziegelwand, Arcade-Schrift, Knöpfe mit Tiefe, Treffer- und Fehleranimationen.
 * ------------------------------------------------------------------ */
.kk-arcade--modern .kk-quiz, .kk-arcade--modern .kk-hoeher, .kk-arcade--modern .kk-tipp, .kk-arcade--modern .kk-doppel, .kk-arcade--modern .kk-impl, .kk-arcade--modern .kk-wort, .kk-arcade--modern .kk-memo, .kk-arcade--modern .kk-road, .kk-arcade--modern .kk-ball, .kk-arcade--modern .kk-implodiert {
	position: relative; padding: clamp(14px, 3.5vw, 24px); border-radius: 20px; overflow: hidden;
	background:
		radial-gradient(ellipse at 50% -10%, rgba(255, 214, 140, 0.16), transparent 55%),
		repeating-linear-gradient(0deg, transparent 0 21px, rgba(0, 0, 0, 0.22) 21px 23px),
		repeating-linear-gradient(90deg, transparent 0 46px, rgba(0, 0, 0, 0.16) 46px 48px),
		linear-gradient(180deg, #231a2c, #150f1b 70%, #100c14);
	box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.3), 0 18px 40px rgba(0, 0, 0, 0.45);
}
.kk-arcade--modern .kk-quiz__kopf { align-items: center; margin-bottom: 4px; font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: 0.875rem; letter-spacing: 0.06em; }
.kk-arcade--modern .kk-quiz__nr, .kk-arcade--modern .kk-quiz__punkte { padding: 5px 12px; border-radius: 999px; background: rgba(10, 8, 14, 0.7); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); color: #fff; }
.kk-arcade--modern .kk-quiz__punkte { color: var(--kk-neon); }
.kk-arcade--modern .kk-quiz__zeit { height: 10px; margin: 12px 0 20px; background: rgba(0, 0, 0, 0.45); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); }
.kk-arcade--modern .kk-quiz__zeit span { background: linear-gradient(90deg, var(--kk-neon), #f2c94c); border-radius: 999px; }
.kk-arcade--modern .kk-quiz__frage, .kk-arcade--modern .kk-raten__frage, .kk-arcade--modern .kk-hoeher__frage, .kk-arcade--modern .kk-doppel__frage, .kk-arcade--modern .kk-impl__frage, .kk-arcade--modern .kk-arcade__frage, .kk-arcade--modern .kk-road__titel {
	font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: clamp(1.25rem, 4vw, 1.6rem); line-height: 1.2; letter-spacing: 0.01em; color: #fff; text-shadow: 0 2px 0 #120d16, 0 0 18px rgba(125, 255, 168, 0.15);
}
/* Antwortknöpfe mit Tiefe */
.kk-arcade--modern .kk-quiz__antwort, .kk-arcade--modern .kk-raten__antwort, .kk-arcade--modern .kk-impl__aussage, .kk-arcade--modern .kk-road__option, .kk-arcade--modern .kk-doppel__karte, .kk-arcade--modern .kk-hoeher__karte, .kk-arcade--modern .kk-tipp__karte {
	background: linear-gradient(180deg, #2a2236, #1b1524); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.09), inset 0 2px 0 rgba(255, 255, 255, 0.08), 0 4px 0 #0a070d, 0 8px 18px rgba(0, 0, 0, 0.35);
	transition: transform 0.1s, box-shadow 0.15s, background 0.15s;
}
.kk-arcade--modern .kk-quiz__antwort, .kk-arcade--modern .kk-raten__antwort, .kk-arcade--modern .kk-impl__aussage, .kk-arcade--modern .kk-road__option { font-weight: 600; }
.kk-arcade--modern .kk-quiz__antwort:hover:not(:disabled), .kk-arcade--modern .kk-raten__antwort:hover:not(:disabled), .kk-arcade--modern .kk-impl__aussage:hover:not(:disabled), .kk-arcade--modern .kk-road__option:hover:not(:disabled), .kk-arcade--modern .kk-doppel__karte:hover:not(:disabled),
.kk-arcade--modern .kk-quiz__antwort:focus-visible, .kk-arcade--modern .kk-raten__antwort:focus-visible, .kk-arcade--modern .kk-impl__aussage:focus-visible, .kk-arcade--modern .kk-road__option:focus-visible, .kk-arcade--modern .kk-doppel__karte:focus-visible {
	transform: translateY(-2px); background: linear-gradient(180deg, #33294a, #1f182b); box-shadow: inset 0 0 0 2px var(--kk-neon), 0 6px 0 #0a070d, 0 0 22px rgba(125, 255, 168, 0.25); outline: none;
}
.kk-arcade--modern .kk-quiz__antwort:active:not(:disabled), .kk-arcade--modern .kk-raten__antwort:active:not(:disabled), .kk-arcade--modern .kk-impl__aussage:active:not(:disabled), .kk-arcade--modern .kk-road__option:active:not(:disabled), .kk-arcade--modern .kk-doppel__karte:active:not(:disabled) { transform: translateY(3px); box-shadow: inset 0 0 0 2px var(--kk-neon), 0 1px 0 #0a070d; }
.kk-arcade--modern .kk-quiz__antwort.ist-richtig, .kk-arcade--modern .kk-raten__antwort.ist-richtig, .kk-arcade--modern .kk-road__option.ist-richtig, .kk-arcade--modern .kk-doppel__karte.ist-richtig, .kk-arcade--modern .kk-hoeher__karte.ist-richtig, .kk-arcade--modern .kk-impl__aussage.ist-fake, .kk-arcade--modern .kk-tipp__karte.ist-genau {
	background: linear-gradient(180deg, #2f9a58, #1d6b3e); box-shadow: inset 0 0 0 2px #7dffa8, 0 4px 0 #0c2a18, 0 0 26px rgba(125, 255, 168, 0.45); color: #fff; opacity: 1; animation: kk-modern-pop 0.42s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.kk-arcade--modern .kk-quiz__antwort.ist-falsch, .kk-arcade--modern .kk-raten__antwort.ist-falsch, .kk-arcade--modern .kk-road__option.ist-falsch, .kk-arcade--modern .kk-doppel__karte.ist-falsch, .kk-arcade--modern .kk-hoeher__karte.ist-falsch, .kk-arcade--modern .kk-impl__aussage.ist-gewaehlt:not(.ist-fake), .kk-arcade--modern .kk-tipp__karte.ist-falsch {
	background: linear-gradient(180deg, #b8323a, #7a1a22); box-shadow: inset 0 0 0 2px #ff8f8f, 0 4px 0 #3a0a10; color: #fff; opacity: 1; animation: kk-modern-nein 0.4s;
}
.kk-arcade--modern .kk-arcade__meldung, .kk-arcade--modern .kk-wort__meldung { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: 1.0625rem; letter-spacing: 0.03em; color: var(--kk-stern); text-shadow: 0 2px 0 #120d16; }
.kk-arcade--modern .kk-quiz__info, .kk-arcade--modern .kk-hoeher__info, .kk-arcade--modern .kk-impl__info { padding: 12px 14px; border-radius: 14px; background: rgba(10, 8, 14, 0.55); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07); }
@keyframes kk-modern-pop { 0% { transform: scale(0.94); } 60% { transform: scale(1.05); } 100% { transform: scale(1); } }
@keyframes kk-modern-nein { 0%, 100% { transform: none; } 20% { transform: translateX(-7px) rotate(-1deg); } 40% { transform: translateX(6px) rotate(1deg); } 60% { transform: translateX(-4px); } 80% { transform: translateX(3px); } }
/* Höher/Tiefer, Tipp, Doppel: Karten mit Glanzkante */
.kk-arcade--modern .kk-hoeher__name, .kk-arcade--modern .kk-doppel__paar, .kk-arcade--modern .kk-impl__name, .kk-arcade--modern .kk-tipp__paarung { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.02em; }
.kk-arcade--modern .kk-hoeher__stand b, .kk-arcade--modern .kk-tipp__zahl { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; -webkit-text-stroke: 1.5px #120d16; paint-order: stroke fill; }
.kk-arcade--modern .kk-tipp__pm { border-radius: 10px; background: linear-gradient(180deg, #33294a, #1f182b); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.1), 0 3px 0 #0a070d; font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; transition: transform 0.08s; }
.kk-arcade--modern .kk-tipp__pm:active { transform: translateY(2px); box-shadow: inset 0 0 0 2px var(--kk-neon), 0 1px 0 #0a070d; }
/* Wort: Kacheln wie Stadiontafel */
.kk-arcade--modern .kk-wort__feld { border-radius: 8px; background: rgba(10, 8, 14, 0.6); font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; transition: transform 0.15s; }
.kk-arcade--modern .kk-wort__feld.ist-voll { animation: kk-modern-pop 0.18s; box-shadow: inset 0 0 0 2px #a99cb8; }
.kk-arcade--modern .kk-wort__feld.ist-g, .kk-arcade--modern .kk-wort__feld.ist-y, .kk-arcade--modern .kk-wort__feld.ist-x { animation: kk-modern-dreh 0.45s ease-out backwards; box-shadow: 0 3px 0 rgba(0, 0, 0, 0.45); }
.kk-arcade--modern .kk-wort__feld.ist-g { background: linear-gradient(180deg, #2fa05e, #1d6b3e); }
.kk-arcade--modern .kk-wort__feld.ist-y { background: linear-gradient(180deg, #e0b33a, #a8801f); }
.kk-arcade--modern .kk-wort__feld.ist-x { background: linear-gradient(180deg, #3a3346, #26202f); }
.kk-arcade--modern .kk-wort__feld:nth-child(2) { animation-delay: 0.08s; } .kk-arcade--modern .kk-wort__feld:nth-child(3) { animation-delay: 0.16s; } .kk-arcade--modern .kk-wort__feld:nth-child(4) { animation-delay: 0.24s; } .kk-arcade--modern .kk-wort__feld:nth-child(5) { animation-delay: 0.32s; } .kk-arcade--modern .kk-wort__feld:nth-child(6) { animation-delay: 0.4s; }
.kk-arcade--modern .kk-wort__taste { border-radius: 8px; background: linear-gradient(180deg, #463c55, #342c40); box-shadow: 0 3px 0 #120d16; font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; transition: transform 0.06s; }
.kk-arcade--modern .kk-wort__taste:active { transform: translateY(2px); box-shadow: 0 1px 0 #120d16; }
.kk-arcade--modern .kk-wort__taste.ist-g { background: linear-gradient(180deg, #2fa05e, #1d6b3e); }
.kk-arcade--modern .kk-wort__taste.ist-y { background: linear-gradient(180deg, #e0b33a, #a8801f); }
.kk-arcade--modern .kk-wort__taste.ist-x { background: #1a1520; color: #6a6078; }
@keyframes kk-modern-dreh { 0% { transform: rotateX(90deg); } 100% { transform: none; } }
/* Memory: Karten mit Holzrücken und Glanz */
.kk-arcade--modern .kk-memo__rueck { background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.14), transparent 45%), repeating-linear-gradient(45deg, #1d6b3e 0 10px, #1a6038 10px 20px); box-shadow: inset 0 0 0 3px #120d16, inset 0 0 0 5px rgba(242, 201, 76, 0.55), 0 4px 0 #0a070d; }
.kk-arcade--modern .kk-memo__vorn { background: linear-gradient(180deg, #fffaf0, #eae0cc); color: #120d16; box-shadow: inset 0 0 0 3px #120d16, 0 4px 0 #0a070d; }
.kk-arcade--modern .kk-memo__name { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; color: #120d16; }
.kk-arcade--modern .kk-memo__karte.ist-gefunden .kk-memo__vorn { background: linear-gradient(180deg, #d9ffe6, #a8e8bf); box-shadow: inset 0 0 0 3px #120d16, 0 0 22px rgba(125, 255, 168, 0.55); }
.kk-arcade--modern .kk-memo__karte.ist-gefunden { animation: kk-modern-pop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1); }
.kk-arcade--modern .kk-memo__karte:hover:not(:disabled) { transform: translateY(-3px); transition: transform 0.12s; }
/* Ball oder nicht Ball: echter Kickertisch mit Mulden */
.kk-arcade--modern .kk-ball__tisch { border-radius: 18px; background: radial-gradient(ellipse at 50% 40%, rgba(255, 240, 200, 0.12), transparent 60%), repeating-linear-gradient(0deg, #2a7c45 0 12.5%, #226a3a 12.5% 25%); box-shadow: 0 0 0 4px #120d16, 0 0 0 14px #6b4424, 0 0 0 16px #120d16, inset 0 0 30px rgba(0, 0, 0, 0.45), 0 18px 30px rgba(0, 0, 0, 0.5); margin: 18px 16px 6px; }
.kk-arcade--modern .kk-ball__tisch::before { background: rgba(240, 248, 240, 0.4); }
.kk-arcade--modern .kk-ball__feld { background: radial-gradient(circle at 50% 35%, #0c1a10, #183a24 70%); box-shadow: inset 0 6px 12px rgba(0, 0, 0, 0.7), 0 1px 0 rgba(255, 255, 255, 0.15), 0 0 0 3px rgba(0, 0, 0, 0.25); }
.kk-arcade--modern .kk-ball__feld svg { animation: kk-modern-hoch 0.22s cubic-bezier(0.34, 1.56, 0.64, 1); filter: drop-shadow(0 4px 3px rgba(0, 0, 0, 0.5)); }
.kk-arcade--modern .kk-ball__feld.ist-treffer { box-shadow: inset 0 0 0 3px var(--kk-neon), 0 0 26px rgba(125, 255, 168, 0.7); }
.kk-arcade--modern .kk-ball__feld.ist-falsch { box-shadow: inset 0 0 0 3px var(--kk-rot), 0 0 22px rgba(255, 90, 95, 0.6); animation: kk-modern-nein 0.35s; }
.kk-arcade--modern .kk-ball__kombo { top: -30px; font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: 1.25rem; color: var(--kk-stern); text-shadow: 0 2px 0 #120d16; }
.kk-arcade--modern .kk-ball__hinweis { font-family: KKArcade, Montserrat, sans-serif; font-size: 1rem; color: #fff; }
@keyframes kk-modern-hoch { from { transform: translateY(40%) scale(0.6); opacity: 0; } to { transform: none; opacity: 1; } }
/* Jubel-Partikel für DOM-Spiele */
.kk-jubel { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 5; }
.kk-jubel i { position: absolute; width: 8px; height: 8px; border-radius: 2px; animation: kk-jubel 0.8s cubic-bezier(0.2, 0.6, 0.4, 1) forwards; }
@keyframes kk-jubel { from { transform: translate(0, 0) rotate(0); opacity: 1; } to { transform: translate(var(--dx), var(--dy)) rotate(var(--dr)); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .kk-arcade--modern [class*="kk-"] { animation: none !important; } .kk-jubel { display: none; } }
/* Jet-Schuss im neuen Look */
.kk-arcade--modern .kk-jet { position: relative; padding: clamp(14px, 3.5vw, 24px); border-radius: 20px; background: radial-gradient(ellipse at 50% -10%, rgba(255, 214, 140, 0.16), transparent 55%), repeating-linear-gradient(0deg, transparent 0 21px, rgba(0, 0, 0, 0.22) 21px 23px), linear-gradient(180deg, #231a2c, #150f1b 70%); box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.3); }
.kk-arcade--modern .kk-jet__feld { background: rgba(10, 8, 14, 0.55); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); }
.kk-arcade--modern .kk-jet__szene { width: min(100%, 380px); filter: drop-shadow(0 12px 18px rgba(0, 0, 0, 0.5)); }
.kk-arcade--modern .kk-jet__text { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.02em; text-shadow: 0 2px 0 #120d16; }
.kk-arcade--modern .kk-jet__feld.ist-los { background: radial-gradient(circle at 50% 40%, rgba(125, 255, 168, 0.25), rgba(10, 8, 14, 0.55) 70%); }
.kk-arcade--modern .kk-jet__feld.ist-los .kk-jet__text { font-size: clamp(2rem, 9vw, 3rem); color: #fff; -webkit-text-stroke: 2px #120d16; paint-order: stroke fill; text-shadow: 0 0 24px rgba(125, 255, 168, 0.8); animation: kk-modern-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); }
.kk-arcade--modern .kk-jet__feld.ist-los .kk-jet__figur { transform: rotate(-14deg) scale(1.05); transform-origin: 150px 144px; transition: transform 0.06s; }
.kk-arcade--modern .kk-jet__feld.ist-los .kk-jet__spur, .kk-arcade--modern .kk-jet__feld.ist-treffer .kk-jet__spur { opacity: 0.35; transition: opacity 0.1s; }
.kk-arcade--modern .kk-jet__feld.ist-treffer .kk-jet__spur { opacity: 0; transition: opacity 0.5s; }
.kk-arcade--modern .kk-jet__feld.ist-treffer .kk-jet__netz { fill: #3a8a5a; transition: fill 0.2s; }
.kk-arcade--modern .kk-jet__feld.ist-fehlstart { background: radial-gradient(circle at 50% 40%, rgba(255, 90, 95, 0.25), rgba(10, 8, 14, 0.55) 70%); animation: kk-modern-nein 0.4s; }
.kk-arcade--modern .kk-jet__feld.ist-warten .kk-jet__keeper { animation: kk-jet-keeper 1.4s ease-in-out infinite; }
.kk-arcade--modern .kk-jet__zeiten li { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; background: rgba(10, 8, 14, 0.7); color: var(--kk-neon); }
@keyframes kk-jet-keeper { 0%, 100% { transform: translateX(-8px); } 50% { transform: translateX(8px); } }
.kk-arcade--modern .kk-quiz__punkte:empty, .kk-arcade--modern .kk-quiz__nr:empty { display: none; }
.kk-escape__symbol { display: inline-flex; width: 1.6em; height: 1.6em; } .kk-escape__symbol svg { width: 100%; height: 100%; display: block; }
/* Regel-Schiri und Road 42 im neuen Look */
.kk-arcade--modern .kk-regel { position: relative; padding: clamp(14px, 3.5vw, 24px); border-radius: 20px; background: radial-gradient(ellipse at 50% -10%, rgba(255, 214, 140, 0.16), transparent 55%), repeating-linear-gradient(0deg, transparent 0 21px, rgba(0, 0, 0, 0.22) 21px 23px), linear-gradient(180deg, #231a2c, #150f1b 70%); box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.3); }
.kk-arcade--modern .kk-regel__szene { border-radius: 14px; box-shadow: 0 0 0 2px #120d16, 0 12px 26px rgba(0, 0, 0, 0.45); }
.kk-arcade--modern .kk-regel__lage { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: 1.125rem; letter-spacing: 0.01em; color: #fff; text-shadow: 0 2px 0 #120d16; }
.kk-arcade--modern .kk-regel__knopf { box-shadow: inset 0 0 0 2px currentColor, 0 4px 0 #0a070d; }
.kk-arcade--modern .kk-regel__knopf--ok { background: linear-gradient(180deg, #2f9a58, #1d6b3e); color: #fff; }
.kk-arcade--modern .kk-regel__knopf--foul { background: linear-gradient(180deg, #c8323a, #7a1a22); color: #fff; }
.kk-arcade--modern .kk-regel__knopf:active:not(:disabled) { transform: translateY(3px); box-shadow: inset 0 0 0 2px currentColor, 0 1px 0 #0a070d; }
.kk-arcade--modern .kk-regel__info { padding: 12px 14px; border-radius: 14px; background: rgba(10, 8, 14, 0.55); }
.kk-arcade--modern .kk-road__reflex { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; letter-spacing: 0.06em; box-shadow: inset 0 0 0 2px var(--kk-neon), 0 4px 0 #0a070d; }
.kk-arcade--modern .kk-road__bahn { border-radius: 10px; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.08), 0 4px 0 #0a070d; }
.kk-arcade--modern .kk-regel__info:empty { display: none; }
.kk-arcade--modern .kk-quiz__nr, .kk-arcade--modern .kk-quiz__punkte { white-space: nowrap; }
@media (max-width: 420px) { .kk-arcade--modern .kk-quiz__kopf { font-size: 0.75rem; gap: 6px; } .kk-arcade--modern .kk-quiz__nr, .kk-arcade--modern .kk-quiz__punkte { padding: 4px 9px; } .kk-arcade--modern .kk-ball__tisch { margin: 18px 12px 6px; } }

/* ------------------------------------------------------------------
 * Kellerkicker FC (3D-Kicker)
 * ------------------------------------------------------------------ */
.kk-fc { position: relative; width: 100%; aspect-ratio: 16 / 9; max-height: 84vh; margin: 0 auto; border-radius: 18px; overflow: hidden; background: #0c0a0e; box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.35), 0 20px 50px rgba(0, 0, 0, 0.55); touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
@media (orientation: portrait) and (max-width: 760px) { .kk-fc { aspect-ratio: 3 / 4.4; max-height: 78vh; } }
.kk-fc:fullscreen, .kk-fc.ist-vollbild { position: fixed; inset: 0; z-index: 9999; width: 100vw; height: 100vh; height: 100dvh; max-height: none; aspect-ratio: auto; border-radius: 0; }
.kk-fc__canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; outline: none; cursor: crosshair; }
.kk-fc__hud { position: absolute; inset: 0; pointer-events: none; font-family: KKArcade, Montserrat, sans-serif; color: #fff; transition: opacity 0.3s; }
.kk-fc__hud.ist-aus { opacity: 0; }
.kk-fc__score { position: absolute; top: 12px; left: 50%; transform: translateX(-50%); display: flex; align-items: stretch; border-radius: 10px; overflow: hidden; box-shadow: 0 0 0 2px #120d16, 0 6px 18px rgba(0, 0, 0, 0.5); font-size: clamp(0.9rem, 2.2vw, 1.3rem); letter-spacing: 0.04em; }
.kk-fc__team { padding: 6px 12px; }
.kk-fc__team--heim { background: linear-gradient(180deg, #2fa05e, #1d6b3e); }
.kk-fc__team--gast { background: linear-gradient(180deg, #f2f0ea, #cfcac0); color: #120d16; }
.kk-fc__tore { padding: 6px 14px; background: #120d16; font-weight: 400; min-width: 4.2em; text-align: center; font-variant-numeric: tabular-nums; }
.kk-fc__zeit { padding: 6px 10px; background: rgba(18, 13, 22, 0.85); color: var(--kk-stern, #f2c94c); font-size: 0.85em; font-variant-numeric: tabular-nums; display: flex; align-items: center; }
.kk-fc__satz { position: absolute; top: calc(12px + 2.6em); left: 50%; transform: translateX(-50%); margin: 6px 0 0; padding: 3px 10px; border-radius: 999px; background: rgba(18, 13, 22, 0.65); font-size: 0.75rem; letter-spacing: 0.06em; white-space: nowrap; }
.kk-fc__stangen { position: absolute; left: 12px; bottom: 12px; display: flex; gap: 6px; }
.kk-fc__stange { padding: 5px 9px; border-radius: 8px; background: rgba(18, 13, 22, 0.7); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); font-size: 0.8rem; letter-spacing: 0.05em; transition: background 0.15s, transform 0.15s; }
.kk-fc__stange.ist-aktiv { background: #2fa05e; box-shadow: 0 0 0 2px #120d16, 0 0 16px rgba(125, 255, 168, 0.6); transform: translateY(-2px); }
.kk-fc__tempo { position: absolute; left: 50%; bottom: 14px; transform: translate(-50%, 30px); opacity: 0; padding: 6px 14px; border-radius: 999px; background: #f2c94c; color: #120d16; box-shadow: 0 0 0 2px #120d16; font-size: 1.05rem; transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s; }
.kk-fc__tempo.ist-an { transform: translate(-50%, 0); opacity: 1; }
.kk-fc__tempo.ist-gast { background: #f2f0ea; }
.kk-fc__ticker { position: absolute; left: 50%; top: 92px; transform: translate(-50%, -8px); opacity: 0; padding: 5px 12px; border-radius: 999px; background: rgba(18, 13, 22, 0.82); box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.5); color: #7dffa8; font-family: KKArcade, Montserrat, sans-serif; font-size: 0.85rem; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; pointer-events: none; transition: transform 0.2s, opacity 0.2s; }
.kk-fc__ticker.ist-an { transform: translate(-50%, 0); opacity: 1; }
.kk-fc__ticker.ist-gast { color: #f2f0ea; box-shadow: inset 0 0 0 1px rgba(217, 83, 47, 0.7); }
.kk-fc__stange.ist-aus { opacity: 0.3; }
.kk-fc__chip.ist-geschafft::after { content: ""; display: inline-block; width: 0.45em; height: 0.8em; margin-left: 0.45em; border: solid #7dffa8; border-width: 0 2px 2px 0; transform: translateY(-0.12em) rotate(45deg); }
.kk-fc__chip.ist-an.ist-geschafft::after { border-color: #fff; }
.kk-fc__ziel { margin: -2px auto 12px; max-width: 30em; color: rgba(255, 255, 255, 0.8); font-size: 0.85rem; line-height: 1.4; }
.kk-fc__banner { position: absolute; left: 50%; top: 42%; transform: translate(-50%, -50%) rotate(-3deg) scale(0.4); opacity: 0; padding: 0.15em 0.7em; background: #2b8a52; box-shadow: 0 0 0 4px #120d16, 8px 8px 0 #120d16; font-size: clamp(1.6rem, 6vw, 3.6rem); letter-spacing: 0.03em; text-transform: uppercase; white-space: nowrap; -webkit-text-stroke: 2px #120d16; paint-order: stroke fill; transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s; }
.kk-fc__banner.ist-an { transform: translate(-50%, -50%) rotate(-3deg) scale(1); opacity: 1; }
.kk-fc__banner--gegentor, .kk-fc__banner--niederlage { background: #d93a3f; }
.kk-fc__banner--sieg { background: #d9a520; }
.kk-fc__banner--info, .kk-fc__banner--anstoss { background: #120d16; color: #fff; font-size: clamp(1rem, 3.4vw, 1.8rem); -webkit-text-stroke: 0; box-shadow: 0 0 0 2px rgba(125, 255, 168, 0.5), 6px 6px 0 rgba(0, 0, 0, 0.5); }
.kk-fc__banner[data-unter]::after { content: attr(data-unter); display: block; margin-top: 0.2em; font-size: 0.32em; letter-spacing: 0.08em; text-align: center; -webkit-text-stroke: 0; max-width: min(34em, 80vw); margin-left: auto; margin-right: auto; white-space: normal; line-height: 1.35; text-transform: none; }
.kk-fc__banner--info[data-unter]::after, .kk-fc__banner--anstoss[data-unter]::after { font-size: 0.6em; letter-spacing: 0.02em; font-family: Montserrat, sans-serif; font-weight: 600; }
.kk-fc__knoepfe { position: absolute; top: 12px; right: 12px; display: flex; gap: 6px; pointer-events: auto; }
.kk-fc__knopf { width: 40px; height: 40px; padding: 9px; border: 0; border-radius: 10px; background: rgba(18, 13, 22, 0.72); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14); cursor: pointer; transition: background 0.15s, transform 0.08s; }
.kk-fc__knopf:hover, .kk-fc__knopf:focus-visible { background: #2b8a52; outline: none; }
.kk-fc__knopf:active { transform: scale(0.94); }
.kk-fc__knopf svg { display: block; width: 100%; height: 100%; }
.kk-fc__touch { position: absolute; inset: 64px 10px 54px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; animation: kk-fc-weg 1s 5s forwards; }
.kk-fc__touch span { display: flex; align-items: flex-end; justify-content: center; padding: 12px; border-radius: 16px; border: 2px dashed rgba(255, 255, 255, 0.35); background: rgba(18, 13, 22, 0.25); font-family: Montserrat, sans-serif; font-weight: 700; font-size: 0.8rem; text-align: center; }
@keyframes kk-fc-weg { to { opacity: 0; visibility: hidden; } }
.kk-fc__menue { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; padding: 14px; background: radial-gradient(ellipse at 50% 30%, rgba(12, 10, 14, 0.35), rgba(12, 10, 14, 0.82)); overflow-y: auto; }
.kk-fc__menue.ist-an { display: flex; }
.kk-fc__menue.ist-pause { backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.kk-fc__karte { width: min(560px, 100%); max-height: 100%; overflow-y: auto; padding: clamp(14px, 3vw, 24px); border-radius: 18px; background: linear-gradient(180deg, rgba(36, 28, 46, 0.94), rgba(18, 13, 22, 0.96)); box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.35), 0 24px 60px rgba(0, 0, 0, 0.6); color: #fff; text-align: center; animation: kk-ergebnis-rein 0.4s cubic-bezier(0.34, 1.56, 0.64, 1); }
.kk-fc__karte--klein { width: min(420px, 100%); }
.kk-fc__ueber { margin: 0; font-family: Montserrat, sans-serif; font-weight: 700; font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--kk-neon, #7dffa8); }
.kk-fc__titel { margin: 0.1em 0 0; font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: clamp(2rem, 7vw, 3.2rem); line-height: 1; letter-spacing: 0.02em; text-transform: uppercase; -webkit-text-stroke: 2px #120d16; paint-order: stroke fill; text-shadow: 0 4px 0 #120d16, 0 0 28px rgba(125, 255, 168, 0.35); }
.kk-fc__unter { margin: 0.4em 0 1em; color: rgba(255, 255, 255, 0.75); font-size: 0.9rem; }
.kk-fc__wahl { margin: 0 0 12px; }
.kk-fc__wahl-titel { margin: 0 0 6px; font-family: KKArcade, Montserrat, sans-serif; font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--kk-stern, #f2c94c); }
.kk-fc__chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.kk-fc__chip { padding: 7px 12px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.07); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15); color: #fff; font-family: Montserrat, sans-serif; font-weight: 700; font-size: 0.82rem; cursor: pointer; transition: background 0.15s, transform 0.08s; }
.kk-fc__chip:hover { background: rgba(125, 255, 168, 0.15); }
.kk-fc__chip.ist-an { background: linear-gradient(180deg, #2fa05e, #1d6b3e); box-shadow: inset 0 0 0 2px #7dffa8; }
.kk-fc__hilfe { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 14px 0 8px; padding: 12px; border-radius: 12px; background: rgba(0, 0, 0, 0.3); text-align: left; font-size: 0.82rem; }
.kk-fc__hilfe dt { font-family: KKArcade, Montserrat, sans-serif; color: var(--kk-neon, #7dffa8); letter-spacing: 0.03em; }
.kk-fc__hilfe dd { margin: 0; color: rgba(255, 255, 255, 0.85); }
.kk-fc__klein { margin: 0 0 12px; font-size: 0.75rem; color: rgba(255, 255, 255, 0.6); }
.kk-fc__los, .kk-fc__zweit { display: block; width: 100%; margin: 8px 0 0; padding: 12px; border: 0; border-radius: 12px; font-family: KKArcade, Montserrat, sans-serif; font-size: 1.25rem; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; transition: transform 0.08s, filter 0.15s; }
.kk-fc__los { background: linear-gradient(180deg, #3fc078, #1d6b3e); color: #fff; box-shadow: 0 0 0 2px #120d16, 0 5px 0 #0c2a18; -webkit-text-stroke: 1px #120d16; paint-order: stroke fill; }
.kk-fc__zweit { background: rgba(255, 255, 255, 0.08); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18); font-size: 1rem; }
.kk-fc__los:hover, .kk-fc__zweit:hover { filter: brightness(1.12); }
.kk-fc__los:active, .kk-fc__zweit:active { transform: translateY(2px); }
@media (max-width: 520px) { .kk-fc__stange { padding: 4px 6px; font-size: 0.7rem; } .kk-fc__knopf { width: 34px; height: 34px; padding: 7px; } .kk-fc__score { top: 8px; } .kk-fc__satz { display: none; } }
/* Kleine Spielfläche (Handy quer, schmale Spalten): Menü kompakt, Hilfe weg (Hinweise stehen im Spiel) */
.kk-fc { container: kkfc / size; }
.kk-fc__menue { align-items: safe center; }
@container kkfc (max-height: 560px) {
	.kk-fc__menue { padding: 8px; }
	.kk-fc__karte { padding: 10px 14px; }
	.kk-fc__ueber, .kk-fc__unter, .kk-fc__hilfe, .kk-fc__klein { display: none; }
	.kk-fc__ziel { margin-bottom: 6px; font-size: 0.75rem; }
	.kk-fc__ticker { top: 52px; font-size: 0.72rem; }
	.kk-fc__titel { font-size: 1.7rem; margin-bottom: 8px; -webkit-text-stroke-width: 1.5px; }
	.kk-fc__wahl { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 6px; }
	.kk-fc__wahl-titel { flex: none; width: 5.5em; margin: 0; font-size: 0.68rem; text-align: right; }
	.kk-fc__chips { justify-content: flex-start; }
	.kk-fc__chips { gap: 4px; }
	.kk-fc__chip { padding: 5px 9px; font-size: 0.72rem; }
	.kk-fc__los, .kk-fc__zweit { margin-top: 6px; padding: 8px; font-size: 1rem; }
}
@container kkfc (max-height: 380px) {
	.kk-fc__titel { font-size: 1.3rem; margin-bottom: 4px; }
	.kk-fc__wahl { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 4px; }
	.kk-fc__wahl-titel { margin: 0; flex: none; }
	.kk-fc__chip { padding: 4px 8px; font-size: 0.68rem; }
}
@container kkfc (max-width: 460px) {
	.kk-fc__score { top: 8px; left: 8px; transform: none; font-size: 0.85rem; }
	.kk-fc__knoepfe { top: 46px; right: 8px; flex-direction: column; gap: 4px; }
	.kk-fc__knopf { width: 32px; height: 32px; padding: 7px; }
	.kk-fc__satz { display: none; }
}
@media (prefers-reduced-motion: reduce) { .kk-fc__banner, .kk-fc__tempo { transition: none; } }

/* Controller (Gamepad): Fokusrahmen, Zeiger, Hinweis */
.kk-pad-aktiv :focus { outline: 3px solid #7dffa8 !important; outline-offset: 3px; box-shadow: 0 0 0 6px rgba(125, 255, 168, 0.25); }
.kk-pad-aktiv canvas:focus, .kk-pad-aktiv [data-kk-arcade-buehne] [tabindex]:not(button):not(a):focus { outline: 0 !important; box-shadow: none; }
.kk-pad-zeiger { position: fixed; top: 0; left: 0; z-index: 2147483000; width: 28px; height: 28px; margin: -3px 0 0 -4px; pointer-events: none; opacity: 0; transition: opacity 0.2s; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.6)); }
.kk-pad-zeiger.ist-an { opacity: 1; }
.kk-pad-zeiger.ist-unten svg { transform: scale(0.85); transform-origin: 4px 2px; }
.kk-pad-hinweis { position: fixed; left: 50%; bottom: 24px; z-index: 2147483001; max-width: calc(100% - 32px); padding: 10px 16px; border-radius: 12px; background: rgba(18, 13, 22, 0.94); box-shadow: 0 0 0 2px #7dffa8, 0 10px 30px rgba(0, 0, 0, 0.5); color: #fff; font: 700 0.9rem/1.3 Montserrat, sans-serif; text-align: center; transform: translateX(-50%); transition: opacity 0.5s, transform 0.5s; }
.kk-pad-hinweis.ist-weg { opacity: 0; transform: translate(-50%, 12px); }
@media (prefers-reduced-motion: reduce) { .kk-pad-zeiger, .kk-pad-hinweis { transition: none; } }

/* Kellerassi Survivors und Geisterkeller: Seitenverhältnis kommt aus dem Spiel, Höhe passt in den Bildschirm */
.kk-spielfeld--survivor .kk-spielfeld__canvas, .kk-spielfeld--geister .kk-spielfeld__canvas { max-height: calc(100svh - 190px); width: auto; max-width: 100%; cursor: crosshair; }
.kk-spielfeld--survivor .kk-spielfeld__canvas { cursor: default; }
.kk-spielfeld--survivor .kk-spielfeld__anzeige, .kk-spielfeld--geister .kk-spielfeld__anzeige { max-width: 100%; }
@media (max-height: 500px) { .kk-spielfeld--survivor .kk-spielfeld__canvas, .kk-spielfeld--geister .kk-spielfeld__canvas { max-height: calc(100svh - 70px); } .kk-spielfeld--survivor .kk-spielfeld__hinweis, .kk-spielfeld--geister .kk-spielfeld__hinweis { display: none; } }

/* Kellerkicker FC: Torwiederholung im Fernsehstil */
.kk-fc__wdh { position: absolute; left: 14px; top: 14px; display: none; flex-direction: column; gap: 2px; padding: 7px 12px 7px 26px; border-radius: 8px; background: rgba(18, 13, 22, 0.85); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15); color: #fff; pointer-events: none; }
.kk-fc__wdh::before { content: ""; position: absolute; left: 10px; top: 13px; width: 8px; height: 8px; border-radius: 50%; background: #ff5a5f; animation: kk-fc-rec 1s steps(2) infinite; }
.kk-fc__wdh b { font-family: KKArcade, Montserrat, sans-serif; font-weight: 400; font-size: 0.95rem; letter-spacing: 0.06em; text-transform: uppercase; }
.kk-fc__wdh span { font-size: 0.7rem; color: rgba(255, 255, 255, 0.7); }
.kk-fc.ist-wiederholung .kk-fc__wdh { display: flex; }
.kk-fc.ist-wiederholung .kk-fc__score, .kk-fc.ist-wiederholung .kk-fc__satz, .kk-fc.ist-wiederholung .kk-fc__stangen, .kk-fc.ist-wiederholung .kk-fc__tempo, .kk-fc.ist-wiederholung .kk-fc__ticker { opacity: 0; }
.kk-fc.ist-wiederholung::before, .kk-fc.ist-wiederholung::after { content: ""; position: absolute; left: 0; right: 0; z-index: 1; height: 7%; background: #000; pointer-events: none; }
.kk-fc.ist-wiederholung::before { top: 0; }
.kk-fc.ist-wiederholung::after { bottom: 0; }
@keyframes kk-fc-rec { to { opacity: 0.2; } }
@media (prefers-reduced-motion: reduce) { .kk-fc__wdh::before { animation: none; } }
.kk-fc.ist-wiederholung .kk-fc__hud { z-index: 2; } .kk-fc.ist-wiederholung .kk-fc__wdh { top: calc(7% + 10px); }

/* Kellerkicker FC: Fernsehvorspann und Statistiktafel */
.kk-fc__vorspann { position: absolute; left: 50%; bottom: 9%; display: none; width: min(92%, 620px); transform: translateX(-50%); text-align: center; pointer-events: none; }
.kk-fc.ist-vorspann .kk-fc__vorspann { display: block; animation: kk-fc-rein 0.5s cubic-bezier(0.2, 0.9, 0.3, 1.2) both; }
.kk-fc.ist-vorspann .kk-fc__score, .kk-fc.ist-vorspann .kk-fc__satz, .kk-fc.ist-vorspann .kk-fc__stangen, .kk-fc.ist-vorspann .kk-fc__banner { opacity: 0; }
.kk-fc__vs-ueber { display: inline-block; margin: 0 0 6px; padding: 4px 12px; border-radius: 6px; background: #f2c94c; color: #120d16; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; }
.kk-fc__vs { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; border-radius: 12px; overflow: hidden; box-shadow: 0 0 0 2px #120d16, 0 16px 40px rgba(0, 0, 0, 0.55); }
.kk-fc__vs i { display: grid; place-items: center; padding: 0 12px; background: #120d16; color: rgba(255, 255, 255, 0.7); font-style: normal; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.1em; }
.kk-fc__vs-team { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 10px 14px; }
.kk-fc__vs-team b { font-weight: 400; font-size: clamp(1.4rem, 4vw, 2.2rem); line-height: 1; letter-spacing: 0.04em; }
.kk-fc__vs-team span { font-family: Montserrat, sans-serif; font-weight: 700; font-size: 0.75rem; }
.kk-fc__vs-team--heim { background: linear-gradient(180deg, #2fa05e, #1d6b3e); color: #fff; }
.kk-fc__vs-team--gast { background: linear-gradient(180deg, #f2f0ea, #d6d2c6); color: #120d16; }
.kk-fc__vs-team--gast b { color: #d9532f; }
.kk-fc__vs-unter { margin: 8px 0 0; font-family: Montserrat, sans-serif; font-size: 0.72rem; color: rgba(255, 255, 255, 0.7); }
.kk-fc__tafel { position: absolute; left: 50%; top: 50%; display: none; width: min(90%, 440px); padding: 12px 16px 14px; border-radius: 14px; background: rgba(18, 13, 22, 0.92); box-shadow: 0 0 0 2px #120d16, 0 0 0 3px rgba(125, 255, 168, 0.35), 0 20px 50px rgba(0, 0, 0, 0.6); transform: translate(-50%, -50%); pointer-events: none; }
.kk-fc.ist-tafel .kk-fc__tafel { display: block; animation: kk-fc-rein 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.2) both; }
.kk-fc.ist-tafel .kk-fc__banner { opacity: 0; }
.kk-fc__tafel-kopf { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; padding-bottom: 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.kk-fc__tafel-kopf b { font-weight: 400; font-size: 1.1rem; color: #7dffa8; }
.kk-fc__tafel-kopf b:last-child { color: #f2f0ea; }
.kk-fc__tafel-kopf strong { font-weight: 400; font-size: 1.6rem; }
.kk-fc__tafel-zeile { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; padding: 4px 0; font-family: Montserrat, sans-serif; font-size: 0.85rem; }
.kk-fc__tafel-wert { font-weight: 800; font-variant-numeric: tabular-nums; }
.kk-fc__tafel-wert:first-child { text-align: left; color: #7dffa8; }
.kk-fc__tafel-wert:last-child { text-align: right; }
.kk-fc__tafel-name { color: rgba(255, 255, 255, 0.7); text-align: center; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.72rem; align-self: center; }
@keyframes kk-fc-rein { from { opacity: 0; transform: translate(-50%, 20px); } }
.kk-fc.ist-tafel .kk-fc__tafel { animation-name: kk-fc-rein-mitte; }
@keyframes kk-fc-rein-mitte { from { opacity: 0; transform: translate(-50%, -40%); } }
@container kkfc (max-height: 380px) { .kk-fc__tafel { padding: 8px 12px; } .kk-fc__tafel-zeile { padding: 1px 0; font-size: 0.75rem; } .kk-fc__vorspann { bottom: 4%; } .kk-fc__vs-team { padding: 6px 10px; } }
@media (prefers-reduced-motion: reduce) { .kk-fc.ist-vorspann .kk-fc__vorspann, .kk-fc.ist-tafel .kk-fc__tafel { animation: none; } }

/* Kellerkicker FC: Turnierbaum */
.kk-fc__karte--turnier { width: min(640px, 100%); }
.kk-fc__baum { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 6px 0 12px; text-align: left; }
.kk-fc__baum-runde { display: flex; flex-direction: column; justify-content: space-around; gap: 6px; padding: 8px; border-radius: 12px; background: rgba(0, 0, 0, 0.25); }
.kk-fc__baum-runde.ist-jetzt { box-shadow: inset 0 0 0 1px rgba(125, 255, 168, 0.5); }
.kk-fc__baum-titel { margin: 0 0 2px; font-size: 0.66rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kk-stern, #f2c94c); text-align: center; }
.kk-fc__baum-spiel { display: flex; flex-direction: column; border-radius: 8px; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); }
.kk-fc__baum-team { display: flex; justify-content: space-between; gap: 6px; padding: 3px 8px; font-size: 0.8rem; background: rgba(255, 255, 255, 0.04); }
.kk-fc__baum-team + .kk-fc__baum-team { border-top: 1px solid rgba(255, 255, 255, 0.08); }
.kk-fc__baum-team b { font-weight: 400; letter-spacing: 0.04em; }
.kk-fc__baum-team i { font-style: normal; font-variant-numeric: tabular-nums; color: rgba(255, 255, 255, 0.8); }
.kk-fc__baum-team.ist-wir { background: rgba(47, 160, 94, 0.35); color: #7dffa8; }
.kk-fc__baum-team.ist-raus { opacity: 0.45; }
.kk-fc__baum-team.ist-offen { justify-content: center; color: rgba(255, 255, 255, 0.35); }
.kk-fc__pokal { width: 84px; margin: 4px auto 6px; filter: drop-shadow(0 0 18px rgba(242, 201, 76, 0.55)); animation: kk-fc-pokal 1.2s ease-in-out infinite alternate; }
.kk-fc__pokal svg { display: block; width: 100%; }
@keyframes kk-fc-pokal { to { transform: translateY(-4px) rotate(-3deg); } }
@container kkfc (max-height: 560px) { .kk-fc__baum { gap: 6px; margin-bottom: 6px; } .kk-fc__baum-runde { padding: 5px; gap: 4px; } .kk-fc__baum-team { padding: 2px 6px; font-size: 0.7rem; } .kk-fc__pokal { width: 54px; } }
@container kkfc (max-width: 420px) { .kk-fc__baum { grid-template-columns: 1fr 1fr 1fr; } .kk-fc__baum-team { padding: 2px 4px; font-size: 0.66rem; } }
@media (prefers-reduced-motion: reduce) { .kk-fc__pokal { animation: none; } }

/* Kellerkicker FC zu zweit: Stangenanzeige für Spieler 2 rechts unten */
.kk-fc__stangen.kk-fc__stangen--gast { left: auto; right: 12px; }
.kk-fc__stangen--gast .kk-fc__stange.ist-aktiv { background: #d9532f; box-shadow: 0 0 0 2px #120d16, 0 0 16px rgba(255, 140, 90, 0.6); }

/* Kellerkicker FC: Elfmeterschießen, Punktereihe unter dem Spielstand */
.kk-fc__elfer { position: absolute; left: 50%; top: 82px; display: flex; flex-direction: column; gap: 3px; transform: translateX(-50%); pointer-events: none; }
.kk-fc__elfer:empty { display: none; }
.kk-fc__elfer-zeile { display: flex; align-items: center; gap: 5px; padding: 3px 8px; border-radius: 999px; background: rgba(18, 13, 22, 0.75); }
.kk-fc__elfer-zeile b { width: 2.6em; font-weight: 400; font-size: 0.7rem; }
.kk-fc__elfer-punkt { width: 11px; height: 11px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.5); }
.kk-fc__elfer-punkt.ist-tor { background: #7dffa8; box-shadow: none; }
.kk-fc__elfer-punkt.ist-daneben { background: #ff5a5f; box-shadow: none; }
.kk-fc.ist-wiederholung .kk-fc__elfer { opacity: 0; }
@container kkfc (max-height: 380px) { .kk-fc__elfer { top: 48px; } .kk-fc__elfer-punkt { width: 8px; height: 8px; } }

/* Kellerkicker FC: Karriere-Tabelle */
.kk-fc__tabelle { width: 100%; margin: 4px 0 10px; border-collapse: collapse; font-family: Montserrat, sans-serif; font-size: 0.8rem; text-align: right; font-variant-numeric: tabular-nums; }
.kk-fc__tabelle th { padding: 3px 6px; font-weight: 700; font-size: 0.66rem; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255, 255, 255, 0.55); }
.kk-fc__tabelle td { padding: 3px 6px; border-top: 1px solid rgba(255, 255, 255, 0.07); }
.kk-fc__tabelle th:nth-child(2), .kk-fc__tabelle td:nth-child(2) { text-align: left; }
.kk-fc__tabelle td:first-child { width: 1.8em; color: rgba(255, 255, 255, 0.6); }
.kk-fc__tabelle td:last-child { font-weight: 800; }
.kk-fc__tabelle tr.ist-auf td:first-child { box-shadow: inset 3px 0 0 #7dffa8; }
.kk-fc__tabelle tr.ist-ab td:first-child { box-shadow: inset 3px 0 0 #ff5a5f; }
.kk-fc__tabelle tr.ist-wir td { background: rgba(47, 160, 94, 0.3); color: #fff; }
@container kkfc (max-height: 560px) { .kk-fc__tabelle { font-size: 0.7rem; } .kk-fc__tabelle td, .kk-fc__tabelle th { padding: 1px 5px; } }
/* Kellerkicker FC: Hochformat-Kamera (schmal und hoch, auch am Desktop wählbar) */
.kk-fc.ist-hochformat { aspect-ratio: 3 / 4.4; width: min(100%, calc(84vh * 3 / 4.4)); max-height: 84vh; }
.kk-fc.ist-hochformat:fullscreen, .kk-fc.ist-hochformat.ist-vollbild { width: 100vw; max-height: none; aspect-ratio: auto; }
.kk-fc__tabelle td:nth-child(2) { overflow-wrap: anywhere; }
/* Keller Chess: Knopfleiste unter dem Brett */
.kk-schach__leiste { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 10px; }
.kk-schach__leiste .kk-knopf { min-height: 40px; padding: 8px 14px; font-size: 0.8125rem; }
.kk-schach__leiste .kk-knopf:disabled { opacity: 0.4; }
/* Bomberassi, Keller Chess: Spielfeld passt in die Fensterhöhe */
.kk-spielfeld--bomber .kk-spielfeld__canvas { max-height: calc(100svh - 200px); width: auto; max-width: 100%; margin-inline: auto; cursor: default; }
.kk-spielfeld--schach .kk-spielfeld__canvas { max-height: calc(100svh - 250px); width: auto; max-width: 100%; margin-inline: auto; cursor: pointer; }
.kk-spielfeld--bomber .kk-spielfeld__anzeige, .kk-spielfeld--schach .kk-spielfeld__anzeige { max-width: 100%; }
@media (max-height: 500px) { .kk-spielfeld--bomber .kk-spielfeld__canvas, .kk-spielfeld--schach .kk-spielfeld__canvas { max-height: calc(100svh - 80px); } .kk-spielfeld--bomber .kk-spielfeld__hinweis, .kk-spielfeld--schach .kk-spielfeld__hinweis { display: none; } }
/* Assi Kong: eigenes Seitenverhältnis 240 × 300 */
.kk-spielfeld--kong .kk-spielfeld__canvas { aspect-ratio: 240 / 300; max-width: min(100%, calc((100svh - 240px) * 240 / 300)); }
.kk-spielfeld--kong .kk-spielfeld__anzeige { max-width: min(100%, calc((100svh - 240px) * 240 / 300)); }
/* Kickerlemminge: Spielfeld und Aufgabenleiste */
.kk-spielfeld--lemminge .kk-spielfeld__canvas { max-height: calc(100svh - 260px); width: auto; max-width: 100%; margin-inline: auto; image-rendering: pixelated; cursor: crosshair; }
.kk-spielfeld--lemminge .kk-spielfeld__anzeige { max-width: 100%; }
.kk-lemminge__leiste { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 10px; touch-action: manipulation; }
.kk-lemminge__knopf { position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; min-width: 64px; min-height: 58px; padding: 6px 8px; border: 0; border-radius: 12px; background: #1b2a22; box-shadow: inset 0 0 0 1px #34403a; color: #e8efe9; font: 700 0.6875rem/1.1 Montserrat, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kk-lemminge__knopf svg { width: 22px; height: 22px; fill: currentColor; margin-bottom: 2px; }
.kk-lemminge__knopf.ist-gewaehlt { background: #2a9a58; box-shadow: inset 0 0 0 2px #7dffa8; color: #fff; }
.kk-lemminge__knopf:disabled { opacity: 0.35; cursor: default; }
.kk-lemminge__zahl { position: absolute; top: 3px; right: 6px; color: #f2c94c; font-size: 0.75rem; }
.kk-lemminge__knopf--klein { min-width: 48px; font-size: 0.875rem; }
@media (max-width: 420px) { .kk-lemminge__knopf { min-width: 54px; min-height: 52px; padding: 4px; } .kk-lemminge__name { font-size: 0.625rem; } }
@media (max-height: 500px) { .kk-spielfeld--lemminge .kk-spielfeld__canvas { max-height: calc(100svh - 120px); } .kk-spielfeld--lemminge .kk-spielfeld__hinweis { display: none; } }
/* Assi Katamari, Only Up: Spielfeld passt in die Fensterhöhe */
.kk-spielfeld--katamari .kk-spielfeld__canvas { max-height: calc(100svh - 200px); width: auto; max-width: 100%; margin-inline: auto; cursor: grab; }
.kk-spielfeld--katamari .kk-spielfeld__anzeige { max-width: 100%; }
@media (max-height: 500px) { .kk-spielfeld--katamari .kk-spielfeld__canvas { max-height: calc(100svh - 80px); } .kk-spielfeld--katamari .kk-spielfeld__hinweis { display: none; } }

/* Der letzte Satz */
.kk-spielfeld--letztersatz { max-width: 640px; margin-inline: auto; }
.kk-spielfeld--letztersatz .kk-spielfeld__canvas { width: 100%; max-height: calc(100svh - 360px); min-height: 120px; object-fit: contain; }
.kk-satz__text { margin: 12px 0 10px; min-height: 5.5em; color: #e8efe9; font: 400 0.9375rem/1.5 Montserrat, sans-serif; }
.kk-satz__text p { margin: 0 0 0.5em; }
.kk-satz__text b { color: #e8762b; }
.kk-satz__leise { opacity: 0.65; font-size: 0.875rem; }
.kk-satz__warn { color: #f2c94c; }
.kk-satz__titel { color: #7dffa8; font-weight: 800; font-size: 1.125rem; letter-spacing: 0.02em; }
.kk-satz__wahl { display: grid; gap: 8px; }
.kk-satz__knopf { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 10px 14px; border: 0; border-radius: 12px; background: #1b2a22; box-shadow: inset 0 0 0 1px #34403a; color: #e8efe9; text-align: left; font: 400 0.875rem/1.3 Montserrat, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kk-satz__knopf:hover, .kk-satz__knopf:focus-visible { box-shadow: inset 0 0 0 2px #7dffa8; outline: none; }
.kk-satz__nr { flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #7dffa8; color: #120d16; font-weight: 800; font-size: 0.8125rem; }
.kk-satz__was { display: flex; flex-direction: column; gap: 2px; }
.kk-satz__was small { opacity: 0.7; font-size: 0.8125rem; }
@media (pointer: coarse) { .kk-satz__nr { display: none; } }

/* Kellerkrieg */
.kk-spielfeld--krieg .kk-spielfeld__canvas { max-height: calc(100svh - 200px); width: auto; max-width: 100%; margin-inline: auto; }
.kk-krieg__steuer { grid-template-rows: repeat(3, clamp(52px, 15vw, 64px)) clamp(40px, 11vw, 48px); grid-template-areas: ". hoch ." "links jet rechts" ". runter ." "spring . waffe"; }
.kk-krieg__steuer .kk-pac__knopf--jet { background: #4a1f24; }
.kk-pac__knopf--spring { grid-area: spring; }
.kk-pac__knopf--waffe { grid-area: waffe; font: 700 0.75rem/1 Montserrat, sans-serif; }
@media (max-height: 500px) { .kk-spielfeld--krieg .kk-spielfeld__canvas { max-height: calc(100svh - 80px); } .kk-spielfeld--krieg .kk-spielfeld__hinweis { display: none; } }

/* Keller Detective */
.kk-spielfeld--detective { max-width: 760px; margin-inline: auto; }
.kk-spielfeld--detective .kk-spielfeld__canvas { width: 100%; max-height: calc(100svh - 380px); min-height: 150px; object-fit: contain; border-radius: 12px; }
.kk-det__text { margin: 12px 0 0; padding: 12px 16px; min-height: 5em; border-radius: 12px; background: #13111a; box-shadow: inset 0 0 0 1px #2e2a3a; color: #e9e4d8; font: 400 0.9375rem/1.5 Montserrat, sans-serif; }
.kk-det__text p { margin: 0 0 0.45em; }
.kk-det__text p:last-child { margin-bottom: 0; }
.kk-det__text b { color: #f2c94c; }
.kk-det__titel { color: #f2c94c; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; font-size: 0.8125rem; }
.kk-det__leise { opacity: 0.65; font-size: 0.875rem; }
.kk-det__neu { color: #7dffa8; font-weight: 700; }
.kk-det__warn { color: #ff8a8d; font-weight: 700; }
.kk-det__geklaert { opacity: 0.85; }
.kk-det__widerspruch { color: #ff5a5f; font-weight: 900; font-size: 1.125rem; letter-spacing: 0.06em; text-transform: uppercase; }
.kk-det__orte, .kk-det__aktionen, .kk-det__akte { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.kk-det__knopf { min-height: 44px; padding: 8px 14px; border: 0; border-radius: 12px; background: #1c1924; color: #fff; font: 600 0.875rem/1.25 Montserrat, sans-serif; text-align: left; box-shadow: inset 0 0 0 1px #3a3448; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kk-det__knopf:hover, .kk-det__knopf:focus-visible { box-shadow: inset 0 0 0 2px #f2c94c; outline: none; }
.kk-det__knopf:disabled { opacity: 0.4; cursor: not-allowed; box-shadow: inset 0 0 0 1px #3a3448; }
.kk-det__ort.ist-hier { background: #2d2614; box-shadow: inset 0 0 0 2px #f2c94c; color: #f2c94c; }
.kk-det__ort--tipp { color: #b8a6ff; margin-left: auto; }
.kk-det__ort--anklage { color: #ff8a8d; }
.kk-det__stelle.ist-erledigt { opacity: 0.6; }
.kk-det__stelle--person { color: #f2c94c; }
.kk-det__aussage { width: 100%; font-weight: 400; font-style: italic; }
.kk-det__aussage.ist-gewaehlt { box-shadow: inset 0 0 0 2px #f2c94c; }
.kk-det__aussage.ist-widerlegt { opacity: 0.7; text-decoration: line-through; text-decoration-color: #ff5a5f; }
.kk-det__kopf { flex-basis: 100%; margin: 14px 0 0; color: #a49cb4; font: 700 0.75rem/1 Montserrat, sans-serif; letter-spacing: 0.08em; text-transform: uppercase; }
.kk-det__gruppe { display: flex; flex-wrap: wrap; gap: 6px; flex-basis: 100%; }
.kk-det__gruppe .kk-det__kopf { margin-top: 6px; }
.kk-det__wahl.ist-gewaehlt { background: #3a1a1e; box-shadow: inset 0 0 0 2px #ff5a5f; }
.kk-det__los { background: #7dffa8; color: #120d16; font-weight: 800; }
.kk-det__los:disabled { background: #1c1924; color: #fff; }
.kk-det__beweis { min-height: 38px; padding: 6px 12px; border: 0; border-radius: 999px; background: #241f16; color: #f2e6c4; font: 600 0.8125rem/1.2 Montserrat, sans-serif; box-shadow: inset 0 0 0 1px #5a4a28; cursor: pointer; }
.kk-det__beweis.ist-waehlbar { box-shadow: inset 0 0 0 2px #f2c94c; }
.kk-det__beweis.ist-gewaehlt { background: #f2c94c; color: #120d16; }
.kk-det__beweis.ist-neu { animation: kk-det-neu 1.2s ease 2; }
.kk-det__leer { margin: 0; color: #a49cb4; font-size: 0.875rem; }
@keyframes kk-det-neu { 50% { box-shadow: inset 0 0 0 2px #7dffa8, 0 0 12px #7dffa8; } }
@media (prefers-reduced-motion: reduce) { .kk-det__beweis.ist-neu { animation: none; } }

/* Kickercraft */
.kk-spielfeld--kickercraft { max-width: 820px; margin-inline: auto; }
.kk-spielfeld--kickercraft .kk-spielfeld__canvas { width: 100%; max-height: calc(100svh - 300px); min-height: 160px; object-fit: contain; border-radius: 10px; image-rendering: pixelated; touch-action: none; }
.kk-craft__werkzeug { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.kk-craft__knopf { min-height: 42px; padding: 6px 14px; border: 0; border-radius: 10px; background: #1b2a22; color: #e8efe9; font: 700 0.8125rem/1.2 Montserrat, sans-serif; box-shadow: inset 0 0 0 1px #34403a; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kk-craft__knopf:hover, .kk-craft__knopf:focus-visible { box-shadow: inset 0 0 0 2px #7dffa8; outline: none; }
.kk-craft__knopf.ist-an { background: #24402e; box-shadow: inset 0 0 0 2px #7dffa8; }
.kk-craft__knopf:disabled { opacity: 0.45; cursor: not-allowed; }
.kk-craft__modus--bau { background: #2a3d1a; color: #c8ff9a; }
.kk-craft__modus--abbau { background: #3a2a1a; color: #ffd6a0; }
.kk-craft__einweihen { margin-left: auto; background: #7dffa8; color: #120d16; }
.kk-craft__einweihen:disabled { background: #1b2a22; color: #e8efe9; }
.kk-craft__meldung { min-height: 1.4em; margin: 8px 0 0; color: #f2c94c; font: 600 0.875rem/1.4 Montserrat, sans-serif; }
.kk-craft__inventar { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.kk-craft__ding { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 4px 10px 4px 6px; border: 0; border-radius: 10px; background: #15181a; color: #e8efe9; font: 600 0.75rem/1.1 Montserrat, sans-serif; box-shadow: inset 0 0 0 1px #2c3430; cursor: pointer; }
.kk-craft__ding.ist-gewaehlt { background: #24402e; box-shadow: inset 0 0 0 2px #7dffa8; }
.kk-craft__ding.ist-roh { opacity: 0.85; }
.kk-craft__symbol { display: inline-block; flex: none; width: 18px; height: 18px; border-radius: 4px; box-shadow: inset 0 0 0 1.5px rgba(0,0,0,0.5); }
.kk-craft__zahl { color: #f2c94c; font-weight: 800; }
.kk-craft__taste { position: absolute; top: -5px; right: -4px; min-width: 14px; height: 14px; border-radius: 7px; background: #34403a; color: #c8d4cc; font-size: 0.5625rem; line-height: 14px; text-align: center; }
.kk-craft__leer { margin: 0; color: #9aa69e; font-size: 0.875rem; }
.kk-craft__panel:empty { display: none; }
.kk-craft__panel { margin-top: 12px; padding: 12px; border-radius: 12px; background: #111614; box-shadow: inset 0 0 0 1px #2c3430; }
.kk-craft__kopf { margin: 0 0 8px; color: #9aa69e; font: 800 0.75rem/1 Montserrat, sans-serif; letter-spacing: 0.08em; text-transform: uppercase; }
.kk-craft__rezepte { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 6px; }
.kk-craft__rezept { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 6px 10px; border: 0; border-radius: 10px; background: #1b2a22; color: #e8efe9; text-align: left; font: 400 0.8125rem/1.25 Montserrat, sans-serif; box-shadow: inset 0 0 0 1px #34403a; cursor: pointer; }
.kk-craft__rezept:hover:not(:disabled) { box-shadow: inset 0 0 0 2px #7dffa8; }
.kk-craft__rezept.ist-aus { opacity: 0.5; cursor: not-allowed; }
.kk-craft__was { display: flex; flex-direction: column; gap: 2px; }
.kk-craft__was small { opacity: 0.75; font-size: 0.75rem; }
.kk-craft__auftrag { display: flex; align-items: center; gap: 10px; padding: 6px 0; color: #e8efe9; font: 400 0.875rem/1.3 Montserrat, sans-serif; border-bottom: 1px solid #222a26; }
.kk-craft__auftrag.ist-erfuellt strong { color: #7dffa8; }
.kk-craft__stern { flex: none; width: 22px; color: #f2c94c; font-size: 1.125rem; text-align: center; }
.kk-craft__werte { margin: 10px 0; color: #9aa69e; font-size: 0.8125rem; }
.kk-craft__neu { background: #2a1a1c; color: #ff9a9d; }
.kk-craft__steuer { margin-top: 10px; }
@media (max-height: 500px) { .kk-spielfeld--kickercraft .kk-spielfeld__canvas { max-height: calc(100svh - 80px); } }

/* Kickerkeller Renovator */
.kk-spielfeld--renovator { max-width: 820px; margin-inline: auto; }
.kk-spielfeld--renovator .kk-spielfeld__canvas { width: 100%; max-height: calc(100svh - 320px); min-height: 160px; object-fit: contain; border-radius: 12px; touch-action: none; cursor: crosshair; }
.kk-reno__leiste { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.kk-reno__knopf { display: inline-flex; align-items: center; gap: 6px; min-height: 42px; padding: 6px 14px; border: 0; border-radius: 10px; background: #1e1a16; color: #f0ebe2; font: 700 0.8125rem/1.2 Montserrat, sans-serif; box-shadow: inset 0 0 0 1px #3c342a; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kk-reno__knopf:hover, .kk-reno__knopf:focus-visible { box-shadow: inset 0 0 0 2px #f2c94c; outline: none; }
.kk-reno__knopf.ist-an { background: #3a3014; box-shadow: inset 0 0 0 2px #f2c94c; color: #f2c94c; }
.kk-reno__raum.ist-an { background: #1b2a22; box-shadow: inset 0 0 0 2px #7dffa8; color: #7dffa8; }
.kk-reno__feier { margin-left: auto; background: #7dffa8; color: #120d16; }
.kk-reno__eimer, .kk-reno__inventar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; flex-basis: 100%; }
.kk-reno__farbe { font-weight: 600; }
.kk-reno__farbe.ist-neu { opacity: 0.8; }
.kk-reno__klecks { display: inline-block; width: 14px; height: 14px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(0,0,0,0.4); }
.kk-reno__kopf { margin: 0; color: #a89a86; font: 800 0.75rem/1 Montserrat, sans-serif; letter-spacing: 0.08em; text-transform: uppercase; }
.kk-reno__ding { background: #2a2416; }
.kk-reno__meldung { min-height: 1.4em; margin: 8px 0 0; color: #f2c94c; font: 600 0.875rem/1.4 Montserrat, sans-serif; }
.kk-reno__aufgaben { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px 14px; margin-top: 8px; }
.kk-reno__aufgabe { display: flex; align-items: center; gap: 8px; color: #d8d0c4; font: 600 0.75rem/1.2 Montserrat, sans-serif; }
.kk-reno__aufgabe > span:first-child { flex: none; width: 74px; }
.kk-reno__balken { flex: 1; height: 6px; border-radius: 3px; background: #2a2620; overflow: hidden; }
.kk-reno__balken > span { display: block; height: 100%; background: #f2c94c; transition: width 0.2s; }
.kk-reno__aufgabe.ist-fertig .kk-reno__balken > span { background: #7dffa8; }
.kk-reno__aufgabe--gesamt { color: #7dffa8; }
.kk-reno__aufgabe--gesamt b { font-size: 0.9375rem; }
.kk-reno__panel:empty { display: none; }
.kk-reno__panel { margin-top: 12px; padding: 12px; border-radius: 12px; background: #15120f; box-shadow: inset 0 0 0 1px #3c342a; }
.kk-reno__panel .kk-reno__kopf { margin-bottom: 10px; }
.kk-reno__raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; }
.kk-reno__artikel { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border: 0; border-radius: 10px; background: #1e1a16; color: #f0ebe2; text-align: left; font: 400 0.8125rem/1.3 Montserrat, sans-serif; box-shadow: inset 0 0 0 1px #3c342a; cursor: pointer; }
.kk-reno__artikel:hover:not(:disabled) { box-shadow: inset 0 0 0 2px #f2c94c; }
.kk-reno__artikel.ist-teuer { opacity: 0.45; cursor: not-allowed; }
.kk-reno__artikelkopf { display: flex; justify-content: space-between; gap: 8px; }
.kk-reno__preis { color: #f2c94c; font-weight: 800; }
.kk-reno__artikel small { opacity: 0.75; font-size: 0.75rem; }
@media (max-height: 500px) { .kk-spielfeld--renovator .kk-spielfeld__canvas { max-height: calc(100svh - 80px); } }
.kk-reno__aufgaben { width: 100%; text-align: left; }
.kk-reno__aufgabe--gesamt { grid-column: 1 / -1; justify-content: flex-start; }
.kk-reno__aufgabe--gesamt > span:first-child { width: auto; }

/* Kellerassi – Schatten über Bergedorf */
.kk-spielfeld--schatten { max-width: 1160px; margin-inline: auto; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.kk-spielfeld--schatten .kk-sb__canvas { display: block; width: 100%; height: auto; max-height: calc(100svh - 150px); margin-inline: auto; object-fit: contain; background: #0b0a18; border-radius: 10px; image-rendering: pixelated; image-rendering: crisp-edges; touch-action: none; }
@supports (aspect-ratio: 16 / 9) { .kk-spielfeld--schatten .kk-sb__canvas { width: min(100%, calc((100svh - 150px) * 16 / 9)); } }
.kk-sb__steuer { display: none; justify-content: space-between; align-items: flex-end; gap: 12px; margin-top: 10px; padding: 0 4px; touch-action: none; -webkit-user-select: none; user-select: none; }
@media (pointer: coarse), (hover: none) { .kk-sb__steuer { display: flex; } }
.kk-sb__kreuz { display: grid; grid-template-columns: repeat(3, 54px); grid-template-rows: repeat(3, 50px); grid-template-areas: ". hoch ." "links . rechts" ". runter ."; gap: 4px; }
.kk-sb__knoepfe { display: grid; grid-template-columns: repeat(3, 62px); grid-template-rows: 40px 58px 58px; grid-template-areas: "pause rage block" "gadget tritt ." "schlag sprung sprung"; gap: 6px; }
.kk-sb__k { display: grid; place-items: center; padding: 0; border: 0; border-radius: 14px; background: rgba(28,22,40,0.92); box-shadow: inset 0 0 0 1px #3a3050, 0 3px 0 #0a0810; color: #e8e2f4; font: 800 0.6875rem/1 Montserrat, sans-serif; letter-spacing: 0.04em; text-transform: uppercase; touch-action: none; -webkit-tap-highlight-color: transparent; }
.kk-sb__k.ist-an { background: #3a2a5a; box-shadow: inset 0 0 0 2px #b07aff; transform: translateY(2px); }
.kk-sb__k--hoch { grid-area: hoch; }
.kk-sb__k--runter { grid-area: runter; }
.kk-sb__k--runter svg { transform: rotate(180deg); }
.kk-sb__k--links { grid-area: links; }
.kk-sb__k--links svg { transform: rotate(-90deg); }
.kk-sb__k--rechts { grid-area: rechts; }
.kk-sb__k--rechts svg { transform: rotate(90deg); }
.kk-sb__k--schlag { grid-area: schlag; border-radius: 50%; background: #2a1a20; color: #ffb0b4; }
.kk-sb__k--tritt { grid-area: tritt; border-radius: 50%; background: #2a2414; color: #f2c94c; }
.kk-sb__k--sprung { grid-area: sprung; border-radius: 29px; background: #14281c; color: #7dffa8; }
.kk-sb__k--gadget { grid-area: gadget; border-radius: 50%; background: #142028; color: #8ad0ff; }
.kk-sb__k--block { grid-area: block; color: #c8b0ff; }
.kk-sb__k--rage { grid-area: rage; color: #7dffa8; }
.kk-sb__k--pause { grid-area: pause; color: #9a90b0; }
/* Vollbild: Steuerung liegt über dem Bild, Safe Areas beachten */
.kk-vollbild.kk-spielfeld--schatten .kk-sb__canvas { max-height: none; border-radius: 0; }
.kk-vollbild.kk-spielfeld--schatten .kk-sb__steuer { position: fixed; left: 0; right: 0; bottom: 0; z-index: 5; margin: 0; padding: 0 max(12px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); pointer-events: none; }
.kk-vollbild.kk-spielfeld--schatten .kk-sb__kreuz, .kk-vollbild.kk-spielfeld--schatten .kk-sb__knoepfe { pointer-events: auto; opacity: 0.82; }
.kk-vollbild.kk-spielfeld--schatten .kk-sb__k { background-color: rgba(20,16,30,0.55); }
@media (max-height: 500px) and (orientation: landscape) {
	.kk-spielfeld--schatten .kk-sb__canvas { max-height: calc(100svh - 40px); }
	.kk-spielfeld--schatten .kk-spielfeld__hinweis { display: none; }
	.kk-sb__kreuz { grid-template-columns: repeat(3, 48px); grid-template-rows: repeat(3, 44px); }
	.kk-sb__knoepfe { grid-template-columns: repeat(3, 56px); grid-template-rows: 34px 52px 52px; }
}
@media (max-height: 500px) { .kk-vollbild.kk-spielfeld--schatten .kk-spielfeld__anzeige { display: none; } }