.vjs-theme-fantasy {
	--vjs-theme-fantasy--primary:#9f44b4;
	--vjs-theme-fantasy--secondary:var(--eierschale);
}
/*.vjs-theme-fantasy .vjs-big-play-button{
	width:160px;height:160px;background:none;line-height:151px;font-size:158px;border:5px solid var(--eierschale);border-radius:1em;top:50%;left:50%;margin-top:-80px;margin-left:-80px;color:var(--eierschale);transition: color var(--transition-medium),	transform var(--transition-medium);
	/* Äußerer Glow um den Button herum */ /*
	box-shadow: inset 0 0 10px rgba(255, 248, 220, 0.4), 0 0 10px rgba(255, 248, 220, 0.4);
	text-shadow: 0 0 10px rgba(255, 248, 220, 0.4);
    /* Weicher Übergang für Animationen */ /*
    transition: box-shadow 0.3s ease, text-shadow 0.3s ease;
}
@media (max-width: 700px) {
	.vjs-theme-fantasy .vjs-big-play-button{
		width: 120px; height: 120px; line-height: 112px; font-size: 115px; margin-top:-60px;margin-left:-60px;
	}
} */
/* 1. Den Player als Container definieren (wichtig für cqw-Einheiten!) */
.vjs-theme-fantasy {
    container-type: inline-size;
}
/* 2. Der stufenlos skalierende Play-Button */
.vjs-theme-fantasy .vjs-big-play-button {
    /* Die Basisgröße orientiert sich an der Playerbreite (ca. 20% der Breite) */
    width: 30cqw;
    height: 30cqw;
    
    /* Begrenzung, damit der Button auf riesigen oder winzigen Screens nicht eskaliert */
    /*min-width: 80px;
    min-height: 80px;
    max-width: 180px;
    max-height: 180px;*/

    /* Das zentrierte Dreieck (Icon-Größe) skaliert passend mit */
    font-size: 33cqw;
    /* Ein feiner mathematischer Kniff, um die vertikale Zentrierung des Icons zu halten */
    line-height: 27.6cqw;
    
    /* Die Rahmenstärke passt sich ebenfalls leicht an */
    border: 1.2cqw solid var(--eierschale);
    border-radius: 1em;
    
    /* Absolute Zentrierung im Player */
    position: absolute;
    top: 40.3cqw;
    left: 84.6cqw;
    /*transform: translate(-50%, -50%);*/
    
    background: none;
    color: var(--eierschale);
    
    /* Äußerer Glow um den Button herum */
    box-shadow: inset 0 0 10px rgba(255, 248, 220, 0.4), 0 0 10px rgba(255, 248, 220, 0.4);
    text-shadow: 0 0 10px rgba(255, 248, 220, 0.4);
    
    /* Weicher Übergang für Hover-Animationen */
    transition: box-shadow 0.3s ease, text-shadow 0.3s ease, transform var(--transition-medium), color var(--transition-medium);
}

/* 3. Hover- und Focus-Effekt (Beibehaltung der Zentrierung beim Skalieren) */
.vjs-theme-fantasy.vjs-big-play-button:focus,
.vjs-theme-fantasy:hover .vjs-big-play-button {
    background-color: transparent;
    color: var(--eierschale); 
    border-color: var(--eierschale); 
    /* Nutzt translate zum Zentrieren UND scale für den Hover-Effekt */
    transform: translate(-50%, -50%) scale(1.15); 
}
/* Seitliche Verschiebung Playbutton ohne Kreis */
.video-js .vjs-big-play-button .vjs-icon-placeholder::before {
	translate: -7%;
}


.vjs-theme-fantasy.vjs-big-play-button:focus,.vjs-theme-fantasy:hover .vjs-big-play-button { 
	background-color:transparent;color:var(--eierschale); border-color: var(--eierschale); transform: /*translateY(-2px)*/scale(1.15); transition: transform var(--transition-medium);
}
.vjs-theme-fantasy .vjs-control-bar {
	height:54px; background-color:rgba(34,38,41,0.7)/*--anthrazit in RGBA*/
}
.vjs-theme-fantasy .vjs-button>.vjs-icon-placeholder:before,.vjs-theme-fantasy .vjs-time-control {
	line-height:54px
}
.vjs-theme-fantasy .vjs-play-control {
	font-size:1.5em;position:relative;color:var(--eierschale);
}
.vjs-theme-fantasy .vjs-volume-panel {
	order:4;color:var(--eierschale);
}
.vjs-theme-fantasy .vjs-volume-bar {
	margin-top:2.5em
}
.vjs-theme-city .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal{height:100%;background-color:var(--eierschale);}
.vjs-theme-fantasy .vjs-volume-level{background-color:var(--eierschale);}
.vjs-theme-fantasy .vjs-load-progress{/*background-color:var(--gruen-dunkel);*/}
.vjs-theme-fantasy .vjs-load-progress div {background:rgba(0,84,55,0.5);}
.vjs-theme-fantasy .vjs-progress-control .vjs-progress-holder,.vjs-theme-fantasy .vjs-progress-control:hover .vjs-progress-holder{font-size:1.5em}.vjs-theme-fantasy .vjs-play-control .vjs-icon-placeholder:before { 
	height:1.3em;width:1.3em;margin-top:.2em;border-radius:1em;border:3px solid var(--vjs-theme-fantasy--secondary);top:2px;left:9px;line-height:1.1
}
.vjs-theme-fantasy .vjs-play-control:hover .vjs-icon-placeholder:before{border:3px solid var(--vjs-theme-fantasy--secondary); box-shadow: inset 0 0 25px rgba(255, 248, 220, 0.6), 0 0 25px rgba(255, 248, 220, 0.6); text-shadow: 0 0 25px rgba(255, 248, 220, 0.6);}.vjs-theme-fantasy .vjs-play-progress,.vjs-theme-fantasy .vjs-play-progress:before{background-color:var(--gruen-hell)}.vjs-theme-fantasy .vjs-play-progress:before{height:.8em;width:.8em;content:"";border:4px solid var(--vjs-theme-fantasy--secondary);border-radius:.8em;top:-.25em}.vjs-theme-fantasy .vjs-progress-control{font-size:14px}.vjs-theme-fantasy .vjs-fullscreen-control{order:6; color:var(--eierschale);}.vjs-theme-fantasy .vjs-remaining-time{display:none}.vjs-theme-fantasy.nyan .vjs-play-progress{background-color:var(--gruen-dunkel); color:var(--gruen-dunkel);}

/* ORIG */