fix(ui): tooltip readability — dark bg + parchment text (was light-on-light)

Operator-flagged 2026-05-28: tooltips (e.g. the action buttons in
Subscriptions → Subscriptions) render near-white-on-near-white,
unreadable.

Cause: Vuetify's default v-tooltip pairs `on-surface-variant` text with
an `surface-variant` background. FC's theme deliberately maps
`on-surface-variant` to vellum (#C2BFB4 — a light cream, the correct
muted-text token for captions/hints on the dark page) but never defines
`surface-variant`, so Vuetify auto-generates a light-ish tooltip
background. Light text on light bg.

Fix is tooltip-specific so it doesn't disturb the (correctly light)
muted-text token elsewhere. New app-global stylesheet
frontend/src/styles/app.css, imported in main.js AFTER vuetify/styles
(equal-specificity rule wins by source order), overrides
`.v-tooltip > .v-overlay__content` to a dark elevated panel
(surface-bright = slate #2C313A) with high-contrast parchment text
(#E8E4D8) + a subtle border + shadow. Applies to every tooltip in the
app, so the fix is consistent rather than per-component.

frontend/src/main.js

@@ -3,6 +3,9 @@ import { createPinia } from 'pinia'
 import { createVuetify } from 'vuetify'
 import 'vuetify/styles'
 import '@mdi/font/css/materialdesignicons.css'
+// App-global CSS overrides — imported AFTER vuetify/styles so equal-
+// specificity rules (e.g. the tooltip readability fix) win by source order.
+import './styles/app.css'
 
 import App from './App.vue'
 import router from './router.js'

frontend/src/styles/app.css

@@ -0,0 +1,21 @@
+/* App-global overrides. Imported in main.js AFTER 'vuetify/styles' so
+   these win on equal selector specificity by source order. */
+
+/* Tooltip readability fix (operator-flagged 2026-05-28).
+   Vuetify's default v-tooltip pairs `on-surface-variant` TEXT with an
+   `surface-variant` BACKGROUND. FC's theme deliberately maps
+   `on-surface-variant` to vellum (#C2BFB4 — a light cream, correct for
+   muted captions/hints on the dark page) but never defines
+   `surface-variant`, so Vuetify auto-generates a light-ish background:
+   light text on light bg → near-white-on-near-white, unreadable.
+
+   Tooltips want the inverse of muted body text — a dark, slightly
+   elevated panel with the HIGH-contrast parchment text. Fixing it here
+   (not by changing on-surface-variant) keeps captions/empty-states
+   correct while making every tooltip in the app legible. */
+.v-tooltip > .v-overlay__content {
+  background: rgb(var(--v-theme-surface-bright));   /* slate #2C313A */
+  color: rgb(var(--v-theme-on-surface));            /* parchment #E8E4D8 */
+  border: 1px solid rgb(var(--v-theme-on-surface-variant) / 0.25);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
+}