body {
	--category-gap: 0.5rem;

	--icon-sprint: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBvcGFjaXR5PSIuNCIgZD0iTTMyIDE4My44QzMyIDE5Ny4xIDQyLjcgMjA3LjggNTYgMjA3LjhMMTY4IDIwNy44QzE4MS4zIDIwNy44IDE5MiAxOTcuMSAxOTIgMTgzLjhDMTkyIDE3MC41IDE4MS4zIDE1OS44IDE2OCAxNTkuOEw1NiAxNTkuOEM0Mi43IDE1OS44IDMyIDE3MC41IDMyIDE4My44ek0zMiAzNzUuOEMzMiAzODkuMSA0Mi43IDM5OS44IDU2IDM5OS44TDIwMCAzOTkuOEMyMTMuMyAzOTkuOCAyMjQgMzg5LjEgMjI0IDM3NS44QzIyNCAzNjIuNSAyMTMuMyAzNTEuOCAyMDAgMzUxLjhMNTYgMzUxLjhDNDIuNyAzNTEuOCAzMiAzNjIuNSAzMiAzNzUuOHpNNjQgMjc5LjhDNjQgMjkzLjEgNzQuNyAzMDMuOCA4OCAzMDMuOEwxNTIgMzAzLjhDMTY1LjMgMzAzLjggMTc2IDI5My4xIDE3NiAyNzkuOEMxNzYgMjY2LjUgMTY1LjMgMjU1LjggMTUyIDI1NS44TDg4IDI1NS44Qzc0LjcgMjU1LjggNjQgMjY2LjUgNjQgMjc5Ljh6TTE5OS4zIDU3OS41QzIxMC41IDU5My4xIDIzMC43IDU5NS4xIDI0NC4zIDU4My44TDMyNi43IDUxNS45QzM0MC4xIDUwNC45IDM1MC4yIDQ5MC40IDM1NiA0NzQuMUwzNjIuOSA0NTQuOEwzNTguMiA0NTMuNEMzMzcuOCA0NDcuMyAzMjAuMyA0MzUuOCAzMDcgNDIxTDI5NS43IDQ1Mi43QzI5My44IDQ1OC4xIDI5MC40IDQ2MyAyODUuOSA0NjYuNkwyMDMuNSA1MzQuNUMxODkuOSA1NDUuNyAxODcuOSA1NjUuOSAxOTkuMiA1NzkuNXoiLz48cGF0aCBkPSJNNDQ4IDE0NEM0NzguOSAxNDQgNTA0IDExOC45IDUwNCA4OEM1MDQgNTcuMSA0NzguOSAzMiA0NDggMzJDNDE3LjEgMzIgMzkyIDU3LjEgMzkyIDg4QzM5MiAxMTguOSA0MTcuMSAxNDQgNDQ4IDE0NHpNMzA3LjcgMjQ1QzMwOC45IDI0MiAzMTEuOSAyNDAgMzE1LjEgMjQwTDM1MSAyNDBMMzI4LjMgMzMwLjZDMzIwIDM2My44IDMzOS4zIDM5Ny42IDM3MiA0MDcuNEw0NjggNDM2LjJMNDE4LjggNTQ3QzQxMS42IDU2My4xIDQxOC45IDU4Mi4xIDQzNSA1ODkuMkM0NTEuMSA1OTYuMyA0NzAuMSA1ODkuMSA0NzcuMiA1NzNMNTMzLjggNDQ1LjZDNTQ1LjUgNDE5LjIgNTMxLjQgMzg4LjQgNTAzLjcgMzgwLjFMNDI4LjMgMzU3LjVMNDQ5IDI4Ny4xTDQ1OSAzMDQuMkM0NzAuNSAzMjMuOSA0OTEuNSAzMzYgNTE0LjMgMzM2TDU3NS45IDMzNkM1OTMuNiAzMzYgNjA3LjkgMzIxLjcgNjA3LjkgMzA0QzYwNy45IDI4Ni4zIDU5My42IDI3MiA1NzUuOSAyNzJMNTE0LjMgMjcyTDQ4MS41IDIxNS43QzQ2Ny4yIDE5MS4xIDQ0MC45IDE3NiA0MTIuNCAxNzZMMzE1LjEgMTc2QzI4NS43IDE3NiAyNTkuMiAxOTMuOSAyNDguMiAyMjEuM0wyMjYuMyAyNzYuMkMyMTkuNyAyOTIuNiAyMjcuNyAzMTEuMiAyNDQuMSAzMTcuOEMyNjAuNSAzMjQuNCAyNzkuMSAzMTYuNCAyODUuNyAzMDBMMzA3LjcgMjQ1eiIvPjwvc3ZnPg==");

	--icon-type-bug: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBvcGFjaXR5PSIuNCIgZD0iTTIwOCAzNDRMMjA4IDQxNkMyMDggNDY5LjYgMjQ1LjcgNTE0LjQgMjk2IDUyNS40TDI5NiAzNjBDMjk2IDM0Ni43IDMwNi43IDMzNiAzMjAgMzM2QzMzMy4zIDMzNiAzNDQgMzQ2LjcgMzQ0IDM2MEwzNDQgNTI1LjRDMzk0LjMgNTE0LjQgNDMyIDQ2OS42IDQzMiA0MTZMNDMyIDM0NEM0MzIgMzEzLjEgNDA2LjkgMjg4IDM3NiAyODhMMjY0IDI4OEMyMzMuMSAyODggMjA4IDMxMy4xIDIwOCAzNDR6Ii8+PHBhdGggZD0iTTMyMCA2NEMyNjcgNjQgMjI0IDEwNyAyMjQgMTYwTDIyNCAxNjMuNkMyMjQgMTc5LjMgMjM2LjcgMTkyIDI1Mi40IDE5MkwzODcuNSAxOTJDNDAzLjIgMTkyIDQxNS45IDE3OS4zIDQxNS45IDE2My42TDQxNS45IDE2MEM0MTUuOSAxMDcgMzcyLjkgNjQgMzE5LjkgNjR6TTQzMiAzNDRMNDMyIDQxNkM0MzIgNDY5LjYgMzk0LjMgNTE0LjQgMzQ0IDUyNS40TDM0NCAzNjBDMzQ0IDM0Ni43IDMzMy4zIDMzNiAzMjAgMzM2QzMwNi43IDMzNiAyOTYgMzQ2LjcgMjk2IDM2MEwyOTYgNTI1LjRDMjQ1LjcgNTE0LjQgMjA4IDQ2OS42IDIwOCA0MTZMMjA4IDM0NEMyMDggMzEzLjEgMjMzLjEgMjg4IDI2NCAyODhMMzc2IDI4OEM0MDYuOSAyODggNDMyIDMxMy4xIDQzMiAzNDR6TTE3OS44IDI4Mi45QzE3MC4zIDI5NiAxNjMuOCAzMTEuMyAxNjEuMiAzMjhMNTYgMzI4QzQyLjcgMzI4IDMyIDMzOC43IDMyIDM1MkMzMiAzNjUuMyA0Mi43IDM3NiA1NiAzNzZMMTYwIDM3NkwxNjAgNDE2QzE2MCA0MjIuNSAxNjAuNCA0MjguOSAxNjEuMSA0MzUuMUw3My42IDUwMC44QzYzIDUwOC44IDYwLjggNTIzLjggNjguOCA1MzQuNEM3Ni44IDU0NSA5MS44IDU0Ny4yIDEwMi40IDUzOS4yTDE3NS40IDQ4NC41QzIwMSA1MzguNiAyNTYuMSA1NzYgMzIwIDU3NkMzODMuOSA1NzYgNDM5IDUzOC42IDQ2NC42IDQ4NC41TDUzNy42IDUzOS4yQzU0OC4yIDU0Ny4yIDU2My4yIDU0NSA1NzEuMiA1MzQuNEM1NzkuMiA1MjMuOCA1NzcgNTA4LjggNTY2LjQgNTAwLjhMNDc4LjkgNDM1LjFDNDc5LjYgNDI4LjggNDgwIDQyMi40IDQ4MCA0MTZMNDgwIDM3Nkw1ODQgMzc2QzU5Ny4zIDM3NiA2MDggMzY1LjMgNjA4IDM1MkM2MDggMzM4LjcgNTk3LjMgMzI4IDU4NCAzMjhMNDc4LjggMzI4QzQ3Ni4yIDMxMS4zIDQ2OS43IDI5NiA0NjAuMiAyODIuOUw1NjYuNCAyMDMuMkM1NzcgMTk1LjIgNTc5LjIgMTgwLjIgNTcxLjIgMTY5LjZDNTYzLjIgMTU5IDU0OC4yIDE1Ni44IDUzNy42IDE2NC44TDQyMi42IDI1MUM0MDguNiAyNDMuOSAzOTIuNyAyNDAgMzc2IDI0MEwyNjQgMjQwQzI0Ny4yIDI0MCAyMzEuNCAyNDQgMjE3LjQgMjUxTDEwMi40IDE2NC44QzkxLjggMTU2LjggNzYuOCAxNTkgNjguOCAxNjkuNkM2MC44IDE4MC4yIDYzIDE5NS4yIDczLjYgMjAzLjJMMTc5LjggMjgyLjl6Ii8+PC9zdmc+");
	--icon-type-epic: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBvcGFjaXR5PSIuNCIgZD0iTTE0NCAxNTJMMTQ0IDQyMi43QzE1My44IDQxOC40IDE2NC42IDQxNiAxNzYgNDE2TDQ3MiA0MTZDNDg1LjMgNDE2IDQ5NiA0MDUuMyA0OTYgMzkyTDQ5NiAxMzZDNDk2IDEyMi43IDQ4NS4zIDExMiA0NzIgMTEyTDE4NCAxMTJDMTYxLjkgMTEyIDE0NCAxMjkuOSAxNDQgMTUyek0yMTEuMSAxODIuNUwyMzQuNyAxNzAuN0wyNDYuNSAxNDcuMUMyNTAuNCAxMzkuMiAyNjEuNyAxMzkuMiAyNjUuNiAxNDcuMUwyNzcuNCAxNzAuN0wzMDEgMTgyLjVDMzA4LjkgMTg2LjQgMzA4LjkgMTk3LjcgMzAxIDIwMS42TDI3Ny40IDIxMy40TDI2NS42IDIzN0MyNjEuNyAyNDQuOSAyNTAuNCAyNDQuOSAyNDYuNSAyMzdMMjM0LjcgMjEzLjRMMjExLjEgMjAxLjZDMjAzLjIgMTk3LjcgMjAzLjIgMTg2LjQgMjExLjEgMTgyLjV6TTMwOC42IDI3OS4yTDM1NS4yIDI1OS4yTDM3NS4yIDIxMi42QzM3OC41IDIwNC44IDM4OS41IDIwNC44IDM5Mi44IDIxMi42TDQxMi44IDI1OS4yTDQ1OS40IDI3OS4yQzQ2Ny4yIDI4Mi41IDQ2Ny4yIDI5My41IDQ1OS40IDI5Ni44TDQxMi44IDMxNi44TDM5Mi44IDM2My40QzM4OS41IDM3MS4yIDM3OC41IDM3MS4yIDM3NS4yIDM2My40TDM1NS4yIDMxNi44TDMwOC42IDI5Ni44QzMwMC44IDI5My41IDMwMC44IDI4Mi41IDMwOC42IDI3OS4yeiIvPjxwYXRoIGQ9Ik0xODQgNjRDMTM1LjQgNjQgOTYgMTAzLjQgOTYgMTUyTDk2IDQ5NkM5NiA1NDAuMiAxMzEuOCA1NzYgMTc2IDU3Nkw1MjAgNTc2QzUzMy4zIDU3NiA1NDQgNTY1LjMgNTQ0IDU1MkM1NDQgNTM4LjcgNTMzLjMgNTI4IDUyMCA1MjhMNTEyIDUyOEw1MTIgNDUxLjlDNTMxLjMgNDM5IDU0NCA0MTcgNTQ0IDM5Mkw1NDQgMTM2QzU0NCA5Ni4yIDUxMS44IDY0IDQ3MiA2NEwxODQgNjR6TTQ2NCA0NjRMNDY0IDUyOEwxNzYgNTI4QzE1OC4zIDUyOCAxNDQgNTEzLjcgMTQ0IDQ5NkMxNDQgNDc4LjMgMTU4LjMgNDY0IDE3NiA0NjRMNDY0IDQ2NHpNMTc2IDQxNkMxNjQuNiA0MTYgMTUzLjggNDE4LjQgMTQ0IDQyMi43TDE0NCAxNTJDMTQ0IDEyOS45IDE2MS45IDExMiAxODQgMTEyTDQ3MiAxMTJDNDg1LjMgMTEyIDQ5NiAxMjIuNyA0OTYgMTM2TDQ5NiAzOTJDNDk2IDQwNS4zIDQ4NS4zIDQxNiA0NzIgNDE2TDE3NiA0MTZ6TTM1NS4yIDI1OS4yTDMwOC42IDI3OS4yQzMwMC44IDI4Mi41IDMwMC44IDI5My41IDMwOC42IDI5Ni44TDM1NS4yIDMxNi44TDM3NS4yIDM2My40QzM3OC41IDM3MS4yIDM4OS41IDM3MS4yIDM5Mi44IDM2My40TDQxMi44IDMxNi44TDQ1OS40IDI5Ni44QzQ2Ny4yIDI5My41IDQ2Ny4yIDI4Mi41IDQ1OS40IDI3OS4yTDQxMi44IDI1OS4yTDM5Mi44IDIxMi42QzM4OS41IDIwNC44IDM3OC41IDIwNC44IDM3NS4yIDIxMi42TDM1NS4yIDI1OS4yek0yNDYuNSAxNDcuMUwyMzQuNyAxNzAuN0wyMTEuMSAxODIuNUMyMDMuMiAxODYuNCAyMDMuMiAxOTcuNyAyMTEuMSAyMDEuNkwyMzQuNyAyMTMuNEwyNDYuNSAyMzdDMjUwLjQgMjQ0LjkgMjYxLjcgMjQ0LjkgMjY1LjYgMjM3TDI3Ny40IDIxMy40TDMwMSAyMDEuNkMzMDguOSAxOTcuNyAzMDguOSAxODYuNCAzMDEgMTgyLjVMMjc3LjQgMTcwLjdMMjY1LjYgMTQ3LjFDMjYxLjcgMTM5LjIgMjUwLjQgMTM5LjIgMjQ2LjUgMTQ3LjF6Ii8+PC9zdmc+");
	--icon-type-story: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBkPSJNMjc2LjQgMTY5LjhMMjk2IDE3OEwyOTYgNTIyLjRDMjQ4LjQgNTA1IDE5OCA0OTYgMTQ3LjIgNDk2TDExMiA0OTZMMTEyIDE0NEwxNDcuMiAxNDRDMTkxLjYgMTQ0IDIzNS41IDE1Mi44IDI3Ni40IDE2OS44ek00OTIuOCA0OTZDNDQyIDQ5NiAzOTEuNiA1MDUgMzQ0IDUyMi40TDM0NCAxNzhMMzYzLjYgMTY5LjhDNDA0LjUgMTUyLjggNDQ4LjQgMTQ0IDQ5Mi44IDE0NEw1MjggMTQ0TDUyOCA0OTZMNDkyLjggNDk2ek0zMjAgMTM2TDI5NC45IDEyNS41QzI0OC4xIDEwNiAxOTcuOSA5NiAxNDcuMiA5NkwxMTIgOTZDODUuNSA5NiA2NCAxMTcuNSA2NCAxNDRMNjQgNDk2QzY0IDUyMi41IDg1LjUgNTQ0IDExMiA1NDRMMTQ3LjIgNTQ0QzE5Ny45IDU0NCAyNDguMSA1NTQgMjk0LjkgNTczLjVMMzA3LjcgNTc4LjhDMzE1LjYgNTgyLjEgMzI0LjQgNTgyLjEgMzMyLjMgNTc4LjhMMzQ1LjEgNTczLjVDMzkxLjkgNTU0IDQ0Mi4xIDU0NCA0OTIuOCA1NDRMNTI4IDU0NEM1NTQuNSA1NDQgNTc2IDUyMi41IDU3NiA0OTZMNTc2IDE0NEM1NzYgMTE3LjUgNTU0LjUgOTYgNTI4IDk2TDQ5Mi44IDk2QzQ0Mi4xIDk2IDM5MS45IDEwNiAzNDUuMSAxMjUuNUwzMjAgMTM2ek0xNjggMTkyQzE1NC43IDE5MiAxNDQgMjAyLjcgMTQ0IDIxNkMxNDQgMjI5LjMgMTU0LjcgMjQwIDE2OCAyNDBMMTcyLjIgMjQwQzE5MiAyNDAgMjExLjUgMjQ0LjYgMjI5LjIgMjUzLjVDMjQxLjEgMjU5LjQgMjU1LjUgMjU0LjYgMjYxLjQgMjQyLjhDMjY3LjMgMjMxIDI2Mi41IDIxNi41IDI1MC43IDIxMC42QzIyNi4zIDE5OC40IDE5OS40IDE5Mi4xIDE3Mi4yIDE5Mi4xTDE2OCAxOTIuMXpNNDY3LjggMTkyQzQ0MC41IDE5MiA0MTMuNyAxOTguMyAzODkuMyAyMTAuNUMzNzcuNCAyMTYuNCAzNzIuNiAyMzAuOCAzNzguNiAyNDIuN0MzODQuNiAyNTQuNiAzOTguOSAyNTkuNCA0MTAuOCAyNTMuNEM0MjguNSAyNDQuNSA0NDggMjM5LjkgNDY3LjggMjM5LjlMNDcyIDIzOS45QzQ4NS4zIDIzOS45IDQ5NiAyMjkuMiA0OTYgMjE1LjlDNDk2IDIwMi42IDQ4NS4zIDE5MS45IDQ3MiAxOTEuOUw0NjcuOCAxOTEuOXpNMTY4IDI4OEMxNTQuNyAyODggMTQ0IDI5OC43IDE0NCAzMTJDMTQ0IDMyNS4zIDE1NC43IDMzNiAxNjggMzM2TDE3Mi4yIDMzNkMxOTIgMzM2IDIxMS41IDM0MC42IDIyOS4yIDM0OS41QzI0MS4xIDM1NS40IDI1NS41IDM1MC42IDI2MS40IDMzOC44QzI2Ny4zIDMyNyAyNjIuNSAzMTIuNSAyNTAuNyAzMDYuNkMyMjYuMyAyOTQuNCAxOTkuNCAyODguMSAxNzIuMiAyODguMUwxNjggMjg4LjF6TTQ2Ny44IDI4OEM0NDAuNSAyODggNDEzLjcgMjk0LjMgMzg5LjMgMzA2LjVDMzc3LjQgMzEyLjQgMzcyLjYgMzI2LjggMzc4LjYgMzM4LjdDMzg0LjYgMzUwLjYgMzk4LjkgMzU1LjQgNDEwLjggMzQ5LjRDNDI4LjUgMzQwLjUgNDQ4IDMzNS45IDQ2Ny44IDMzNS45TDQ3MiAzMzUuOUM0ODUuMyAzMzUuOSA0OTYgMzI1LjIgNDk2IDMxMS45QzQ5NiAyOTguNiA0ODUuMyAyODcuOSA0NzIgMjg3LjlMNDY3LjggMjg3Ljl6TTE2OCAzODRDMTU0LjcgMzg0IDE0NCAzOTQuNyAxNDQgNDA4QzE0NCA0MjEuMyAxNTQuNyA0MzIgMTY4IDQzMkwxNzIuMiA0MzJDMTkyIDQzMiAyMTEuNSA0MzYuNiAyMjkuMiA0NDUuNUMyNDEuMSA0NTEuNCAyNTUuNSA0NDYuNiAyNjEuNCA0MzQuOEMyNjcuMyA0MjMgMjYyLjUgNDA4LjUgMjUwLjcgNDAyLjZDMjI2LjMgMzkwLjQgMTk5LjQgMzg0LjEgMTcyLjIgMzg0LjFMMTY4IDM4NC4xek00NjcuOCAzODRDNDQwLjUgMzg0IDQxMy43IDM5MC4zIDM4OS4zIDQwMi41QzM3Ny40IDQwOC40IDM3Mi42IDQyMi44IDM3OC42IDQzNC43QzM4NC42IDQ0Ni42IDM5OC45IDQ1MS40IDQxMC44IDQ0NS40QzQyOC41IDQzNi41IDQ0OCA0MzEuOSA0NjcuOCA0MzEuOUw0NzIgNDMxLjlDNDg1LjMgNDMxLjkgNDk2IDQyMS4yIDQ5NiA0MDcuOUM0OTYgMzk0LjYgNDg1LjMgMzgzLjkgNDcyIDM4My45TDQ2Ny44IDM4My45eiIvPjwvc3ZnPg==");
	--icon-type-task: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBvcGFjaXR5PSIuNCIgZD0iTTIyNCA0ODBDMjI0IDQ2Mi4zIDIzOC4zIDQ0OCAyNTYgNDQ4TDU0NCA0NDhDNTYxLjcgNDQ4IDU3NiA0NjIuMyA1NzYgNDgwQzU3NiA0OTcuNyA1NjEuNyA1MTIgNTQ0IDUxMkwyNTYgNTEyQzIzOC4zIDUxMiAyMjQgNDk3LjcgMjI0IDQ4MHpNMjg4IDE2MEMyODggMTQyLjMgMzAyLjMgMTI4IDMyMCAxMjhMNTQ0IDEyOEM1NjEuNyAxMjggNTc2IDE0Mi4zIDU3NiAxNjBDNTc2IDE3Ny43IDU2MS43IDE5MiA1NDQgMTkyTDMyMCAxOTJDMzAyLjMgMTkyIDI4OCAxNzcuNyAyODggMTYwek0yODggMzIwQzI4OCAzMDIuMyAzMDIuMyAyODggMzIwIDI4OEw1NDQgMjg4QzU2MS43IDI4OCA1NzYgMzAyLjMgNTc2IDMyMEM1NzYgMzM3LjcgNTYxLjcgMzUyIDU0NCAzNTJMMzIwIDM1MkMzMDIuMyAzNTIgMjg4IDMzNy43IDI4OCAzMjB6Ii8+PHBhdGggZD0iTTIwMy43IDEzMy44QzIxMS4zIDEyMi45IDIwOC43IDEwOCAxOTcuOCAxMDAuNEMxODYuOSA5Mi44IDE3MiA5NS40IDE2NC40IDEwNi4zTDEyNC43IDE2Mi44TDEwNSAxNDNDOTUuNiAxMzMuNyA4MC40IDEzMy43IDcxIDE0M0M2MS42IDE1Mi4zIDYxLjcgMTY3LjYgNzEgMTc3TDExMSAyMTdDMTE2IDIyMiAxMjMgMjI0LjYgMTMwLjEgMjIzLjlDMTM3LjIgMjIzLjIgMTQzLjYgMjE5LjYgMTQ3LjcgMjEzLjhMMjAzLjcgMTMzLjh6TTIwMy43IDI5My44QzIxMS4zIDI4Mi45IDIwOC43IDI2OCAxOTcuOCAyNjAuNEMxODYuOSAyNTIuOCAxNzIgMjU1LjQgMTY0LjQgMjY2LjNMMTI0LjcgMzIyLjhMMTA1IDMwM0M5NS42IDI5My42IDgwLjQgMjkzLjYgNzEuMSAzMDNDNjEuOCAzMTIuNCA2MS43IDMyNy42IDcxIDMzN0wxMTEgMzc3QzExNiAzODIgMTIzIDM4NC42IDEzMC4xIDM4My45QzEzNy4yIDM4My4yIDE0My42IDM3OS42IDE0Ny43IDM3My44TDIwMy43IDI5My44ek0xMjggNTIwQzE1MC4xIDUyMCAxNjggNTAyLjEgMTY4IDQ4MEMxNjggNDU3LjkgMTUwLjEgNDQwIDEyOCA0NDBDMTA1LjkgNDQwIDg4IDQ1Ny45IDg4IDQ4MEM4OCA1MDIuMSAxMDUuOSA1MjAgMTI4IDUyMHoiLz48L3N2Zz4=");
	--icon-type-subtask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBkPSJNNTg0IDM1MkM1OTcuMyAzNTIgNjA4IDM2Mi43IDYwOCAzNzZMNjA4IDQ4MEM2MDggNTE1LjMgNTc5LjMgNTQ0IDU0NCA1NDRMOTYgNTQ0QzYwLjcgNTQ0IDMyIDUxNS4zIDMyIDQ4MEwzMiAzNzZDMzIgMzYyLjcgNDIuNyAzNTIgNTYgMzUyQzY5LjMgMzUyIDgwIDM2Mi43IDgwIDM3Nkw4MCA0ODBDODAgNDg4LjggODcuMiA0OTYgOTYgNDk2TDU0NCA0OTZDNTUyLjggNDk2IDU2MCA0ODguOCA1NjAgNDgwTDU2MCAzNzZDNTYwIDM2Mi43IDU3MC43IDM1MiA1ODQgMzUyek00NDggOTZDNDgzLjMgOTYgNTEyIDEyNC43IDUxMiAxNjBMNTEyIDM4NEM1MTIgNDE5LjMgNDgzLjMgNDQ4IDQ0OCA0NDhMMTkyIDQ0OEMxNTYuNyA0NDggMTI4IDQxOS4zIDEyOCAzODRMMTI4IDE2MEMxMjggMTI0LjcgMTU2LjcgOTYgMTkyIDk2TDQ0OCA5NnpNNDEwLjkgMTgwLjZDNDAwLjIgMTcyLjggMzg1LjIgMTc1LjIgMzc3LjQgMTg1LjlMMjkxLjggMzAzLjZMMjY1LjMgMjc2LjJDMjU2LjEgMjY2LjcgMjQwLjkgMjY2LjQgMjMxLjQgMjc1LjZDMjIxLjkgMjg0LjggMjIxLjYgMzAwIDIzMC44IDMwOS41TDI3Ny4yIDM1Ny41QzI4Mi4xIDM2Mi42IDI4OSAzNjUuMyAyOTYuMSAzNjQuOEMzMDMuMiAzNjQuMyAzMDkuNyAzNjAuNyAzMTMuOSAzNTVMNDE2LjIgMjE0LjFDNDI0IDIwMy40IDQyMS42IDE4OC40IDQxMC45IDE4MC42eiIvPjwvc3ZnPg==");

	--icon-priority-blocker: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBkPSJNNTY2LjYgMTE4LjZDNTc5LjEgMTA2LjEgNTc5LjEgODUuOCA1NjYuNiA3My4zQzU1NC4xIDYwLjggNTMzLjggNjAuOCA1MjEuMyA3My4zTDQ3NyAxMTcuOEM0MzMuNiA4NC4xIDM3OS4yIDY0IDMyMCA2NEMxNzguNiA2NCA2NCAxNzguNiA2NCAzMjBDNjQgMzc5LjIgODQuMSA0MzMuNiAxMTcuOCA0NzdMNzMuNCA1MjEuNEM2MC45IDUzMy45IDYwLjkgNTU0LjIgNzMuNCA1NjYuN0M4NS45IDU3OS4yIDEwNi4yIDU3OS4yIDExOC43IDU2Ni43TDE2MyA1MjIuMkMyMDYuMyA1NTUuOSAyNjAuOCA1NzYgMzIwIDU3NkM0NjEuNCA1NzYgNTc2IDQ2MS40IDU3NiAzMjBDNTc2IDI2MC44IDU1NS45IDIwNi40IDUyMi4yIDE2M0w1NjYuNiAxMTguNnpNNDMxLjIgMTYzLjVMMTYzLjUgNDMxLjJDMTQxLjEgMzk5LjkgMTI4IDM2MS41IDEyOCAzMjBDMTI4IDIxNCAyMTQgMTI4IDMyMCAxMjhDMzYxLjUgMTI4IDM5OS45IDE0MS4xIDQzMS4yIDE2My41ek0yMDguNyA0NzYuNUw0NzYuNSAyMDguOEM0OTguOSAyNDAuMiA1MTIgMjc4LjYgNTEyIDMyMEM1MTIgNDI2IDQyNiA1MTIgMzIwIDUxMkMyNzguNSA1MTIgMjQwLjEgNDk4LjkgMjA4LjggNDc2LjV6Ii8+PC9zdmc+");
	--icon-priority-highest: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBvcGFjaXR5PSIuNCIgZD0iTTEwNS40IDQ4OS40QzkyLjkgNTAxLjkgOTIuOSA1MjIuMiAxMDUuNCA1MzQuN0MxMTcuOSA1NDcuMiAxMzguMiA1NDcuMiAxNTAuNyA1MzQuN0wzMjAgMzY1LjNMNDg5LjQgNTM0LjZDNTAxLjkgNTQ3LjEgNTIyLjIgNTQ3LjEgNTM0LjcgNTM0LjZDNTQ3LjIgNTIyLjEgNTQ3LjIgNTAxLjggNTM0LjcgNDg5LjNMMzQyLjcgMjk3LjNDMzMwLjIgMjg0LjggMzA5LjkgMjg0LjggMjk3LjQgMjk3LjNMMTA1LjQgNDg5LjN6Ii8+PHBhdGggZD0iTTI5Ny40IDEwNS40QzMwOS45IDkyLjkgMzMwLjIgOTIuOSAzNDIuNyAxMDUuNEw1MzQuNyAyOTcuNEM1NDcuMiAzMDkuOSA1NDcuMiAzMzAuMiA1MzQuNyAzNDIuN0M1MjIuMiAzNTUuMiA1MDEuOSAzNTUuMiA0ODkuNCAzNDIuN0wzMjAgMTczLjNMMTUwLjYgMzQyLjZDMTM4LjEgMzU1LjEgMTE3LjggMzU1LjEgMTA1LjMgMzQyLjZDOTIuOCAzMzAuMSA5Mi44IDMwOS44IDEwNS4zIDI5Ny4zTDI5Ny4zIDEwNS4zeiIvPjwvc3ZnPg==");
	--icon-priority-high: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBkPSJNMjk3LjQgMTY5LjRDMzA5LjkgMTU2LjkgMzMwLjIgMTU2LjkgMzQyLjcgMTY5LjRMNTM0LjcgMzYxLjRDNTQ3LjIgMzczLjkgNTQ3LjIgMzk0LjIgNTM0LjcgNDA2LjdDNTIyLjIgNDE5LjIgNTAxLjkgNDE5LjIgNDg5LjQgNDA2LjdMMzIwIDIzNy4zTDE1MC42IDQwNi42QzEzOC4xIDQxOS4xIDExNy44IDQxOS4xIDEwNS4zIDQwNi42QzkyLjggMzk0LjEgOTIuOCAzNzMuOCAxMDUuMyAzNjEuM0wyOTcuMyAxNjkuM3oiLz48L3N2Zz4=");
	--icon-priority-medium: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBkPSJNNjQgMzIwQzY0IDMwMi4zIDc4LjMgMjg4IDk2IDI4OEw1NDQgMjg4QzU2MS43IDI4OCA1NzYgMzAyLjMgNTc2IDMyMEM1NzYgMzM3LjcgNTYxLjcgMzUyIDU0NCAzNTJMOTYgMzUyQzc4LjMgMzUyIDY0IDMzNy43IDY0IDMyMHoiLz48L3N2Zz4=");
	--icon-priority-low: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBkPSJNMjk3LjQgNDcwLjZDMzA5LjkgNDgzLjEgMzMwLjIgNDgzLjEgMzQyLjcgNDcwLjZMNTM0LjcgMjc4LjZDNTQ3LjIgMjY2LjEgNTQ3LjIgMjQ1LjggNTM0LjcgMjMzLjNDNTIyLjIgMjIwLjggNTAxLjkgMjIwLjggNDg5LjQgMjMzLjNMMzIwIDQwMi43TDE1MC42IDIzMy40QzEzOC4xIDIyMC45IDExNy44IDIyMC45IDEwNS4zIDIzMy40QzkyLjggMjQ1LjkgOTIuOCAyNjYuMiAxMDUuMyAyNzguN0wyOTcuMyA0NzAuN3oiLz48L3N2Zz4=");
	--icon-priority-lowest: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNjQwIj48cGF0aCBvcGFjaXR5PSIuNCIgZD0iTTEwNS40IDEwNS40QzkyLjkgMTE3LjkgOTIuOSAxMzguMSAxMDUuNCAxNTAuNkwyOTcuNCAzNDIuNkMzMDkuOSAzNTUuMSAzMzAuMiAzNTUuMSAzNDIuNyAzNDIuNkw1MzQuNyAxNTAuNkM1NDcuMiAxMzguMSA1NDcuMiAxMTcuOCA1MzQuNyAxMDUuM0M1MjIuMiA5Mi44IDUwMS45IDkyLjggNDg5LjQgMTA1LjNMMzIwIDI3NC43TDE1MC42IDEwNS40QzEzOC4xIDkyLjkgMTE3LjggOTIuOSAxMDUuMyAxMDUuNHoiLz48cGF0aCBkPSJNMzQyLjYgNTM0LjZDMzMwLjEgNTQ3LjEgMzA5LjggNTQ3LjEgMjk3LjMgNTM0LjZMMTA1LjMgMzQyLjZDOTIuOCAzMzAuMSA5Mi44IDMwOS44IDEwNS4zIDI5Ny4zQzExNy44IDI4NC44IDEzOC4xIDI4NC44IDE1MC42IDI5Ny4zTDMyMCA0NjYuN0w0ODkuNCAyOTcuNEM1MDEuOSAyODQuOSA1MjIuMiAyODQuOSA1MzQuNyAyOTcuNEM1NDcuMiAzMDkuOSA1NDcuMiAzMzAuMiA1MzQuNyAzNDIuN0wzNDIuNyA1MzQuN3oiLz48L3N2Zz4=");
}

.issue-content {

	/* Issue and comment migration details */
	.comment-body div:has(> samp > time) {
		color: #fff6;
		display: flex;
		flex-wrap: wrap;
		font-family: var(--fonts-regular);
		font-size: 10px;
		gap: 0.5rem;
		margin-top: 2rem;

		samp {
			background: #0003;
			border-radius: 3px;
			display: inline-block;
			font-family: var(--fonts-regular);
			padding: 0 0.5rem;
		}
		
		samp > samp,
		time {
			display: inline-block;
			white-space: nowrap;
			font-family: var(--fonts-monospace);
			font-size: 12px;
			margin-left: 0.25rem;
			padding: 0;
			background: none;

		}
	}
}

/*	Draw a text notification that explicity states how and where
	the custom label icons and styles are defined.
 */
.page-content.repository.labels .switch.issue-list-navbar {
	position: relative;

	&::after {
		content: "✔️ Label icons and display order are set in Custom CSS.";
		display: block;
		position: absolute;
		left: 200px;
		width: 400px;
		max-width: calc(100vw - 360px);
		padding-left: 24px;
		text-indent: -24px;
	}
}

/*	The embedded issue link popup uses a different DOM structure
	for displaying the labels, so they require alternate styles.
 */
#issue-info-popup .labels-list {
	display: flex !important;
	
	/*	The sprint label itself cannot both truncate text and draw an icon.
		So if the list contains a sprint, the list container should draw the
		icon, allowing the sprint label to truncate text. The sprit will
		always be ordered first, right after the icon.
	 */
	&:has([style*="background-color: rgb(153, 153, 153)"])::before {
		content: "";
		display: inline-block;
		width: 20px;
		height: 20px;
		margin-right: 0.125em;

		position: absolute;
		vertical-align: middle;

		background-color: currentColor;
		color: white;

		-webkit-mask-image: var(--icon-type-subtask);
		-webkit-mask-position: center;
		-webkit-mask-repeat: no-repeat;
		-webkit-mask-size: contain;

		mask-image: var(--icon-sprint);
		mask-position: center;
		mask-repeat: no-repeat;
		mask-size: contain;
	}

	& > div.ui.label {
		/* A high order for labels by default */
		order: 50;

		/* Override the sort order */
		&[style*="background-color: rgb(255, 0, 0)"],		/* Priority/Blocker */
		&[style*="background-color: rgb(221, 68, 51)"],		/* Priority/Highest */
		&[style*="background-color: rgb(238, 153, 51)"],	/* Priority/High */
		&[style*="background-color: rgb(255, 238, 51)"],	/* Priority/Medium */
		&[style*="background-color: rgb(204, 221, 51)"],	/* Priority/Low */
		&[style*="background-color: rgb(153, 204, 51)"] {	/* Priority/lowest */
			margin-right: var(--category-gap);
			order: -1;
		}

		&[style*="background-color: rgb(204, 51, 51)"],		/* Type/Bug */
		&[style*="background-color: rgb(153, 119, 187)"],	/* Type/Epic */
		&[style*="background-color: rgb(153, 153, 255)"],	/* Type/Story */
		&[style*="background-color: rgb(204, 136, 136)"],	/* Type/Task */
		&[style*="background-color: rgb(153, 119, 119)"] {	/* Type/Subtask */
			margin-right: var(--category-gap);
			order: -2;
		}

		&[style*="background-color: rgb(153, 153, 153)"] {	/* Sprint */
			order: -3;
			position: relative;

			justify-content: right;
			margin-left: 21px;
			margin-right: var(--category-gap);
			padding-left: 20px;
			text-align: right;
		 	width: calc-size(fit-content, size - 52px); /* experimental */
			
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			
			/*	Hack-attack! - Draw an opaque background over the left side
				of the label to hide the text that couldn't be truncated.
			 */
			&::after {
				content: "";
				display: inline-block;
				width: 6px;
				height: 20px;

				background-color: #999999;
				border-bottom-left-radius: 4px;
				border-top-left-radius: 4px;

				position: absolute;
				left: 0;
			}
		}

 		&[style*="background-color: rgb(255, 0, 0)"],		/* Priority/Blocker */
		&[style*="background-color: rgb(221, 68, 51)"],		/* Priority/Highest */
		&[style*="background-color: rgb(238, 153, 51)"],	/* Priority/High */
		&[style*="background-color: rgb(255, 238, 51)"],	/* Priority/Medium */
		&[style*="background-color: rgb(204, 221, 51)"],	/* Priority/Low */
		&[style*="background-color: rgb(153, 204, 51)"],	/* Priority/lowest */
		&[style*="background-color: rgb(204, 51, 51)"],		/* Type/Bug */
		&[style*="background-color: rgb(153, 119, 187)"],	/* Type/Epic */
		&[style*="background-color: rgb(153, 153, 255)"],	/* Type/Story */
		&[style*="background-color: rgb(204, 136, 136)"],	/* Type/Task */
		&[style*="background-color: rgb(153, 119, 119)"]	/* Type/Subtask */
		{
			background-color: transparent !important;
			font-size: 0;
			padding: 0;
			
			/* Draw icon to the left of the label */
			&::before {
				content: "";
				display: inline-block;
				width: 20px;
				height: 20px;
				margin-right: 0.125em;

				background-color: currentColor;
				vertical-align: middle;

				-webkit-mask-repeat: no-repeat;
				-webkit-mask-position: center;
				-webkit-mask-size: contain;

				mask-repeat: no-repeat;
				mask-position: center;
				mask-size: contain;
			}
		}

		&[style*="background-color: rgb(204, 51, 51)"]::before {	/* Type/Bug */
			-webkit-mask-image: var(--icon-type-bug);
			mask-image: var(--icon-type-bug);
			color: rgb(204, 51, 51);
		}
		
		&[style*="background-color: rgb(153, 119, 187)"]::before {	/* Type/Epic */
			-webkit-mask-image: var(--icon-type-epic);
			mask-image: var(--icon-type-epic);
			color: rgb(153, 119, 187);
		}
		
		&[style*="background-color: rgb(153, 153, 255)"]::before {	/* Type/Story */
			-webkit-mask-image: var(--icon-type-story);
			mask-image: var(--icon-type-story);
			color: rgb(153, 153, 255);
		}
		
		&[style*="background-color: rgb(204, 136, 136)"]::before {	/* Type/Task */
			-webkit-mask-image: var(--icon-type-task);
			mask-image: var(--icon-type-task);
			color: rgb(204, 136, 136);
		}
		
		&[style*="background-color: rgb(153, 119, 119)"]::before {	/* Type/Subtask */
			-webkit-mask-image: var(--icon-type-subtask);
			mask-image: var(--icon-type-subtask);
			color: rgb(153, 119, 119);
		}
		
		&[style*="background-color: rgb(255, 0, 0)"]::before {		/* Priority/Blocker */
			-webkit-mask-image: var(--icon-priority-blocker);
			mask-image: var(--icon-priority-blocker);
			color: #FF0000;
		}
		
		&[style*="background-color: rgb(221, 68, 51)"]::before {	/* Priority/Highest */
			-webkit-mask-image: var(--icon-priority-highest);
			mask-image: var(--icon-priority-highest);
			color: #DD4433;
		}
		
		&[style*="background-color: rgb(238, 153, 51)"]::before {	/* Priority/High */
			-webkit-mask-image: var(--icon-priority-high);
			mask-image: var(--icon-priority-high);
			color: #EE9933;
		}
		
		&[style*="background-color: rgb(255, 238, 51)"]::before {	/* Priority/Medium */
			-webkit-mask-image: var(--icon-priority-medium);
			mask-image: var(--icon-priority-medium);
			color: #FFEE33;
		}
		
		&[style*="background-color: rgb(204, 221, 51)"]::before {	/* Priority/Low */
			-webkit-mask-image: var(--icon-priority-low);
			mask-image: var(--icon-priority-low);
			color: #CCDD33;
		}
		
		&[style*="background-color: rgb(153, 204, 51)"]::before {	/* Priority/lowest */
			-webkit-mask-image: var(--icon-priority-lowest);
			mask-image: var(--icon-priority-lowest);
			color: #99CC33;
		}
	}
}

/*	The primary issue page and the labels page share a DOM
	layout. so the same styles can be used for both pages.
 */
#issue-filters .menu,
.issue-content .filter .item,
.issue-label-list,
.labels-list {

	/* All labels get a high default order (unscoped labels fall here) */
	a:has(.ui.label) { order: 50; }

	/* Match entire scopes by prefix */
	a:has(.ui.label[data-tooltip-content^="Sprint: "]) {
		margin-right: var(--category-gap);
		order: 10;
	}

	a:has(.ui.label[data-tooltip-content^="Type: "]) {
		margin-right: var(--category-gap);
		order: 20;
	}

	a:has(.ui.label[data-tooltip-content^="Priority: "]) {
		margin-right: var(--category-gap);
		order: 30;
	}

	a:has(.ui.label[data-tooltip-content^="Component: "]) {
		margin-right: var(--category-gap);
		order: 40;
	}

	[data-tooltip-content^="Sprint: "],
	[data-tooltip-content^="Type: "],
	[data-tooltip-content^="Priority: "] {
		&::before {
			content: "";
			display: inline-block;
			width: 20px;
			height: 20px;
			margin-right: 0.125em;

			background-color: currentColor;

			-webkit-mask-repeat: no-repeat;
			-webkit-mask-position: center;
			-webkit-mask-size: contain;

			mask-repeat: no-repeat;
			mask-position: center;
			mask-size: contain;

			vertical-align: middle;		
		}
	}

	[data-tooltip-content^="Sprint: "] {
		&::before {
			-webkit-mask-image: var(--icon-sprint);
			mask-image: var(--icon-sprint);
		}
	
		& .scope-left {
			display: none;
		}
	
		& .scope-right {
			border-radius: inherit;
		}
	}

	[data-tooltip-content="Type: Bug"]::before {
		-webkit-mask-image: var(--icon-type-bug);
		mask-image: var(--icon-type-bug);
		color: #CC3333;
	}

	[data-tooltip-content="Type: Epic"]::before {
		-webkit-mask-image: var(--icon-type-epic);
		mask-image: var(--icon-type-epic);
		color: #9977BB;
	}

	[data-tooltip-content="Type: Story"]::before {
		-webkit-mask-image: var(--icon-type-story);
		mask-image: var(--icon-type-story);
		color: #9999FF;
	}

	[data-tooltip-content="Type: Task"]::before {
		-webkit-mask-image: var(--icon-type-task);
		mask-image: var(--icon-type-task);
		color: #CC8888;
	}

	[data-tooltip-content="Type: Subtask"]::before {
		-webkit-mask-image: var(--icon-type-subtask);
		mask-image: var(--icon-type-subtask);
		color: #997777;
	}

	[data-tooltip-content="Priority: Blocker"]::before {
		-webkit-mask-image: var(--icon-priority-blocker);
		mask-image: var(--icon-priority-blocker);
		color: #FF0000;
	}

	[data-tooltip-content="Priority: Highest"]::before {
		-webkit-mask-image: var(--icon-priority-highest);
		mask-image: var(--icon-priority-highest);
		color: #DD4433;
	}

	[data-tooltip-content="Priority: High"]::before {
		-webkit-mask-image: var(--icon-priority-high);
		mask-image: var(--icon-priority-high);
		color: #EE9933;
	}

	[data-tooltip-content="Priority: Medium"]::before {
		-webkit-mask-image: var(--icon-priority-medium);
		mask-image: var(--icon-priority-medium);
		color: #FFEE33;
	}

	[data-tooltip-content="Priority: Low"]::before {
		-webkit-mask-image: var(--icon-priority-low);
		mask-image: var(--icon-priority-low);
		color: #CCDD33;
	}

	[data-tooltip-content="Priority: Lowest"]::before {
		-webkit-mask-image: var(--icon-priority-lowest);
		mask-image: var(--icon-priority-lowest);
		color: #99CC33;
	}
}

#issue-filters .menu,
.issue-content .filter .item,
.issue-label-list {
	[data-tooltip-content^="Type: "],
	[data-tooltip-content^="Priority: "] {
		& .scope-left {
			display: none;
		}

		& ._scope-right {
			display: none;
		}

		& .scope-right {
			border-radius: 4px;
		}
	}
}

.labels-list {
	[data-tooltip-content^="Type: "],
	[data-tooltip-content^="Priority: "] {
		& .scope-left {
			display: none;
		}

		& .scope-right {
			display: none;
		}
	}
}