feat: Add 5 Platform Admin views for super-admin dashboard

- AdminDashboard: KPI cards (licenses, users, MRR, servers, signups) + quick links
- AdminLicenses: Searchable paginated table with detail panel, CSV export, license generation
- AdminSubscriptions: MRR summary cards, per-module breakdown, subscriber table
- AdminUsers: Paginated user table with super admin toggle and account disable actions
- AdminServers: Filterable server table with connection type badges, status dots, relative heartbeat times

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/views/platform-admin/AdminSubscriptions.vue

@@ -0,0 +1,145 @@
+<script setup lang="ts">
+import { ref, computed, onMounted } from 'vue'
+import { useApi } from '@/composables/useApi'
+import { CreditCard, Package, DollarSign, Users } from 'lucide-vue-next'
+
+const api = useApi()
+
+interface Subscription {
+  owner_email: string
+  module_name: string
+  license_id: string
+}
+
+interface SubscriptionResponse {
+  subscriptions: Subscription[]
+}
+
+const subscriptions = ref<Subscription[]>([])
+const isLoading = ref(false)
+
+const MODULE_PRICE = 9.99
+
+const totalSubscribers = computed(() => {
+  const emails = new Set(subscriptions.value.map(s => s.owner_email))
+  return emails.size
+})
+
+const totalMrr = computed(() => {
+  return subscriptions.value.length * MODULE_PRICE
+})
+
+const moduleBreakdown = computed(() => {
+  const counts: Record<string, number> = {}
+  for (const sub of subscriptions.value) {
+    counts[sub.module_name] = (counts[sub.module_name] || 0) + 1
+  }
+  return Object.entries(counts)
+    .map(([name, count]) => ({ name, count }))
+    .sort((a, b) => b.count - a.count)
+})
+
+async function fetchSubscriptions() {
+  isLoading.value = true
+  try {
+    const data = await api.get<SubscriptionResponse>('/admin/subscriptions')
+    subscriptions.value = data.subscriptions
+  } catch {
+    // API not wired yet
+  } finally {
+    isLoading.value = false
+  }
+}
+
+onMounted(() => {
+  fetchSubscriptions()
+})
+</script>
+
+<template>
+  <div class="p-6 space-y-6 bg-neutral-950 min-h-screen">
+    <!-- Header -->
+    <div class="flex items-center gap-3">
+      <CreditCard class="w-5 h-5 text-oxide-500" />
+      <div>
+        <h1 class="text-2xl font-bold text-neutral-100">Subscriptions</h1>
+        <p class="text-sm text-neutral-400 mt-0.5">Module subscription overview and subscriber details.</p>
+      </div>
+    </div>
+
+    <!-- Summary Cards -->
+    <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
+      <!-- Total Subscribers -->
+      <div class="bg-neutral-900 border border-neutral-800 rounded-lg p-5">
+        <div class="flex items-center gap-3 mb-3">
+          <div class="p-2 rounded-lg bg-oxide-500/10">
+            <Users class="w-4 h-4 text-oxide-400" />
+          </div>
+          <p class="text-sm text-neutral-400">Total Subscribers</p>
+        </div>
+        <div v-if="isLoading" class="h-8 w-16 bg-neutral-800 rounded animate-pulse" />
+        <p v-else class="text-3xl font-bold text-neutral-100">{{ totalSubscribers.toLocaleString() }}</p>
+      </div>
+
+      <!-- Total MRR -->
+      <div class="bg-neutral-900 border border-neutral-800 rounded-lg p-5">
+        <div class="flex items-center gap-3 mb-3">
+          <div class="p-2 rounded-lg bg-green-500/10">
+            <DollarSign class="w-4 h-4 text-green-400" />
+          </div>
+          <p class="text-sm text-neutral-400">Total MRR</p>
+        </div>
+        <div v-if="isLoading" class="h-8 w-24 bg-neutral-800 rounded animate-pulse" />
+        <p v-else class="text-3xl font-bold text-neutral-100">${{ totalMrr.toFixed(2) }}</p>
+      </div>
+
+      <!-- Per-Module Cards -->
+      <div
+        v-for="mod in moduleBreakdown"
+        :key="mod.name"
+        class="bg-neutral-900 border border-neutral-800 rounded-lg p-5"
+      >
+        <div class="flex items-center gap-3 mb-3">
+          <div class="p-2 rounded-lg bg-oxide-500/10">
+            <Package class="w-4 h-4 text-oxide-400" />
+          </div>
+          <p class="text-sm text-neutral-400 truncate">{{ mod.name }}</p>
+        </div>
+        <p class="text-3xl font-bold text-neutral-100">{{ mod.count }}</p>
+        <p class="text-xs text-neutral-500 mt-1">subscribers</p>
+      </div>
+    </div>
+
+    <!-- Table -->
+    <div class="bg-neutral-900 border border-neutral-800 rounded-lg overflow-hidden">
+      <table class="w-full">
+        <thead>
+          <tr class="border-b border-neutral-800 text-left">
+            <th class="px-4 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">Owner Email</th>
+            <th class="px-4 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">Module Name</th>
+            <th class="px-4 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">License ID</th>
+          </tr>
+        </thead>
+        <tbody class="divide-y divide-neutral-800">
+          <tr v-if="subscriptions.length === 0 && !isLoading">
+            <td colspan="3" class="px-4 py-12 text-center text-neutral-500 text-sm">
+              No subscriptions found.
+            </td>
+          </tr>
+          <tr v-if="isLoading">
+            <td colspan="3" class="px-4 py-12 text-center text-neutral-500 text-sm">Loading subscriptions...</td>
+          </tr>
+          <tr
+            v-for="(sub, idx) in subscriptions"
+            :key="`${sub.license_id}-${sub.module_name}-${idx}`"
+            class="hover:bg-neutral-800/50 transition-colors"
+          >
+            <td class="px-4 py-3 text-sm text-neutral-100">{{ sub.owner_email }}</td>
+            <td class="px-4 py-3 text-sm text-neutral-400">{{ sub.module_name }}</td>
+            <td class="px-4 py-3 text-sm text-neutral-400 font-mono">{{ sub.license_id }}</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+</template>