/* ReBBu Unified Web: the tag page. The search with its results; beside it the popular tags, the tag fight and the
   tag match. */

.ut-search { display: flex; gap: 10px; margin-bottom: 18px; }
.ut-search .uw-input { flex: 1; min-width: 0; }
.ut-result-head { display: flex; align-items: center; justify-content: space-between; gap: 12px 18px; flex-wrap: wrap; margin-bottom: 4px; }
.ut-result-head p { margin: 0; }
.ut-result img { image-rendering: pixelated; }
.ut-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
/* a player's tags: the pills of the dashboard (main.css), a size smaller; the tag searched for in gold */
.ut-tags a { padding: 2px 10px 3px 10px; border-radius: 999px; background: #2a6fb3; font-size: 13px; font-weight: 500; text-decoration: none; }
.ut-tags a:nth-child(5n+2) { background: #c8433f; }
.ut-tags a:nth-child(5n+3) { background: #b6409a; }
.ut-tags a:nth-child(5n+4) { background: #2e7d34; }
.ut-tags a:nth-child(5n+5) { background: #a85a0c; }
.uw-page .ut-tags a { color: #fff; }
.uw-page .ut-tags a:hover { color: #ffe08a; }
.uw-page .ut-tags a[aria-current] { background: var(--uw-gold); color: #3a2600; }
.ut-fight-result { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; margin-bottom: 18px; }
.ut-fight-result img { image-rendering: pixelated; }
.ut-fight-result p { margin: 0; }
.ut-match { display: flex; align-items: center; gap: 18px; margin-bottom: 18px; }
.ut-match p { margin: 0; }
.ut-match-value { flex: none; display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; font: 700 20px/1 var(--uw-font-display);
	background: radial-gradient(closest-side, var(--uw-panel) 76%, transparent 78%), conic-gradient(var(--uw-gold) calc(var(--ut-match) * 1%), var(--uw-night) 0); }
