diff --git a/web-next/app/[locale]/trans-history/page.tsx b/web-next/app/[locale]/trans-history/page.tsx
new file mode 100644
index 0000000..4a729b1
--- /dev/null
+++ b/web-next/app/[locale]/trans-history/page.tsx
@@ -0,0 +1,144 @@
+import type { Metadata } from 'next'
+import { setRequestLocale } from 'next-intl/server'
+import { redirect } from '@/i18n/navigation'
+import { getSession } from '@/lib/session'
+import { getPaymentTransactions, type PaymentTx } from '@/lib/trans-history'
+import { PageShell } from '@/components/PageShell'
+import { ServiceBox } from '@/components/ServiceBox'
+
+export const dynamic = 'force-dynamic'
+
+export const metadata: Metadata = { title: 'Historial de transacciones' }
+
+/** Fecha en formato DD-MM-YYYY HH:MM:SS. */
+function fmt(d: Date): string {
+  const p = (n: number) => String(n).padStart(2, '0')
+  return `${p(d.getDate())}-${p(d.getMonth() + 1)}-${d.getFullYear()} ${p(d.getHours())}:${p(d.getMinutes())}:${p(d.getSeconds())}`
+}
+
+function StatusBadge({ status }: { status: PaymentTx['status'] }) {
+  return <span className={status === 'PAID' ? 'green-info2' : 'yellow-info'}>{status}</span>
+}
+
+/** Caja de una pasarela con su tabla de transacciones (o "No hay movimientos"). */
+function PlatformBox({
+  name,
+  logo,
+  note,
+  txs,
+}: {
+  name: string
+  logo: string
+  note: string
+  txs: PaymentTx[]
+}) {
+  return (
+    <div className="box-content">
+      <div className="title-box-content">
+        <h2>
+          <img src={logo} alt={name} title={name} style={{ height: '22px', verticalAlign: 'middle', marginRight: '6px' }} /> {name}
+        </h2>
+      </div>
+      <div className="body-box-content">
+        <p>
+          Recibirás los PD correspondientes a cada transacción sólo cuando esté aprobada y el estado sea{' '}
+          <span className="green-info2">PAID</span> (Pagado).
+        </p>
+        <br />
+        <p>
+          <span className="red-info2">Importante:</span> {note}
+        </p>
+        <br />
+        {txs.length === 0 ? (
+          <table className="max-center-table-aligned">
+            <tbody>
+              <tr>
+                <td>
+                  <span>No hay movimientos</span>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        ) : (
+          <table className="max-center-table-aligned">
+            <tbody>
+              <tr>
+                <th>ID de transacción</th>
+                <th>Estado</th>
+                <th className="responsive-td">Concepto</th>
+                <th>Fecha creación</th>
+                <th>Cantidad</th>
+              </tr>
+              {txs.map((t) => (
+                <tr key={t.id}>
+                  <td className="long-td">
+                    <span>{t.id}</span>
+                  </td>
+                  <td>
+                    <StatusBadge status={t.status} />
+                  </td>
+                  <td className="responsive-td">
+                    <span>{t.concept}</span>
+                  </td>
+                  <td>
+                    <span>{fmt(t.createdAt)}</span>
+                  </td>
+                  <td>
+                    <span>{t.amount.toFixed(2)} €</span>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        )}
+      </div>
+    </div>
+  )
+}
+
+const LOGO_BASE = '/nw-themes/nw-ryu/nw-images/nw-logos'
+
+export default async function TransHistoryPage({ params }: { params: Promise<{ locale: string }> }) {
+  const { locale } = await params
+  setRequestLocale(locale)
+
+  const session = await getSession()
+  if (!session.bnetId) redirect({ href: '/login', locale })
+  if (!session.username) redirect({ href: '/select-account', locale })
+
+  const txs = await getPaymentTransactions(session.accountId!)
+  const stripe = txs.filter((t) => t.platform === 'Stripe')
+  const sumup = txs.filter((t) => t.platform === 'SumUp')
+
+  return (
+    <PageShell title="Historial de transacciones">
+      <ServiceBox>
+        <br />
+        <p>Aquí verás la información que recibimos de nuestras diferentes plataformas de pago automáticas.</p>
+        <br />
+        <p>¿Has tenido algún problema con alguna transacción?</p>
+        <p>
+          Si has tenido un problema con una de las transacciones o no has recibido tus PD, puedes contactarnos en
+          nuestro Discord o a través del correo{' '}
+          <a href="mailto:contacto@ultimowow.com">contacto@ultimowow.com</a>.
+        </p>
+      </ServiceBox>
+      <br />
+      <PlatformBox
+        name="Stripe"
+        logo={`${LOGO_BASE}/stripe-p-logo.svg`}
+        note="Los pagos con tarjeta se aprueban normalmente en unos segundos."
+        txs={stripe}
+      />
+      <br />
+      <hr />
+      <br />
+      <PlatformBox
+        name="SumUp"
+        logo={`${LOGO_BASE}/sumup-p-logo.svg`}
+        note="SumUp puede tardar unos minutos en confirmar el pago tras completar el checkout."
+        txs={sumup}
+      />
+    </PageShell>
+  )
+}
diff --git a/web-next/lib/trans-history.ts b/web-next/lib/trans-history.ts
new file mode 100644
index 0000000..297f2f1
--- /dev/null
+++ b/web-next/lib/trans-history.ts
@@ -0,0 +1,38 @@
+import type { RowDataPacket } from 'mysql2'
+import { db, DB } from './db'
+
+/** Una transacción de pago (Stripe o SumUp) registrada en home_stripelog. */
+export interface PaymentTx {
+  id: string // referencia de la pasarela (session_id / checkout_reference)
+  platform: 'Stripe' | 'SumUp'
+  status: 'PAID' | 'PENDING'
+  createdAt: Date
+  amount: number // importe en €
+  concept: string
+}
+
+/**
+ * Transacciones de pago de una cuenta desde `home_stripelog`, limitadas a las
+ * dos pasarelas activas: **Stripe** (mode test/live) y **SumUp** (mode sumup).
+ * `fulfilled` 1 -> PAID (pagado y entregado), 0 -> PENDING. Orden por fecha desc.
+ */
+export async function getPaymentTransactions(accountId: number, limit = 200): Promise<PaymentTx[]> {
+  if (!accountId) return []
+  try {
+    const [rows] = await db(DB.default).query<RowDataPacket[]>(
+      "SELECT session_id, product_name, amount, mode, fulfilled, timestamp FROM home_stripelog " +
+        "WHERE account_id = ? AND mode IN ('sumup', 'test', 'live') ORDER BY timestamp DESC LIMIT ?",
+      [accountId, limit],
+    )
+    return rows.map((r) => ({
+      id: String(r.session_id || ''),
+      platform: r.mode === 'sumup' ? 'SumUp' : 'Stripe',
+      status: r.fulfilled ? 'PAID' : 'PENDING',
+      createdAt: new Date(r.timestamp),
+      amount: Number(r.amount),
+      concept: String(r.product_name || '—'),
+    }))
+  } catch {
+    return []
+  }
+}