diff --git a/drizzle/0001_many_weapon_omega.sql b/drizzle/0001_many_weapon_omega.sql
new file mode 100644
index 0000000..b34e609
--- /dev/null
+++ b/drizzle/0001_many_weapon_omega.sql
@@ -0,0 +1,14 @@
+CREATE TABLE "login_history" (
+	"id" uuid PRIMARY KEY DEFAULT gen_random_uuid() NOT NULL,
+	"user_id" text NOT NULL,
+	"application_id" uuid,
+	"session_id" text,
+	"logged_at" timestamp with time zone DEFAULT now() NOT NULL,
+	"ip_address" text,
+	"user_agent" text
+);
+--> statement-breakpoint
+ALTER TABLE "user" ADD COLUMN "last_login_at" timestamp;--> statement-breakpoint
+ALTER TABLE "login_history" ADD CONSTRAINT "login_history_application_id_applications_id_fk" FOREIGN KEY ("application_id") REFERENCES "public"."applications"("id") ON DELETE set null ON UPDATE no action;--> statement-breakpoint
+CREATE INDEX "login_history_user_logged_idx" ON "login_history" USING btree ("user_id","logged_at");--> statement-breakpoint
+CREATE INDEX "login_history_app_logged_idx" ON "login_history" USING btree ("application_id","logged_at");
\ No newline at end of file
diff --git a/drizzle/meta/_journal.json b/drizzle/meta/_journal.json
index a883156..88ca20f 100644
--- a/drizzle/meta/_journal.json
+++ b/drizzle/meta/_journal.json
@@ -8,6 +8,13 @@
       "when": 1776085749779,
       "tag": "0000_initial_schema",
       "breakpoints": false
+    },
+    {
+      "idx": 1,
+      "version": "7",
+      "when": 1778972820706,
+      "tag": "0001_many_weapon_omega",
+      "breakpoints": true
     }
   ]
 }
\ No newline at end of file
diff --git a/frontend/src/api/applications.ts b/frontend/src/api/applications.ts
index fea33d4..6157336 100644
--- a/frontend/src/api/applications.ts
+++ b/frontend/src/api/applications.ts
@@ -1,5 +1,5 @@
 import { apiFetch, USE_MOCK } from './client';
-import type { Application, ApplicationCreateResponse, UserApplication, AppRole, AppPermission, SubscriptionPlan, SubscriptionPlanPrice } from '@/types';
+import type { Application, ApplicationCreateResponse, UserApplication, AppRole, AppPermission, SubscriptionPlan, SubscriptionPlanPrice, LoginHistoryResponse } from '@/types';
 import { MOCK_APPLICATIONS, MOCK_ROLES, MOCK_PERMISSIONS, MOCK_PLANS, MOCK_USER_APPLICATIONS } from '@/mocks/data';
 
 export async function listApplications(): Promise<{ applications: Application[] }> {
@@ -101,6 +101,16 @@ export async function listAppUsers(appId: string): Promise<{ users: UserApplicat
   return apiFetch<{ users: UserApplication[] }>(`/admin/applications/${appId}/users`);
 }
 
+export async function getUserLoginHistory(appId: string, userId: string, params: { page?: number; limit?: number } = {}): Promise<LoginHistoryResponse> {
+  if (USE_MOCK) {
+    return { entries: [], total: 0, page: params.page ?? 1, limit: params.limit ?? 20 };
+  }
+  const qs = new URLSearchParams();
+  if (params.page) qs.set('page', String(params.page));
+  if (params.limit) qs.set('limit', String(params.limit));
+  return apiFetch<LoginHistoryResponse>(`/admin/applications/${appId}/users/${userId}/history?${qs}`);
+}
+
 export async function grantAppAccess(appId: string, body: { userId: string; roleId?: string }): Promise<{ access: UserApplication }> {
   if (USE_MOCK) {
     const access: UserApplication = { userId: body.userId, applicationId: appId, isActive: true, subscriptionPlanId: null, createdAt: new Date().toISOString(), name: null, email: null, roleId: body.roleId ?? null };
diff --git a/frontend/src/api/sessions.ts b/frontend/src/api/sessions.ts
index 78d4675..cb6c24a 100644
--- a/frontend/src/api/sessions.ts
+++ b/frontend/src/api/sessions.ts
@@ -9,16 +9,26 @@ export interface SessionsListResponse {
   limit: number
 }
 
-export async function listSessions(params: { page?: number; limit?: number } = {}): Promise<SessionsListResponse> {
+export async function listSessions(params: { page?: number; limit?: number; search?: string } = {}): Promise<SessionsListResponse> {
   if (USE_MOCK) {
     const page = params.page ?? 1;
     const limit = params.limit ?? 20;
+    const search = params.search?.trim().toLowerCase() ?? '';
+    let pool = MOCK_SESSIONS;
+    if (search) {
+      pool = pool.filter(s =>
+        (s.user?.name ?? '').toLowerCase().includes(search)
+        || (s.user?.email ?? '').toLowerCase().includes(search)
+        || (s.ipAddress ?? '').toLowerCase().includes(search),
+      );
+    }
     const start = (page - 1) * limit;
-    return { sessions: MOCK_SESSIONS.slice(start, start + limit), total: MOCK_SESSIONS.length, page, limit };
+    return { sessions: pool.slice(start, start + limit), total: pool.length, page, limit };
   }
   const qs = new URLSearchParams();
   if (params.page) qs.set('page', String(params.page));
   if (params.limit) qs.set('limit', String(params.limit));
+  if (params.search) qs.set('search', params.search);
   return apiFetch<SessionsListResponse>(`/admin/sessions?${qs}`);
 }
 
diff --git a/frontend/src/api/stats.ts b/frontend/src/api/stats.ts
new file mode 100644
index 0000000..976cda9
--- /dev/null
+++ b/frontend/src/api/stats.ts
@@ -0,0 +1,65 @@
+import { apiFetch, USE_MOCK } from './client';
+
+export interface ActiveUsersResponse {
+  count: number;
+}
+
+export interface LoginsSeriesPoint {
+  date: string;
+  count: number;
+}
+
+export interface LoginsResponse {
+  range: '7d' | '30d';
+  series: LoginsSeriesPoint[];
+  total: number;
+}
+
+export interface AppActivityEntry {
+  appId: string;
+  online: number;
+  last7dLogins: number;
+  sparkline: number[];
+}
+
+export interface ApplicationsActivityResponse {
+  applications: AppActivityEntry[];
+}
+
+function mockSeries(days: number): LoginsSeriesPoint[] {
+  const out: LoginsSeriesPoint[] = [];
+  const now = new Date();
+  for (let i = days - 1; i >= 0; i--) {
+    const d = new Date(now);
+    d.setUTCDate(d.getUTCDate() - i);
+    const date = d.toISOString().slice(0, 10);
+    out.push({ date, count: Math.floor(Math.random() * 8) });
+  }
+  return out;
+}
+
+export async function getActiveUsers(): Promise<ActiveUsersResponse> {
+  if (USE_MOCK) return { count: Math.floor(Math.random() * 12) };
+  return apiFetch<ActiveUsersResponse>('/admin/stats/active-users');
+}
+
+export async function getLogins(params: { range?: '7d' | '30d'; appId?: string } = {}): Promise<LoginsResponse> {
+  const range = params.range ?? '7d';
+  if (USE_MOCK) {
+    const series = mockSeries(range === '7d' ? 7 : 30);
+    return { range, series, total: series.reduce((a, b) => a + b.count, 0) };
+  }
+  const qs = new URLSearchParams();
+  qs.set('range', range);
+  if (params.appId) qs.set('appId', params.appId);
+  return apiFetch<LoginsResponse>(`/admin/stats/logins?${qs}`);
+}
+
+export async function getApplicationsActivity(): Promise<ApplicationsActivityResponse> {
+  if (USE_MOCK) {
+    return {
+      applications: [],
+    };
+  }
+  return apiFetch<ApplicationsActivityResponse>('/admin/stats/applications-activity');
+}
diff --git a/frontend/src/api/users.ts b/frontend/src/api/users.ts
index f0aed63..44c32fa 100644
--- a/frontend/src/api/users.ts
+++ b/frontend/src/api/users.ts
@@ -60,7 +60,7 @@ export async function getUser(id: string): Promise<UserDetailResponse> {
     if (!user) throw new Error('User not found');
     const apps: UserApplicationDetail[] = MOCK_USER_APPLICATIONS
       .filter(a => a.userId === id)
-      .map(a => ({ id: a.applicationId, name: a.name ?? a.applicationId, slug: a.applicationId, icon: null, isActive: a.isActive, subscriptionPlanId: a.subscriptionPlanId, roles: a.roleId ? [{ id: a.roleId, name: a.roleId }] : [] }));
+      .map(a => ({ id: a.applicationId, name: a.name ?? a.applicationId, slug: a.applicationId, icon: null, isActive: a.isActive, subscriptionPlanId: a.subscriptionPlanId, subscriptionPlanName: a.subscriptionPlanName ?? null, roles: a.roleId ? [{ id: a.roleId, name: a.roleId }] : [], lastLoginAt: a.lastLoginAt ?? null }));
     return { user, applications: apps };
   }
   return apiFetch<UserDetailResponse>(`/admin/users/${id}`);
diff --git a/frontend/src/components/ui/AppIconStack.vue b/frontend/src/components/ui/AppIconStack.vue
new file mode 100644
index 0000000..daacb16
--- /dev/null
+++ b/frontend/src/components/ui/AppIconStack.vue
@@ -0,0 +1,126 @@
+<script setup lang="ts">
+import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue';
+import { AppWindow } from 'lucide-vue-next';
+import type { UserAppSummary } from '@/types';
+
+const props = withDefaults(defineProps<{
+  apps: UserAppSummary[];
+  /** Maximum number of icons rendered inline before being collapsed into a counter. */
+  max?: number;
+  /** Size of each icon avatar in pixels. */
+  size?: number;
+}>(), {
+  max: 3,
+  size: 22,
+});
+
+const visible = computed(() => props.apps.slice(0, props.max));
+const overflow = computed(() => Math.max(0, props.apps.length - props.max));
+const open = ref(false);
+const triggerRef = ref<HTMLElement | null>(null);
+const popoverRef = ref<HTMLElement | null>(null);
+const popoverStyle = ref<{ top: string; left: string }>({ top: '0px', left: '0px' });
+
+function updatePosition() {
+  const t = triggerRef.value;
+  if (!t) return;
+  const rect = t.getBoundingClientRect();
+  popoverStyle.value = {
+    top: `${rect.bottom + 4}px`,
+    left: `${rect.left}px`,
+  };
+}
+
+function onDocClick(e: MouseEvent) {
+  if (!open.value) return;
+  const target = e.target as Node;
+  if (popoverRef.value?.contains(target)) return;
+  if (triggerRef.value?.contains(target)) return;
+  open.value = false;
+}
+
+function onWindowChange() {
+  if (open.value) open.value = false;
+}
+
+async function toggle() {
+  if (open.value) {
+    open.value = false;
+    return;
+  }
+  open.value = true;
+  await nextTick();
+  updatePosition();
+  document.addEventListener('click', onDocClick);
+  window.addEventListener('scroll', onWindowChange, true);
+  window.addEventListener('resize', onWindowChange);
+}
+
+function cleanup() {
+  document.removeEventListener('click', onDocClick);
+  window.removeEventListener('scroll', onWindowChange, true);
+  window.removeEventListener('resize', onWindowChange);
+}
+
+onBeforeUnmount(cleanup);
+
+// Tear down the global listeners as soon as the popover closes so we
+// never leak handlers after the trigger row scrolls out of view.
+watch(open, (v) => { if (!v) cleanup(); });
+</script>
+
+<template>
+  <div v-if="apps.length === 0" class="text-xs text-surface-600">—</div>
+  <div v-else class="relative inline-flex items-center">
+    <button
+      ref="triggerRef"
+      type="button"
+      class="inline-flex items-center"
+      @click.stop="toggle"
+    >
+      <span
+        v-for="(app, idx) in visible"
+        :key="app.id"
+        :style="{
+          width: `${size}px`,
+          height: `${size}px`,
+          marginLeft: idx === 0 ? '0' : '-6px',
+          zIndex: visible.length - idx,
+        }"
+        class="inline-flex items-center justify-center rounded-full bg-surface-800 border border-surface-700/60 ring-1 ring-surface-900 overflow-hidden text-surface-300"
+        :title="app.name"
+      >
+        <img v-if="app.icon" :src="app.icon" :alt="app.name" class="w-full h-full object-cover" />
+        <AppWindow v-else class="w-3 h-3" />
+      </span>
+      <span
+        v-if="overflow > 0"
+        :style="{ height: `${size}px`, marginLeft: '-6px' }"
+        class="inline-flex items-center justify-center px-1.5 rounded-full bg-surface-800 border border-surface-700/60 ring-1 ring-surface-900 text-[10px] font-medium text-surface-400"
+      >
+        +{{ overflow }}
+      </span>
+    </button>
+
+    <Teleport to="body">
+      <div
+        v-if="open"
+        ref="popoverRef"
+        :style="{ position: 'fixed', top: popoverStyle.top, left: popoverStyle.left }"
+        class="z-[100] w-56 bg-surface-800 border border-surface-700/50 rounded-xl shadow-xl py-1"
+      >
+        <div
+          v-for="app in apps"
+          :key="app.id"
+          class="flex items-center gap-2 px-3 py-2 text-sm text-surface-300 hover:bg-surface-700/40"
+        >
+          <span class="w-5 h-5 rounded-md bg-surface-700/60 inline-flex items-center justify-center overflow-hidden">
+            <img v-if="app.icon" :src="app.icon" :alt="app.name" class="w-full h-full object-cover" />
+            <AppWindow v-else class="w-3 h-3 text-surface-400" />
+          </span>
+          <span class="truncate">{{ app.name }}</span>
+        </div>
+      </div>
+    </Teleport>
+  </div>
+</template>
diff --git a/frontend/src/components/ui/DataTable.vue b/frontend/src/components/ui/DataTable.vue
index b7fc0d9..f59b46e 100644
--- a/frontend/src/components/ui/DataTable.vue
+++ b/frontend/src/components/ui/DataTable.vue
@@ -1,44 +1,406 @@
-<script setup lang="ts">
-withDefaults(defineProps<{
+<script setup lang="ts" generic="Row extends Record<string, unknown>">
+import { computed, ref, watch } from 'vue';
+import { ChevronUp, ChevronDown, ChevronsUpDown, Columns3, Rows3, Rows4, Search, ChevronLeft, ChevronRight } from 'lucide-vue-next';
+import { useI18n } from 'vue-i18n';
+import type { ColumnDef, DataTablePagination, SortState } from '@/types/data-table';
+
+const props = withDefaults(defineProps<{
+  /** Optional column-driven mode. When provided, the table auto-renders headers and rows. */
+  columns?: ColumnDef<Row>[];
+  /** Row data — required when `columns` is provided. */
+  items?: Row[];
+  /** Stable row key accessor. */
+  rowKey?: (row: Row) => string | number;
+  /** When true, shows a shimmering skeleton body. */
   loading?: boolean;
+  /** When true (and not loading), shows the `empty` slot. */
   empty?: boolean;
+  /** Number of skeleton rows when loading. */
   skeletonRows?: number;
+  /**
+   * Number of skeleton columns. Defaults to `columns.length` when column
+   * mode is active and to 4 otherwise (legacy slot mode).
+   */
   skeletonCols?: number;
+  /** Controlled sort state. Omit for uncontrolled internal sort. */
+  sort?: SortState | null;
+  /** Show the built-in toolbar above the table when the toolbar slot is used. */
+  toolbar?: boolean;
+  /** Allow users to toggle column visibility (built-in dropdown). */
+  enableColumnVisibility?: boolean;
+  /** Allow users to switch between comfortable and compact row density. */
+  enableDensityToggle?: boolean;
+  /** Render the built-in search input (bound through `v-model:search`). */
+  searchable?: boolean;
+  /** Current search string. Use with `v-model:search` for two-way binding. */
+  search?: string;
+  /** Placeholder shown in the search input. Defaults to the i18n `common.search` label. */
+  searchPlaceholder?: string;
+  /**
+   * Server-driven pagination metadata. Triggers the footer with prev/next
+   * controls and the rows-per-page selector. Emits `update:page` and
+   * `update:limit` when the user interacts.
+   */
+  pagination?: DataTablePagination | null;
+  /** When true, rows render with `cursor-pointer`. Pair with `@row-click`. */
+  clickableRows?: boolean;
 }>(), {
   loading: false,
   empty: false,
   skeletonRows: 5,
-  skeletonCols: 4,
+  sort: null,
+  toolbar: false,
+  enableColumnVisibility: false,
+  enableDensityToggle: false,
+  searchable: false,
+  search: '',
+  searchPlaceholder: '',
+  pagination: null,
+  clickableRows: false,
 });
+
+const emit = defineEmits<{
+  (e: 'update:sort', value: SortState | null): void;
+  (e: 'row-click', row: Row): void;
+  (e: 'update:search', value: string): void;
+  (e: 'update:page', value: number): void;
+  (e: 'update:limit', value: number): void;
+}>();
+
+const { t } = useI18n();
+
+const density = ref<'comfortable' | 'compact'>('comfortable');
+function toggleDensity() {
+  density.value = density.value === 'comfortable' ? 'compact' : 'comfortable';
+}
+const cellPaddingClass = computed(() => density.value === 'compact' ? 'px-3 py-1.5' : 'px-4 py-3');
+const headerPaddingClass = computed(() => density.value === 'compact' ? 'px-3 py-2' : 'px-4 py-3');
+
+const hiddenKeys = ref<Set<string>>(new Set(
+  (props.columns ?? []).filter(c => c.hidden).map(c => c.key),
+));
+function toggleColumn(key: string) {
+  const next = new Set(hiddenKeys.value);
+  if (next.has(key)) next.delete(key); else next.add(key);
+  hiddenKeys.value = next;
+}
+const visibleColumns = computed(() => (props.columns ?? []).filter(c => !hiddenKeys.value.has(c.key)));
+const showVisibilityMenu = ref(false);
+
+const internalSort = ref<SortState | null>(props.sort ?? null);
+watch(() => props.sort, v => { internalSort.value = v; });
+const activeSort = computed<SortState | null>(() => props.sort !== undefined && props.sort !== null
+  ? props.sort
+  : internalSort.value);
+
+function cycleSort(col: ColumnDef<Row>) {
+  if (!col.sortable) return;
+  const current = activeSort.value;
+  let next: SortState | null;
+  if (!current || current.key !== col.key) next = { key: col.key, direction: 'asc' };
+  else if (current.direction === 'asc') next = { key: col.key, direction: 'desc' };
+  else next = null;
+  internalSort.value = next;
+  emit('update:sort', next);
+}
+
+function readField(row: Row, field: string): unknown {
+  return field.split('.').reduce<unknown>((acc, part) => {
+    if (acc === null || acc === undefined) return undefined;
+    return (acc as Record<string, unknown>)[part];
+  }, row);
+}
+
+function getCellValue(row: Row, col: ColumnDef<Row>): unknown {
+  if (col.accessor) return col.accessor(row);
+  if (col.field) return readField(row, col.field);
+  return undefined;
+}
+
+const sortedItems = computed<Row[]>(() => {
+  const items = props.items ?? [];
+  const s = activeSort.value;
+  if (props.sort !== null && props.sort !== undefined) return items;
+  if (!s) return items;
+  const col = (props.columns ?? []).find(c => c.key === s.key);
+  if (!col) return items;
+  const factor = s.direction === 'asc' ? 1 : -1;
+  return [...items].sort((a, b) => {
+    const av = getCellValue(a, col);
+    const bv = getCellValue(b, col);
+    if (av === bv) return 0;
+    if (av === undefined || av === null) return 1;
+    if (bv === undefined || bv === null) return -1;
+    if (typeof av === 'number' && typeof bv === 'number') return (av - bv) * factor;
+    return String(av).localeCompare(String(bv)) * factor;
+  });
+});
+
+const colCount = computed(() => props.columns
+  ? visibleColumns.value.length
+  : (props.skeletonCols ?? 4));
+
+function alignClass(col: ColumnDef<Row>): string {
+  if (col.align === 'right') return 'text-right';
+  if (col.align === 'center') return 'text-center';
+  return 'text-left';
+}
+
+function responsiveClass(col: ColumnDef<Row>): string {
+  // Static class map — Tailwind's JIT scanner only sees fully-formed class
+  // names in source. Concatenating `hidden ${breakpoint}:table-cell` would
+  // be silently dropped at build time, causing columns to stay hidden at
+  // every viewport. Listing the literals keeps them in the generated CSS.
+  if (!col.responsive) return '';
+  switch (col.responsive) {
+    case 'sm': return 'hidden sm:table-cell';
+    case 'md': return 'hidden md:table-cell';
+    case 'lg': return 'hidden lg:table-cell';
+    case 'xl': return 'hidden xl:table-cell';
+    case '2xl': return 'hidden 2xl:table-cell';
+    default: return '';
+  }
+}
+
+function defaultRowKey(row: Row, idx: number): string | number {
+  if (props.rowKey) return props.rowKey(row);
+  const id = (row as Record<string, unknown>).id;
+  if (typeof id === 'string' || typeof id === 'number') return id;
+  return idx;
+}
+
+// ── Search ─────────────────────────────────────────────────────────────
+// Mirrors the `search` prop in a local ref so the input stays controllable
+// even when the parent uses simple one-way binding (no v-model).
+const searchValue = ref(props.search ?? '');
+watch(() => props.search, (v) => { searchValue.value = v ?? ''; });
+function onSearchInput(event: Event) {
+  const v = (event.target as HTMLInputElement).value;
+  searchValue.value = v;
+  emit('update:search', v);
+}
+
+// ── Pagination ─────────────────────────────────────────────────────────
+const pageCount = computed(() => {
+  if (!props.pagination) return 1;
+  return Math.max(1, Math.ceil(props.pagination.total / props.pagination.limit));
+});
+const pageStart = computed(() => {
+  if (!props.pagination || props.pagination.total === 0) return 0;
+  return (props.pagination.page - 1) * props.pagination.limit + 1;
+});
+const pageEnd = computed(() => {
+  if (!props.pagination) return 0;
+  return Math.min(props.pagination.total, props.pagination.page * props.pagination.limit);
+});
+function setPage(p: number) {
+  if (!props.pagination) return;
+  const next = Math.min(Math.max(1, p), pageCount.value);
+  if (next !== props.pagination.page) emit('update:page', next);
+}
+function onLimitChange(event: Event) {
+  const next = parseInt((event.target as HTMLSelectElement).value, 10);
+  if (!Number.isFinite(next) || next < 1) return;
+  emit('update:limit', next);
+}
+const defaultPageSizes = [10, 20, 50, 100];
+const pageSizes = computed(() => props.pagination?.pageSizes ?? defaultPageSizes);
+
+const showToolbar = computed(() =>
+  props.toolbar
+  || props.enableColumnVisibility
+  || props.enableDensityToggle
+  || props.searchable,
+);
 </script>
 
 <template>
-  <div class="rounded-xl overflow-hidden border border-surface-700/50 bg-surface-900/40">
-    <div class="overflow-x-auto">
-      <table class="w-full">
-        <thead>
-          <tr class="border-b border-surface-700/50 bg-surface-800/30">
-            <slot name="head" />
-          </tr>
-        </thead>
-        <tbody v-if="loading">
-          <tr v-for="i in skeletonRows" :key="i" class="border-b border-surface-800/50 last:border-0">
-            <td v-for="j in skeletonCols" :key="j" class="px-4 py-3">
-              <div class="h-4 bg-gradient-to-r from-surface-800 via-surface-700 to-surface-800 bg-[length:200%_100%] animate-shimmer rounded-md" :style="{ width: j === 1 ? '140px' : '90px' }" />
-            </td>
-          </tr>
-        </tbody>
-        <tbody v-else-if="empty">
-          <tr>
-            <td :colspan="skeletonCols" class="py-0">
-              <slot name="empty" />
-            </td>
-          </tr>
-        </tbody>
-        <tbody v-else>
-          <slot />
-        </tbody>
-      </table>
+  <div class="space-y-3">
+    <div v-if="showToolbar" class="flex items-center gap-2 flex-wrap">
+      <div v-if="searchable" class="relative w-full sm:w-64 shrink-0">
+        <Search class="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-surface-500" />
+        <input
+          type="search"
+          :value="searchValue"
+          @input="onSearchInput"
+          :placeholder="searchPlaceholder || t('common.search')"
+          class="w-full pl-9 pr-3 py-2 text-sm bg-surface-800 border border-surface-600 rounded-lg text-surface-100 placeholder:text-surface-500 focus:outline-none focus:ring-2 focus:ring-primary-500/50 focus:border-primary-500"
+        />
+      </div>
+      <div class="flex items-center gap-2 flex-wrap">
+        <slot name="filters" />
+      </div>
+      <div class="flex-1 min-w-0">
+        <slot name="toolbar" />
+      </div>
+      <div v-if="enableDensityToggle" class="flex items-center">
+        <button
+          type="button"
+          @click="toggleDensity"
+          class="p-2 rounded-lg text-surface-500 hover:text-surface-300 hover:bg-surface-800/60 transition-colors"
+          :title="density === 'compact' ? 'Comfortable density' : 'Compact density'"
+        >
+          <component :is="density === 'compact' ? Rows4 : Rows3" class="w-4 h-4" />
+        </button>
+      </div>
+      <div v-if="enableColumnVisibility && columns" class="relative">
+        <button
+          type="button"
+          @click="showVisibilityMenu = !showVisibilityMenu"
+          class="p-2 rounded-lg text-surface-500 hover:text-surface-300 hover:bg-surface-800/60 transition-colors"
+          title="Toggle columns"
+        >
+          <Columns3 class="w-4 h-4" />
+        </button>
+        <div
+          v-if="showVisibilityMenu"
+          class="absolute right-0 mt-1 w-52 bg-surface-800 border border-surface-700/50 rounded-xl shadow-xl z-20 py-1"
+          v-click-outside="() => (showVisibilityMenu = false)"
+        >
+          <label
+            v-for="col in columns"
+            :key="col.key"
+            class="flex items-center gap-2 px-3 py-2 text-sm text-surface-300 hover:bg-surface-700/40 cursor-pointer"
+          >
+            <input
+              type="checkbox"
+              :checked="!hiddenKeys.has(col.key)"
+              @change="toggleColumn(col.key)"
+              class="rounded border-surface-600 bg-surface-900 text-primary-500 focus:ring-primary-500/30"
+            />
+            <span class="truncate">{{ col.label }}</span>
+          </label>
+        </div>
+      </div>
+    </div>
+
+    <div class="rounded-xl overflow-hidden border border-surface-700/50 bg-surface-900/40">
+      <div class="overflow-x-auto">
+        <table class="w-full">
+          <thead>
+            <tr class="border-b border-surface-700/50 bg-surface-800/30">
+              <template v-if="columns">
+                <th
+                  v-for="col in visibleColumns"
+                  :key="col.key"
+                  :class="[
+                    headerPaddingClass,
+                    'text-xs font-medium text-surface-500 uppercase tracking-wide',
+                    alignClass(col),
+                    responsiveClass(col),
+                    col.width,
+                    col.sortable ? 'cursor-pointer select-none hover:text-surface-300' : '',
+                  ]"
+                  @click="cycleSort(col)"
+                >
+                  <span class="inline-flex items-center gap-1.5">
+                    <component v-if="col.icon" :is="col.icon" class="w-3.5 h-3.5" />
+                    <span>{{ col.label }}</span>
+                    <template v-if="col.sortable">
+                      <ChevronUp
+                        v-if="activeSort?.key === col.key && activeSort.direction === 'asc'"
+                        class="w-3.5 h-3.5"
+                      />
+                      <ChevronDown
+                        v-else-if="activeSort?.key === col.key && activeSort.direction === 'desc'"
+                        class="w-3.5 h-3.5"
+                      />
+                      <ChevronsUpDown v-else class="w-3.5 h-3.5 opacity-50" />
+                    </template>
+                  </span>
+                </th>
+              </template>
+              <slot v-else name="head" />
+            </tr>
+          </thead>
+
+          <tbody v-if="loading">
+            <tr v-for="i in skeletonRows" :key="i" class="border-b border-surface-800/50 last:border-0">
+              <td v-for="j in colCount" :key="j" :class="cellPaddingClass">
+                <div
+                  class="h-4 bg-gradient-to-r from-surface-800 via-surface-700 to-surface-800 bg-[length:200%_100%] animate-shimmer rounded-md"
+                  :style="{ width: j === 1 ? '140px' : '90px' }"
+                />
+              </td>
+            </tr>
+          </tbody>
+
+          <tbody v-else-if="empty || (columns && sortedItems.length === 0)">
+            <tr>
+              <td :colspan="colCount" class="py-0">
+                <slot name="empty" />
+              </td>
+            </tr>
+          </tbody>
+
+          <tbody v-else-if="columns">
+            <tr
+              v-for="(row, idx) in sortedItems"
+              :key="defaultRowKey(row, idx)"
+              :class="[
+                'border-b border-surface-800/50 last:border-0 hover:bg-surface-800/20 transition-colors',
+                clickableRows ? 'cursor-pointer' : '',
+              ]"
+              @click="emit('row-click', row)"
+            >
+              <td
+                v-for="col in visibleColumns"
+                :key="col.key"
+                :class="[cellPaddingClass, alignClass(col), responsiveClass(col)]"
+              >
+                <slot :name="`cell-${col.key}`" :row="row" :value="getCellValue(row, col)">
+                  <span class="text-sm text-surface-300">{{ getCellValue(row, col) ?? '—' }}</span>
+                </slot>
+              </td>
+            </tr>
+          </tbody>
+
+          <tbody v-else>
+            <slot />
+          </tbody>
+        </table>
+      </div>
+    </div>
+
+    <div
+      v-if="pagination"
+      class="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3 text-sm text-surface-400"
+    >
+      <div class="flex items-center gap-2">
+        <label class="text-xs text-surface-500">{{ t('dataTable.rowsPerPage') }}</label>
+        <select
+          :value="pagination.limit"
+          @change="onLimitChange"
+          class="text-xs bg-surface-800 border border-surface-600 rounded-lg px-2 py-1 text-surface-200 focus:outline-none focus:ring-2 focus:ring-primary-500/50"
+        >
+          <option v-for="sz in pageSizes" :key="sz" :value="sz">{{ sz }}</option>
+        </select>
+      </div>
+      <div class="flex items-center gap-3">
+        <span class="text-xs text-surface-500 tabular-nums">
+          {{ t('dataTable.pageOf', { from: pageStart, to: pageEnd, total: pagination.total }) }}
+        </span>
+        <div class="flex items-center gap-1">
+          <button
+            type="button"
+            :disabled="pagination.page <= 1"
+            @click="setPage(pagination.page - 1)"
+            class="p-1.5 rounded-lg text-surface-500 hover:text-surface-200 hover:bg-surface-800/60 transition-colors disabled:opacity-40 disabled:hover:bg-transparent disabled:cursor-not-allowed"
+            :title="t('dataTable.previous')"
+          >
+            <ChevronLeft class="w-4 h-4" />
+          </button>
+          <button
+            type="button"
+            :disabled="pagination.page >= pageCount"
+            @click="setPage(pagination.page + 1)"
+            class="p-1.5 rounded-lg text-surface-500 hover:text-surface-200 hover:bg-surface-800/60 transition-colors disabled:opacity-40 disabled:hover:bg-transparent disabled:cursor-not-allowed"
+            :title="t('dataTable.next')"
+          >
+            <ChevronRight class="w-4 h-4" />
+          </button>
+        </div>
+      </div>
     </div>
   </div>
 </template>
diff --git a/frontend/src/components/ui/Sparkline.vue b/frontend/src/components/ui/Sparkline.vue
new file mode 100644
index 0000000..c5e7aff
--- /dev/null
+++ b/frontend/src/components/ui/Sparkline.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+const props = withDefaults(defineProps<{
+  values: number[];
+  width?: number;
+  height?: number;
+  color?: string;
+  fill?: string;
+}>(), {
+  width: 80,
+  height: 24,
+  color: '#10b981',
+  fill: 'rgba(16,185,129,0.15)',
+});
+
+const path = computed(() => {
+  const vs = props.values;
+  if (!vs.length) return '';
+  const max = Math.max(...vs, 1);
+  const min = Math.min(...vs, 0);
+  const range = max - min || 1;
+  const stepX = props.width / Math.max(vs.length - 1, 1);
+  return vs.map((v, i) => {
+    const x = i * stepX;
+    const y = props.height - ((v - min) / range) * props.height;
+    return `${i === 0 ? 'M' : 'L'}${x.toFixed(2)},${y.toFixed(2)}`;
+  }).join(' ');
+});
+
+const areaPath = computed(() => {
+  if (!path.value) return '';
+  return `${path.value} L${props.width},${props.height} L0,${props.height} Z`;
+});
+
+const empty = computed(() => props.values.length === 0 || props.values.every(v => v === 0));
+</script>
+
+<template>
+  <svg
+    :width="width"
+    :height="height"
+    :viewBox="`0 0 ${width} ${height}`"
+    class="block"
+    role="img"
+    aria-label="Activity sparkline"
+  >
+    <template v-if="!empty">
+      <path :d="areaPath" :fill="fill" />
+      <path :d="path" :stroke="color" stroke-width="1.5" fill="none" stroke-linejoin="round" stroke-linecap="round" />
+    </template>
+    <line
+      v-else
+      :x1="0"
+      :y1="height / 2"
+      :x2="width"
+      :y2="height / 2"
+      stroke="rgba(148,163,184,0.25)"
+      stroke-width="1"
+      stroke-dasharray="2 2"
+    />
+  </svg>
+</template>
diff --git a/frontend/src/components/users/UserAppHistoryModal.vue b/frontend/src/components/users/UserAppHistoryModal.vue
new file mode 100644
index 0000000..78997b2
--- /dev/null
+++ b/frontend/src/components/users/UserAppHistoryModal.vue
@@ -0,0 +1,95 @@
+<script setup lang="ts">
+import { ref, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import BaseModal from '@/components/ui/BaseModal.vue';
+import BaseButton from '@/components/ui/BaseButton.vue';
+import { Clock, Globe, Monitor } from 'lucide-vue-next';
+import { getUserLoginHistory } from '@/api/applications';
+import { parseUserAgent } from '@/composables/useUserAgent';
+import type { LoginHistoryEntry } from '@/types';
+
+const props = defineProps<{
+  open: boolean;
+  appId: string;
+  userId: string;
+  userName?: string | null;
+}>();
+
+const emit = defineEmits<{ (e: 'close'): void }>();
+
+const { t } = useI18n();
+const loading = ref(false);
+const entries = ref<LoginHistoryEntry[]>([]);
+const total = ref(0);
+const page = ref(1);
+const limit = 20;
+const error = ref<string | null>(null);
+
+async function load() {
+  loading.value = true;
+  error.value = null;
+  try {
+    const res = await getUserLoginHistory(props.appId, props.userId, { page: page.value, limit });
+    entries.value = res.entries;
+    total.value = res.total;
+  } catch (err) {
+    error.value = err instanceof Error ? err.message : 'Failed to load login history';
+  } finally {
+    loading.value = false;
+  }
+}
+
+watch(() => [props.open, props.userId, props.appId], ([isOpen]) => {
+  if (isOpen) {
+    page.value = 1;
+    void load();
+  }
+}, { immediate: true });
+
+function formatDate(iso: string): string {
+  return new Date(iso).toLocaleString(undefined, { dateStyle: 'medium', timeStyle: 'short' });
+}
+</script>
+
+<template>
+  <BaseModal :open="open" :title="userName ? `${t('users.history.title')} — ${userName}` : t('users.history.title')" size="lg" @close="emit('close')">
+    <div class="space-y-3">
+      <p class="text-xs text-surface-500">{{ t('users.history.description') }}</p>
+
+      <div v-if="loading" class="space-y-2">
+        <div v-for="i in 3" :key="i" class="h-12 rounded-lg bg-gradient-to-r from-surface-800 via-surface-700 to-surface-800 bg-[length:200%_100%] animate-shimmer" />
+      </div>
+
+      <p v-else-if="error" class="text-sm text-red-400">{{ error }}</p>
+
+      <div v-else-if="entries.length === 0" class="py-8 text-center text-sm text-surface-500">
+        {{ t('users.history.empty') }}
+      </div>
+
+      <div v-else class="rounded-xl border border-surface-700/50 overflow-hidden divide-y divide-surface-800/40">
+        <div v-for="e in entries" :key="e.id" class="px-4 py-3 flex items-start gap-3 hover:bg-surface-800/20 transition-colors">
+          <div class="shrink-0 w-8 h-8 rounded-lg bg-primary-500/10 flex items-center justify-center">
+            <Clock class="w-4 h-4 text-primary-400" />
+          </div>
+          <div class="flex-1 min-w-0 text-sm">
+            <p class="text-surface-200 font-medium">{{ formatDate(e.loggedAt) }}</p>
+            <p class="text-xs text-surface-500 mt-0.5 flex flex-wrap items-center gap-3">
+              <span v-if="e.ipAddress" class="inline-flex items-center gap-1"><Globe class="w-3 h-3" />{{ e.ipAddress }}</span>
+              <span v-if="e.userAgent" class="inline-flex items-center gap-1 truncate"><Monitor class="w-3 h-3" />
+                {{ parseUserAgent(e.userAgent).browser }} / {{ parseUserAgent(e.userAgent).os }}
+              </span>
+            </p>
+          </div>
+        </div>
+      </div>
+
+      <div v-if="!loading && total > limit" class="flex items-center justify-between text-xs text-surface-500">
+        <span>{{ t('common.showing', { from: (page - 1) * limit + 1, to: Math.min(page * limit, total), total }) }}</span>
+        <div class="flex gap-2">
+          <BaseButton variant="outline" size="sm" :disabled="page === 1" @click="page--; load()">{{ t('common.previous') }}</BaseButton>
+          <BaseButton variant="outline" size="sm" :disabled="page * limit >= total" @click="page++; load()">{{ t('common.next') }}</BaseButton>
+        </div>
+      </div>
+    </div>
+  </BaseModal>
+</template>
diff --git a/frontend/src/i18n/en.ts b/frontend/src/i18n/en.ts
index e212769..c31d220 100644
--- a/frontend/src/i18n/en.ts
+++ b/frontend/src/i18n/en.ts
@@ -72,6 +72,7 @@ export default {
     newRegistrations: 'New Registrations',
     sessionActivity: 'Session Activity',
     activeSessionsList: 'Active Sessions',
+    allApplications: 'All applications',
     platformAlerts: 'Platform Alerts',
     quickActions: 'Quick Actions',
     createUser: 'Create User',
@@ -82,6 +83,10 @@ export default {
     noMfaEnforced: 'MFA is not enforced platform-wide. Consider requiring it for sensitive applications.',
     lastRefreshed: 'Last refreshed',
     revoke: 'Revoke',
+    onlineNow: 'Online Now',
+    onlineNowSub: 'Active in the last 5 min',
+    loginsChart: 'Login Activity',
+    totalLogins: '{count} logins',
     timeRanges: {
       '7d': 'Last 7 days',
       '30d': 'Last 30 days',
@@ -124,6 +129,39 @@ export default {
     isMfaRequired: 'Force MFA',
     applications: 'Applications',
     password: 'Password',
+    lastLogin: 'Last login',
+    never: 'Never',
+    columns: {
+      name: 'Name',
+      role: 'Role',
+      verified: 'Verified',
+      mfa: '2FA',
+      applications: 'Applications',
+      lastLogin: 'Last login',
+      ipAddress: 'IP',
+      device: 'Device',
+      history: 'History',
+      createdAt: 'Created',
+      actions: 'Actions',
+    },
+    history: {
+      title: 'Login history',
+      description: 'Each entry represents an OAuth token issuance for this user on this application.',
+      empty: 'No logins recorded yet.',
+      open: 'View login history',
+    },
+  },
+  dataTable: {
+    sortAsc: 'Sort ascending',
+    sortDesc: 'Sort descending',
+    clearSort: 'Clear sort',
+    columns: 'Columns',
+    density: 'Density',
+    search: 'Search',
+    previous: 'Previous page',
+    next: 'Next page',
+    pageOf: '{from}–{to} of {total}',
+    rowsPerPage: 'Rows per page',
   },
   organizations: {
     title: 'Organizations',
@@ -164,6 +202,11 @@ export default {
     title: 'Applications',
     subtitle: 'Manage OAuth2 applications',
     createApp: 'Create Application',
+    activity: {
+      online: 'Online',
+      last7d: '7-day logins',
+      sparklineEmpty: 'No recent activity',
+    },
     name: 'Name',
     slug: 'Slug (Client ID)',
     description: 'Description',
diff --git a/frontend/src/i18n/fr.ts b/frontend/src/i18n/fr.ts
index 5e98ab0..a972c34 100644
--- a/frontend/src/i18n/fr.ts
+++ b/frontend/src/i18n/fr.ts
@@ -72,6 +72,7 @@ export default {
     newRegistrations: 'Nouvelles inscriptions',
     sessionActivity: 'Activité des sessions',
     activeSessionsList: 'Sessions actives',
+    allApplications: 'Toutes les applications',
     platformAlerts: 'Alertes plateforme',
     quickActions: 'Actions rapides',
     createUser: 'Créer un utilisateur',
@@ -82,6 +83,10 @@ export default {
     noMfaEnforced: 'L\'authentification MFA n\'est pas imposée à l\'échelle de la plateforme.',
     lastRefreshed: 'Dernière actualisation',
     revoke: 'Révoquer',
+    onlineNow: 'En ligne',
+    onlineNowSub: 'Actifs dans les 5 dernières minutes',
+    loginsChart: 'Activité des connexions',
+    totalLogins: '{count} connexions',
     timeRanges: {
       '7d': '7 derniers jours',
       '30d': '30 derniers jours',
@@ -124,6 +129,39 @@ export default {
     isMfaRequired: 'Forcer le MFA',
     applications: 'Applications',
     password: 'Mot de passe',
+    lastLogin: 'Dernière connexion',
+    never: 'Jamais',
+    columns: {
+      name: 'Nom',
+      role: 'Rôle',
+      verified: 'Vérifié',
+      mfa: '2FA',
+      applications: 'Applications',
+      lastLogin: 'Dernière connexion',
+      ipAddress: 'IP',
+      device: 'Appareil',
+      history: 'Historique',
+      createdAt: 'Créé le',
+      actions: 'Actions',
+    },
+    history: {
+      title: 'Historique de connexion',
+      description: 'Chaque entrée correspond à l\'émission d\'un jeton OAuth pour cet utilisateur sur cette application.',
+      empty: 'Aucune connexion enregistrée.',
+      open: 'Voir l\'historique de connexion',
+    },
+  },
+  dataTable: {
+    sortAsc: 'Tri croissant',
+    sortDesc: 'Tri décroissant',
+    clearSort: 'Réinitialiser le tri',
+    columns: 'Colonnes',
+    density: 'Densité',
+    search: 'Rechercher',
+    previous: 'Page précédente',
+    next: 'Page suivante',
+    pageOf: '{from}–{to} sur {total}',
+    rowsPerPage: 'Lignes par page',
   },
   organizations: {
     title: 'Organisations',
@@ -164,6 +202,11 @@ export default {
     title: 'Applications',
     subtitle: 'Gérer les applications OAuth2',
     createApp: 'Créer une application',
+    activity: {
+      online: 'En ligne',
+      last7d: 'Connexions 7 j',
+      sparklineEmpty: 'Aucune activité récente',
+    },
     name: 'Nom',
     slug: 'Identifiant (Client ID)',
     description: 'Description',
diff --git a/frontend/src/mocks/data.ts b/frontend/src/mocks/data.ts
index 82a9e37..488f195 100644
--- a/frontend/src/mocks/data.ts
+++ b/frontend/src/mocks/data.ts
@@ -23,6 +23,11 @@ export const MOCK_USERS: User[] = [
     company: 'CIRCLE',
     position: 'Platform Engineer',
     address: '42 rue de la Paix, 75001 Paris',
+    lastLoginAt: '2024-11-15T09:23:11.000Z',
+    applications: [
+      { id: '550e8400-e29b-41d4-a716-446655440000', name: 'Circle Dashboard', slug: 'circle-dashboard', icon: null },
+      { id: '6ba7b811-9dad-11d1-80b4-00c04fd430c8', name: 'Internal API', slug: 'internal-api', icon: null },
+    ],
   },
   {
     id: 'usr_5nRmW9tGxKqPsUvCeL7zBi',
@@ -42,6 +47,10 @@ export const MOCK_USERS: User[] = [
     company: 'Acme Corp',
     position: 'CTO',
     address: null,
+    lastLoginAt: '2024-11-14T08:21:00.000Z',
+    applications: [
+      { id: '6ba7b810-9dad-11d1-80b4-00c04fd430c8', name: 'Acme App', slug: 'acme-app', icon: 'https://acme.com/favicon.ico' },
+    ],
   },
   {
     id: 'usr_8jHkD4aNcOeQyMfTgX2rVo',
@@ -61,6 +70,8 @@ export const MOCK_USERS: User[] = [
     company: null,
     position: null,
     address: null,
+    lastLoginAt: '2024-10-22T12:08:00.000Z',
+    applications: [],
   },
   {
     id: 'usr_1cEwZ6sPiLnXbQdRkA9mFu',
@@ -80,6 +91,10 @@ export const MOCK_USERS: User[] = [
     company: 'Startup XYZ',
     position: 'Developer',
     address: null,
+    lastLoginAt: null,
+    applications: [
+      { id: '6ba7b810-9dad-11d1-80b4-00c04fd430c8', name: 'Acme App', slug: 'acme-app', icon: 'https://acme.com/favicon.ico' },
+    ],
   },
 ];
 
@@ -95,6 +110,10 @@ export const MOCK_SESSIONS: Session[] = [
     userId: 'usr_2wQx8mNpKvLrTbYcJdF3hA',
     impersonatedBy: null,
     activeOrganizationId: null,
+    user: { id: 'usr_2wQx8mNpKvLrTbYcJdF3hA', name: 'Alexandre Dubois', email: 'alexandre.dubois@example.com', image: null },
+    applications: [
+      { id: '550e8400-e29b-41d4-a716-446655440000', name: 'Circle Dashboard', slug: 'circle-dashboard', icon: null },
+    ],
   },
   {
     id: 'sess_6uZaS1fPkOeVdNbQlIrCg4',
@@ -107,6 +126,10 @@ export const MOCK_SESSIONS: Session[] = [
     userId: 'usr_5nRmW9tGxKqPsUvCeL7zBi',
     impersonatedBy: null,
     activeOrganizationId: 'org_7vBmC4dKpLqRtNsWoXeA',
+    user: { id: 'usr_5nRmW9tGxKqPsUvCeL7zBi', name: 'Sofia Marchetti', email: 'sofia.marchetti@example.com', image: 'https://api.dicebear.com/9.x/initials/svg?seed=SM' },
+    applications: [
+      { id: '6ba7b810-9dad-11d1-80b4-00c04fd430c8', name: 'Acme App', slug: 'acme-app', icon: 'https://acme.com/favicon.ico' },
+    ],
   },
 ];
 
@@ -284,8 +307,8 @@ export const MOCK_ORGANIZATIONS: Organization[] = [
 ];
 
 export const MOCK_USER_APPLICATIONS: UserApplication[] = [
-  { userId: 'usr_5nRmW9tGxKqPsUvCeL7zBi', applicationId: '6ba7b810-9dad-11d1-80b4-00c04fd430c8', isActive: true, subscriptionPlanId: 'plan-0001-0000-0000-000000000002', createdAt: '2024-03-25T10:00:00.000Z', name: 'Sofia Marchetti', email: 'sofia.marchetti@example.com', roleId: 'a1b2c3d4-0001-0000-0000-000000000002' },
-  { userId: 'usr_1cEwZ6sPiLnXbQdRkA9mFu', applicationId: '6ba7b810-9dad-11d1-80b4-00c04fd430c8', isActive: true, subscriptionPlanId: 'plan-0001-0000-0000-000000000001', createdAt: '2024-09-05T08:00:00.000Z', name: 'Margot Lefèvre', email: 'margot.lefevre@example.com', roleId: 'a1b2c3d4-0001-0000-0000-000000000001' },
+  { userId: 'usr_5nRmW9tGxKqPsUvCeL7zBi', applicationId: '6ba7b810-9dad-11d1-80b4-00c04fd430c8', isActive: true, subscriptionPlanId: 'plan-0001-0000-0000-000000000002', subscriptionPlanName: 'Pro', createdAt: '2024-03-25T10:00:00.000Z', name: 'Sofia Marchetti', email: 'sofia.marchetti@example.com', roleId: 'a1b2c3d4-0001-0000-0000-000000000002', lastLoginAt: '2024-11-14T08:21:00.000Z', lastIp: '91.198.174.192', lastUserAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) Firefox/132.0' },
+  { userId: 'usr_1cEwZ6sPiLnXbQdRkA9mFu', applicationId: '6ba7b810-9dad-11d1-80b4-00c04fd430c8', isActive: true, subscriptionPlanId: 'plan-0001-0000-0000-000000000001', subscriptionPlanName: 'Free', createdAt: '2024-09-05T08:00:00.000Z', name: 'Margot Lefèvre', email: 'margot.lefevre@example.com', roleId: 'a1b2c3d4-0001-0000-0000-000000000001', lastLoginAt: null, lastIp: null, lastUserAgent: null },
 ];
 
 export const MOCK_CONSUMPTION: ConsumptionAggregate[] = [
diff --git a/frontend/src/types/data-table.ts b/frontend/src/types/data-table.ts
new file mode 100644
index 0000000..1e18f29
--- /dev/null
+++ b/frontend/src/types/data-table.ts
@@ -0,0 +1,53 @@
+import type { Component } from 'vue';
+
+/**
+ * Column definition for the shared DataTable component.
+ *
+ * - `key`: stable identifier; matches the named slot `cell-<key>` if a
+ *   custom cell renderer is provided.
+ * - `field`: dot-path accessor on the row object used for default text
+ *   rendering and client-side sort. Optional when `cell-<key>` slot is used.
+ * - `responsive`: Tailwind responsive prefix that controls visibility — the
+ *   column is hidden below the breakpoint (e.g. `md` hides on mobile).
+ * - `align`: cell alignment; default `left`.
+ * - `sortable`: enables the sort caret in the header.
+ * - `width`: optional fixed width class (e.g. `w-32`, `w-[180px]`).
+ * - `hidden`: column-visibility toggle; managed by the table when the
+ *   visibility dropdown is rendered, or controlled externally.
+ */
+export interface ColumnDef<Row = Record<string, unknown>> {
+  key: string;
+  label: string;
+  field?: string;
+  responsive?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+  align?: 'left' | 'right' | 'center';
+  sortable?: boolean;
+  width?: string;
+  hidden?: boolean;
+  icon?: Component;
+  /**
+   * Optional value extractor used by client-side sort and default text
+   * rendering when no `cell-<key>` slot is provided. Receives the full row.
+   */
+  accessor?: (row: Row) => unknown;
+}
+
+export type SortDirection = 'asc' | 'desc';
+
+export interface SortState {
+  key: string;
+  direction: SortDirection;
+}
+
+/**
+ * Server-driven pagination state shared between the parent view and the
+ * DataTable toolbar. `total` is the unfiltered count of rows; `page` is
+ * 1-indexed; `limit` is the page size.
+ */
+export interface DataTablePagination {
+  page: number;
+  limit: number;
+  total: number;
+  /** Optional explicit choices shown in the rows-per-page selector. */
+  pageSizes?: number[];
+}
diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts
index 639b0ec..909c689 100644
--- a/frontend/src/types/index.ts
+++ b/frontend/src/types/index.ts
@@ -16,6 +16,17 @@ export interface User {
   company: string | null
   position: string | null
   address: string | null
+  /** ISO timestamp of the most recent OAuth token issuance. Null when the user has never logged in. */
+  lastLoginAt?: string | null
+  /** Applications the user currently has active access to. Populated by /admin/users. */
+  applications?: UserAppSummary[]
+}
+
+export interface UserAppSummary {
+  id: string
+  name: string
+  slug: string
+  icon: string | null
 }
 
 export interface Session {
@@ -29,6 +40,10 @@ export interface Session {
   userId: string
   impersonatedBy: string | null
   activeOrganizationId: string | null
+  /** Enriched user identity (populated by /admin/sessions). */
+  user?: { id: string; name: string | null; email: string | null; image: string | null }
+  /** Applications this user has logged into during the session lifespan. */
+  applications?: UserAppSummary[]
 }
 
 export interface MfaSetupResult {
@@ -143,10 +158,33 @@ export interface UserApplication {
   applicationId: string
   isActive: boolean
   subscriptionPlanId: string | null
+  subscriptionPlanName?: string | null
   createdAt: string
   name: string | null
   email: string | null
+  image?: string | null
   roleId: string | null
+  /** Most recent login of this user to this application. */
+  lastLoginAt?: string | null
+  /** IP captured at the most recent login (this app). */
+  lastIp?: string | null
+  /** User-agent captured at the most recent login (this app). */
+  lastUserAgent?: string | null
+}
+
+export interface LoginHistoryEntry {
+  id: string
+  loggedAt: string
+  ipAddress: string | null
+  userAgent: string | null
+  sessionId: string | null
+}
+
+export interface LoginHistoryResponse {
+  entries: LoginHistoryEntry[]
+  total: number
+  page: number
+  limit: number
 }
 
 export interface UserApplicationDetail {
@@ -156,7 +194,10 @@ export interface UserApplicationDetail {
   icon: string | null
   isActive: boolean
   subscriptionPlanId: string | null
+  subscriptionPlanName?: string | null
   roles: { id: string; name: string }[]
+  /** Most recent login of the user to this application, or null when none. */
+  lastLoginAt?: string | null
 }
 
 export interface UserSubscription {
diff --git a/frontend/src/views/ApplicationDetailView.vue b/frontend/src/views/ApplicationDetailView.vue
index 1ffc08e..d392144 100644
--- a/frontend/src/views/ApplicationDetailView.vue
+++ b/frontend/src/views/ApplicationDetailView.vue
@@ -20,8 +20,14 @@ import ConfirmDialog from '@/components/ui/ConfirmDialog.vue';
 import BaseBadge from '@/components/ui/BaseBadge.vue';
 import CopyField from '@/components/ui/CopyField.vue';
 import UserAvatar from '@/components/ui/UserAvatar.vue';
+import DataTable from '@/components/ui/DataTable.vue';
+import UserAppHistoryModal from '@/components/users/UserAppHistoryModal.vue';
+import { parseUserAgent } from '@/composables/useUserAgent';
+import Sparkline from '@/components/ui/Sparkline.vue';
+import { getApplicationsActivity, getLogins, type AppActivityEntry } from '@/api/stats';
 import type { PlanFeature } from '@/types';
-import { ArrowLeft, Plus, Trash2, RefreshCw, Check, X, AlertTriangle, Code, TrendingUp } from 'lucide-vue-next';
+import type { ColumnDef } from '@/types/data-table';
+import { ArrowLeft, Plus, Trash2, RefreshCw, Check, X, AlertTriangle, Code, TrendingUp, History, Activity } from 'lucide-vue-next';
 
 const { t } = useI18n();
 const route = useRoute();
@@ -73,6 +79,7 @@ const planFeatureEntries = ref<Array<{ key: string; usage: boolean; value: strin
 onMounted(async () => {
   await services.fetch();
   await loadAll();
+  void loadAppActivity();
 });
 
 async function loadAll() {
@@ -107,6 +114,60 @@ async function loadConsumption() {
   consumption.value = allAggs;
 }
 
+// — User-history modal state
+const historyModalOpen = ref(false);
+const historyModalUserId = ref<string | null>(null);
+const historyModalUserName = ref<string>('');
+function openHistory(ua: UserApplication) {
+  historyModalUserId.value = ua.userId;
+  historyModalUserName.value = getUserName(ua.userId);
+  historyModalOpen.value = true;
+}
+
+// — Activity strip (online + sparkline + 7d logins)
+const appActivity = ref<AppActivityEntry | null>(null);
+async function loadAppActivity() {
+  try {
+    const [activityRes, loginsRes] = await Promise.all([
+      getApplicationsActivity(),
+      getLogins({ range: '7d', appId }),
+    ]);
+    const entry = activityRes.applications.find(a => a.appId === appId);
+    if (entry) {
+      appActivity.value = entry;
+    } else {
+      // Fallback: synthesise a sparkline from the per-app logins endpoint.
+      appActivity.value = {
+        appId,
+        online: 0,
+        last7dLogins: loginsRes.total,
+        sparkline: loginsRes.series.map(p => p.count),
+      };
+    }
+  } catch {
+    // Silent — activity strip is non-critical.
+  }
+}
+
+const userColumns = computed<ColumnDef<UserApplication>[]>(() => [
+  { key: 'user', label: t('users.columns.name') },
+  { key: 'role', label: t('users.columns.role'), responsive: 'sm' },
+  { key: 'plan', label: 'Plan', responsive: 'sm' },
+  { key: 'status', label: 'Status', responsive: 'md' },
+  { key: 'lastLogin', label: t('users.columns.lastLogin'), field: 'lastLoginAt', sortable: true, responsive: 'md' },
+  { key: 'ipAddress', label: t('users.columns.ipAddress'), field: 'lastIp', responsive: 'lg' },
+  { key: 'ua', label: t('users.columns.device'), responsive: 'lg' },
+  { key: 'history', label: t('users.columns.history'), align: 'right' },
+  { key: 'actions', label: t('users.columns.actions'), align: 'right' },
+]);
+
+// Format with date + time (per spec) so admins can see at a glance the
+// exact moment of the last successful login on this application.
+function formatLastLogin(iso: string | null | undefined): string {
+  if (!iso) return t('users.never');
+  return new Date(iso).toLocaleString(undefined, { dateStyle: 'medium', timeStyle: 'short' });
+}
+
 async function handleCreateRole() {
   formLoading.value = true;
   try {
@@ -585,6 +646,26 @@ const financialKpis = computed(() => {
         </div>
       </div>
 
+      <div v-if="appActivity" class="rounded-2xl bg-surface-900/60 border border-surface-700/40 px-5 py-3 flex items-center justify-between gap-5">
+        <div class="flex items-center gap-5 text-sm">
+          <div class="flex items-center gap-2">
+            <Activity
+              class="w-4 h-4"
+              :class="appActivity.online > 0 ? 'text-emerald-400' : 'text-surface-600'"
+            />
+            <span class="text-surface-200 font-semibold">{{ appActivity.online }}</span>
+            <span class="text-xs text-surface-500">{{ t('applications.activity.online') }}</span>
+          </div>
+          <div class="h-5 w-px bg-surface-700/60" />
+          <div class="flex items-center gap-2">
+            <TrendingUp class="w-4 h-4 text-primary-400" />
+            <span class="text-surface-200 font-semibold">{{ appActivity.last7dLogins }}</span>
+            <span class="text-xs text-surface-500">{{ t('applications.activity.last7d') }}</span>
+          </div>
+        </div>
+        <Sparkline :values="appActivity.sparkline" :width="140" :height="32" />
+      </div>
+
       <div class="flex gap-1 p-1 bg-surface-900/60 rounded-xl border border-surface-700/40 w-fit overflow-x-auto">
         <button
           v-for="tab in tabs"
@@ -681,29 +762,73 @@ const financialKpis = computed(() => {
           <div class="flex justify-end">
             <BaseButton size="sm" @click="showUserModal = true"><Plus class="w-3.5 h-3.5" />{{ t('appDetail.grantAccess') }}</BaseButton>
           </div>
-          <div class="rounded-2xl bg-surface-900/60 border border-surface-700/40 overflow-hidden">
-            <div v-if="!appUsers.length" class="px-5 py-8 text-center text-sm text-surface-500">No users with access</div>
-            <div v-else class="divide-y divide-surface-800/40">
-              <div v-for="ua in appUsers" :key="ua.userId" class="px-5 py-4 flex items-center gap-4 group" :class="{ 'opacity-60': isDeletedUser(ua.userId) }">
-                <UserAvatar :name="getUserName(ua.userId)" :image="getUserImage(ua.userId)" size="sm" />
-                <div class="flex-1 min-w-0">
+          <DataTable
+            :columns="userColumns"
+            :items="appUsers"
+            :loading="loading"
+            :empty="!loading && appUsers.length === 0"
+            :row-key="(u: UserApplication) => u.userId"
+            enable-column-visibility
+            enable-density-toggle
+          >
+            <template #empty>
+              <div class="px-5 py-8 text-center text-sm text-surface-500">No users with access</div>
+            </template>
+            <template #cell-user="{ row }">
+              <div class="flex items-center gap-3" :class="{ 'opacity-60': isDeletedUser((row as UserApplication).userId) }">
+                <UserAvatar :name="getUserName((row as UserApplication).userId)" :image="getUserImage((row as UserApplication).userId)" size="sm" />
+                <div class="min-w-0">
                   <div class="flex items-center gap-2">
-                    <p class="text-sm font-medium text-surface-200">{{ getUserName(ua.userId) }}</p>
-                    <BaseBadge v-if="isDeletedUser(ua.userId)" variant="error" size="sm">{{ t('appDetail.deletedUser') }}</BaseBadge>
+                    <p class="text-sm font-medium text-surface-200 truncate">{{ getUserName((row as UserApplication).userId) }}</p>
+                    <BaseBadge v-if="isDeletedUser((row as UserApplication).userId)" variant="error" size="sm">{{ t('appDetail.deletedUser') }}</BaseBadge>
                   </div>
-                  <p class="text-xs text-surface-500">{{ getUserEmail(ua.userId) }}</p>
-                </div>
-                <div class="flex items-center gap-2">
-                  <BaseBadge variant="neutral" size="sm">{{ getRoleName(ua.roleId) }}</BaseBadge>
-                  <BaseBadge variant="neutral" size="sm">{{ getPlanName(ua.subscriptionPlanId) }}</BaseBadge>
-                  <BaseBadge :variant="ua.isActive ? 'success' : 'neutral'" size="sm" dot>{{ ua.isActive ? t('common.active') : t('common.inactive') }}</BaseBadge>
+                  <p class="text-xs text-surface-500 truncate">{{ getUserEmail((row as UserApplication).userId) }}</p>
                 </div>
-                <button @click="selectedUserId = ua.userId; showDeleteUserConfirm = true" class="opacity-0 group-hover:opacity-100 p-1.5 rounded-lg text-red-500 hover:bg-red-500/10 transition-all">
-                  <Trash2 class="w-4 h-4" />
-                </button>
               </div>
-            </div>
-          </div>
+            </template>
+            <template #cell-role="{ row }">
+              <BaseBadge variant="neutral" size="sm">{{ getRoleName((row as UserApplication).roleId) }}</BaseBadge>
+            </template>
+            <template #cell-plan="{ row }">
+              <BaseBadge variant="neutral" size="sm">{{ getPlanName((row as UserApplication).subscriptionPlanId) }}</BaseBadge>
+            </template>
+            <template #cell-status="{ row }">
+              <BaseBadge :variant="(row as UserApplication).isActive ? 'success' : 'neutral'" size="sm" dot>
+                {{ (row as UserApplication).isActive ? t('common.active') : t('common.inactive') }}
+              </BaseBadge>
+            </template>
+            <template #cell-lastLogin="{ row }">
+              <span class="text-xs text-surface-500">{{ formatLastLogin((row as UserApplication).lastLoginAt) }}</span>
+            </template>
+            <template #cell-ipAddress="{ row }">
+              <span class="text-xs text-surface-400">{{ (row as UserApplication).lastIp ?? '—' }}</span>
+            </template>
+            <template #cell-ua="{ row }">
+              <span class="text-xs text-surface-400">
+                <template v-if="(row as UserApplication).lastUserAgent">
+                  {{ parseUserAgent((row as UserApplication).lastUserAgent!).browser }} / {{ parseUserAgent((row as UserApplication).lastUserAgent!).os }}
+                </template>
+                <template v-else>—</template>
+              </span>
+            </template>
+            <template #cell-history="{ row }">
+              <button
+                @click="openHistory(row as UserApplication)"
+                class="p-1.5 rounded-lg text-surface-500 hover:text-surface-200 hover:bg-surface-700/50 transition-colors"
+                :title="t('users.history.title')"
+              >
+                <History class="w-4 h-4" />
+              </button>
+            </template>
+            <template #cell-actions="{ row }">
+              <button
+                @click="selectedUserId = (row as UserApplication).userId; showDeleteUserConfirm = true"
+                class="p-1.5 rounded-lg text-red-500 hover:bg-red-500/10 transition-all"
+              >
+                <Trash2 class="w-4 h-4" />
+              </button>
+            </template>
+          </DataTable>
         </div>
 
         <div v-if="activeTab === 'plans'" class="space-y-4">
@@ -1115,5 +1240,14 @@ const financialKpis = computed(() => {
     <ConfirmDialog :open="showRotateConfirm" :title="t('applications.rotateSecret')" :message="t('applications.rotateSecretConfirm')" :loading="formLoading" @confirm="handleRotate" @cancel="showRotateConfirm = false" />
     <ConfirmDialog :open="showDeletePermConfirm" :title="t('appDetail.deletePermission')" message="Delete this permission?" :loading="formLoading" @confirm="async () => { if (selectedPermId) { await appsApi.deletePermission(appId, selectedPermId); permissions = (await appsApi.listPermissions(appId)).permissions; showDeletePermConfirm = false; } }" @cancel="showDeletePermConfirm = false" />
     <ConfirmDialog :open="showDeletePlanConfirm" :title="t('appDetail.deletePlan')" message="Delete this plan?" :loading="formLoading" @confirm="async () => { if (selectedPlanId) { await appsApi.deletePlan(appId, selectedPlanId); plans = (await appsApi.listPlans(appId)).plans; showDeletePlanConfirm = false; } }" @cancel="showDeletePlanConfirm = false" />
+
+    <UserAppHistoryModal
+      v-if="historyModalUserId"
+      :open="historyModalOpen"
+      :app-id="appId"
+      :user-id="historyModalUserId"
+      :user-name="historyModalUserName"
+      @close="historyModalOpen = false"
+    />
   </AppLayout>
 </template>
diff --git a/frontend/src/views/ApplicationsView.vue b/frontend/src/views/ApplicationsView.vue
index 50460fe..fedbc9c 100644
--- a/frontend/src/views/ApplicationsView.vue
+++ b/frontend/src/views/ApplicationsView.vue
@@ -14,6 +14,8 @@ import CopyField from '@/components/ui/CopyField.vue';
 import EmptyState from '@/components/ui/EmptyState.vue';
 import EntityModal from '@/components/ui/EntityModal.vue';
 import ApplicationFormModal from '@/components/applications/ApplicationFormModal.vue';
+import Sparkline from '@/components/ui/Sparkline.vue';
+import { getApplicationsActivity, type AppActivityEntry } from '@/api/stats';
 import {
   Plus,
   AppWindow,
@@ -27,6 +29,7 @@ import {
   Globe,
   Lock,
   AlertTriangle,
+  Activity,
 } from 'lucide-vue-next';
 
 const { t } = useI18n();
@@ -47,7 +50,22 @@ const actionMenu = ref<string | null>(null);
 const filterActive = ref('');
 const filterType = ref('');
 
-onMounted(() => store.fetchApplications());
+onMounted(() => {
+  store.fetchApplications();
+  void loadActivity();
+});
+
+const activity = ref<Map<string, AppActivityEntry>>(new Map());
+async function loadActivity() {
+  try {
+    const res = await getApplicationsActivity();
+    const m = new Map<string, AppActivityEntry>();
+    res.applications.forEach(a => m.set(a.appId, a));
+    activity.value = m;
+  } catch {
+    // Silent — sparklines are decorative.
+  }
+}
 
 const filtered = computed(() => {
   let apps = store.applications;
@@ -277,6 +295,27 @@ function formatDate(iso: string) {
           <div class="text-xs text-surface-600">
             {{ app.redirectUris.length }} redirect URIs · {{ formatDate(app.createdAt) }}
           </div>
+
+          <div class="mt-3 pt-3 border-t border-surface-800/40 flex items-center justify-between">
+            <div class="flex items-center gap-3 text-xs">
+              <span
+                class="inline-flex items-center gap-1.5"
+                :class="(activity.get(app.id)?.online ?? 0) > 0 ? 'text-emerald-400' : 'text-surface-600'"
+                :title="t('applications.activity.online')"
+              >
+                <Activity class="w-3 h-3" />
+                {{ activity.get(app.id)?.online ?? 0 }}
+              </span>
+              <span class="text-surface-500">
+                {{ activity.get(app.id)?.last7dLogins ?? 0 }} · {{ t('applications.activity.last7d') }}
+              </span>
+            </div>
+            <Sparkline
+              :values="activity.get(app.id)?.sparkline ?? []"
+              :width="72"
+              :height="20"
+            />
+          </div>
         </div>
       </div>
     </div>
diff --git a/frontend/src/views/DashboardView.vue b/frontend/src/views/DashboardView.vue
index 0641c01..92847f2 100644
--- a/frontend/src/views/DashboardView.vue
+++ b/frontend/src/views/DashboardView.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, computed, onMounted } from 'vue';
+import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 import { useAuthStore } from '@/stores/auth';
@@ -8,14 +8,20 @@ import { listUsers } from '@/api/users';
 import { listSessions, revokeSession } from '@/api/sessions';
 import { listApplications } from '@/api/applications';
 import { listOrganizations } from '@/api/organizations';
+import { getActiveUsers, getLogins, type LoginsSeriesPoint } from '@/api/stats';
+import { useDebounce } from '@/composables/useDebounce';
 import AppLayout from '@/components/layout/AppLayout.vue';
 import StatCard from '@/components/ui/StatCard.vue';
 import UserAvatar from '@/components/ui/UserAvatar.vue';
 import BaseButton from '@/components/ui/BaseButton.vue';
+import BaseSelect from '@/components/ui/BaseSelect.vue';
+import DataTable from '@/components/ui/DataTable.vue';
+import AppIconStack from '@/components/ui/AppIconStack.vue';
 import { parseUserAgent } from '@/composables/useUserAgent';
 import type { Session, User, Application, Organization } from '@/types';
+import type { ColumnDef, DataTablePagination } from '@/types/data-table';
 import {
-  Users, MonitorSmartphone, AppWindow, Building2,
+  Users, MonitorSmartphone, AppWindow, Building2, Activity,
   AlertTriangle, Info, UserPlus, Plus, Settings, Clock,
 } from 'lucide-vue-next';
 import { Line } from 'vue-chartjs';
@@ -33,27 +39,95 @@ const sessions = ref<Session[]>([]);
 const applications = ref<Application[]>([]);
 const organizations = ref<Organization[]>([]);
 const loading = ref(true);
+const sessionsLoading = ref(true);
 const timeRange = ref<'7d' | '30d'>('7d');
 const lastRefreshed = ref(new Date());
 
+// Server-driven state for the sessions table. Search is debounced so the
+// user can type a query without firing one request per keystroke.
+const sessionPage = ref(1);
+const sessionLimit = ref(20);
+const sessionTotal = ref(0);
+const sessionSearch = ref('');
+const sessionAppFilter = ref('');
+const debouncedSessionSearch = useDebounce(sessionSearch, 300);
+
+const onlineCount = ref<number | null>(null);
+const loginsSeries = ref<LoginsSeriesPoint[]>([]);
+const loginsTotal = ref(0);
+const loginsLoading = ref(true);
+let onlinePollHandle: ReturnType<typeof setInterval> | null = null;
+
+async function fetchOnline() {
+  try {
+    const res = await getActiveUsers();
+    onlineCount.value = res.count;
+  } catch {
+    // Silent — KPI tolerates transient errors during polling.
+  }
+}
+
+async function fetchLogins() {
+  loginsLoading.value = true;
+  try {
+    const res = await getLogins({ range: timeRange.value });
+    loginsSeries.value = res.series;
+    loginsTotal.value = res.total;
+  } finally {
+    loginsLoading.value = false;
+  }
+}
+
 onMounted(async () => {
   await Promise.all([
     services.fetch(),
+    fetchOnline(),
+    fetchLogins(),
+    loadSessions(),
     (async () => {
-      const [u, s, a, o] = await Promise.all([
+      const [u, a, o] = await Promise.all([
         listUsers({ limit: 100 }),
-        listSessions({ limit: 100 }),
         listApplications(),
         listOrganizations(),
       ]);
       users.value = u.users;
-      sessions.value = s.sessions;
       applications.value = a.applications;
       organizations.value = o.organizations;
       lastRefreshed.value = new Date();
     })(),
   ]);
   loading.value = false;
+  onlinePollHandle = setInterval(fetchOnline, 30_000);
+});
+
+async function loadSessions() {
+  sessionsLoading.value = true;
+  try {
+    const res = await listSessions({
+      page: sessionPage.value,
+      limit: sessionLimit.value,
+      search: debouncedSessionSearch.value || undefined,
+    });
+    sessions.value = res.sessions;
+    sessionTotal.value = res.total;
+    lastRefreshed.value = new Date();
+  } finally {
+    sessionsLoading.value = false;
+  }
+}
+
+watch(debouncedSessionSearch, () => {
+  sessionPage.value = 1;
+  void loadSessions();
+});
+watch(sessionLimit, () => {
+  sessionPage.value = 1;
+  void loadSessions();
+});
+watch(sessionPage, () => { void loadSessions(); });
+
+onUnmounted(() => {
+  if (onlinePollHandle) clearInterval(onlinePollHandle);
 });
 
 const activeApplications = computed(() => applications.value.filter(a => a.isActive).length);
@@ -64,6 +138,33 @@ const userMap = computed(() => {
   return m;
 });
 
+const sessionColumns = computed<ColumnDef<Session>[]>(() => [
+  { key: 'user', label: t('users.columns.name') },
+  { key: 'apps', label: t('users.columns.applications') },
+  { key: 'ipAddress', label: t('users.columns.ipAddress'), field: 'ipAddress' },
+  { key: 'ua', label: t('users.columns.device') },
+  { key: 'createdAt', label: t('users.columns.createdAt'), field: 'createdAt', sortable: true },
+  { key: 'actions', label: t('users.columns.actions'), align: 'right' },
+]);
+
+// Client-side filter on application slug, applied to the page returned by
+// the server. Acceptable because the page size is bounded by the limit.
+const filteredSessions = computed(() => {
+  if (!sessionAppFilter.value) return sessions.value;
+  return sessions.value.filter(s => (s.applications ?? []).some(a => a.id === sessionAppFilter.value));
+});
+
+const appFilterOptions = computed(() => [
+  { value: '', label: t('dashboard.allApplications') },
+  ...applications.value.map(a => ({ value: a.id, label: a.name })),
+]);
+
+const sessionPagination = computed<DataTablePagination>(() => ({
+  page: sessionPage.value,
+  limit: sessionLimit.value,
+  total: sessionTotal.value,
+}));
+
 function generateDateLabels(days: number): string[] {
   return Array.from({ length: days }, (_, i) => {
     const d = new Date();
@@ -107,6 +208,24 @@ const userChartData = computed(() => ({
   }],
 }));
 
+const loginsChartData = computed(() => ({
+  labels: loginsSeries.value.map(p => {
+    const d = new Date(p.date);
+    return d.toLocaleDateString('en', { month: 'short', day: 'numeric' });
+  }),
+  datasets: [{
+    data: loginsSeries.value.map(p => p.count),
+    borderColor: '#10b981',
+    backgroundColor: 'rgba(16,185,129,0.08)',
+    fill: true,
+    tension: 0.4,
+    pointRadius: 3,
+    pointBackgroundColor: '#10b981',
+  }],
+}));
+
+watch(timeRange, () => { void fetchLogins(); });
+
 const hasNoProviders = computed(() => {
   const p = services.config?.providers;
   if (!p) return false;
@@ -117,6 +236,7 @@ const hasNoMfa = computed(() => !users.value.some(u => u.twoFactorEnabled || u.i
 
 async function handleRevoke(session: Session) {
   await revokeSession(session.id);
+  await loadSessions();
 }
 
 function formatDate(iso: string): string {
@@ -129,7 +249,14 @@ void d;
 <template>
   <AppLayout :title="t('dashboard.title')" :subtitle="t('dashboard.subtitle')">
     <div class="space-y-6">
-      <div class="grid grid-cols-2 lg:grid-cols-4 gap-4">
+      <div class="grid grid-cols-2 lg:grid-cols-5 gap-4">
+        <StatCard
+          :label="t('dashboard.onlineNow')"
+          :value="onlineCount ?? '—'"
+          :loading="loading && onlineCount === null"
+          :icon="Activity"
+          :sub="t('dashboard.onlineNowSub')"
+        />
         <StatCard :label="t('dashboard.totalUsers')" :value="loading ? '' : users.length" :loading="loading" :icon="Users" />
         <StatCard :label="t('dashboard.activeSessions')" :value="loading ? '' : sessions.length" :loading="loading" :icon="MonitorSmartphone" :sub="t('dashboard.lastRefreshed') + ' ' + lastRefreshed.toLocaleTimeString()" />
         <StatCard :label="t('dashboard.totalApplications')" :value="loading ? '' : applications.length" :loading="loading" :icon="AppWindow" :sub="`${activeApplications} ${t('common.active')}`" />
@@ -197,56 +324,95 @@ void d;
         </div>
       </div>
 
-      <div class="rounded-2xl bg-surface-900/60 border border-surface-700/40 overflow-hidden">
-        <div class="px-5 py-4 border-b border-surface-700/40 flex items-center justify-between">
-          <p class="text-sm font-semibold text-surface-200">{{ t('dashboard.activeSessionsList') }}</p>
-          <span class="text-xs text-surface-500">{{ sessions.length }} {{ t('common.total').toLowerCase() }}</span>
-        </div>
-
-        <div v-if="loading" class="divide-y divide-surface-800/40">
-          <div v-for="i in 3" :key="i" class="px-5 py-4 flex items-center gap-4">
-            <div class="w-9 h-9 bg-gradient-to-r from-surface-800 via-surface-700 to-surface-800 bg-[length:200%_100%] animate-shimmer rounded-full" />
-            <div class="flex-1 space-y-2">
-              <div class="h-3.5 bg-gradient-to-r from-surface-800 via-surface-700 to-surface-800 bg-[length:200%_100%] animate-shimmer rounded w-32" />
-              <div class="h-3 bg-gradient-to-r from-surface-800 via-surface-700 to-surface-800 bg-[length:200%_100%] animate-shimmer rounded w-48" />
-            </div>
+      <div class="rounded-2xl bg-surface-900/60 border border-surface-700/40 p-5">
+        <div class="flex items-center justify-between mb-4">
+          <div>
+            <p class="text-sm font-semibold text-surface-200">{{ t('dashboard.loginsChart') }}</p>
+            <p class="text-xs text-surface-500 mt-0.5">{{ t('dashboard.totalLogins', { count: loginsTotal }) }}</p>
+          </div>
+          <div class="flex gap-1">
+            <button
+              v-for="r in (['7d', '30d'] as const)"
+              :key="`logins-${r}`"
+              @click="timeRange = r"
+              :class="['px-2.5 py-1 rounded-lg text-xs font-medium transition-colors', timeRange === r ? 'bg-emerald-600/20 text-emerald-300' : 'text-surface-500 hover:text-surface-300']"
+            >
+              {{ t(`dashboard.timeRanges.${r}`) }}
+            </button>
           </div>
         </div>
-
-        <div v-else-if="sessions.length === 0" class="px-5 py-10 text-center text-sm text-surface-500">
-          No active sessions
+        <div class="h-48">
+          <Line v-if="!loginsLoading" :data="loginsChartData" :options="chartOptions" />
+          <div v-else class="h-full bg-gradient-to-r from-surface-800 via-surface-700 to-surface-800 bg-[length:200%_100%] animate-shimmer rounded-xl" />
         </div>
+      </div>
 
-        <div v-else class="divide-y divide-surface-800/40">
-          <div
-            v-for="session in sessions"
-            :key="session.id"
-            class="px-5 py-4 flex items-center gap-4 hover:bg-surface-800/20 transition-colors"
+      <div class="rounded-2xl bg-surface-900/60 border border-surface-700/40 overflow-hidden">
+        <div class="px-5 py-4 border-b border-surface-700/40 flex items-center justify-between">
+          <p class="text-sm font-semibold text-surface-200">{{ t('dashboard.activeSessionsList') }}</p>
+          <span class="text-xs text-surface-500">{{ sessionTotal }} {{ t('common.total').toLowerCase() }}</span>
+        </div>
+        <div class="p-3">
+          <DataTable
+            :columns="sessionColumns"
+            :items="filteredSessions"
+            :loading="sessionsLoading"
+            :empty="!sessionsLoading && filteredSessions.length === 0"
+            :row-key="(s: Session) => s.id"
+            searchable
+            :search="sessionSearch"
+            :pagination="sessionPagination"
+            enable-column-visibility
+            enable-density-toggle
+            @update:search="sessionSearch = $event"
+            @update:page="sessionPage = $event"
+            @update:limit="sessionLimit = $event"
           >
-            <UserAvatar
-              :name="userMap.get(session.userId)?.name"
-              :image="userMap.get(session.userId)?.image"
-              size="sm"
-            />
-            <div class="flex-1 min-w-0">
-              <p class="text-sm font-medium text-surface-200">
-                {{ userMap.get(session.userId)?.name ?? t('common.unknown') }}
-                <span v-if="session.userId === auth.user?.id" class="ml-2 text-xs text-primary-400">(you)</span>
-              </p>
-              <p class="text-xs text-surface-500 mt-0.5">
-                {{ userMap.get(session.userId)?.email }} · {{ session.ipAddress ?? '—' }} ·
-                {{ parseUserAgent(session.userAgent).browser }} / {{ parseUserAgent(session.userAgent).os }}
-              </p>
-            </div>
-            <div class="text-right shrink-0 hidden sm:block">
-              <p class="text-xs text-surface-400 flex items-center gap-1">
+            <template #filters>
+              <BaseSelect v-model="sessionAppFilter" :options="appFilterOptions" class="w-48" />
+            </template>
+            <template #empty>
+              <div class="px-5 py-10 text-center text-sm text-surface-500">No active sessions</div>
+            </template>
+            <template #cell-user="{ row }">
+              <div class="flex items-center gap-3">
+                <UserAvatar
+                  :name="(row as Session).user?.name ?? userMap.get((row as Session).userId)?.name"
+                  :image="(row as Session).user?.image ?? userMap.get((row as Session).userId)?.image"
+                  size="sm"
+                />
+                <div class="min-w-0">
+                  <p class="text-sm font-medium text-surface-200 truncate">
+                    {{ (row as Session).user?.name ?? userMap.get((row as Session).userId)?.name ?? t('common.unknown') }}
+                    <span v-if="(row as Session).userId === auth.user?.id" class="ml-1 text-xs text-primary-400">(you)</span>
+                  </p>
+                  <p class="text-xs text-surface-500 truncate">
+                    {{ (row as Session).user?.email ?? userMap.get((row as Session).userId)?.email }}
+                  </p>
+                </div>
+              </div>
+            </template>
+            <template #cell-apps="{ row }">
+              <AppIconStack :apps="(row as Session).applications ?? []" />
+            </template>
+            <template #cell-ipAddress="{ row }">
+              <span class="text-xs text-surface-400">{{ (row as Session).ipAddress ?? '—' }}</span>
+            </template>
+            <template #cell-ua="{ row }">
+              <span class="text-xs text-surface-400">
+                {{ parseUserAgent((row as Session).userAgent).browser }} / {{ parseUserAgent((row as Session).userAgent).os }}
+              </span>
+            </template>
+            <template #cell-createdAt="{ row }">
+              <span class="text-xs text-surface-500 inline-flex items-center gap-1">
                 <Clock class="w-3 h-3" />
-                {{ formatDate(session.createdAt) }}
-              </p>
-              <p class="text-xs text-surface-600 mt-0.5">Expires {{ formatDate(session.expiresAt) }}</p>
-            </div>
-            <BaseButton variant="ghost" size="sm" @click="handleRevoke(session)">{{ t('dashboard.revoke') }}</BaseButton>
-          </div>
+                {{ formatDate((row as Session).createdAt) }}
+              </span>
+            </template>
+            <template #cell-actions="{ row }">
+              <BaseButton variant="ghost" size="sm" @click="handleRevoke(row as Session)">{{ t('dashboard.revoke') }}</BaseButton>
+            </template>
+          </DataTable>
         </div>
       </div>
     </div>
diff --git a/frontend/src/views/UserDetailView.vue b/frontend/src/views/UserDetailView.vue
index 2a26bc1..7c16b04 100644
--- a/frontend/src/views/UserDetailView.vue
+++ b/frontend/src/views/UserDetailView.vue
@@ -1,14 +1,17 @@
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import { ref, computed, onMounted } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { getUser } from '@/api/users';
 import { getUserConsumption } from '@/api/consumption';
 import type { User, UserApplicationDetail, ConsumptionAggregate } from '@/types';
+import type { ColumnDef } from '@/types/data-table';
 import AppLayout from '@/components/layout/AppLayout.vue';
 import UserAvatar from '@/components/ui/UserAvatar.vue';
 import BaseBadge from '@/components/ui/BaseBadge.vue';
 import BaseButton from '@/components/ui/BaseButton.vue';
+import DataTable from '@/components/ui/DataTable.vue';
+import EmptyState from '@/components/ui/EmptyState.vue';
 import { ArrowLeft, CheckCircle, XCircle, Shield, ShieldAlert } from 'lucide-vue-next';
 
 const { t } = useI18n();
@@ -45,11 +48,30 @@ function formatDate(iso: string) {
   return new Date(iso).toLocaleString(undefined, { dateStyle: 'medium', timeStyle: 'short' });
 }
 
+function formatLastLogin(iso: string | null | undefined): string {
+  if (!iso) return t('users.never');
+  return new Date(iso).toLocaleString(undefined, { dateStyle: 'medium', timeStyle: 'short' });
+}
+
+function formatConsumption(aggs: ConsumptionAggregate[] | undefined): string {
+  if (!aggs || aggs.length === 0) return '—';
+  return aggs.map(a => `${a.key}: ${Number(a.total).toLocaleString()}`).join(' · ');
+}
+
 function roleBadgeVariant(role: string | null) {
   if (role === 'superadmin') return 'error' as const;
   if (role === 'admin') return 'warning' as const;
   return 'neutral' as const;
 }
+
+const appColumns = computed<ColumnDef<UserApplicationDetail>[]>(() => [
+  { key: 'app', label: t('users.columns.applications') },
+  { key: 'roles', label: t('users.columns.role'), responsive: 'sm' },
+  { key: 'plan', label: 'Plan', responsive: 'md' },
+  { key: 'status', label: 'Status', responsive: 'md' },
+  { key: 'lastLogin', label: t('users.columns.lastLogin'), field: 'lastLoginAt', sortable: true, responsive: 'md' },
+  { key: 'consumption', label: t('appDetail.consumption'), responsive: 'lg' },
+]);
 </script>
 
 <template>
@@ -117,37 +139,56 @@ function roleBadgeVariant(role: string | null) {
           <div class="px-5 py-4 border-b border-surface-700/40">
             <h3 class="text-sm font-semibold text-surface-200">{{ t('users.applications') }}</h3>
           </div>
-          <div v-if="userApps.length === 0" class="px-5 py-8 text-center text-sm text-surface-500">
-            No application access
-          </div>
-          <div v-else class="divide-y divide-surface-800/40">
-            <div v-for="ua in userApps" :key="ua.id" class="px-5 py-4">
-              <div class="flex items-start justify-between">
+          <div class="p-3">
+            <DataTable
+              :columns="appColumns"
+              :items="userApps"
+              :empty="userApps.length === 0"
+              :row-key="(ua: UserApplicationDetail) => ua.id"
+              enable-column-visibility
+              enable-density-toggle
+            >
+              <template #empty>
+                <EmptyState :title="t('users.applications')" :message="t('applications.noApps')" />
+              </template>
+              <template #cell-app="{ row }">
                 <div class="flex items-center gap-3">
-                  <div class="w-9 h-9 rounded-lg overflow-hidden shrink-0 bg-surface-800 flex items-center justify-center">
-                    <img v-if="ua.icon" :src="ua.icon" class="w-full h-full object-cover" />
-                    <span v-else class="text-xs font-bold text-surface-400">{{ ua.name[0].toUpperCase() }}</span>
+                  <div class="w-8 h-8 rounded-lg overflow-hidden shrink-0 bg-surface-800 flex items-center justify-center">
+                    <img v-if="(row as UserApplicationDetail).icon" :src="(row as UserApplicationDetail).icon!" class="w-full h-full object-cover" />
+                    <span v-else class="text-xs font-bold text-surface-400">{{ (row as UserApplicationDetail).name[0].toUpperCase() }}</span>
                   </div>
-                  <div>
-                    <p class="text-sm font-medium text-surface-200">{{ ua.name }}</p>
-                    <div class="flex items-center gap-2 mt-1 flex-wrap">
-                      <BaseBadge :variant="ua.isActive ? 'success' : 'neutral'" size="sm" dot>{{ ua.isActive ? t('common.active') : t('common.inactive') }}</BaseBadge>
-                      <span v-for="r in ua.roles" :key="r.id" class="text-xs text-surface-500">{{ r.name }}</span>
-                    </div>
+                  <div class="min-w-0">
+                    <p class="text-sm font-medium text-surface-200 truncate">{{ (row as UserApplicationDetail).name }}</p>
+                    <p class="text-xs text-surface-500 truncate">{{ (row as UserApplicationDetail).slug }}</p>
                   </div>
                 </div>
-              </div>
-              <div v-if="consumption[ua.id]?.length" class="mt-3 flex flex-wrap gap-3">
-                <div
-                  v-for="agg in consumption[ua.id]"
-                  :key="agg.key"
-                  class="px-3 py-1.5 rounded-lg bg-surface-800/60 border border-surface-700/30"
-                >
-                  <p class="text-xs text-surface-500 font-mono">{{ agg.key }}</p>
-                  <p class="text-sm font-semibold text-surface-200 tabular-nums">{{ Number(agg.total).toLocaleString() }}</p>
+              </template>
+              <template #cell-roles="{ row }">
+                <div class="flex flex-wrap gap-1">
+                  <BaseBadge
+                    v-for="r in (row as UserApplicationDetail).roles"
+                    :key="r.id"
+                    variant="neutral"
+                    size="sm"
+                  >{{ r.name }}</BaseBadge>
+                  <span v-if="(row as UserApplicationDetail).roles.length === 0" class="text-xs text-surface-500">—</span>
                 </div>
-              </div>
-            </div>
+              </template>
+              <template #cell-plan="{ row }">
+                <span class="text-xs text-surface-400">{{ (row as UserApplicationDetail).subscriptionPlanName ?? (row as UserApplicationDetail).subscriptionPlanId ?? '—' }}</span>
+              </template>
+              <template #cell-status="{ row }">
+                <BaseBadge :variant="(row as UserApplicationDetail).isActive ? 'success' : 'neutral'" size="sm" dot>
+                  {{ (row as UserApplicationDetail).isActive ? t('common.active') : t('common.inactive') }}
+                </BaseBadge>
+              </template>
+              <template #cell-lastLogin="{ row }">
+                <span class="text-xs text-surface-400">{{ formatLastLogin((row as UserApplicationDetail).lastLoginAt) }}</span>
+              </template>
+              <template #cell-consumption="{ row }">
+                <span class="text-xs text-surface-500 font-mono">{{ formatConsumption(consumption[(row as UserApplicationDetail).id]) }}</span>
+              </template>
+            </DataTable>
           </div>
         </div>
       </template>
diff --git a/frontend/src/views/UsersView.vue b/frontend/src/views/UsersView.vue
index fbd4b46..9e07703 100644
--- a/frontend/src/views/UsersView.vue
+++ b/frontend/src/views/UsersView.vue
@@ -17,7 +17,9 @@ import BaseBadge from '@/components/ui/BaseBadge.vue';
 import UserAvatar from '@/components/ui/UserAvatar.vue';
 import DataTable from '@/components/ui/DataTable.vue';
 import EmptyState from '@/components/ui/EmptyState.vue';
+import AppIconStack from '@/components/ui/AppIconStack.vue';
 import { UserPlus, Search, CheckCircle, XCircle, Shield, ShieldAlert, User as UserIcon, MoreHorizontal, Eye, Pencil, Trash2, Ban, CheckCircle2 } from 'lucide-vue-next';
+import type { ColumnDef } from '@/types/data-table';
 import { useAuthStore } from '@/stores/auth';
 
 const { t } = useI18n();
@@ -198,6 +200,22 @@ function formatDate(iso: string) {
   return new Date(iso).toLocaleDateString(undefined, { dateStyle: 'medium' });
 }
 
+function formatLastLogin(iso: string | null | undefined): string {
+  if (!iso) return t('users.never');
+  return new Date(iso).toLocaleString(undefined, { dateStyle: 'short', timeStyle: 'short' });
+}
+
+const userColumns = computed<ColumnDef<User>[]>(() => [
+  { key: 'name', label: t('users.columns.name'), field: 'name', sortable: true },
+  { key: 'role', label: t('users.columns.role'), field: 'role', sortable: true, responsive: 'sm' },
+  { key: 'applications', label: t('users.columns.applications'), responsive: 'md', accessor: (r) => r.applications?.length ?? 0 },
+  { key: 'lastLogin', label: t('users.columns.lastLogin'), field: 'lastLoginAt', sortable: true, responsive: 'md' },
+  { key: 'verified', label: t('users.columns.verified'), field: 'emailVerified', responsive: 'lg' },
+  { key: 'mfa', label: t('users.columns.mfa'), field: 'twoFactorEnabled', responsive: 'lg' },
+  { key: 'createdAt', label: t('users.columns.createdAt'), field: 'createdAt', sortable: true, responsive: 'lg' },
+  { key: 'actions', label: t('users.columns.actions'), align: 'right' },
+]);
+
 const menuPos = ref({ top: 0, left: 0 });
 const MENU_WIDTH = 176; // w-44
 
@@ -264,16 +282,17 @@ const editModalTags = computed(() => {
         </BaseButton>
       </div>
 
-      <DataTable :loading="store.loading" :empty="!store.loading && filteredUsers.length === 0" :skeleton-cols="6">
-        <template #head>
-          <th class="px-4 py-3 text-left text-xs font-medium text-surface-500 uppercase tracking-wide">{{ t('users.name') }}</th>
-          <th class="px-4 py-3 text-left text-xs font-medium text-surface-500 uppercase tracking-wide hidden md:table-cell">{{ t('users.role') }}</th>
-          <th class="px-4 py-3 text-left text-xs font-medium text-surface-500 uppercase tracking-wide hidden lg:table-cell">{{ t('users.verified') }}</th>
-          <th class="px-4 py-3 text-left text-xs font-medium text-surface-500 uppercase tracking-wide hidden lg:table-cell">{{ t('users.mfa') }}</th>
-          <th class="px-4 py-3 text-left text-xs font-medium text-surface-500 uppercase tracking-wide hidden xl:table-cell">{{ t('users.createdAt') }}</th>
-          <th class="px-4 py-3 text-right text-xs font-medium text-surface-500 uppercase tracking-wide">{{ t('common.actions') }}</th>
-        </template>
-
+      <DataTable
+        :columns="userColumns"
+        :items="filteredUsers"
+        :loading="store.loading"
+        :empty="!store.loading && filteredUsers.length === 0"
+        :row-key="(u: User) => u.id"
+        enable-column-visibility
+        enable-density-toggle
+        clickable-rows
+        @row-click="(u: User) => router.push(`/users/${u.id}`)"
+      >
         <template #empty>
           <EmptyState :title="t('users.noUsers')" :message="t('users.noUsersMessage')">
             <template #action>
@@ -285,69 +304,76 @@ const editModalTags = computed(() => {
           </EmptyState>
         </template>
 
-        <tr
-          v-for="user in filteredUsers"
-          :key="user.id"
-          class="border-b border-surface-800/40 last:border-0 hover:bg-surface-800/20 transition-colors"
-        >
-          <td class="px-4 py-3">
-            <div class="flex items-center gap-3">
-              <UserAvatar :name="user.name" :image="user.image" size="sm" />
-              <div class="min-w-0">
-                <div class="flex items-center gap-2">
-                  <p class="text-sm font-medium text-surface-200 truncate">{{ user.name }}</p>
-                  <BaseBadge v-if="user.banned" variant="error" size="sm">{{ t('users.banned') }}</BaseBadge>
-                </div>
-                <p class="text-xs text-surface-500 truncate">{{ user.email }}</p>
+        <template #cell-name="{ row }">
+          <div class="flex items-center gap-3">
+            <UserAvatar :name="(row as User).name" :image="(row as User).image" size="sm" />
+            <div class="min-w-0">
+              <div class="flex items-center gap-2">
+                <p class="text-sm font-medium text-surface-200 truncate">{{ (row as User).name }}</p>
+                <BaseBadge v-if="(row as User).banned" variant="error" size="sm">{{ t('users.banned') }}</BaseBadge>
               </div>
+              <p class="text-xs text-surface-500 truncate">{{ (row as User).email }}</p>
             </div>
-          </td>
-          <td class="px-4 py-3 hidden md:table-cell">
-            <BaseBadge :variant="roleBadgeVariant(user.role)">
-              <ShieldAlert v-if="user.role === 'superadmin'" class="w-3 h-3" />
-              <Shield v-else-if="user.role === 'admin'" class="w-3 h-3" />
-              <UserIcon v-else class="w-3 h-3" />
-              {{ user.role ? t(`users.${user.role}`) : t('users.user') }}
-            </BaseBadge>
-          </td>
-          <td class="px-4 py-3 hidden lg:table-cell">
-            <CheckCircle v-if="user.emailVerified" class="w-4 h-4 text-emerald-400" />
-            <XCircle v-else class="w-4 h-4 text-surface-600" />
-          </td>
-          <td class="px-4 py-3 hidden lg:table-cell">
-            <CheckCircle v-if="user.twoFactorEnabled" class="w-4 h-4 text-emerald-400" />
-            <XCircle v-else class="w-4 h-4 text-surface-600" />
-          </td>
-          <td class="px-4 py-3 hidden xl:table-cell">
-            <span class="text-xs text-surface-500">{{ formatDate(user.createdAt) }}</span>
-          </td>
-          <td class="px-4 py-3 text-right">
-            <div class="flex items-center justify-end gap-1">
-              <div class="relative">
-                <button
-                  @click.stop="toggleMenu(user, $event)"
-                  class="p-1.5 rounded-lg text-surface-500 hover:text-surface-300 hover:bg-surface-700/50 transition-colors"
+          </div>
+        </template>
+
+        <template #cell-role="{ row }">
+          <BaseBadge :variant="roleBadgeVariant((row as User).role)">
+            <ShieldAlert v-if="(row as User).role === 'superadmin'" class="w-3 h-3" />
+            <Shield v-else-if="(row as User).role === 'admin'" class="w-3 h-3" />
+            <UserIcon v-else class="w-3 h-3" />
+            {{ (row as User).role ? t(`users.${(row as User).role}`) : t('users.user') }}
+          </BaseBadge>
+        </template>
+
+        <template #cell-applications="{ row }">
+          <AppIconStack :apps="(row as User).applications ?? []" />
+        </template>
+
+        <template #cell-lastLogin="{ row }">
+          <span class="text-xs text-surface-500">{{ formatLastLogin((row as User).lastLoginAt) }}</span>
+        </template>
+
+        <template #cell-verified="{ row }">
+          <CheckCircle v-if="(row as User).emailVerified" class="w-4 h-4 text-emerald-400" />
+          <XCircle v-else class="w-4 h-4 text-surface-600" />
+        </template>
+
+        <template #cell-mfa="{ row }">
+          <CheckCircle v-if="(row as User).twoFactorEnabled" class="w-4 h-4 text-emerald-400" />
+          <XCircle v-else class="w-4 h-4 text-surface-600" />
+        </template>
+
+        <template #cell-createdAt="{ row }">
+          <span class="text-xs text-surface-500">{{ formatDate((row as User).createdAt) }}</span>
+        </template>
+
+        <template #cell-actions="{ row }">
+          <div class="flex items-center justify-end gap-1">
+            <div class="relative">
+              <button
+                @click.stop="toggleMenu(row as User, $event)"
+                class="p-1.5 rounded-lg text-surface-500 hover:text-surface-300 hover:bg-surface-700/50 transition-colors"
+              >
+                <MoreHorizontal class="w-4 h-4" />
+              </button>
+              <Teleport to="body">
+                <div
+                  v-if="actionMenuUser === (row as User).id"
+                  :style="{ position: 'fixed', top: `${menuPos.top}px`, left: `${menuPos.left}px` }"
+                  class="w-44 bg-surface-800 border border-surface-700/50 rounded-xl shadow-xl z-[100] overflow-hidden animate-slide-up"
+                  v-click-outside="() => actionMenuUser = null"
                 >
-                  <MoreHorizontal class="w-4 h-4" />
-                </button>
-                <Teleport to="body">
-                  <div
-                    v-if="actionMenuUser === user.id"
-                    :style="{ position: 'fixed', top: `${menuPos.top}px`, left: `${menuPos.left}px` }"
-                    class="w-44 bg-surface-800 border border-surface-700/50 rounded-xl shadow-xl z-[100] overflow-hidden animate-slide-up"
-                    v-click-outside="() => actionMenuUser = null"
-                  >
-                    <button @click="router.push(`/users/${user.id}`); actionMenuUser = null;" class="w-full text-left px-3 py-2.5 text-sm text-surface-300 hover:text-surface-100 hover:bg-surface-700/50 flex items-center gap-2"><Eye class="w-4 h-4" />{{ t('common.view') }}</button>
-                    <button @click="openEdit(user)" class="w-full text-left px-3 py-2.5 text-sm text-surface-300 hover:text-surface-100 hover:bg-surface-700/50 flex items-center gap-2"><Pencil class="w-4 h-4" />{{ t('users.editUser') }}</button>
-                    <button v-if="user.banned" @click="handleUnban(user)" class="w-full text-left px-3 py-2.5 text-sm text-emerald-400 hover:bg-surface-700/50 flex items-center gap-2"><CheckCircle2 class="w-4 h-4" />{{ t('users.enable') }}</button>
-                    <button v-else @click="openDisable(user)" class="w-full text-left px-3 py-2.5 text-sm text-amber-400 hover:bg-surface-700/50 flex items-center gap-2"><Ban class="w-4 h-4" />{{ t('users.disable') }}</button>
-                    <button @click="openDelete(user)" class="w-full text-left px-3 py-2.5 text-sm text-red-400 hover:bg-surface-700/50 flex items-center gap-2"><Trash2 class="w-4 h-4" />{{ t('users.deleteUser') }}</button>
-                  </div>
-                </Teleport>
-              </div>
+                  <button @click="router.push(`/users/${(row as User).id}`); actionMenuUser = null;" class="w-full text-left px-3 py-2.5 text-sm text-surface-300 hover:text-surface-100 hover:bg-surface-700/50 flex items-center gap-2"><Eye class="w-4 h-4" />{{ t('common.view') }}</button>
+                  <button @click="openEdit(row as User)" class="w-full text-left px-3 py-2.5 text-sm text-surface-300 hover:text-surface-100 hover:bg-surface-700/50 flex items-center gap-2"><Pencil class="w-4 h-4" />{{ t('users.editUser') }}</button>
+                  <button v-if="(row as User).banned" @click="handleUnban(row as User)" class="w-full text-left px-3 py-2.5 text-sm text-emerald-400 hover:bg-surface-700/50 flex items-center gap-2"><CheckCircle2 class="w-4 h-4" />{{ t('users.enable') }}</button>
+                  <button v-else @click="openDisable(row as User)" class="w-full text-left px-3 py-2.5 text-sm text-amber-400 hover:bg-surface-700/50 flex items-center gap-2"><Ban class="w-4 h-4" />{{ t('users.disable') }}</button>
+                  <button @click="openDelete(row as User)" class="w-full text-left px-3 py-2.5 text-sm text-red-400 hover:bg-surface-700/50 flex items-center gap-2"><Trash2 class="w-4 h-4" />{{ t('users.deleteUser') }}</button>
+                </div>
+              </Teleport>
             </div>
-          </td>
-        </tr>
+          </div>
+        </template>
       </DataTable>
 
       <div v-if="store.total > 20" class="flex items-center justify-between text-sm text-surface-500">
diff --git a/src/auth.ts b/src/auth.ts
index 17263aa..9613794 100644
--- a/src/auth.ts
+++ b/src/auth.ts
@@ -22,6 +22,7 @@ import {
 } from "./services/email.js";
 import { userMustSetupMfa } from "./services/mfa.js";
 import { isSocialProviderAllowed } from "./services/social-providers.js";
+import { recordLogin } from "./services/login-history.js";
 import { APIError } from "better-auth";
 
 const schema = { ...authSchema, ...customSchema };
@@ -148,6 +149,44 @@ export const auth = betterAuth({
       company: { type: "string", required: false },
       position: { type: "string", required: false },
       address: { type: "string", required: false },
+      // Surfaced to admin listings as "last seen". Written by
+      // services/login-history.ts on every successful OAuth token issuance.
+      lastLoginAt: { type: "date", required: false },
+    },
+  },
+  // Capture every direct session creation (admin dashboard sign-in, password
+  // login, social provider callback) as a login_history row with
+  // applicationId = null. OAuth-client logins are already recorded inside
+  // `customAccessTokenClaims` with the resolved applicationId — those rows
+  // are complementary (one per token issuance, with an app id and IP/UA
+  // from the OAuth context). Fire-and-forget: failures must never break
+  // session creation.
+  databaseHooks: {
+    session: {
+      create: {
+        after: async (session) => {
+          try {
+            const s = session as {
+              userId: string;
+              id: string;
+              ipAddress?: string | null;
+              userAgent?: string | null;
+            };
+            await recordLogin({
+              userId: s.userId,
+              applicationId: null,
+              sessionId: s.id,
+              ipAddress: s.ipAddress ?? null,
+              userAgent: s.userAgent ?? null,
+            });
+          } catch (err) {
+            console.warn(
+              "[login-history] failed to record dashboard login",
+              { err: String(err) },
+            );
+          }
+        },
+      },
     },
   },
   plugins: [
@@ -371,6 +410,28 @@ export const auth = betterAuth({
         if (scopes.includes("org") && referenceId) {
           (claims as Record<string, unknown>).org_id = referenceId;
         }
+        // Record this token issuance as a login event for analytics / last-seen
+        // tracking. Fire-and-forget — a failure here must never block token
+        // issuance for the downstream client. The OAuth issuance callback does
+        // not surface request headers, so ipAddress / userAgent stay null;
+        // they remain available on the parent session row when needed.
+        if (clientId) {
+          const [appRow] = await db
+            .select({ id: applications.id })
+            .from(applications)
+            .where(eq(applications.slug, clientId))
+            .limit(1);
+          if (appRow) {
+            try {
+              await recordLogin({ userId: user.id, applicationId: appRow.id });
+            } catch (err) {
+              console.warn(
+                "[login-history] failed to record login",
+                { userId: user.id, clientId, err: String(err) },
+              );
+            }
+          }
+        }
         return { ...claims, ...appAttrs };
       },
       // Same data in /oauth2/userinfo response.
diff --git a/src/db/auth-schema.ts b/src/db/auth-schema.ts
index eac0e9b..a842ab2 100644
--- a/src/db/auth-schema.ts
+++ b/src/db/auth-schema.ts
@@ -30,6 +30,11 @@ export const user = pgTable("user", {
   company: text("company"),
   position: text("position"),
   address: text("address"),
+  // Denormalised timestamp of the user's most recent successful login,
+  // updated by recordLogin() in src/services/login-history.ts. Allows the
+  // admin users listing to render a "last seen" column without joining the
+  // login_history table.
+  lastLoginAt: timestamp("last_login_at"),
 });
 
 export const session = pgTable(
diff --git a/src/db/schema.ts b/src/db/schema.ts
index 9fa56f8..de3951e 100644
--- a/src/db/schema.ts
+++ b/src/db/schema.ts
@@ -254,3 +254,30 @@ export const consumptionAggregates = pgTable(
   },
   (t) => [primaryKey({ columns: [t.userId, t.applicationId, t.key] })],
 );
+
+// ── Login History ─────────────────────────────────────────────────────────────
+// Append-only log of successful login events. One row per OAuth token
+// issuance to an application (applicationId set) and one row per direct
+// sign-in to the auth-service admin dashboard (applicationId null).
+// Powers session→app attribution, last-login columns, per-app history modal,
+// and dashboard/app-card activity charts.
+export const loginHistory = pgTable(
+  "login_history",
+  {
+    id: uuid("id").primaryKey().defaultRandom(),
+    userId: text("user_id").notNull(),
+    applicationId: uuid("application_id").references(() => applications.id, {
+      onDelete: "set null",
+    }),
+    sessionId: text("session_id"),
+    loggedAt: timestamp("logged_at", { withTimezone: true })
+      .defaultNow()
+      .notNull(),
+    ipAddress: text("ip_address"),
+    userAgent: text("user_agent"),
+  },
+  (t) => [
+    index("login_history_user_logged_idx").on(t.userId, t.loggedAt),
+    index("login_history_app_logged_idx").on(t.applicationId, t.loggedAt),
+  ],
+);
diff --git a/src/index.ts b/src/index.ts
index cf8e064..7c37d48 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -26,6 +26,7 @@ import { plansRoutes } from "./routes/admin/plans.js";
 import { adminConsumptionRoutes } from "./routes/admin/adminConsumption.js";
 import { usersRoutes } from "./routes/admin/users.js";
 import { sessionsRoutes } from "./routes/admin/sessions.js";
+import { statsRoutes } from "./routes/admin/stats.js";
 import { servicesRoutes } from "./routes/admin/services.js";
 import { consumptionRoutes } from "./routes/consumption.js";
 import { userRoutes } from "./routes/user.js";
@@ -399,6 +400,7 @@ await fastify.register(plansRoutes, { prefix: "/api/admin" });
 await fastify.register(adminConsumptionRoutes, { prefix: "/api/admin" });
 await fastify.register(usersRoutes, { prefix: "/api/admin/users" });
 await fastify.register(sessionsRoutes, { prefix: "/api/admin/sessions" });
+await fastify.register(statsRoutes, { prefix: "/api/admin/stats" });
 await fastify.register(servicesRoutes, { prefix: "/api/admin/services" });
 await fastify.register(organizationsRoutes, { prefix: "/api/admin/organizations" });
 await fastify.register(consumptionRoutes, { prefix: "/api/consumption" });
diff --git a/src/migrate.ts b/src/migrate.ts
index 3660c5a..774c2bd 100644
--- a/src/migrate.ts
+++ b/src/migrate.ts
@@ -22,7 +22,16 @@ const __dirname = dirname(fileURLToPath(import.meta.url));
  * Migrations that ship after a clean baseline and only ever run through this
  * runner do not need a probe.
  */
-const POST_BASELINE_PROBES: { tag: string; probe: ReturnType<typeof sql> }[] = [];
+const POST_BASELINE_PROBES: { tag: string; probe: ReturnType<typeof sql> }[] = [
+  {
+    // 0001 introduces the `login_history` table and the `user.last_login_at`
+    // column. Detect the table — it is the most distinctive artefact and
+    // cheaper than checking a column on a hot table.
+    tag: "0001_many_weapon_omega",
+    probe: sql`SELECT 1 FROM information_schema.tables
+               WHERE table_schema = 'public' AND table_name = 'login_history'`,
+  },
+];
 
 /**
  * Ensures `__drizzle_migrations` is consistent with the migrations folder.
diff --git a/src/routes/admin/applications.ts b/src/routes/admin/applications.ts
index e671ac4..0930037 100644
--- a/src/routes/admin/applications.ts
+++ b/src/routes/admin/applications.ts
@@ -12,13 +12,14 @@ import {
   consumptionEntries,
   subscriptionPlans,
   userSubscriptions,
+  loginHistory,
 } from "../../db/schema.js";
 import {
   assignDefaultRoleIfNeeded,
   assignDefaultPlanIfNeeded,
 } from "../../services/claims.js";
 import { oauthClient, user as userTable } from "../../db/auth-schema.js";
-import { and, eq, inArray } from "drizzle-orm";
+import { and, count, desc, eq, inArray } from "drizzle-orm";
 import { ERR } from "../../errors.js";
 import { auth } from "../../auth.js";
 import { randomBytes, createHash } from "node:crypto";
@@ -545,7 +546,10 @@ export async function applicationRoutes(
 
   // ── App ↔ User access management ─────────────────────────────────────────────
 
-  // GET /api/admin/applications/:id/users — list all users associated with this app
+  // GET /api/admin/applications/:id/users — list all users associated with this app.
+  // Augments each row with `lastLoginAt` scoped to this application (computed
+  // from `login_history`). A single grouped sub-select keeps this to one round
+  // trip even when the membership list is large.
   fastify.get<{ Params: { id: string } }>("/:id/users", async (req, reply) => {
     const rows = await db
       .select({
@@ -555,6 +559,7 @@ export async function applicationRoutes(
         createdAt: userApplications.createdAt,
         name: userTable.name,
         email: userTable.email,
+        image: userTable.image,
         roleId: userAppRoles.roleId,
       })
       .from(userApplications)
@@ -568,9 +573,88 @@ export async function applicationRoutes(
       )
       .where(eq(userApplications.applicationId, req.params.id));
 
-    await reply.send({ users: rows });
+    const userIds = Array.from(new Set(rows.map((r) => r.userId)));
+    const lastLoginByUser = new Map<
+      string,
+      { lastLoginAt: Date; lastIp: string | null; lastUserAgent: string | null }
+    >();
+    if (userIds.length > 0) {
+      const lastLogins = await db
+        .selectDistinctOn([loginHistory.userId], {
+          userId: loginHistory.userId,
+          lastLoginAt: loginHistory.loggedAt,
+          lastIp: loginHistory.ipAddress,
+          lastUserAgent: loginHistory.userAgent,
+        })
+        .from(loginHistory)
+        .where(
+          and(
+            eq(loginHistory.applicationId, req.params.id),
+            inArray(loginHistory.userId, userIds),
+          ),
+        )
+        .orderBy(loginHistory.userId, desc(loginHistory.loggedAt));
+      for (const r of lastLogins) {
+        lastLoginByUser.set(r.userId, {
+          lastLoginAt: r.lastLoginAt,
+          lastIp: r.lastIp,
+          lastUserAgent: r.lastUserAgent,
+        });
+      }
+    }
+
+    const enriched = rows.map((r) => {
+      const last = lastLoginByUser.get(r.userId);
+      return {
+        ...r,
+        lastLoginAt: last?.lastLoginAt ?? null,
+        lastIp: last?.lastIp ?? null,
+        lastUserAgent: last?.lastUserAgent ?? null,
+      };
+    });
+
+    await reply.send({ users: enriched });
   });
 
+  // GET /api/admin/applications/:id/users/:userId/history — paginated login
+  // history for a single user inside a single application. Powers the history
+  // modal opened from the row-action icon in the app users tab.
+  fastify.get<{ Params: { id: string; userId: string } }>(
+    "/:id/users/:userId/history",
+    async (req, reply) => {
+      const query = req.query as Record<string, string>;
+      const page = Math.max(1, parseInt(query.page ?? "1", 10));
+      const limit = Math.min(100, Math.max(1, parseInt(query.limit ?? "20", 10)));
+      const offset = (page - 1) * limit;
+
+      const where = and(
+        eq(loginHistory.applicationId, req.params.id),
+        eq(loginHistory.userId, req.params.userId),
+      );
+
+      const [{ total }] = await db
+        .select({ total: count() })
+        .from(loginHistory)
+        .where(where);
+
+      const entries = await db
+        .select({
+          id: loginHistory.id,
+          loggedAt: loginHistory.loggedAt,
+          ipAddress: loginHistory.ipAddress,
+          userAgent: loginHistory.userAgent,
+          sessionId: loginHistory.sessionId,
+        })
+        .from(loginHistory)
+        .where(where)
+        .orderBy(desc(loginHistory.loggedAt))
+        .limit(limit)
+        .offset(offset);
+
+      await reply.send({ entries, total, page, limit });
+    },
+  );
+
   // POST /api/admin/applications/:id/users — grant a user access to this app
   fastify.post<{ Params: { id: string } }>("/:id/users", async (req, reply) => {
     const parsed = grantUserAccessSchema.safeParse(req.body);
diff --git a/src/routes/admin/sessions.test.ts b/src/routes/admin/sessions.test.ts
new file mode 100644
index 0000000..ee06229
--- /dev/null
+++ b/src/routes/admin/sessions.test.ts
@@ -0,0 +1,132 @@
+import { describe, it, expect, vi, beforeAll, afterAll, beforeEach } from "vitest";
+import Fastify from "fastify";
+import { sessionsRoutes } from "./sessions.js";
+
+vi.mock("better-auth/node", () => ({ fromNodeHeaders: vi.fn(() => ({})) }));
+
+const { mockDb, mockGetSession, makeChain } = vi.hoisted(() => {
+  function makeChain(result: unknown[] = []): Record<string, unknown> {
+    const p = Promise.resolve(result);
+    const c: Record<string, unknown> = {
+      from: () => c,
+      where: () => c,
+      leftJoin: () => c,
+      innerJoin: () => c,
+      orderBy: () => c,
+      limit: () => c,
+      offset: () => c,
+      groupBy: () => c,
+      then: p.then.bind(p),
+      catch: p.catch.bind(p),
+      finally: p.finally.bind(p),
+    };
+    return c;
+  }
+  const mockDb = {
+    select: vi.fn(() => makeChain()),
+    selectDistinct: vi.fn(() => makeChain()),
+  };
+  const mockGetSession = vi.fn();
+  return { mockDb, mockGetSession, makeChain };
+});
+
+vi.mock("../../db/index.js", () => ({ db: mockDb }));
+vi.mock("../../auth.js", () => ({
+  auth: { api: { getSession: mockGetSession } },
+}));
+
+const adminSession = { user: { id: "admin-1", role: "admin" } };
+
+describe("Admin — sessionsRoutes", () => {
+  const app = Fastify();
+
+  beforeAll(async () => {
+    await app.register(sessionsRoutes);
+    await app.ready();
+  });
+
+  afterAll(() => app.close());
+
+  beforeEach(() => {
+    mockDb.select.mockImplementation(() => makeChain());
+    mockDb.selectDistinct.mockImplementation(() => makeChain());
+  });
+
+  it("GET / → 401 when not authenticated", async () => {
+    mockGetSession.mockResolvedValueOnce(null);
+    const res = await app.inject({ method: "GET", url: "/" });
+    expect(res.statusCode).toBe(401);
+  });
+
+  it("GET / → 403 when authenticated as regular user", async () => {
+    mockGetSession.mockResolvedValueOnce({ user: { id: "u1", role: "user" } });
+    const res = await app.inject({ method: "GET", url: "/" });
+    expect(res.statusCode).toBe(403);
+  });
+
+  it("GET / → 200 with empty list when no active sessions", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    mockDb.select
+      .mockImplementationOnce(() => makeChain([{ total: 0 }])) // count
+      .mockImplementationOnce(() => makeChain([])); // list
+    const res = await app.inject({ method: "GET", url: "/" });
+    expect(res.statusCode).toBe(200);
+    const body = JSON.parse(res.body) as {
+      total: number;
+      sessions: unknown[];
+    };
+    expect(body.total).toBe(0);
+    expect(body.sessions).toEqual([]);
+  });
+
+  it("GET / → enriches sessions with user info and applications array", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    const createdAt = new Date("2026-05-17T10:00:00Z");
+    const expiresAt = new Date("2026-05-18T10:00:00Z");
+    mockDb.select
+      .mockImplementationOnce(() => makeChain([{ total: 1 }]))
+      .mockImplementationOnce(() =>
+        makeChain([
+          {
+            id: "sess-1",
+            userId: "user-1",
+            userAgent: "UA",
+            ipAddress: "1.2.3.4",
+            createdAt,
+            expiresAt,
+            userName: "Alice",
+            userEmail: "alice@example.com",
+            userImage: null,
+          },
+        ]),
+      );
+    mockDb.selectDistinct.mockImplementationOnce(() =>
+      makeChain([
+        {
+          userId: "user-1",
+          id: "app-1",
+          name: "App 1",
+          slug: "app-1",
+          icon: null,
+        },
+      ]),
+    );
+
+    const res = await app.inject({ method: "GET", url: "/" });
+    expect(res.statusCode).toBe(200);
+    const body = JSON.parse(res.body) as {
+      total: number;
+      sessions: {
+        id: string;
+        user: { name: string; email: string };
+        applications: { id: string; slug: string }[];
+      }[];
+    };
+    expect(body.total).toBe(1);
+    expect(body.sessions[0]?.user.name).toBe("Alice");
+    expect(body.sessions[0]?.user.email).toBe("alice@example.com");
+    expect(body.sessions[0]?.applications).toEqual([
+      { id: "app-1", name: "App 1", slug: "app-1", icon: null },
+    ]);
+  });
+});
diff --git a/src/routes/admin/sessions.ts b/src/routes/admin/sessions.ts
index e48f84f..31e5cee 100644
--- a/src/routes/admin/sessions.ts
+++ b/src/routes/admin/sessions.ts
@@ -1,8 +1,9 @@
 import type { FastifyInstance, FastifyRequest, FastifyReply } from "fastify";
 import { fromNodeHeaders } from "better-auth/node";
 import { db } from "../../db/index.js";
-import { session as sessionTable } from "../../db/auth-schema.js";
-import { gt, count } from "drizzle-orm";
+import { session as sessionTable, user as userTable } from "../../db/auth-schema.js";
+import { applications, loginHistory } from "../../db/schema.js";
+import { and, count, desc, eq, gt, gte, ilike, inArray, or, type SQL } from "drizzle-orm";
 import { ERR } from "../../errors.js";
 import { auth } from "../../auth.js";
 
@@ -32,17 +33,37 @@ export async function sessionsRoutes(fastify: FastifyInstance): Promise<void> {
   fastify.addHook("preHandler", requireAdmin);
 
   // GET /api/admin/sessions
+  // Returns active (non-expired) sessions enriched with their user identity
+  // and the list of applications the user logged into since the session was
+  // created. SSO means one session can serve multiple apps, so the linkage is
+  // many-to-many through login_history.
   fastify.get("/", async (req, reply) => {
     const query = req.query as Record<string, string>;
     const page = Math.max(1, parseInt(query.page ?? "1", 10));
     const limit = Math.min(100, Math.max(1, parseInt(query.limit ?? "20", 10)));
     const offset = (page - 1) * limit;
+    const search = query.search?.trim();
     const now = new Date();
 
+    // Search matches user name, email or session IP. Built as a single OR
+    // expression so we can reuse it for both COUNT and SELECT below.
+    const conditions: SQL[] = [gt(sessionTable.expiresAt, now)];
+    if (search) {
+      const pattern = `%${search}%`;
+      const orExpr = or(
+        ilike(userTable.name, pattern),
+        ilike(userTable.email, pattern),
+        ilike(sessionTable.ipAddress, pattern),
+      );
+      if (orExpr) conditions.push(orExpr);
+    }
+    const whereExpr = conditions.length === 1 ? conditions[0] : and(...conditions);
+
     const [{ total }] = await db
       .select({ total: count() })
       .from(sessionTable)
-      .where(gt(sessionTable.expiresAt, now));
+      .leftJoin(userTable, eq(sessionTable.userId, userTable.id))
+      .where(whereExpr);
 
     const list = await db
       .select({
@@ -52,12 +73,68 @@ export async function sessionsRoutes(fastify: FastifyInstance): Promise<void> {
         ipAddress: sessionTable.ipAddress,
         createdAt: sessionTable.createdAt,
         expiresAt: sessionTable.expiresAt,
+        userName: userTable.name,
+        userEmail: userTable.email,
+        userImage: userTable.image,
       })
       .from(sessionTable)
-      .where(gt(sessionTable.expiresAt, now))
+      .leftJoin(userTable, eq(sessionTable.userId, userTable.id))
+      .where(whereExpr)
+      .orderBy(desc(sessionTable.createdAt))
       .limit(limit)
       .offset(offset);
 
-    await reply.send({ total, sessions: list, page, limit });
+    // Bulk-resolve the apps each user logged into since their oldest visible
+    // session was created. Cheap distinct query on the (userId, loggedAt) index.
+    const userIds = Array.from(new Set(list.map((s) => s.userId)));
+    const oldestSessionStart = list.reduce<Date | null>((min, s) => {
+      if (!min || s.createdAt < min) return s.createdAt;
+      return min;
+    }, null);
+    const appsByUser = new Map<
+      string,
+      { id: string; name: string; slug: string; icon: string | null }[]
+    >();
+    if (userIds.length > 0 && oldestSessionStart) {
+      const rows = await db
+        .selectDistinct({
+          userId: loginHistory.userId,
+          id: applications.id,
+          name: applications.name,
+          slug: applications.slug,
+          icon: applications.icon,
+        })
+        .from(loginHistory)
+        .innerJoin(applications, eq(loginHistory.applicationId, applications.id))
+        .where(
+          and(
+            inArray(loginHistory.userId, userIds),
+            gte(loginHistory.loggedAt, oldestSessionStart),
+          ),
+        );
+      for (const r of rows) {
+        const arr = appsByUser.get(r.userId) ?? [];
+        arr.push({ id: r.id, name: r.name, slug: r.slug, icon: r.icon });
+        appsByUser.set(r.userId, arr);
+      }
+    }
+
+    const sessions = list.map((s) => ({
+      id: s.id,
+      userId: s.userId,
+      userAgent: s.userAgent,
+      ipAddress: s.ipAddress,
+      createdAt: s.createdAt,
+      expiresAt: s.expiresAt,
+      user: {
+        id: s.userId,
+        name: s.userName,
+        email: s.userEmail,
+        image: s.userImage,
+      },
+      applications: appsByUser.get(s.userId) ?? [],
+    }));
+
+    await reply.send({ total, sessions, page, limit });
   });
 }
diff --git a/src/routes/admin/stats.test.ts b/src/routes/admin/stats.test.ts
new file mode 100644
index 0000000..f41a944
--- /dev/null
+++ b/src/routes/admin/stats.test.ts
@@ -0,0 +1,173 @@
+import { describe, it, expect, vi, beforeAll, afterAll, beforeEach } from "vitest";
+import Fastify from "fastify";
+import { statsRoutes } from "./stats.js";
+
+vi.mock("better-auth/node", () => ({ fromNodeHeaders: vi.fn(() => ({})) }));
+
+const { mockDb, mockGetSession, makeChain } = vi.hoisted(() => {
+  function makeChain(result: unknown[] = []): Record<string, unknown> {
+    const p = Promise.resolve(result);
+    const c: Record<string, unknown> = {
+      from: () => c,
+      where: () => c,
+      leftJoin: () => c,
+      innerJoin: () => c,
+      orderBy: () => c,
+      limit: () => c,
+      offset: () => c,
+      groupBy: () => c,
+      then: p.then.bind(p),
+      catch: p.catch.bind(p),
+      finally: p.finally.bind(p),
+    };
+    return c;
+  }
+  const mockDb = {
+    select: vi.fn(() => makeChain()),
+    execute: vi.fn<(...args: unknown[]) => Promise<unknown[]>>(() => Promise.resolve([])),
+  };
+  const mockGetSession = vi.fn();
+  return { mockDb, mockGetSession, makeChain };
+});
+
+vi.mock("../../db/index.js", () => ({ db: mockDb }));
+vi.mock("../../auth.js", () => ({
+  auth: { api: { getSession: mockGetSession } },
+}));
+
+const adminSession = { user: { id: "admin-1", role: "admin" } };
+
+describe("Admin — statsRoutes", () => {
+  const app = Fastify();
+
+  beforeAll(async () => {
+    await app.register(statsRoutes);
+    await app.ready();
+  });
+
+  afterAll(() => app.close());
+
+  beforeEach(() => {
+    mockDb.select.mockImplementation(() => makeChain());
+    mockDb.execute.mockImplementation(() => Promise.resolve([]));
+  });
+
+  // ── Auth guard ─────────────────────────────────────────────────────────
+
+  it("GET /active-users → 401 when not authenticated", async () => {
+    mockGetSession.mockResolvedValueOnce(null);
+    const res = await app.inject({ method: "GET", url: "/active-users" });
+    expect(res.statusCode).toBe(401);
+  });
+
+  it("GET /active-users → 403 when authenticated as regular user", async () => {
+    mockGetSession.mockResolvedValueOnce({ user: { id: "u1", role: "user" } });
+    const res = await app.inject({ method: "GET", url: "/active-users" });
+    expect(res.statusCode).toBe(403);
+  });
+
+  // ── /active-users ──────────────────────────────────────────────────────
+
+  it("GET /active-users → returns distinct online count", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    mockDb.select.mockImplementationOnce(() => makeChain([{ count: 3 }]));
+    const res = await app.inject({ method: "GET", url: "/active-users" });
+    expect(res.statusCode).toBe(200);
+    expect(JSON.parse(res.body)).toEqual({ count: 3 });
+  });
+
+  // ── /logins ────────────────────────────────────────────────────────────
+
+  it("GET /logins → 400 on invalid range", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    const res = await app.inject({ method: "GET", url: "/logins?range=99d" });
+    expect(res.statusCode).toBe(400);
+  });
+
+  it("GET /logins → returns dense 7-day zero-filled series by default", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    mockDb.execute.mockResolvedValueOnce([]);
+    const res = await app.inject({ method: "GET", url: "/logins" });
+    expect(res.statusCode).toBe(200);
+    const body = JSON.parse(res.body) as {
+      range: string;
+      series: { date: string; count: number }[];
+      total: number;
+    };
+    expect(body.range).toBe("7d");
+    expect(body.series).toHaveLength(7);
+    expect(body.series.every((p) => p.count === 0)).toBe(true);
+    expect(body.total).toBe(0);
+  });
+
+  it("GET /logins → returns dense 30-day series when range=30d", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    mockDb.execute.mockResolvedValueOnce([]);
+    const res = await app.inject({ method: "GET", url: "/logins?range=30d" });
+    expect(res.statusCode).toBe(200);
+    const body = JSON.parse(res.body) as { series: unknown[] };
+    expect(body.series).toHaveLength(30);
+  });
+
+  it("GET /logins → backfills sparse raw rows into dense series", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    const today = new Date();
+    today.setUTCHours(0, 0, 0, 0);
+    const todayKey = today.toISOString().slice(0, 10);
+    mockDb.execute.mockResolvedValueOnce([{ day: todayKey, count: 5 }]);
+    const res = await app.inject({ method: "GET", url: "/logins" });
+    const body = JSON.parse(res.body) as {
+      series: { date: string; count: number }[];
+      total: number;
+    };
+    expect(body.total).toBe(5);
+    expect(body.series[body.series.length - 1]).toEqual({
+      date: todayKey,
+      count: 5,
+    });
+  });
+
+  // ── /applications-activity ─────────────────────────────────────────────
+
+  it("GET /applications-activity → empty list when no applications", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    mockDb.select.mockImplementationOnce(() => makeChain([]));
+    const res = await app.inject({
+      method: "GET",
+      url: "/applications-activity",
+    });
+    expect(res.statusCode).toBe(200);
+    expect(JSON.parse(res.body)).toEqual({ applications: [] });
+  });
+
+  it("GET /applications-activity → returns sparkline + KPI per app", async () => {
+    mockGetSession.mockResolvedValueOnce(adminSession);
+    mockDb.select.mockImplementationOnce(() =>
+      makeChain([{ id: "app-1" }, { id: "app-2" }]),
+    );
+    mockDb.execute
+      .mockResolvedValueOnce([{ appId: "app-1", day: "2026-05-17", count: 4 }])
+      .mockResolvedValueOnce([{ appId: "app-1", online: 2 }]);
+    const res = await app.inject({
+      method: "GET",
+      url: "/applications-activity",
+    });
+    expect(res.statusCode).toBe(200);
+    const body = JSON.parse(res.body) as {
+      applications: {
+        appId: string;
+        online: number;
+        last7dLogins: number;
+        sparkline: number[];
+      }[];
+    };
+    expect(body.applications).toHaveLength(2);
+    const app1 = body.applications.find((a) => a.appId === "app-1");
+    expect(app1?.online).toBe(2);
+    expect(app1?.sparkline).toHaveLength(7);
+    expect(app1?.sparkline.every((n) => typeof n === "number")).toBe(true);
+    const app2 = body.applications.find((a) => a.appId === "app-2");
+    expect(app2?.online).toBe(0);
+    expect(app2?.last7dLogins).toBe(0);
+  });
+});
diff --git a/src/routes/admin/stats.ts b/src/routes/admin/stats.ts
new file mode 100644
index 0000000..e434936
--- /dev/null
+++ b/src/routes/admin/stats.ts
@@ -0,0 +1,176 @@
+import type { FastifyInstance, FastifyRequest, FastifyReply } from "fastify";
+import { fromNodeHeaders } from "better-auth/node";
+import { z } from "zod";
+import { db } from "../../db/index.js";
+import { session as sessionTable } from "../../db/auth-schema.js";
+import { applications, loginHistory } from "../../db/schema.js";
+import { and, countDistinct, eq, gt, gte, sql } from "drizzle-orm";
+import { ERR } from "../../errors.js";
+import { auth } from "../../auth.js";
+
+async function requireAdmin(
+  req: FastifyRequest,
+  reply: FastifyReply,
+): Promise<void> {
+  const session = await auth.api.getSession({
+    headers: fromNodeHeaders(req.headers),
+  });
+  if (!session) {
+    await reply.status(401).send(ERR.AUTH_001().toJSON());
+    return;
+  }
+  const role = (session.user as Record<string, unknown>).role as
+    | string
+    | undefined;
+  if (role !== "admin" && role !== "superadmin") {
+    await reply
+      .status(403)
+      .send(ERR.AUTH_001("Insufficient permissions").toJSON());
+    return;
+  }
+}
+
+const rangeSchema = z.enum(["7d", "30d"]).default("7d");
+const loginsQuerySchema = z.object({
+  range: rangeSchema.optional(),
+  appId: z.string().uuid().optional(),
+});
+
+function rangeToDays(range: "7d" | "30d"): number {
+  return range === "30d" ? 30 : 7;
+}
+
+/**
+ * Build a dense [{ date, count }] series for the given range, filling missing
+ * days with zero so chart libraries do not need to interpolate.
+ */
+function denseSeries(
+  raw: { day: string; count: number }[],
+  days: number,
+): { date: string; count: number }[] {
+  const byDay = new Map(raw.map((r) => [r.day, r.count]));
+  const out: { date: string; count: number }[] = [];
+  const today = new Date();
+  today.setUTCHours(0, 0, 0, 0);
+  for (let i = days - 1; i >= 0; i--) {
+    const d = new Date(today);
+    d.setUTCDate(today.getUTCDate() - i);
+    const key = d.toISOString().slice(0, 10);
+    out.push({ date: key, count: byDay.get(key) ?? 0 });
+  }
+  return out;
+}
+
+export async function statsRoutes(fastify: FastifyInstance): Promise<void> {
+  fastify.addHook("preHandler", requireAdmin);
+
+  // GET /api/admin/stats/active-users
+  // Distinct users with at least one non-expired session — i.e. currently online.
+  fastify.get("/active-users", async (_req, reply) => {
+    const now = new Date();
+    const [{ count }] = await db
+      .select({ count: countDistinct(sessionTable.userId) })
+      .from(sessionTable)
+      .where(gt(sessionTable.expiresAt, now));
+    await reply.send({ count });
+  });
+
+  // GET /api/admin/stats/logins?range=7d|30d&appId=<uuid>
+  // Daily login counts (per-app or platform-wide). Dense series — zero-filled
+  // for days with no logins so the frontend chart renders a continuous axis.
+  fastify.get("/logins", async (req, reply) => {
+    const parsed = loginsQuerySchema.safeParse(req.query);
+    if (!parsed.success) {
+      throw ERR.APP_001("Invalid stats query", parsed.error.flatten());
+    }
+    const range = parsed.data.range ?? "7d";
+    const days = rangeToDays(range);
+    const since = new Date();
+    since.setUTCDate(since.getUTCDate() - (days - 1));
+    since.setUTCHours(0, 0, 0, 0);
+
+    const conditions = [gte(loginHistory.loggedAt, since)];
+    if (parsed.data.appId) {
+      conditions.push(eq(loginHistory.applicationId, parsed.data.appId));
+    }
+
+    // Raw aggregate via sql`` because date_trunc is not exposed by the typed
+    // builder; the input is server-controlled (no user concatenation).
+    const rows = (await db.execute(
+      sql`SELECT to_char(date_trunc('day', logged_at AT TIME ZONE 'UTC'), 'YYYY-MM-DD') AS day,
+                 COUNT(*)::int AS count
+          FROM login_history
+          WHERE ${and(...conditions)}
+          GROUP BY day
+          ORDER BY day ASC`,
+    )) as { day: string; count: number }[];
+
+    const series = denseSeries(rows, days);
+    const total = series.reduce((acc, r) => acc + r.count, 0);
+    await reply.send({ range, series, total });
+  });
+
+  // GET /api/admin/stats/applications-activity
+  // One bulk row per application: { appId, online (distinct users via this app
+  // in active sessions ≈ logins in the last 24h), last7dLogins, sparkline[7] }.
+  // Used by the applications grid to avoid N+1 calls for per-card stats.
+  fastify.get("/applications-activity", async (_req, reply) => {
+    const since = new Date();
+    since.setUTCDate(since.getUTCDate() - 6);
+    since.setUTCHours(0, 0, 0, 0);
+    const sinceIso = since.toISOString();
+
+    const apps = await db
+      .select({ id: applications.id })
+      .from(applications);
+
+    if (apps.length === 0) {
+      await reply.send({ applications: [] });
+      return;
+    }
+
+    const rows = (await db.execute(
+      sql`SELECT application_id AS "appId",
+                 to_char(date_trunc('day', logged_at AT TIME ZONE 'UTC'), 'YYYY-MM-DD') AS day,
+                 COUNT(*)::int AS count
+          FROM login_history
+          WHERE application_id IS NOT NULL
+            AND logged_at >= ${sinceIso}::timestamptz
+          GROUP BY application_id, day`,
+    )) as { appId: string; day: string; count: number }[];
+
+    // Online proxy: distinct users with a login event in the last 24h per app.
+    const online24h = new Date();
+    online24h.setUTCHours(online24h.getUTCHours() - 24);
+    const online24hIso = online24h.toISOString();
+    const onlineRows = (await db.execute(
+      sql`SELECT application_id AS "appId",
+                 COUNT(DISTINCT user_id)::int AS online
+          FROM login_history
+          WHERE application_id IS NOT NULL
+            AND logged_at >= ${online24hIso}::timestamptz
+          GROUP BY application_id`,
+    )) as { appId: string; online: number }[];
+    const onlineByApp = new Map(onlineRows.map((r) => [r.appId, r.online]));
+
+    const byApp = new Map<string, { day: string; count: number }[]>();
+    for (const r of rows) {
+      const arr = byApp.get(r.appId) ?? [];
+      arr.push({ day: r.day, count: r.count });
+      byApp.set(r.appId, arr);
+    }
+
+    const result = apps.map((a) => {
+      const series = denseSeries(byApp.get(a.id) ?? [], 7);
+      const last7dLogins = series.reduce((acc, p) => acc + p.count, 0);
+      return {
+        appId: a.id,
+        online: onlineByApp.get(a.id) ?? 0,
+        last7dLogins,
+        sparkline: series.map((p) => p.count),
+      };
+    });
+
+    await reply.send({ applications: result });
+  });
+}
diff --git a/src/routes/admin/users.ts b/src/routes/admin/users.ts
index 41a5fae..cea1ebf 100644
--- a/src/routes/admin/users.ts
+++ b/src/routes/admin/users.ts
@@ -10,9 +10,11 @@ import {
   userSubscriptions,
   consumptionEntries,
   consumptionAggregates,
+  loginHistory,
+  subscriptionPlans,
 } from "../../db/schema.js";
 import { user as userTable } from "../../db/auth-schema.js";
-import { and, count, eq } from "drizzle-orm";
+import { and, count, desc, eq, inArray, max } from "drizzle-orm";
 import { ERR } from "../../errors.js";
 import { auth } from "../../auth.js";
 
@@ -83,8 +85,79 @@ export async function usersRoutes(fastify: FastifyInstance): Promise<void> {
       },
     });
 
+    // Enrich each user with the list of applications they have access to and
+    // a fallback lastLoginAt (the user.lastLoginAt column is denormalised in
+    // recordLogin()). One grouped query per dimension keeps this O(1) round
+    // trips regardless of the page size.
+    const userIds = users.users.map((u) => u.id);
+    const appsByUser = new Map<
+      string,
+      { id: string; name: string; slug: string; icon: string | null }[]
+    >();
+    const lastLoginByUser = new Map<string, Date>();
+    if (userIds.length > 0) {
+      const accessRows = await db
+        .select({
+          userId: userApplications.userId,
+          id: applications.id,
+          name: applications.name,
+          slug: applications.slug,
+          icon: applications.icon,
+        })
+        .from(userApplications)
+        .innerJoin(
+          applications,
+          eq(userApplications.applicationId, applications.id),
+        )
+        .where(
+          and(
+            inArray(userApplications.userId, userIds),
+            eq(userApplications.isActive, true),
+          ),
+        );
+      for (const row of accessRows) {
+        const list = appsByUser.get(row.userId) ?? [];
+        list.push({
+          id: row.id,
+          name: row.name,
+          slug: row.slug,
+          icon: row.icon,
+        });
+        appsByUser.set(row.userId, list);
+      }
+
+      const lastLogins = await db
+        .select({
+          userId: loginHistory.userId,
+          lastLoginAt: max(loginHistory.loggedAt),
+        })
+        .from(loginHistory)
+        .where(inArray(loginHistory.userId, userIds))
+        .groupBy(loginHistory.userId);
+      for (const r of lastLogins) {
+        if (r.lastLoginAt) lastLoginByUser.set(r.userId, r.lastLoginAt);
+      }
+    }
+
+    const enriched = users.users.map((u) => {
+      const denormalised = (u as unknown as Record<string, unknown>)
+        .lastLoginAt as Date | string | null | undefined;
+      const fromHistory = lastLoginByUser.get(u.id) ?? null;
+      const denormalisedDate =
+        denormalised instanceof Date
+          ? denormalised
+          : typeof denormalised === "string"
+            ? new Date(denormalised)
+            : null;
+      return {
+        ...u,
+        applications: appsByUser.get(u.id) ?? [],
+        lastLoginAt: denormalisedDate ?? fromHistory,
+      };
+    });
+
     await reply.send({
-      users: users.users,
+      users: enriched,
       total: users.total,
       page,
       limit,
@@ -129,7 +202,9 @@ export async function usersRoutes(fastify: FastifyInstance): Promise<void> {
       .catch(() => null);
     if (!user) throw ERR.USR_001();
 
-    // Get user's app access with application details
+    // Get user's app access with application details. Left-join the plan
+    // table so the UI can display the human-readable plan name instead of
+    // the raw UUID stored on user_applications.
     const appAccess = await db
       .select({
         id: applications.id,
@@ -138,12 +213,17 @@ export async function usersRoutes(fastify: FastifyInstance): Promise<void> {
         icon: applications.icon,
         isActive: userApplications.isActive,
         subscriptionPlanId: userApplications.subscriptionPlanId,
+        subscriptionPlanName: subscriptionPlans.name,
       })
       .from(userApplications)
       .innerJoin(
         applications,
         eq(userApplications.applicationId, applications.id),
       )
+      .leftJoin(
+        subscriptionPlans,
+        eq(userApplications.subscriptionPlanId, subscriptionPlans.id),
+      )
       .where(eq(userApplications.userId, req.params.id));
 
     // Get per-app roles for this user
@@ -165,9 +245,28 @@ export async function usersRoutes(fastify: FastifyInstance): Promise<void> {
       rolesByApp.set(r.applicationId, existing);
     }
 
+    // Most recent login per application for this user. One round trip,
+    // one row per applicationId — Postgres-only selectDistinctOn is fine
+    // because the project pins on postgres.js.
+    const lastLoginRows = await db
+      .selectDistinctOn([loginHistory.applicationId], {
+        applicationId: loginHistory.applicationId,
+        lastLoginAt: loginHistory.loggedAt,
+      })
+      .from(loginHistory)
+      .where(eq(loginHistory.userId, req.params.id))
+      .orderBy(loginHistory.applicationId, desc(loginHistory.loggedAt));
+    const lastLoginByApp = new Map<string, Date>();
+    for (const r of lastLoginRows) {
+      if (r.applicationId && r.lastLoginAt) {
+        lastLoginByApp.set(r.applicationId, r.lastLoginAt);
+      }
+    }
+
     const appsWithRoles = appAccess.map((app) => ({
       ...app,
       roles: rolesByApp.get(app.id) ?? [],
+      lastLoginAt: lastLoginByApp.get(app.id) ?? null,
     }));
 
     await reply.send({ user, applications: appsWithRoles });
diff --git a/src/services/login-history.test.ts b/src/services/login-history.test.ts
new file mode 100644
index 0000000..a9d694b
--- /dev/null
+++ b/src/services/login-history.test.ts
@@ -0,0 +1,66 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+
+const insertValuesMock = vi.fn<(...args: unknown[]) => Promise<void>>(() => Promise.resolve());
+const updateSetMock = vi.fn<(...args: unknown[]) => unknown>();
+
+vi.mock("../db/index.js", () => {
+  return {
+    db: {
+      insert: vi.fn(() => ({ values: insertValuesMock })),
+      update: vi.fn(() => ({
+        set: updateSetMock.mockImplementation(() => ({
+          where: vi.fn(() => Promise.resolve()),
+        })),
+      })),
+    },
+  };
+});
+
+import { recordLogin } from "./login-history.js";
+
+describe("recordLogin", () => {
+  beforeEach(() => {
+    insertValuesMock.mockClear();
+    updateSetMock.mockClear();
+  });
+
+  it("inserts a login_history row with the provided context", async () => {
+    const loggedAt = new Date("2026-05-17T12:00:00Z");
+    await recordLogin({
+      userId: "user-1",
+      applicationId: "app-1",
+      sessionId: "sess-1",
+      ipAddress: "10.0.0.1",
+      userAgent: "Mozilla/5.0",
+      loggedAt,
+    });
+
+    expect(insertValuesMock).toHaveBeenCalledWith({
+      userId: "user-1",
+      applicationId: "app-1",
+      sessionId: "sess-1",
+      ipAddress: "10.0.0.1",
+      userAgent: "Mozilla/5.0",
+      loggedAt,
+    });
+  });
+
+  it("normalises missing optional fields to null", async () => {
+    await recordLogin({ userId: "user-2" });
+    const call = (insertValuesMock.mock.calls[0]?.[0] ?? {}) as Record<
+      string,
+      unknown
+    >;
+    expect(call.applicationId).toBeNull();
+    expect(call.sessionId).toBeNull();
+    expect(call.ipAddress).toBeNull();
+    expect(call.userAgent).toBeNull();
+    expect(call.loggedAt).toBeInstanceOf(Date);
+  });
+
+  it("updates user.lastLoginAt with the same timestamp", async () => {
+    const loggedAt = new Date("2026-05-17T13:30:00Z");
+    await recordLogin({ userId: "user-3", loggedAt });
+    expect(updateSetMock).toHaveBeenCalledWith({ lastLoginAt: loggedAt });
+  });
+});
diff --git a/src/services/login-history.ts b/src/services/login-history.ts
new file mode 100644
index 0000000..fb0dbac
--- /dev/null
+++ b/src/services/login-history.ts
@@ -0,0 +1,38 @@
+import { db } from "../db/index.js";
+import { loginHistory } from "../db/schema.js";
+import { user as userTable } from "../db/auth-schema.js";
+import { eq } from "drizzle-orm";
+
+export interface RecordLoginInput {
+  userId: string;
+  /** Null when the login is a direct admin-dashboard sign-in (no OAuth client). */
+  applicationId?: string | null;
+  sessionId?: string | null;
+  ipAddress?: string | null;
+  userAgent?: string | null;
+  /** Optional explicit timestamp — defaults to now(). Useful in tests. */
+  loggedAt?: Date;
+}
+
+/**
+ * Append a successful-login row to `login_history` and refresh the
+ * denormalised `user.last_login_at` timestamp. Both writes succeed or fail
+ * together; callers in token-issuance hot paths should not block on failures
+ * (see hook callers in src/auth.ts which wrap this call in try/catch with a
+ * warn-level log).
+ */
+export async function recordLogin(input: RecordLoginInput): Promise<void> {
+  const loggedAt = input.loggedAt ?? new Date();
+  await db.insert(loginHistory).values({
+    userId: input.userId,
+    applicationId: input.applicationId ?? null,
+    sessionId: input.sessionId ?? null,
+    ipAddress: input.ipAddress ?? null,
+    userAgent: input.userAgent ?? null,
+    loggedAt,
+  });
+  await db
+    .update(userTable)
+    .set({ lastLoginAt: loggedAt })
+    .where(eq(userTable.id, input.userId));
+}
diff --git a/test_output.txt b/test_output.txt
new file mode 100644
index 0000000..eef7087
--- /dev/null
+++ b/test_output.txt
@@ -0,0 +1,2466 @@
+
+> auth-service@0.1.24 test /home/user/Documents/Developments/Circle/auth-service
+> vitest run
+
+
+ RUN  v3.2.4 /home/user/Documents/Developments/Circle/auth-service
+
+ ❯ src/services/templates.test.ts (11 tests | 1 failed) 34ms
+   ✓ renderAuthPage > variable substitution > substitutes all standard variables 9ms
+   × renderAuthPage > variable substitution > renders empty OAUTH_QUERY when oauthQuery is not provided 13ms
+     → expected '<!DOCTYPE html>\n<html lang="en">\n<h…' to contain 'name="oauthQuery" value=""'
+   ✓ renderAuthPage > variable substitution > renders OAUTH_QUERY when oauthQuery is provided 1ms
+   ✓ renderAuthPage > variable substitution > HTML-escapes oauthQuery special characters 1ms
+   ✓ renderAuthPage > variable substitution > renders empty ERROR_MESSAGE when errorMessage is not provided 1ms
+   ✓ renderAuthPage > variable substitution > renders errorMessage when provided 1ms
+   ✓ renderAuthPage > register page > includes oauthQuery hidden input 1ms
+   ✓ renderAuthPage > per-application template override > falls back to built-in template when appSlug has no override 1ms
+   ✓ renderAuthPage > allowRegister substitution > renders ALLOW_REGISTER as 'true' when allowRegister is true 1ms
+   ✓ renderAuthPage > allowRegister substitution > renders ALLOW_REGISTER as 'false' when allowRegister is false 1ms
+   ✓ renderAuthPage > allowRegister substitution > defaults ALLOW_REGISTER to 'true' when allowRegister is omitted 1ms
+ ❯ src/routes/health.test.ts (1 test | 1 failed) 56ms
+   × GET /health > returns 200 with status ok 39ms
+     → expected 'undefined' to be 'string' // Object.is equality
+ ✓ src/routes/admin/roles.test.ts (9 tests) 113ms
+ ✓ src/routes/admin/stats.test.ts (9 tests) 86ms
+ ✓ src/routes/admin/organizations.test.ts (7 tests) 53ms
+ ✓ src/routes/admin/applications.test.ts (12 tests) 60ms
+ ✓ src/routes/admin/users.test.ts (8 tests) 71ms
+ ✓ src/services/mfa.test.ts (6 tests) 10ms
+ ✓ src/services/social-providers.test.ts (4 tests) 7ms
+ ✓ src/routes/admin/adminConsumption.test.ts (8 tests) 70ms
+stderr | src/tests/roles.integration.test.ts
+2026-05-16T23:11:42.705Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:42.706Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+ ✓ src/routes/admin/plans.test.ts (11 tests) 121ms
+stderr | src/tests/applications.integration.test.ts
+2026-05-16T23:11:42.943Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:42.945Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+ ❯ src/tests/roles.integration.test.ts (7 tests | 7 failed) 83ms
+   × rolesRoutes integration > 401 when not authenticated 26ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × rolesRoutes integration > GET roles → empty list 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × rolesRoutes integration > POST role → creates role 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × rolesRoutes integration > POST role → 409 on duplicate name in same app 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × rolesRoutes integration > POST role → new isDefault demotes existing default 16ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × rolesRoutes integration > DELETE role → 400 when role is assigned to users 9ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × rolesRoutes integration > DELETE role → 204 when role has no users 7ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+stderr | src/tests/adminConsumption.integration.test.ts
+2026-05-16T23:11:43.003Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:43.004Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+stderr | src/tests/users.integration.test.ts
+2026-05-16T23:11:43.040Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:43.042Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+stderr | src/tests/plans.integration.test.ts
+2026-05-16T23:11:43.059Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:43.060Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+stderr | src/tests/userSubscription.integration.test.ts
+2026-05-16T23:11:43.114Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:43.115Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+stderr | src/tests/consumption.integration.test.ts
+2026-05-16T23:11:43.132Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:43.133Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+stderr | src/tests/sessions.integration.test.ts
+2026-05-16T23:11:43.163Z WARN [Better Auth]: Please ensure '/.well-known/oauth-authorization-server' exists. Upon completion, clear with silenceWarnings.oauthAuthServerConfig.
+2026-05-16T23:11:43.164Z WARN [Better Auth]: Please ensure '/.well-known/openid-configuration' exists. Upon completion, clear with silenceWarnings.openidConfig.
+
+ ❯ src/tests/applications.integration.test.ts (8 tests | 8 failed) 80ms
+   × applicationRoutes integration > 401 when not authenticated 28ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × applicationRoutes integration > GET / → returns empty list initially 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × applicationRoutes integration > POST / → creates an application with default roles and plan 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × applicationRoutes integration > POST / → 409 on duplicate slug 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × applicationRoutes integration > POST / → public app has no clientSecret 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × applicationRoutes integration > POST / auto-assigns superadmins to new app 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × applicationRoutes integration > DELETE /:id → removes the application 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × applicationRoutes integration > GET /:id → 404 for unknown application 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ src/tests/adminConsumption.integration.test.ts (8 tests | 8 failed) 80ms
+   × adminConsumptionRoutes integration > 401 when not authenticated 36ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × adminConsumptionRoutes integration > 403 when not admin 5ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × adminConsumptionRoutes integration > 400 when year query param is invalid 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × adminConsumptionRoutes integration > 400 when month is out of valid range 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × adminConsumptionRoutes integration > 404 when app does not exist 6ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × adminConsumptionRoutes integration > 200 with empty entries when no consumption data 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × adminConsumptionRoutes integration > 200 aggregates entries grouped by userId and key for the requested month 5ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × adminConsumptionRoutes integration > 200 excludes entries from other months 1ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ✓ src/services/claims.test.ts (7 tests) 8ms
+ ❯ src/tests/users.integration.test.ts (8 tests | 8 failed) 47ms
+   × Admin — usersRoutes integration > GET / → 401 when not authenticated 18ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × Admin — usersRoutes integration > GET / → 403 for regular user 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × Admin — usersRoutes integration > GET / → returns paginated users via auth.api.listUsers 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × Admin — usersRoutes integration > DELETE /:id → 400 USR_002 when deleting the last superadmin 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × Admin — usersRoutes integration > DELETE /:id → 204 when deleting a superadmin while another exists 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × Admin — usersRoutes integration > DELETE /:id → 204 when deleting a normal user 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × Admin — usersRoutes integration > DELETE /:id → 400 USR_003 when admin tries to delete themselves 1ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × Admin — usersRoutes integration > DELETE /:id → 404 when user not found 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ✓ src/routes/consumption.test.ts (3 tests) 32ms
+ ❯ src/tests/plans.integration.test.ts (12 tests | 12 failed) 109ms
+   × plansRoutes integration > 401 when not authenticated 27ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > GET plans → 404 when application does not exist 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > GET plans → empty list 1ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > POST plan → creates plan 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > POST plan → new isDefault demotes existing default 6ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > DELETE plan → 400 when plan has active subscribers 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > DELETE plan → 204 when no active subscribers 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > POST price → 400 when amount is negative 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > POST price → 201 when amount is 0 (free tier) 8ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > POST price → 201 stores interval correctly for one_time 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > POST price → 404 when plan does not exist 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × plansRoutes integration > POST plan with metered features → 201 stores features correctly 35ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ src/tests/userSubscription.integration.test.ts (7 tests | 7 failed) 65ms
+   × userRoutes — GET /subscription > 401 when not authenticated 28ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × userRoutes — GET /subscription > 200 with empty subscriptions when user has no app access 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × userRoutes — GET /subscription > 200 with plan null when user has access but no plan assigned 8ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × userRoutes — GET /subscription > 200 with plan details when subscription plan is assigned 5ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × userRoutes — GET /subscription > 200 includes prices array in plan when prices exist 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × userRoutes — GET /subscription > 200 prices array is empty when plan has no prices 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × userRoutes — GET /subscription > 200 includes metered features in plan 1ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ src/tests/consumption.integration.test.ts (9 tests | 9 failed) 71ms
+   × consumptionRoutes integration > POST / → 403 when not authenticated 22ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > POST / → 404 when user+app relationship not found 2ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > POST / → creates consumption entry and aggregate 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > POST / → accumulates on subsequent calls 12ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > POST / → 400 on invalid key format 5ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > GET /:userId/:applicationId → returns all aggregates 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > GET /:userId/:applicationId/:key → returns single aggregate 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > GET /:userId/:applicationId/:key → 404 when not found 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × consumptionRoutes integration > DELETE /:userId/:applicationId/:key → removes aggregate and entries 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ src/tests/sessions.integration.test.ts (5 tests | 5 failed) 56ms
+   × GET /api/admin/sessions — sessions integration > 401 when not authenticated 26ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × GET /api/admin/sessions — sessions integration > returns empty list when no active sessions 3ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × GET /api/admin/sessions — sessions integration > returns only active sessions, excludes expired ones 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × GET /api/admin/sessions — sessions integration > paginates correctly 7ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+   × GET /api/admin/sessions — sessions integration > response contains the `sessions` key (not `list`) 4ms
+     → Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ✓ src/services/login-history.test.ts (3 tests) 7ms
+
+⎯⎯⎯⎯⎯⎯ Failed Tests 66 ⎯⎯⎯⎯⎯⎯⎯
+
+ FAIL  src/routes/health.test.ts > GET /health > returns 200 with status ok
+AssertionError: expected 'undefined' to be 'string' // Object.is equality
+
+Expected: "string"
+Received: "undefined"
+
+ ❯ src/routes/health.test.ts:20:33
+     18|     const body = JSON.parse(res.body);
+     19|     expect(body.status).toBe("ok");
+     20|     expect(typeof body.version).toBe("string");
+       |                                 ^
+     21|   });
+     22| });
+
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/66]⎯
+
+ FAIL  src/services/templates.test.ts > renderAuthPage > variable substitution > renders empty OAUTH_QUERY when oauthQuery is not provided
+AssertionError: expected '<!DOCTYPE html>\n<html lang="en">\n<h…' to contain 'name="oauthQuery" value=""'
+
+- Expected
++ Received
+
+- name="oauthQuery" value=""
++ <!DOCTYPE html>
++ <html lang="en">
++ <head>
++   <meta charset="UTF-8" />
++   <meta name="viewport" content="width=device-width, initial-scale=1" />
++   <title>Sign in</title>
++   <link rel="preconnect" href="https://fonts.googleapis.com" />
++   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
++   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet" />
++   <style>
++     :root {
++       --bg:             #f4f4f5;
++       --surface:        rgba(255,255,255,0.9);
++       --surface-inner:  #f4f4f5;
++       --border:         rgba(212,212,216,0.7);
++       --border-focus:   #2563eb;
++       --text:           #09090b;
++       --text-muted:     #71717a;
++       --text-subtle:    #a1a1aa;
++       --primary:        #2563eb;
++       --primary-hover:  #3b82f6;
++       --primary-glow:   rgba(37,99,235,0.15);
++       --danger:         #ef4444;
++       --danger-bg:      rgba(239,68,68,0.08);
++       --danger-border:  rgba(239,68,68,0.25);
++       --radius-sm: 4px; --radius: 7px; --radius-lg: 9px; --radius-xl: 12px;
++       --shadow-lg: 0 8px 24px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);
++     }
++     @media (prefers-color-scheme: dark) {
++       :root {
++         --bg:             #09090b;
++         --surface:        rgba(24,24,27,0.6);
++         --surface-inner:  rgba(39,39,42,0.6);
++         --border:         rgba(63,63,70,0.4);
++         --border-focus:   #3b82f6;
++         --text:           #fafafa;
++         --text-muted:     #a1a1aa;
++         --text-subtle:    #52525b;
++         --primary:        #2563eb;
++         --primary-hover:  #3b82f6;
++         --primary-glow:   rgba(59,130,246,0.12);
++         --danger:         #f87171;
++         --danger-bg:      rgba(239,68,68,0.1);
++         --danger-border:  rgba(239,68,68,0.3);
++         --shadow-lg: 0 8px 32px rgba(0,0,0,.4), 0 2px 8px rgba(0,0,0,.3);
++       }
++     }
++     *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
++     body {
++       font-family: "Inter", system-ui, sans-serif;
++       background: var(--bg);
++       color: var(--text);
++       min-height: 100svh;
++       display: flex; align-items: center; justify-content: center;
++       padding: 1.5rem 1rem;
++       -webkit-font-smoothing: antialiased;
++     }
++     .auth-container { width: 100%; max-width: 22rem; display: flex; flex-direction: column; align-items: center; }
++     .auth-header { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; margin-bottom: 1.75rem; text-align: center; }
++     .auth-icon {
++       width: 3rem; height: 3rem; border-radius: var(--radius-xl);
++       background: var(--primary); color: #fff;
++       display: flex; align-items: center; justify-content: center;
++       box-shadow: 0 8px 20px rgba(37,99,235,0.35); margin-bottom: 0.25rem;
++       transition: transform .4s cubic-bezier(.4,0,.2,1);
++     }
++     .auth-icon svg { width: 1.375rem; height: 1.375rem; }
++     h1 { font-size: 1.25rem; font-weight: 600; letter-spacing: -0.02em; }
++     .subtitle { font-size: 0.875rem; color: var(--text-muted); line-height: 1.5; }
++     .card {
++       background: var(--surface); border: 1px solid var(--border);
++       border-radius: var(--radius-xl); padding: 1.5rem; width: 100%;
++       box-shadow: var(--shadow-lg);
++       backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
++       overflow: hidden;
++     }
++
++     /* ── Slide-in viewport ─────────────────────────────────────────────── */
++     .slider-viewport { overflow: hidden; width: 100%; }
++     .slider {
++       display: flex; width: 200%;
++       transition: transform .45s cubic-bezier(.4,0,.2,1);
++     }
++     .slider > .step { flex: 0 0 50%; min-width: 0; }
++     /* A small inner padding so focus rings aren't clipped by overflow:hidden */
++     .slider > .step > .step-inner { padding: 2px; }
++     .slider.step-mfa { transform: translateX(-50%); }
++     @media (prefers-reduced-motion: reduce) {
++       .slider { transition: none; }
++       .auth-icon { transition: none; }
++     }
++
++     .form-group { margin-bottom: 1rem; }
++     label {
++       display: block; font-size: 0.8125rem; font-weight: 500;
++       color: var(--text-muted); margin-bottom: 0.375rem;
++     }
++     .label-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.375rem; }
++     .label-row label { margin-bottom: 0; }
++     .label-link { font-size: 0.8125rem; color: var(--primary); text-decoration: none; font-weight: 500; }
++     .label-link:hover { color: var(--primary-hover); }
++     input[type="email"], input[type="password"], input[type="text"] {
++       width: 100%; padding: 0.5625rem 0.75rem;
++       border: 1px solid var(--border); border-radius: var(--radius);
++       font-size: 0.9375rem; font-family: inherit;
++       color: var(--text); background: var(--surface-inner);
++       outline: none; transition: border-color .15s, box-shadow .15s; line-height: 1.5;
++     }
++     input::placeholder { color: var(--text-subtle); }
++     input:focus { border-color: var(--border-focus); box-shadow: 0 0 0 3px var(--primary-glow); }
++     .btn {
++       display: flex; align-items: center; justify-content: center; gap: 0.5rem;
++       width: 100%; padding: 0.5625rem 1rem; border-radius: var(--radius);
++       font-size: 0.9375rem; font-weight: 600; font-family: inherit;
++       cursor: pointer; transition: background .15s, box-shadow .15s, opacity .15s;
++       border: 1px solid transparent; line-height: 1.5; margin-top: 1.25rem;
++     }
++     .btn-primary { background: var(--primary); color: #fff; }
++     .btn-primary:hover:not(:disabled) { background: var(--primary-hover); box-shadow: 0 4px 12px rgba(37,99,235,0.3); }
++     .btn-primary:disabled { opacity: 0.5; cursor: not-allowed; }
++     .btn-ghost {
++       background: transparent; color: var(--text-muted);
++       border: 1px solid var(--border); margin-top: .5rem;
++     }
++     .btn-ghost:hover:not(:disabled) { color: var(--text); border-color: var(--border-focus); }
++     .error-box {
++       background: var(--danger-bg); color: var(--danger);
++       border: 1px solid var(--danger-border); border-radius: var(--radius-sm);
++       padding: 0.5625rem 0.75rem; font-size: 0.875rem; margin-bottom: 1rem;
++     }
++     .error-box:empty { display: none; }
++     .auth-footer { margin-top: 1.25rem; text-align: center; font-size: 0.875rem; color: var(--text-muted); }
++     .auth-footer a { color: var(--primary); text-decoration: none; font-weight: 500; }
++     .auth-footer a:hover { color: var(--primary-hover); }
++     .divider {
++       display: flex; align-items: center; gap: .75rem;
++       margin: 1.25rem 0 1rem; color: var(--text-subtle); font-size: .8125rem;
++     }
++     .divider::before, .divider::after { content: ''; flex: 1; height: 1px; background: var(--border); }
++     .social-buttons { display: flex; flex-direction: column; gap: .5rem; }
++     .btn-social {
++       display: flex; align-items: center; gap: .625rem; width: 100%;
++       padding: .5rem .75rem; background: var(--surface-inner);
++       border: 1px solid var(--border); border-radius: var(--radius);
++       font-family: inherit; font-size: .9375rem; font-weight: 500;
++       color: var(--text); cursor: pointer; transition: border-color .15s; line-height: 1.5;
++     }
++     .btn-social:hover:not(:disabled) { border-color: var(--border-focus); }
++     .btn-social:disabled { opacity: .5; cursor: not-allowed; }
++     .btn-social svg { flex-shrink: 0; }
++
++     /* ── OTP (6 digits split 3+3) ───────────────────────────────────────── */
++     .otp-group {
++       display: flex; align-items: center; justify-content: center;
++       gap: .5rem; margin: .25rem 0 .25rem;
++     }
++     .otp-group .otp-sep {
++       width: 1rem; height: 1px; background: var(--border);
++       flex-shrink: 0;
++     }
++     .otp-block { display: flex; gap: .4rem; }
++     .otp-input {
++       width: 2.5rem; height: 3rem;
++       text-align: center;
++       font-size: 1.25rem; font-weight: 600;
++       font-variant-numeric: tabular-nums;
++       padding: 0;
++       border: 1px solid var(--border); border-radius: var(--radius);
++       background: var(--surface-inner); color: var(--text);
++       outline: none; transition: border-color .15s, box-shadow .15s, transform .12s;
++     }
++     .otp-input:focus { border-color: var(--border-focus); box-shadow: 0 0 0 3px var(--primary-glow); }
++     .otp-input.is-filled { border-color: var(--primary); }
++     .otp-group.is-error .otp-input {
++       border-color: var(--danger-border);
++       animation: otp-shake .35s cubic-bezier(.36,.07,.19,.97);
++     }
++     @keyframes otp-shake {
++       10%,90% { transform: translateX(-1px); }
++       20%,80% { transform: translateX(2px); }
++       30%,50%,70% { transform: translateX(-4px); }
++       40%,60% { transform: translateX(4px); }
++     }
++     .mfa-mode-switch {
++       display: flex; justify-content: space-between; align-items: center;
++       margin-top: .875rem; font-size: .8125rem;
++     }
++     .mfa-mode-switch button {
++       background: none; border: none; padding: 0; cursor: pointer;
++       font: inherit; color: var(--text-muted);
++     }
++     .mfa-mode-switch button:hover { color: var(--text); }
++     .mfa-mode-switch button.primary { color: var(--primary); }
++     .mfa-mode-switch button.primary:hover { color: var(--primary-hover); }
++     .backup-input {
++       width: 100%; text-align: center; letter-spacing: .1em;
++       font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
++       font-size: 1rem;
++     }
++   </style>
++ </head>
++ <body>
++   <div class="auth-container">
++     <div class="auth-header">
++       <div class="auth-icon" id="auth-icon" aria-hidden="true">
++         <!-- shield icon for login; swapped to a lock when MFA step is shown -->
++         <svg id="icon-login" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
++           <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
++         </svg>
++         <svg id="icon-mfa" style="display:none" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
++           <rect x="3" y="11" width="18" height="11" rx="2" ry="2"/>
++           <path d="M7 11V7a5 5 0 0 1 10 0v4"/>
++         </svg>
++       </div>
++       <h1 id="title">Welcome back</h1>
++       <p class="subtitle" id="subtitle">Sign in to your account to continue.</p>
++     </div>
++
++     <div class="card">
++       <div class="error-box" id="error-box"></div>
++
++       <div class="slider-viewport">
++         <div class="slider" id="slider">
++           <!-- ── Step 1: credentials ─────────────────────────────────── -->
++           <div class="step" aria-hidden="false">
++             <div class="step-inner">
++               <form id="login-form">
++                 <input type="hidden" name="redirectTo" value="/" />
++                 <input type="hidden" name="oauthQuery"  value="" />
++                 <div class="form-group">
++                   <label for="email">Email</label>
++                   <input id="email" name="email" type="email" autocomplete="email" placeholder="you@example.com" required />
++                 </div>
++                 <div class="form-group">
++                   <div class="label-row">
++                     <label for="password">Password</label>
++                     <a class="label-link" href="/forgot-password">Forgot password?</a>
++                   </div>
++                   <input id="password" name="password" type="password" autocomplete="current-password" placeholder="••••••••" required />
++                 </div>
++                 <button type="submit" class="btn btn-primary" id="submit-btn">Sign in</button>
++               </form>
++               <div id="social-section"></div>
++             </div>
++           </div>
++
++           <!-- ── Step 2: MFA challenge ───────────────────────────────── -->
++           <div class="step" aria-hidden="true">
++             <div class="step-inner">
++               <!-- TOTP (6 digits split 3+3) -->
++               <form id="totp-form" novalidate>
++                 <label style="text-align:center; margin-bottom:.75rem;">Enter your 6-digit code</label>
++                 <div class="otp-group" id="otp-group" role="group" aria-label="One-time password, 6 digits">
++                   <div class="otp-block">
++                     <input class="otp-input" type="text" inputmode="numeric" pattern="[0-9]*" maxlength="1" autocomplete="one-time-code" aria-label="Digit 1" />
++                     <input class="otp-input" type="text" inputmode="numeric" pattern="[0-9]*" maxlength="1"                               aria-label="Digit 2" />
++                     <input class="otp-input" type="text" inputmode="numeric" pattern="[0-9]*" maxlength="1"                               aria-label="Digit 3" />
++                   </div>
++                   <span class="otp-sep" aria-hidden="true"></span>
++                   <div class="otp-block">
++                     <input class="otp-input" type="text" inputmode="numeric" pattern="[0-9]*" maxlength="1"                               aria-label="Digit 4" />
++                     <input class="otp-input" type="text" inputmode="numeric" pattern="[0-9]*" maxlength="1"                               aria-label="Digit 5" />
++                     <input class="otp-input" type="text" inputmode="numeric" pattern="[0-9]*" maxlength="1"                               aria-label="Digit 6" />
++                   </div>
++                 </div>
++                 <button type="submit" class="btn btn-primary" id="totp-submit">Verify</button>
++               </form>
++
++               <!-- Backup code fallback (hidden by default) -->
++               <form id="backup-form" style="display:none" novalidate>
++                 <div class="form-group" style="margin-top:.25rem">
++                   <label for="backup-code">Backup code</label>
++                   <input class="backup-input" id="backup-code" type="text" autocomplete="one-time-code" placeholder="xxxx-xxxx" required />
++                 </div>
++                 <button type="submit" class="btn btn-primary" id="backup-submit">Verify</button>
++               </form>
++
++               <div class="mfa-mode-switch">
++                 <button type="button" id="toggle-mode" class="primary">Use a backup code</button>
++                 <button type="button" id="cancel-mfa">Cancel</button>
++               </div>
++             </div>
++           </div>
++         </div>
++       </div>
++     </div>
++
++     <p class="auth-footer" id="register-footer">
++       No account yet? <a id="register-link" href="/register">Create one</a>
++     </p>
++   </div>
++
++   <script type="module">
++     const AUTH_URL = 'https://auth.example.com';
++
++     const slider      = document.getElementById('slider');
++     const errorBox    = document.getElementById('error-box');
++     const title       = document.getElementById('title');
++     const subtitle    = document.getElementById('subtitle');
++     const iconLogin   = document.getElementById('icon-login');
++     const iconMfa     = document.getElementById('icon-mfa');
++     const registerFtr = document.getElementById('register-footer');
++
++     // ── Step 1: sign-in form ──────────────────────────────────────────
++     const form      = document.getElementById('login-form');
++     const submitBtn = document.getElementById('submit-btn');
++
++     form.addEventListener('submit', async (e) => {
++       e.preventDefault();
++       errorBox.textContent = '';
++       submitBtn.disabled = true;
++       submitBtn.textContent = 'Signing in…';
++       const email = form.email.value.trim();
++       const password = form.password.value;
++       const redirectTo = form.redirectTo.value || '/';
++       const oauthQuery = form.oauthQuery.value;
++       try {
++         const callbackURL = oauthQuery
++           ? AUTH_URL + '/api/auth/oauth2/authorize?' + oauthQuery
++           : (redirectTo || '/');
++         const body = { email, password, callbackURL };
++         const res = await fetch(AUTH_URL + '/api/auth/sign-in/email', {
++           method: 'POST', credentials: 'include',
++           headers: { 'Content-Type': 'application/json', 'Origin': window.location.origin },
++           body: JSON.stringify(body),
++         });
++         const data = await res.json().catch(() => ({}));
++         if (!res.ok) {
++           errorBox.textContent = data?.error?.message ?? 'Authentication failed.';
++           return;
++         }
++         // MFA required → slide to step 2 instead of navigating away.
++         if (data?.twoFactorRedirect) {
++           showMfaStep();
++           return;
++         }
++         if (data?.url) {
++           window.location.href = data.url;
++         } else if (redirectTo.startsWith('/api/') || redirectTo.startsWith('http')) {
++           window.location.href = redirectTo;
++         } else {
++           window.location.href = redirectTo || '/';
++         }
++       } catch {
++         errorBox.textContent = 'A network error occurred. Please try again.';
++       } finally {
++         submitBtn.disabled = false;
++         submitBtn.textContent = 'Sign in';
++       }
++     });
++
++     if ('true' !== 'true') registerFtr?.remove();
++
++     // ── Step 2: MFA challenge ────────────────────────────────────────
++     const otpGroup   = document.getElementById('otp-group');
++     const otpInputs  = Array.from(otpGroup.querySelectorAll('.otp-input'));
++     const totpForm   = document.getElementById('totp-form');
++     const totpSubmit = document.getElementById('totp-submit');
++     const backupForm = document.getElementById('backup-form');
++     const backupSub  = document.getElementById('backup-submit');
++     const backupInp  = document.getElementById('backup-code');
++     const toggleBtn  = document.getElementById('toggle-mode');
++     const cancelBtn  = document.getElementById('cancel-mfa');
++
++     let mfaMode = 'totp'; // 'totp' | 'backup'
++
++     function showMfaStep() {
++       errorBox.textContent = '';
++       title.textContent = 'Two-factor authentication';
++       subtitle.textContent = 'Enter the code from your authenticator app.';
++       iconLogin.style.display = 'none';
++       iconMfa.style.display = '';
++       registerFtr?.style && (registerFtr.style.display = 'none');
++       slider.classList.add('step-mfa');
++       // Focus first OTP input after slide animation completes.
++       setTimeout(() => otpInputs[0]?.focus(), 300);
++     }
++
++     function showLoginStep() {
++       errorBox.textContent = '';
++       title.textContent = 'Welcome back';
++       subtitle.textContent = 'Sign in to your account to continue.';
++       iconLogin.style.display = '';
++       iconMfa.style.display = 'none';
++       if (registerFtr && 'true' === 'true') registerFtr.style.display = '';
++       slider.classList.remove('step-mfa');
++       resetOtp();
++       backupInp.value = '';
++       switchMode('totp');
++     }
++
++     function resetOtp() {
++       otpInputs.forEach(i => { i.value = ''; i.classList.remove('is-filled'); });
++       otpGroup.classList.remove('is-error');
++     }
++
++     function otpValue() {
++       return otpInputs.map(i => i.value).join('');
++     }
++
++     function markFilled() {
++       otpInputs.forEach(i => i.classList.toggle('is-filled', !!i.value));
++     }
++
++     // Digit input handling: auto-advance, auto-submit on last digit.
++     otpInputs.forEach((input, idx) => {
++       input.addEventListener('input', (e) => {
++         // Keep only the last digit typed (handles Android IMEs returning >1 char).
++         const raw = (e.target.value || '').replace(/\D/g, '');
++         input.value = raw.slice(-1);
++         markFilled();
++         if (input.value && idx < otpInputs.length - 1) {
++           otpInputs[idx + 1].focus();
++         }
++         if (otpValue().length === 6) {
++           submitTotp();
++         }
++       });
++       input.addEventListener('keydown', (e) => {
++         if (e.key === 'Backspace' && !input.value && idx > 0) {
++           otpInputs[idx - 1].focus();
++           otpInputs[idx - 1].value = '';
++           markFilled();
++           e.preventDefault();
++         } else if (e.key === 'ArrowLeft' && idx > 0) {
++           otpInputs[idx - 1].focus(); e.preventDefault();
++         } else if (e.key === 'ArrowRight' && idx < otpInputs.length - 1) {
++           otpInputs[idx + 1].focus(); e.preventDefault();
++         }
++       });
++       input.addEventListener('paste', (e) => {
++         const text = (e.clipboardData || window.clipboardData)?.getData('text') ?? '';
++         const digits = text.replace(/\D/g, '').slice(0, 6);
++         if (!digits) return;
++         e.preventDefault();
++         otpInputs.forEach((inp, i) => { inp.value = digits[i] ?? ''; });
++         markFilled();
++         const nextIdx = Math.min(digits.length, otpInputs.length - 1);
++         otpInputs[nextIdx].focus();
++         if (digits.length === 6) submitTotp();
++       });
++     });
++
++     totpForm.addEventListener('submit', (e) => { e.preventDefault(); submitTotp(); });
++     backupForm.addEventListener('submit', (e) => { e.preventDefault(); submitBackup(); });
++
++     async function submitTotp() {
++       const code = otpValue();
++       if (code.length !== 6) return;
++       totpSubmit.disabled = true;
++       totpSubmit.textContent = 'Verifying…';
++       errorBox.textContent = '';
++       try {
++         const res = await fetch(AUTH_URL + '/api/auth/two-factor/verify-totp', {
++           method: 'POST', credentials: 'include',
++           headers: { 'Content-Type': 'application/json', 'Origin': window.location.origin },
++           body: JSON.stringify({ code }),
++         });
++         const data = await res.json().catch(() => ({}));
++         if (!res.ok) {
++           otpGroup.classList.add('is-error');
++           errorBox.textContent = data?.error?.message ?? 'Invalid code. Please try again.';
++           // Clear and refocus so the user can retry without manual clearing.
++           setTimeout(() => { resetOtp(); otpInputs[0].focus(); }, 400);
++           return;
++         }
++         redirectAfterMfa(data);
++       } catch {
++         errorBox.textContent = 'A network error occurred. Please try again.';
++       } finally {
++         totpSubmit.disabled = false;
++         totpSubmit.textContent = 'Verify';
++       }
++     }
++
++     async function submitBackup() {
++       const code = backupInp.value.trim();
++       if (!code) return;
++       backupSub.disabled = true;
++       backupSub.textContent = 'Verifying…';
++       errorBox.textContent = '';
++       try {
++         const res = await fetch(AUTH_URL + '/api/auth/two-factor/verify-backup-code', {
++           method: 'POST', credentials: 'include',
++           headers: { 'Content-Type': 'application/json', 'Origin': window.location.origin },
++           body: JSON.stringify({ code }),
++         });
++         const data = await res.json().catch(() => ({}));
++         if (!res.ok) {
++           errorBox.textContent = data?.error?.message ?? 'Invalid backup code.';
++           return;
++         }
++         redirectAfterMfa(data);
++       } catch {
++         errorBox.textContent = 'A network error occurred. Please try again.';
++       } finally {
++         backupSub.disabled = false;
++         backupSub.textContent = 'Verify';
++       }
++     }
++
++     // After successful MFA, BetterAuth returns the same payload shape as a
++     // normal sign-in: either `{ url }` (OAuth redirect) or a session object.
++     function redirectAfterMfa(data) {
++       const redirectTo = form.redirectTo.value || '/';
++       const oauthQuery = form.oauthQuery.value;
++       if (data?.url) { window.location.href = data.url; return; }
++       if (oauthQuery) {
++         window.location.href = AUTH_URL + '/api/auth/oauth2/authorize?' + oauthQuery;
++         return;
++       }
++       window.location.href = redirectTo || '/';
++     }
++
++     function switchMode(next) {
++       mfaMode = next;
++       errorBox.textContent = '';
++       if (next === 'backup') {
++         totpForm.style.display = 'none';
++         backupForm.style.display = '';
++         toggleBtn.textContent = 'Use authenticator code';
++         setTimeout(() => backupInp.focus(), 50);
++       } else {
++         totpForm.style.display = '';
++         backupForm.style.display = 'none';
++         toggleBtn.textContent = 'Use a backup code';
++         setTimeout(() => otpInputs[0]?.focus(), 50);
++       }
++     }
++
++     toggleBtn.addEventListener('click', () => switchMode(mfaMode === 'totp' ? 'backup' : 'totp'));
++     cancelBtn.addEventListener('click', () => {
++       // Best-effort: clear BetterAuth's temporary 2FA cookie by signing out.
++       fetch(AUTH_URL + '/api/auth/sign-out', { method: 'POST', credentials: 'include' })
++         .catch(() => {})
++         .finally(() => showLoginStep());
++     });
++
++     // ── Social providers (login step) ────────────────────────────────
++     const PROVIDER_CONFIG = {
++       google:    { label: 'Continue with Google',    icon: '<svg width="16" height="16" viewBox="0 0 24 24"><path fill="#4285F4" d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"/><path fill="#34A853" d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"/><path fill="#FBBC05" d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"/><path fill="#EA4335" d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"/></svg>' },
++       github:    { label: 'Continue with GitHub',    icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"/></svg>' },
++       linkedin:  { label: 'Continue with LinkedIn',  icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="#0A66C2"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>' },
++       microsoft: { label: 'Continue with Microsoft', icon: '<svg width="16" height="16" viewBox="0 0 24 24"><path fill="#F25022" d="M1 1h10v10H1z"/><path fill="#00A4EF" d="M13 1h10v10H13z"/><path fill="#7FBA00" d="M1 13h10v10H1z"/><path fill="#FFB900" d="M13 13h10v10H13z"/></svg>' },
++       apple:     { label: 'Continue with Apple',     icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.8-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z"/></svg>' },
++     };
++     const socialProviders = (() => { try { return JSON.parse('[]'); } catch { return []; } })();
++     if (socialProviders.length > 0) {
++       const sec = document.getElementById('social-section');
++       sec.innerHTML = '<div class="divider"><span>or continue with</span></div><div class="social-buttons" id="social-buttons"></div>';
++       const container = document.getElementById('social-buttons');
++       socialProviders.forEach(provider => {
++         const cfg = PROVIDER_CONFIG[provider]; if (!cfg) return;
++         const btn = document.createElement('button');
++         btn.type = 'button'; btn.className = 'btn-social'; btn.dataset.provider = provider;
++         btn.innerHTML = cfg.icon + '<span>' + cfg.label + '</span>';
++         btn.addEventListener('click', async () => {
++           container.querySelectorAll('.btn-social').forEach(b => { b.disabled = true; });
++           btn.innerHTML = cfg.icon + '<span>Redirecting…</span>';
++           const oq = form.oauthQuery.value; const rd = form.redirectTo.value || '/';
++           const callbackURL = oq ? AUTH_URL + '/api/auth/oauth2/authorize?' + oq : rd;
++           try {
++             const res = await fetch(AUTH_URL + '/api/auth/sign-in/social', {
++               method: 'POST', credentials: 'include',
++               headers: { 'Content-Type': 'application/json', 'Origin': window.location.origin },
++               body: JSON.stringify({ provider, callbackURL }),
++             });
++             const data = await res.json().catch(() => ({}));
++             if (!res.ok || !data.url) {
++               errorBox.textContent = data?.error?.message ?? 'Social sign-in failed.';
++               container.querySelectorAll('.btn-social').forEach(b => { b.disabled = false; });
++               btn.innerHTML = cfg.icon + '<span>' + cfg.label + '</span>'; return;
++             }
++             window.location.href = data.url;
++           } catch {
++             errorBox.textContent = 'A network error occurred. Please try again.';
++             container.querySelectorAll('.btn-social').forEach(b => { b.disabled = false; });
++             btn.innerHTML = cfg.icon + '<span>' + cfg.label + '</span>';
++           }
++         });
++         container.appendChild(btn);
++       });
++     }
++   </script>
++ </body>
++ </html>
++
+
+ ❯ src/services/templates.test.ts:43:20
+     41|       expect(html).not.toContain("{{OAUTH_QUERY}}");
+     42|       // The hidden input should carry an empty value
+     43|       expect(html).toContain('name="oauthQuery" value=""');
+       |                    ^
+     44|     });
+     45| 
+
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[2/66]⎯
+
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 401 when not authenticated
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 403 when not admin
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 400 when year query param is invalid
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 400 when month is out of valid range
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 404 when app does not exist
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 200 with empty entries when no consumption data
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 200 aggregates entries grouped by userId and key for the requested month
+ FAIL  src/tests/adminConsumption.integration.test.ts > adminConsumptionRoutes integration > 200 excludes entries from other months
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/adminConsumption.integration.test.ts:34:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[3/66]⎯
+
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > 401 when not authenticated
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > GET / → returns empty list initially
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > POST / → creates an application with default roles and plan
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > POST / → 409 on duplicate slug
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > POST / → public app has no clientSecret
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > POST / auto-assigns superadmins to new app
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > DELETE /:id → removes the application
+ FAIL  src/tests/applications.integration.test.ts > applicationRoutes integration > GET /:id → 404 for unknown application
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/applications.integration.test.ts:40:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[4/66]⎯
+
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > POST / → 403 when not authenticated
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > POST / → 404 when user+app relationship not found
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > POST / → creates consumption entry and aggregate
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > POST / → accumulates on subsequent calls
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > POST / → 400 on invalid key format
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > GET /:userId/:applicationId → returns all aggregates
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > GET /:userId/:applicationId/:key → returns single aggregate
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > GET /:userId/:applicationId/:key → 404 when not found
+ FAIL  src/tests/consumption.integration.test.ts > consumptionRoutes integration > DELETE /:userId/:applicationId/:key → removes aggregate and entries
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/consumption.integration.test.ts:41:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[5/66]⎯
+
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > 401 when not authenticated
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > GET plans → 404 when application does not exist
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > GET plans → empty list
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > POST plan → creates plan
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > POST plan → new isDefault demotes existing default
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > DELETE plan → 400 when plan has active subscribers
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > DELETE plan → 204 when no active subscribers
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > POST price → 400 when amount is negative
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > POST price → 201 when amount is 0 (free tier)
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > POST price → 201 stores interval correctly for one_time
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > POST price → 404 when plan does not exist
+ FAIL  src/tests/plans.integration.test.ts > plansRoutes integration > POST plan with metered features → 201 stores features correctly
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/plans.integration.test.ts:38:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[6/66]⎯
+
+ FAIL  src/tests/roles.integration.test.ts > rolesRoutes integration > 401 when not authenticated
+ FAIL  src/tests/roles.integration.test.ts > rolesRoutes integration > GET roles → empty list
+ FAIL  src/tests/roles.integration.test.ts > rolesRoutes integration > POST role → creates role
+ FAIL  src/tests/roles.integration.test.ts > rolesRoutes integration > POST role → 409 on duplicate name in same app
+ FAIL  src/tests/roles.integration.test.ts > rolesRoutes integration > POST role → new isDefault demotes existing default
+ FAIL  src/tests/roles.integration.test.ts > rolesRoutes integration > DELETE role → 400 when role is assigned to users
+ FAIL  src/tests/roles.integration.test.ts > rolesRoutes integration > DELETE role → 204 when role has no users
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/roles.integration.test.ts:36:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[7/66]⎯
+
+ FAIL  src/tests/sessions.integration.test.ts > GET /api/admin/sessions — sessions integration > 401 when not authenticated
+ FAIL  src/tests/sessions.integration.test.ts > GET /api/admin/sessions — sessions integration > returns empty list when no active sessions
+ FAIL  src/tests/sessions.integration.test.ts > GET /api/admin/sessions — sessions integration > returns only active sessions, excludes expired ones
+ FAIL  src/tests/sessions.integration.test.ts > GET /api/admin/sessions — sessions integration > paginates correctly
+ FAIL  src/tests/sessions.integration.test.ts > GET /api/admin/sessions — sessions integration > response contains the `sessions` key (not `list`)
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/sessions.integration.test.ts:26:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[8/66]⎯
+
+ FAIL  src/tests/userSubscription.integration.test.ts > userRoutes — GET /subscription > 401 when not authenticated
+ FAIL  src/tests/userSubscription.integration.test.ts > userRoutes — GET /subscription > 200 with empty subscriptions when user has no app access
+ FAIL  src/tests/userSubscription.integration.test.ts > userRoutes — GET /subscription > 200 with plan null when user has access but no plan assigned
+ FAIL  src/tests/userSubscription.integration.test.ts > userRoutes — GET /subscription > 200 with plan details when subscription plan is assigned
+ FAIL  src/tests/userSubscription.integration.test.ts > userRoutes — GET /subscription > 200 includes prices array in plan when prices exist
+ FAIL  src/tests/userSubscription.integration.test.ts > userRoutes — GET /subscription > 200 prices array is empty when plan has no prices
+ FAIL  src/tests/userSubscription.integration.test.ts > userRoutes — GET /subscription > 200 includes metered features in plan
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/userSubscription.integration.test.ts:40:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[9/66]⎯
+
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > GET / → 401 when not authenticated
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > GET / → 403 for regular user
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > GET / → returns paginated users via auth.api.listUsers
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > DELETE /:id → 400 USR_002 when deleting the last superadmin
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > DELETE /:id → 204 when deleting a superadmin while another exists
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > DELETE /:id → 204 when deleting a normal user
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > DELETE /:id → 400 USR_003 when admin tries to delete themselves
+ FAIL  src/tests/users.integration.test.ts > Admin — usersRoutes integration > DELETE /:id → 404 when user not found
+Error: Failed query: TRUNCATE TABLE
+      app_role_permissions,
+      user_app_roles,
+      app_permissions,
+      app_roles,
+      user_subscriptions,
+      subscription_plan_prices,
+      subscription_plans,
+      consumption_aggregates,
+      consumption_entries,
+      user_applications,
+      applications,
+      two_factor,
+      passkey,
+      oauth_client,
+      "session",
+      account,
+      verification,
+      "user"
+    RESTART IDENTITY CASCADE
+params: 
+ ❯ PostgresJsPreparedQuery.queryWithCache node_modules/.pnpm/drizzle-orm@0.44.7_@opentelemetry+api@1.9.1_kysely@0.28.17_postgres@3.4.9/node_modules/src/pg-core/session.ts:73:11
+ ❯ Module.cleanDb src/tests/helpers/db.ts:18:3
+     16|  */
+     17| export async function cleanDb(): Promise<void> {
+     18|   await db.execute(
+       |   ^
+     19|     sql`TRUNCATE TABLE
+     20|       app_role_permissions,
+ ❯ src/tests/users.integration.test.ts:37:3
+
+Caused by: Error: connect ECONNREFUSED 127.0.0.1:5433
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
+Serialized Error: { errno: -111, code: 'ECONNREFUSED', syscall: 'connect', address: '127.0.0.1', port: 5433, query: undefined, parameters: undefined, args: [], types: null }
+⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[10/66]⎯
+
+
+ Test Files  10 failed | 12 passed (22)
+      Tests  66 failed | 97 passed (163)
+   Start at  01:11:40
+   Duration  2.80s (transform 1.58s, setup 0ms, collect 27.50s, tests 1.32s, environment 4ms, prepare 2.13s)
+
+ ELIFECYCLE  Test failed. See above for more details.