Template:Infobox Twitch streamer/sandbox/styles.css

/* twitch color branding */
.ib-twitch-title,
.ib-twitch-above,
.ib-twitch-header {
	background-color: #6441A4;
	color: white;
}

.ib-twitch-above {
	font-size: 125%;
}

.ib-twitch-above .honorific-prefix,
.ib-twitch-above .honorific-suffix {
	font-size: small;
	font-weight: normal;
}

/* override blue link on purple background */
.ib-twitch-above .honorific-prefix a,
.ib-twitch-above .honorific-suffix a {
	color: white;
}

.ib-twitch-header {
	line-height: 1.5em;
}

.ib-twitch-title {
	line-height: 1.6em;
}

.ib-twitch-sb .infobox-full-data {
	padding: 0;
}

.ib-twitch-sb div.nickname,
.ib-twitch-sb div.birthplace,
.ib-twitch-sb div.deathplace {
	display: inline;
}

.ib-twitch-below {
	color: darkslategray;
}

/* mobile fixes */
body.skin-minerva .ib-twitch-title {
	padding: 7px;
}

body.skin-minerva .ib-twitch-below hr:first-of-type {
	display: none;
}

/* Dark mode set from reading preferences */
@media screen {
	/* extra CSS class (.ib-twitch-sb) and !important tag needed to overcome the 
	specificity on a default Wikipedia dark mode stylesheet */
	html.skin-theme-clientpref-night .ib-twitch-sb .ib-twitch-title,
	html.skin-theme-clientpref-night .ib-twitch-sb .ib-twitch-above,
	html.skin-theme-clientpref-night .ib-twitch-sb .ib-twitch-header {
		background-color: #6441A4 !important;
		color: white !important;
	}
	html.skin-theme-clientpref-night .ib-twitch-sb .ib-twitch-signature span:not(.skin-invert):not(.skin-invert-image) img {
		filter: invert(1);
	}
	
}
/* Dark mode set through operating system */
@media screen and (prefers-color-scheme: dark) {
	/* extra CSS class (.ib-twitch-sb) and !important tag needed to overcome the 
	specificity on a default Wikipedia dark mode stylesheet */
	html.skin-theme-clientpref-os .ib-twitch-sb .ib-twitch-title,
	html.skin-theme-clientpref-os .ib-twitch-sb .ib-twitch-above,
	html.skin-theme-clientpref-os .ib-twitch-sb .ib-twitch-header {
		background-color: #6441A4 !important;
		color: white !important;
	}
	html.skin-theme-clientpref-os .ib-twitch-sb .ib-twitch-signature span:not(.skin-invert):not(.skin-invert-image) img {
		filter: invert(1);
	}
}