MediaWiki:Common.css

/* Размещённый здесь CSS будет применяться ко всем темам оформления */

:root {
	--mask-rarity:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M 0.5,0 0,0.5 0.5,1 1,0.5 Z M 0.5,0.2 0.8,0.5 0.5,0.8 0.2,0.5 Z'%3E%3C/path%3E%3C/svg%3E");
	--mask-rarity-1: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M 0,0.5 0.5,0 1,0.5 0.5,1 Z'%3E%3C/path%3E%3C/svg%3E");
	--mask-rarity-2: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M 0.5,0 0,0.5 0.2,0.7 0.7,0.2 Z m 0.3,0.3 -0.5,0.5 L 0.5,1 1,0.5 Z'%3E%3C/path%3E%3C/svg%3E");
	--mask-rarity-3: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M 0.5,0 0,0.5 0.1,0.6 0.6,0.1 Z m 0.2,0.2 -0.5,0.5 0.1,0.1 0.5,-0.5 z M 0.9,0.4 0.4,0.9 l 0.1,0.1 L 1,0.5 Z'%3E%3C/path%3E%3C/svg%3E");
	--mask-rarity-4: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M 0.5,0 0.3,0.2 0.5,0.4 0.7,0.2 Z M 0.8,0.3 0.6,0.5 0.8,0.7 1,0.5 Z m -0.6,0 L 0,0.5 0.2,0.7 0.4,0.5 Z M 0.5,0.6 0.3,0.8 0.5,1 0.7,0.8 Z'%3E%3C/path%3E%3C/svg%3E");
	--mask-rarity-5: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M 0.5,0 0.3,0.2 0.4,0.3 0.5,0.2 0.6,0.3 0.7,0.2 Z M 0.8,0.3 0.7,0.4 0.8,0.5 0.7,0.6 0.8,0.7 1,0.5 Z m -0.3,0 -0.2,0.2 0.2,0.2 0.2,-0.2 z m -0.3,0 L 0,0.5 0.2,0.7 0.3,0.6 0.2,0.5 0.3,0.4 Z M 0.6,0.7 0.5,0.8 0.4,0.7 0.3,0.8 0.5,1 0.7,0.8 Z'%3E%3C/path%3E%3C/svg%3E");

	--team-0: #444;
	--team-1: #B00;
	--team-2: #0B0;
	--team-3: #08F;

	--level-1: #FECE5A; --level-2: #FFA630;
	--level-3: #FF7315; --level-4: #E40000;
	--level-5: #FD2992; --level-6: #EB26CD;
	--level-7: #C124E0; --level-8: #9627F4;
	--level-9: #6D00F5; --level-10: #3A00F7;
}

.item-icon {
	display: inline-block;
	width: .85em;
	height: .85em;
	background: currentColor;
	vertical-align: -.1em;
}
.item-icon.core { border-radius: 1em; }
.item-icon.catalyser { clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.rarity   { mask-image: var(--mask-rarity); }
.rarity-1 { mask-image: var(--mask-rarity-1); }
.rarity-2 { mask-image: var(--mask-rarity-2); }
.rarity-3 { mask-image: var(--mask-rarity-3); }
.rarity-4 { mask-image: var(--mask-rarity-4); }
.rarity-5 { mask-image: var(--mask-rarity-5); }
.rarity-any { animation: rarity-any 5s linear infinite normal; }

@keyframes rarity-any {
	0%   { mask-image: var(--mask-rarity-1); }
	20%  { mask-image: var(--mask-rarity-2); }
	40%  { mask-image: var(--mask-rarity-3); }
	60%  { mask-image: var(--mask-rarity-4); }
	80%  { mask-image: var(--mask-rarity-5); }
	100% { mask-image: var(--mask-rarity-1); }
}

.spoiler {
	--bgc: #d6d6d6;
	background-color: var(--bgc);
    color: var(--bgc);
    user-select: none;
    padding: 0 .15em;
}
.spoiler:hover {
	color: inherit;
	user-select: unset;
}