@byline/admin 6.7.1 → 6.8.0

package/src/modules/admin-users/components/set-password.tsx

@@ -160,7 +160,7 @@ export function SetPassword({ user, onClose, onSuccess }: SetPasswordProps) {
         <div className={cx('byline-user-set-password-actions', styles.actions)}>
           <Button
             type="button"
-            intent="secondary"
+            intent="noeffect"
             size="sm"
             onClick={onClose}
             className={cx('byline-user-set-password-action', styles.action)}

package/src/modules/admin-users/components/update.tsx

@@ -295,7 +295,7 @@ export function UpdateUser({ user, onClose, onSuccess }: UpdateUserProps) {
         <div className={cx('byline-user-update-actions', styles.actions)}>
           <Button
             type="button"
-            intent="secondary"
+            intent="noeffect"
             size="sm"
             onClick={onClose}
             className={cx('byline-user-update-action', styles.action)}

package/src/modules/auth/auth-maintenance-repository.ts

@@ -0,0 +1,26 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+/** Bounded housekeeping; expiry and revocation remain independent authorization checks. */
+export interface AuthMaintenanceRepository {
+  /** Remove at most 100 attempts expired or consumed on/before the supplied grace cutoff. */
+  purgeAttempts(before: Date): Promise<number>
+  /** Candidate only: eligibility must be checked again under its owning account lock. */
+  findTerminalLogin(before: Date): Promise<{ id: string; adminUserId: string } | null>
+  /**
+   * Requires the owning account lock. Re-read eligibility, delete at most 100 refresh
+   * children, then delete the terminal parent only if no children remain. Never cascade.
+   */
+  pruneTerminalLogin(input: {
+    id: string
+    adminUserId: string
+    before: Date
+  }): Promise<{ refreshDeleted: number; loginDeleted: boolean }>
+  /** Remove at most 100 legacy null-sid rows expired on/before the retention cutoff. */
+  purgeLegacyRefreshTokens(before: Date): Promise<number>
+}

package/src/modules/auth/auth-maintenance.test.node.ts

@@ -0,0 +1,110 @@
+import type { RecurringTaskContext } from '@byline/core'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { createAuthMaintenanceTasks } from './auth-maintenance.js'
+import type { AdminStore } from '../../store.js'
+
+let store: AdminStore
+let context: RecurringTaskContext
+const now = new Date('2026-10-16T12:00:00Z')
+beforeEach(() => {
+  store = {
+    authMaintenance: {
+      purgeAttempts: vi.fn().mockResolvedValue(0),
+      findTerminalLogin: vi.fn().mockResolvedValue(null),
+      pruneTerminalLogin: vi.fn(),
+      purgeLegacyRefreshTokens: vi.fn().mockResolvedValue(0),
+    },
+  } as unknown as AdminStore
+  store.withSessionLock = vi.fn(async (_id, work) => work(store, null))
+  context = {
+    taskName: 'test',
+    scheduledFor: now,
+    signal: new AbortController().signal,
+    heartbeat: vi.fn().mockResolvedValue(undefined),
+    logger: {},
+  } as unknown as RecurringTaskContext
+})
+afterEach(() => vi.restoreAllMocks())
+describe('bounded auth maintenance tasks', () => {
+  it('registers three one-minute leased tasks without doing any work', () => {
+    const tasks = createAuthMaintenanceTasks(store)
+    expect(tasks.map((t) => t.name)).toEqual([
+      'auth.maintenance.attempts',
+      'auth.maintenance.logins',
+      'auth.maintenance.legacy-refresh',
+    ])
+    expect(tasks.every((t) => t.intervalMs === 60_000 && t.leaseMs === 60_000)).toBe(true)
+    expect(store.authMaintenance.purgeAttempts).not.toHaveBeenCalled()
+  })
+  it('uses separate five-minute and 30-day cutoffs', async () => {
+    const tasks = createAuthMaintenanceTasks(store, () => now)
+    for (const task of tasks) expect(await task.run(context)).toEqual({ workRemaining: false })
+    expect(store.authMaintenance.purgeAttempts).toHaveBeenCalledWith(
+      new Date(now.getTime() - 300_000)
+    )
+    expect(store.authMaintenance.findTerminalLogin).toHaveBeenCalledWith(
+      new Date(now.getTime() - 30 * 86_400_000)
+    )
+    expect(store.authMaintenance.purgeLegacyRefreshTokens).toHaveBeenCalledWith(
+      new Date(now.getTime() - 30 * 86_400_000)
+    )
+  })
+  it('stops at 32 full batches and heartbeats before each', async () => {
+    vi.mocked(store.authMaintenance.purgeAttempts).mockResolvedValue(100)
+    const [task] = createAuthMaintenanceTasks(store)
+    expect(await task!.run(context)).toEqual({ workRemaining: true })
+    expect(store.authMaintenance.purgeAttempts).toHaveBeenCalledTimes(32)
+    expect(context.heartbeat).toHaveBeenCalledTimes(32)
+  })
+  it('stops when the elapsed-time budget is reached', async () => {
+    vi.spyOn(performance, 'now')
+      .mockReturnValueOnce(0)
+      .mockReturnValueOnce(0)
+      .mockReturnValue(30_000)
+    vi.mocked(store.authMaintenance.purgeAttempts).mockResolvedValue(100)
+    expect(await createAuthMaintenanceTasks(store)[0]!.run(context)).toEqual({
+      workRemaining: true,
+    })
+    expect(store.authMaintenance.purgeAttempts).toHaveBeenCalledOnce()
+  })
+  it.each(['before', 'heartbeat'])('honours abort %s batch admission', async (phase) => {
+    const abort = new AbortController()
+    context.signal = abort.signal
+    if (phase === 'before') abort.abort(new Error('stopped'))
+    else
+      vi.mocked(context.heartbeat).mockImplementation(async () => {
+        abort.abort(new Error('stopped'))
+      })
+    await expect(createAuthMaintenanceTasks(store)[0]!.run(context)).rejects.toThrow('stopped')
+    expect(store.authMaintenance.purgeAttempts).not.toHaveBeenCalled()
+  })
+  it('propagates lease loss before cleanup and repository errors to the runner', async () => {
+    vi.mocked(context.heartbeat).mockRejectedValueOnce(new Error('lease lost'))
+    await expect(createAuthMaintenanceTasks(store)[0]!.run(context)).rejects.toThrow('lease lost')
+    expect(store.authMaintenance.purgeAttempts).not.toHaveBeenCalled()
+    vi.mocked(store.authMaintenance.purgeAttempts).mockRejectedValue(
+      new Error('storage unavailable')
+    )
+    await expect(createAuthMaintenanceTasks(store)[0]!.run(context)).rejects.toThrow(
+      'storage unavailable'
+    )
+  })
+  it('uses the scoped store under the candidate account lock and rescans between batches', async () => {
+    const scoped = { authMaintenance: { pruneTerminalLogin: vi.fn() } } as unknown as AdminStore
+    vi.mocked(store.withSessionLock).mockImplementation(async (_id, work) => work(scoped, null))
+    vi.mocked(store.authMaintenance.findTerminalLogin)
+      .mockResolvedValueOnce({ id: 'login', adminUserId: 'actor' })
+      .mockResolvedValue(null)
+    expect(await createAuthMaintenanceTasks(store, () => now)[1]!.run(context)).toEqual({
+      workRemaining: false,
+    })
+    expect(store.withSessionLock).toHaveBeenCalledWith('actor', expect.any(Function))
+    expect(scoped.authMaintenance.pruneTerminalLogin).toHaveBeenCalledWith({
+      id: 'login',
+      adminUserId: 'actor',
+      before: new Date(now.getTime() - 30 * 86_400_000),
+    })
+    expect(store.authMaintenance.pruneTerminalLogin).not.toHaveBeenCalled()
+  })
+})

package/src/modules/auth/auth-maintenance.ts

@@ -0,0 +1,62 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+import type { RecurringTaskDefinition } from '@byline/core'
+
+import type { AdminStore } from '../../store.js'
+
+const DAY = 86_400_000
+
+/** Register for native sessions even on password-only sites; configuration never runs cleanup. */
+export function createAuthMaintenanceTasks(
+  store: AdminStore,
+  now: () => Date = () => new Date()
+): RecurringTaskDefinition[] {
+  const task = (
+    name: string,
+    retention: number,
+    batch: (cutoff: Date) => Promise<boolean>
+  ): RecurringTaskDefinition => ({
+    name: `auth.maintenance.${name}`,
+    intervalMs: 60_000,
+    leaseMs: 60_000,
+    async run(context) {
+      const started = performance.now()
+      const cutoff = new Date(now().getTime() - retention)
+      for (let n = 0; n < 32 && performance.now() - started < 30_000; n++) {
+        context.signal.throwIfAborted()
+        await context.heartbeat()
+        context.signal.throwIfAborted()
+        if (!(await batch(cutoff))) return { workRemaining: false }
+      }
+      return { workRemaining: true }
+    },
+  })
+  return [
+    task(
+      'attempts',
+      300_000,
+      async (cutoff) => (await store.authMaintenance.purgeAttempts(cutoff)) === 100
+    ),
+    task('logins', 30 * DAY, async (cutoff) => {
+      const candidate = await store.authMaintenance.findTerminalLogin(cutoff)
+      if (!candidate) return false
+      await store.withSessionLock(candidate.adminUserId, async (scoped) => {
+        await scoped.authMaintenance.pruneTerminalLogin({ ...candidate, before: cutoff })
+      })
+      // A candidate is not a cursor. Re-scan after each bounded transaction so
+      // a login with many refresh predecessors drains without a long-held lock.
+      return true
+    }),
+    task(
+      'legacy-refresh',
+      30 * DAY,
+      async (cutoff) => (await store.authMaintenance.purgeLegacyRefreshTokens(cutoff)) === 100
+    ),
+  ]
+}

package/src/modules/auth/components/passkey-browser.test.node.ts

@@ -0,0 +1,188 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import type {
+  PasskeyAdminServices,
+  PasskeyPageBinding,
+} from '../../../services/admin-services-types.js'
+
+const browser = vi.hoisted(() => ({
+  supported: vi.fn(),
+  authentication: vi.fn(),
+  registration: vi.fn(),
+}))
+vi.mock('@simplewebauthn/browser', () => ({
+  browserSupportsWebAuthn: browser.supported,
+  startAuthentication: browser.authentication,
+  startRegistration: browser.registration,
+}))
+
+import {
+  enrollPasskey,
+  passkeyErrorKey,
+  provePasskeyAction,
+  signInWithPasskey,
+} from './passkey-browser.js'
+
+let services: PasskeyAdminServices
+let binding: PasskeyPageBinding
+const expiresAt = () => new Date(Date.now() + 60_000).toISOString()
+beforeEach(() => {
+  vi.resetAllMocks()
+  browser.supported.mockReturnValue(true)
+  browser.authentication.mockResolvedValue({ id: 'assertion' })
+  browser.registration.mockResolvedValue({ id: 'attestation' })
+  binding = { expectedSessionId: 'login-A', assertCurrent: vi.fn() }
+  const ceremony = () => ({ ceremonyId: 'attempt', expiresAt: expiresAt(), options: {} })
+  const grant = () => ({ grantId: 'grant', expiresAt: expiresAt() })
+  services = {
+    capability: vi.fn(),
+    captureLogin: vi.fn(() => binding),
+    managementContext: vi.fn(),
+    signInOptions: vi.fn(async () => ceremony()),
+    signIn: vi.fn(),
+    passwordProof: vi.fn(async () => grant()),
+    proofOptions: vi.fn(async () => ceremony()),
+    proof: vi.fn(async () => grant()),
+    enrollmentOptions: vi.fn(async () => ceremony()),
+    enrollment: vi.fn(),
+    list: vi.fn(),
+    rename: vi.fn(),
+    remove: vi.fn(),
+  } as unknown as PasskeyAdminServices
+})
+describe('browser passkey ceremonies', () => {
+  it('does not enter the cookie-changing submission until the prompt finishes', async () => {
+    let finish!: (value: unknown) => void
+    browser.authentication.mockImplementation(
+      () =>
+        new Promise((resolve) => {
+          finish = resolve
+        })
+    )
+    const pending = signInWithPasskey(services)
+    await vi.waitFor(() => expect(browser.authentication).toHaveBeenCalledOnce())
+    expect(services.signIn).not.toHaveBeenCalled()
+    finish({ id: 'verified' })
+    await pending
+    expect(services.signIn).toHaveBeenCalledWith(
+      { data: { ceremonyId: 'attempt', response: { id: 'verified' } } },
+      expect.objectContaining({ expectedSessionId: 'login-A' })
+    )
+  })
+  it.each(['AbortError', 'NotAllowedError'])(
+    'cancellation %s does not submit or retry',
+    async (name) => {
+      browser.authentication.mockRejectedValue(Object.assign(new Error('cancelled'), { name }))
+      await expect(signInWithPasskey(services)).rejects.toThrow('cancelled')
+      expect(services.signInOptions).toHaveBeenCalledOnce()
+      expect(services.signIn).not.toHaveBeenCalled()
+    }
+  )
+  it('rejects a login switch during the authenticator prompt', async () => {
+    browser.authentication.mockImplementation(async () => {
+      vi.mocked(binding.assertCurrent).mockImplementation(() => {
+        throw new Error('session changed')
+      })
+      return { id: 'other-account' }
+    })
+    await expect(signInWithPasskey(services)).rejects.toThrow('session changed')
+    expect(services.signIn).not.toHaveBeenCalled()
+  })
+  it('abandons a completed prompt when the sign-in page has unmounted', async () => {
+    let active = true
+    browser.authentication.mockImplementation(async () => {
+      active = false
+      return {}
+    })
+    await expect(signInWithPasskey(services, () => active)).rejects.toThrow('page closed')
+    expect(services.signIn).not.toHaveBeenCalled()
+  })
+  it('does not open a device prompt for an expired challenge', async () => {
+    vi.mocked(services.signInOptions).mockResolvedValue({
+      ceremonyId: 'expired',
+      expiresAt: new Date(0).toISOString(),
+      options: {} as any,
+    })
+    await expect(signInWithPasskey(services)).rejects.toMatchObject({ code: 'ERR_INVALID_TOKEN' })
+    expect(browser.authentication).not.toHaveBeenCalled()
+  })
+  it('binds password proof and enrollment to the page login, without email input', async () => {
+    await enrollPasskey(services, binding, 'Laptop', 'password')
+    expect(services.passwordProof).toHaveBeenCalledWith({
+      data: { expectedSessionId: 'login-A', action: { purpose: 'enroll' }, password: 'password' },
+    })
+    expect(services.enrollmentOptions).toHaveBeenCalledWith({
+      data: { expectedSessionId: 'login-A', grantId: 'grant' },
+    })
+    expect(services.enrollment).toHaveBeenCalledWith({
+      data: {
+        expectedSessionId: 'login-A',
+        ceremonyId: 'attempt',
+        response: { id: 'attestation' },
+        name: 'Laptop',
+      },
+    })
+  })
+  it('does not enroll after a login change during registration', async () => {
+    browser.registration.mockImplementation(async () => {
+      vi.mocked(binding.assertCurrent).mockImplementation(() => {
+        throw new Error('session changed')
+      })
+      return { id: 'attestation' }
+    })
+    await expect(enrollPasskey(services, binding, 'Laptop', 'password')).rejects.toThrow(
+      'session changed'
+    )
+    expect(services.enrollment).not.toHaveBeenCalled()
+  })
+  it('passes a scoped removal action and never accepts a wrong-account proof', async () => {
+    const action = {
+      purpose: 'remove' as const,
+      targetUserId: 'target',
+      credentialRecordId: 'record',
+    }
+    vi.mocked(services.proof).mockRejectedValue(
+      Object.assign(new Error('wrong account'), { code: 'ERR_INVALID_CREDENTIALS' })
+    )
+    await expect(provePasskeyAction(services, binding, action)).rejects.toThrow('wrong account')
+    expect(services.proofOptions).toHaveBeenCalledWith({
+      data: { expectedSessionId: 'login-A', action },
+    })
+    expect(services.remove).not.toHaveBeenCalled()
+    expect(services.proof).toHaveBeenCalledOnce()
+  })
+  it('does not retry ambiguous enrollment completion', async () => {
+    vi.mocked(services.enrollment).mockRejectedValue(new Error('connection lost'))
+    await expect(enrollPasskey(services, binding, 'Laptop', 'password')).rejects.toThrow(
+      'connection lost'
+    )
+    expect(services.enrollment).toHaveBeenCalledOnce()
+    expect(services.enrollmentOptions).toHaveBeenCalledOnce()
+  })
+  it('keeps password proof available without WebAuthn support', async () => {
+    browser.supported.mockReturnValue(false)
+    await expect(
+      provePasskeyAction(
+        services,
+        binding,
+        { purpose: 'remove', targetUserId: 'target', credentialRecordId: 'key' },
+        'password'
+      )
+    ).resolves.toMatchObject({ grantId: 'grant' })
+    await expect(signInWithPasskey(services)).rejects.toMatchObject({ code: 'PASSKEY_UNSUPPORTED' })
+  })
+  it.each([
+    [{ code: 'ERR_INVALID_TOKEN' }, 'expired'],
+    [{ code: 'ERR_SESSION_CHANGED' }, 'sessionChanged'],
+    [{ code: 'ERR_INVALID_CREDENTIALS' }, 'proof'],
+    [{ code: 'ERROR_AUTHENTICATOR_MISSING_DISCOVERABLE_CREDENTIAL_SUPPORT' }, 'unsupported'],
+    [{ code: 'ERROR_AUTHENTICATOR_GENERAL_ERROR' }, 'device'],
+    [
+      { code: 'ERROR_PASSTHROUGH_SEE_CAUSE_PROPERTY', cause: { name: 'NotAllowedError' } },
+      'cancelled',
+    ],
+    [{ status: 429 }, 'rateLimited'],
+  ])('maps bounded public error %j to usable copy', (error, key) => {
+    expect(passkeyErrorKey(error)).toBe(`passkeys.errors.${key}`)
+  })
+})

package/src/modules/auth/components/passkey-browser.ts

@@ -0,0 +1,139 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+import type { PasskeyManagementAction } from '@byline/auth'
+import {
+  browserSupportsWebAuthn,
+  type PublicKeyCredentialCreationOptionsJSON,
+  type PublicKeyCredentialRequestOptionsJSON,
+  startAuthentication,
+  startRegistration,
+} from '@simplewebauthn/browser'
+
+import type {
+  PasskeyAdminServices,
+  PasskeyPageBinding,
+} from '../../../services/admin-services-types.js'
+
+function ready(binding: PasskeyPageBinding, expiresAt?: string) {
+  binding.assertCurrent()
+  if (expiresAt && Date.parse(expiresAt) <= Date.now())
+    throw Object.assign(new Error('Expired ceremony'), { code: 'ERR_INVALID_TOKEN' })
+}
+function supported() {
+  if (!browserSupportsWebAuthn())
+    throw Object.assign(new Error('WebAuthn unavailable'), { code: 'PASSKEY_UNSUPPORTED' })
+}
+export async function signInWithPasskey(
+  services: PasskeyAdminServices,
+  isActive: () => boolean = () => true
+) {
+  supported()
+  const captured = services.captureLogin(true)
+  const binding = {
+    ...captured,
+    assertCurrent: () => {
+      if (!isActive()) throw new Error('Sign-in page closed')
+      captured.assertCurrent()
+    },
+  }
+  const ceremony = await services.signInOptions({ data: {} })
+  ready(binding, ceremony.expiresAt)
+  const response = await startAuthentication({
+    optionsJSON: ceremony.options as PublicKeyCredentialRequestOptionsJSON,
+  })
+  ready(binding, ceremony.expiresAt)
+  return services.signIn({ data: { ceremonyId: ceremony.ceremonyId, response } }, binding)
+}
+
+export async function provePasskeyAction(
+  services: PasskeyAdminServices,
+  binding: PasskeyPageBinding,
+  action: PasskeyManagementAction,
+  password?: string
+) {
+  ready(binding)
+  const expectedSessionId = binding.expectedSessionId
+  if (!expectedSessionId)
+    throw Object.assign(new Error('Login changed'), { code: 'ERR_SESSION_CHANGED' })
+  if (password !== undefined) {
+    const grant = await services.passwordProof({ data: { expectedSessionId, action, password } })
+    ready(binding, grant.expiresAt)
+    return grant
+  }
+  supported()
+  const ceremony = await services.proofOptions({ data: { expectedSessionId, action } })
+  ready(binding, ceremony.expiresAt)
+  const response = await startAuthentication({
+    optionsJSON: ceremony.options as PublicKeyCredentialRequestOptionsJSON,
+  })
+  ready(binding, ceremony.expiresAt)
+  const grant = await services.proof({
+    data: { expectedSessionId, ceremonyId: ceremony.ceremonyId, response },
+  })
+  ready(binding, grant.expiresAt)
+  return grant
+}
+
+export async function enrollPasskey(
+  services: PasskeyAdminServices,
+  binding: PasskeyPageBinding,
+  name: string,
+  password?: string
+) {
+  supported()
+  const grant = await provePasskeyAction(services, binding, { purpose: 'enroll' }, password)
+  const expectedSessionId = binding.expectedSessionId!
+  const ceremony = await services.enrollmentOptions({
+    data: { expectedSessionId, grantId: grant.grantId },
+  })
+  ready(binding, ceremony.expiresAt)
+  const response = await startRegistration({
+    optionsJSON: ceremony.options as PublicKeyCredentialCreationOptionsJSON,
+  })
+  ready(binding, ceremony.expiresAt)
+  return services.enrollment({
+    data: { expectedSessionId, ceremonyId: ceremony.ceremonyId, response, name },
+  })
+}
+
+/** Render fixed translated messages, never provider payloads or authenticator identifiers. */
+export function passkeyErrorKey(error: unknown): string {
+  const value = error as {
+    code?: string
+    name?: string
+    cause?: { name?: string }
+    status?: number
+  } | null
+  const name = value?.cause?.name ?? value?.name
+  if (
+    name === 'AbortError' ||
+    name === 'NotAllowedError' ||
+    value?.code === 'ERROR_CEREMONY_ABORTED'
+  )
+    return 'passkeys.errors.cancelled'
+  if (
+    name === 'ConstraintError' ||
+    name === 'NotSupportedError' ||
+    value?.code === 'PASSKEY_UNSUPPORTED' ||
+    value?.code?.startsWith('ERROR_AUTHENTICATOR_MISSING_') ||
+    value?.code === 'ERROR_AUTHENTICATOR_NO_SUPPORTED_PUBKEYCREDPARAMS_ALG'
+  )
+    return 'passkeys.errors.unsupported'
+  if (name === 'UnknownError' || value?.code === 'ERROR_AUTHENTICATOR_GENERAL_ERROR')
+    return 'passkeys.errors.device'
+  if (value?.code === 'ERROR_AUTHENTICATOR_PREVIOUSLY_REGISTERED')
+    return 'passkeys.errors.duplicate'
+  if (value?.code === 'ERR_INVALID_TOKEN') return 'passkeys.errors.expired'
+  if (value?.code === 'ERR_SESSION_CHANGED') return 'passkeys.errors.sessionChanged'
+  if (value?.code === 'ERR_PASSKEY_LIMIT') return 'passkeys.errors.limit'
+  if (value?.code === 'ERR_FORBIDDEN') return 'passkeys.errors.forbidden'
+  if (value?.code === 'ERR_INVALID_CREDENTIALS') return 'passkeys.errors.proof'
+  if (value?.status === 429) return 'passkeys.errors.rateLimited'
+  return 'passkeys.errors.unavailable'
+}

package/src/modules/auth/components/passkey-manager.module.css

@@ -0,0 +1,100 @@
+.manager {
+  padding: 1.25rem;
+  border: 1px solid var(--border-color, #8885);
+  border-radius: 0.5rem;
+}
+.list {
+  list-style: none;
+  padding: 0;
+  margin: 1rem 0;
+}
+.empty + .add {
+  margin-top: 0.25rem;
+}
+.row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+  padding: 0.75rem 0;
+  border-bottom: 1px solid var(--border-color, #8885);
+  overflow-wrap: anywhere;
+}
+.row p {
+  font-size: 0.875rem;
+  margin: 0.25rem 0;
+}
+.actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+}
+
+/*
+ * Add and rename open in a drawer, matching the other account and user edit
+ * panels; remove opens a modal, matching other destructive confirmations.
+ * Both share the action row below: below 40rem the actions stack full-width
+ * (touch-sized), with the primary action on top and Cancel last. From 40rem
+ * the small action buttons sit in one right-aligned row, which fits every
+ * bundled locale. The modal is capped at 540px, and the drawer is 540px from
+ * 48rem (40px wider than the account drawers) so the three proof actions fit
+ * one row in French.
+ */
+.modal {
+  width: calc(100% - 2 * var(--spacing-8));
+  max-width: 540px;
+  margin-bottom: var(--spacing-8);
+}
+.drawer-body {
+  padding: var(--spacing-8);
+}
+.drawer-form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-16);
+  padding-top: var(--spacing-8);
+}
+.drawer-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: var(--spacing-12);
+  margin-top: var(--spacing-8);
+}
+.drawer-skip {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+.modal-actions {
+  flex-direction: column-reverse;
+  align-items: stretch;
+}
+@media (max-width: 39.99rem) {
+  .modal-actions > * {
+    min-height: 2.5rem;
+  }
+}
+@media (min-width: 40rem) {
+  .modal {
+    width: 100%;
+    margin-bottom: 0;
+  }
+  .modal-actions {
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--spacing-8);
+  }
+}
+@media (min-width: 48rem) {
+  .drawer {
+    width: 540px;
+  }
+}