Referer badge: translucent theme-aware pill, compact UTM summary with click-to-copy

frontend/src/assets/pagerite.css

@@ -26,14 +26,15 @@
   /* Selection fill for page text and the CodeMirror editors; themes
      override when the accent tint clashes with accent-colored text. */
   --selection-bg: color-mix(var(--accent) 30%, transparent);
-  /* Referer-badge chip in the analytics viewer: a fixed neutral palette,
+  /* Referer-badge chip in the analytics viewer: a translucent neutral wash,
      deliberately NOT themed — the chip sits behind transparent favicons, so
      black-on-transparent and white-on-transparent glyphs must both stay
-     legible on every theme (dark greys kill black glyphs, pure white kills
-     white ones); its text likewise stays dark on any theme. */
-  --badge-bg: #c9d1d9;
-  --badge-text: #1f2328;
-  --badge-muted: #59636e;
+     legible on every theme (a slight whitening keeps black glyphs readable
+     on dark bars without a glaring solid-white chip). Being translucent, it
+     takes the page's tone, so its text follows the theme's colors. */
+  --badge-bg: #aaaaaa44;
+  --badge-text: var(--text);
+  --badge-muted: var(--muted);
   /* Code highlighting palette, consumed by pygments.css: complete light and
      dark sets (background included), resolved by light-dark() from the
      used color-scheme. A theme picks a set simply by declaring