diff --git a/src/lib/api/attestation.ts b/src/lib/api/attestation.ts
new file mode 100644
index 0000000..18097d9
--- /dev/null
+++ b/src/lib/api/attestation.ts
@@ -0,0 +1,55 @@
+import { createApiClient } from './client';
+
+// --- Types (P26 v2 attestation publique) ---
+
+export interface AttestationValid {
+	valid: true;
+	challenger: {
+		username: string;
+		display_name: string;
+		avatar_url: string | null;
+	};
+	validator: {
+		username: string;
+		display_name: string;
+		avatar_url: string | null;
+	};
+	pr_url: string;
+	repo: string;
+	domain: string;
+	difficulty: number;
+	validated_at: string;
+	merged_upstream: boolean;
+}
+
+export interface AttestationInvalid {
+	valid: false;
+	reason: 'malformed attestation hash' | 'unknown attestation hash' | string;
+}
+
+export type AttestationResponse = AttestationValid | AttestationInvalid;
+
+// SKI-115 endpoint hors /api (public verify)
+const publicApi = createApiClient(fetch, '');
+
+export const attestationApi = {
+	// GET /verify/{hash} — retourne le JSON attestation
+	verify(hash: string) {
+		return publicApi.get<AttestationResponse>(`/verify/${encodeURIComponent(hash)}`);
+	},
+
+	// URL directe du PDF (deep link, pas de fetch cote front)
+	pdfUrl(hash: string): string {
+		return `/verify/${encodeURIComponent(hash)}.pdf`;
+	},
+
+	// SKI-116 badge user SVG (URL directe)
+	badgeUserUrl(username: string): string {
+		return `/badge/user/${encodeURIComponent(username)}/validated.svg`;
+	},
+
+	// SKI-117 badge repo SVG (URL directe)
+	badgeRepoUrl(owner: string, name: string): string {
+		return `/badge/repo/${encodeURIComponent(owner)}/${encodeURIComponent(name)}/validated.svg`;
+	}
+};
diff --git a/src/lib/api/maintainerDigest.ts b/src/lib/api/maintainerDigest.ts
new file mode 100644
index 0000000..2d843e3
--- /dev/null
+++ b/src/lib/api/maintainerDigest.ts
@@ -0,0 +1,51 @@
+import type { ApiResponse } from '$lib/types';
+import { createApiClient } from './client';
+
+// SKI-120 endpoints hors /api (opt-in public)
+const publicApi = createApiClient(fetch, '');
+
+// --- Types ---
+
+export interface SubscribePayload {
+	github_login: string;
+	email: string;
+	repos: string[];
+}
+
+export interface SubscribeResponse {
+	pending: boolean;
+	message: string;
+}
+
+export interface ConfirmResponse {
+	confirmed: boolean;
+	email: string;
+}
+
+export interface UnsubscribeResponse {
+	unsubscribed: boolean;
+	email: string;
+}
+
+// --- API ---
+
+export const maintainerDigestApi = {
+	subscribe(payload: SubscribePayload) {
+		return publicApi.post<ApiResponse<SubscribeResponse>>(
+			'/maintainer-digest/subscribe',
+			payload
+		);
+	},
+
+	confirm(token: string) {
+		return publicApi.get<ApiResponse<ConfirmResponse>>(
+			`/maintainer-digest/confirm/${encodeURIComponent(token)}`
+		);
+	},
+
+	unsubscribe(token: string) {
+		return publicApi.get<ApiResponse<UnsubscribeResponse>>(
+			`/maintainer-digest/unsubscribe/${encodeURIComponent(token)}`
+		);
+	}
+};
diff --git a/src/lib/api/slices.ts b/src/lib/api/slices.ts
new file mode 100644
index 0000000..2c8d87c
--- /dev/null
+++ b/src/lib/api/slices.ts
@@ -0,0 +1,152 @@
+import type { ApiResponse } from '$lib/types';
+import { createApiClient } from './client';
+
+const api = createApiClient();
+
+// --- Types (P26 v2 workflow challenge) ---
+
+export type SliceStatus =
+	| 'open'
+	| 'claimed'
+	| 'in_progress'
+	| 'submitted'
+	| 'ci_green'
+	| 'pending_validation'
+	| 'validated'
+	| 'merged'
+	| 'closed'
+	| 'expired';
+
+export interface SliceExternalMetadata {
+	issue_url?: string;
+	issue_number?: number;
+	repo_owner?: string;
+	repo_name?: string;
+}
+
+export interface Slice {
+	id: string;
+	title: string;
+	description: string;
+	acceptance_criteria: string[];
+	labels: string[];
+	difficulty: number;
+	status: SliceStatus;
+	min_rank: string | null;
+	required_orientation_slugs: string[] | null;
+	external_metadata: SliceExternalMetadata | null;
+	fork_repo_url: string | null;
+	submitted_pr_url: string | null;
+	attestation_hash: string | null;
+	announced_at: string | null;
+	validation_reject_reason: string | null;
+	claimed_by_user_id: string | null;
+	claim_expires_at: string | null;
+	validator_user_id: string | null;
+	project_id: string;
+	project_slug: string;
+	created_at: string;
+	updated_at: string;
+}
+
+export interface ActiveSkilluver {
+	user_id: string;
+	username: string;
+	display_name: string;
+	avatar_url: string | null;
+}
+
+export interface ActiveSkilluversResponse {
+	count: number;
+	users: ActiveSkilluver[];
+}
+
+export interface DiaryEntry {
+	id: string;
+	slice_id: string;
+	author_user_id: string;
+	author_username: string;
+	author_display_name: string;
+	author_avatar_url: string | null;
+	body_markdown: string;
+	is_public: boolean;
+	created_at: string;
+}
+
+export interface DiaryPostPayload {
+	body_markdown: string;
+	is_public: boolean;
+}
+
+export interface SubmitPrPayload {
+	pr_url: string;
+	announce_publicly: boolean;
+}
+
+export interface SlicesListParams {
+	status?: SliceStatus;
+	project_id?: string;
+	page?: number;
+	per_page?: number;
+}
+
+// --- API ---
+
+export const slicesApi = {
+	list(params?: SlicesListParams) {
+		return api.get<ApiResponse<{ slices: Slice[]; page: number; per_page: number }>>(
+			'/slices',
+			params as Record<string, string | number>
+		);
+	},
+
+	get(id: string) {
+		return api.get<ApiResponse<Slice>>(`/slices/${id}`);
+	},
+
+	claim(id: string) {
+		return api.post<ApiResponse<{ claimed: boolean; fork_repo_url: string | null }>>(
+			`/slices/${id}/claim`
+		);
+	},
+
+	unclaim(id: string) {
+		return api.post<ApiResponse<{ unclaimed: boolean }>>(`/slices/${id}/unclaim`);
+	},
+
+	submitPr(id: string, payload: SubmitPrPayload) {
+		return api.post<ApiResponse<{ submitted: boolean }>>(`/slices/${id}/submit-pr`, payload);
+	},
+
+	// SKI-122 widget "Active Skilluvers on this repo"
+	activeSkilluvers(projectSlug: string, days = 30) {
+		return api.get<ApiResponse<ActiveSkilluversResponse>>(
+			`/projects/${encodeURIComponent(projectSlug)}/active-skilluvers`,
+			{ days }
+		);
+	},
+
+	// SKI-123 challenger diary
+	diary(sliceId: string) {
+		return api.get<ApiResponse<{ entries: DiaryEntry[] }>>(`/slices/${sliceId}/diary`);
+	},
+
+	postDiaryEntry(sliceId: string, payload: DiaryPostPayload) {
+		return api.post<ApiResponse<DiaryEntry>>(`/slices/${sliceId}/diary`, payload);
+	},
+
+	// SKI-121 feed reco challenges
+	feedRecommended(limit = 20) {
+		return api.get<
+			ApiResponse<{ slices: Slice[]; meta?: { user_rank_ord?: number; median_difficulty?: number } }>
+		>('/me/feed/challenges', { limit });
+	},
+
+	// Mes challenges
+	mySlices(params?: { status?: SliceStatus; page?: number; per_page?: number }) {
+		return api.get<ApiResponse<{ slices: Slice[]; page: number; per_page: number }>>(
+			'/users/me/slices',
+			params as Record<string, string | number>
+		);
+	}
+};
diff --git a/src/lib/api/validation.ts b/src/lib/api/validation.ts
new file mode 100644
index 0000000..37877b9
--- /dev/null
+++ b/src/lib/api/validation.ts
@@ -0,0 +1,59 @@
+import type { ApiResponse } from '$lib/types';
+import { createApiClient } from './client';
+import type { Slice } from './slices';
+
+const api = createApiClient();
+
+// --- Types (P26 v2 validator workflow) ---
+
+export interface ValidationQueueItem {
+	slice: Slice;
+	repo_url: string;
+	pr_url: string;
+	claimer_username: string;
+	claimer_display_name: string;
+	claimer_avatar_url: string | null;
+	picked_up_by_me: boolean;
+	picked_up_at: string | null;
+}
+
+export interface ValidationApproveResponse {
+	attestation_hash: string;
+	pdf_url: string;
+	fragments_credited: number;
+}
+
+export interface ValidationRejectPayload {
+	reason: string;
+}
+
+// --- API ---
+
+export const validationApi = {
+	// SKI-86 filter queue par caps validator du user
+	queue() {
+		return api.get<ApiResponse<{ items: ValidationQueueItem[] }>>('/me/validation/queue');
+	},
+
+	// SKI-83 premier volontaire gagne
+	pickup(sliceId: string) {
+		return api.post<ApiResponse<{ picked_up: boolean }>>(
+			`/slices/${sliceId}/validation/pickup`
+		);
+	},
+
+	// SKI-84 approve -> attestation + fragments
+	approve(sliceId: string) {
+		return api.post<ApiResponse<ValidationApproveResponse>>(
+			`/slices/${sliceId}/validation/approve`
+		);
+	},
+
+	// SKI-85 reject avec raison
+	reject(sliceId: string, payload: ValidationRejectPayload) {
+		return api.post<ApiResponse<{ rejected: boolean }>>(
+			`/slices/${sliceId}/validation/reject`,
+			payload
+		);
+	}
+};
diff --git a/src/lib/api/validatorApplications.ts b/src/lib/api/validatorApplications.ts
new file mode 100644
index 0000000..996c376
--- /dev/null
+++ b/src/lib/api/validatorApplications.ts
@@ -0,0 +1,82 @@
+import type { ApiResponse } from '$lib/types';
+import { createApiClient } from './client';
+
+const api = createApiClient();
+
+// --- Types (P26 v2 candidature validateur) ---
+
+export type ValidatorDomain =
+	| 'code'
+	| 'design'
+	| 'game'
+	| 'security'
+	| 'ops'
+	| 'ai'
+	| 'soft_skills';
+
+export type ValidatorApplicationStatus =
+	| 'pending'
+	| 'accepted'
+	| 'rejected'
+	| 'withdrawn';
+
+export type ValidatorApplicationOrigin = 'user_apply' | 'admin_invite';
+
+export interface ValidatorApplication {
+	id: string;
+	domain: ValidatorDomain;
+	origin: ValidatorApplicationOrigin;
+	status: ValidatorApplicationStatus;
+	motivation: string | null;
+	admin_notes: string | null;
+	reviewer_admin_id: string | null;
+	created_at: string;
+	updated_at: string;
+}
+
+// Renseignes par le back via GET /users/me/stats pour la preview seuils.
+export interface ValidatorEligibilityStats {
+	rank: string;
+	merged_prs_by_domain: Record<ValidatorDomain, number>;
+	repos_covered_by_domain: Record<ValidatorDomain, number>;
+	tenure_days: number;
+}
+
+// Seuils exposes par SKI-81 pour affichage cote front.
+export const VALIDATOR_MIN_RANK = 'artisan';
+export const VALIDATOR_MIN_MERGED_PRS = 10;
+export const VALIDATOR_MIN_REPOS_COVERED = 3;
+export const VALIDATOR_MIN_TENURE_DAYS = 90;
+
+// --- API ---
+
+export const validatorApplicationsApi = {
+	// SKI-81 candidature user
+	apply(payload: { domain: ValidatorDomain; motivation?: string }) {
+		return api.post<ApiResponse<{ application_id: string }>>(
+			'/me/apply-as-validator',
+			payload
+		);
+	},
+
+	// SKI-81 liste des candidatures/invitations du user
+	list() {
+		return api.get<ApiResponse<{ applications: ValidatorApplication[] }>>(
+			'/me/validator-applications'
+		);
+	},
+
+	// SKI-82 invitee-side accept
+	accept(applicationId: string) {
+		return api.post<ApiResponse<{ accepted: boolean }>>(
+			`/validator-applications/${applicationId}/accept`
+		);
+	},
+
+	// SKI-82 withdraw / decline
+	withdraw(applicationId: string) {
+		return api.post<ApiResponse<{ withdrawn: boolean }>>(
+			`/validator-applications/${applicationId}/withdraw`
+		);
+	}
+};
diff --git a/src/lib/components/profile/BadgesSection.svelte b/src/lib/components/profile/BadgesSection.svelte
new file mode 100644
index 0000000..c49599d
--- /dev/null
+++ b/src/lib/components/profile/BadgesSection.svelte
@@ -0,0 +1,185 @@
+<script lang="ts">
+	// SKI-104 — Section "Badges Skilluv" sur la page profil.
+	// Affiche le badge personnel de l'utilisateur (SVG) + snippets Markdown/HTML
+	// a coller dans un README, un CV ou LinkedIn. Si `ownedProjects` est fourni
+	// et que le viewer est le proprietaire du profil, affiche aussi les badges
+	// des repos qu'il maintient.
+	import { attestationApi } from '$api/attestation';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import { Copy } from '@lucide/svelte';
+
+	interface OwnedProject {
+		slug: string;
+		github_repo_owner: string;
+		github_repo_name: string;
+		name: string;
+	}
+
+	interface Props {
+		username: string;
+		isOwner?: boolean;
+		ownedProjects?: OwnedProject[];
+	}
+
+	let { username, isOwner = false, ownedProjects }: Props = $props();
+
+	// Base publique (deep-link stable pour les snippets a coller ailleurs).
+	const BASE = 'https://skill-uv.com';
+
+	let badgeUserSrc = $derived(attestationApi.badgeUserUrl(username));
+	let badgeUserFailed = $state(false);
+
+	let userMarkdown = $derived(
+		`[![Skilluv](${BASE}/badge/user/${username}/validated.svg)](${BASE}/profile/${username})`
+	);
+	let userHtml = $derived(
+		`<a href="${BASE}/profile/${username}"><img src="${BASE}/badge/user/${username}/validated.svg" alt="Skilluv" /></a>`
+	);
+
+	function repoMarkdown(owner: string, name: string): string {
+		return `[![Skilluv](${BASE}/badge/repo/${owner}/${name}/validated.svg)](${BASE}/for-maintainers)`;
+	}
+	function repoHtml(owner: string, name: string): string {
+		return `<a href="${BASE}/for-maintainers"><img src="${BASE}/badge/repo/${owner}/${name}/validated.svg" alt="Skilluv" /></a>`;
+	}
+
+	async function copyToClipboard(text: string): Promise<boolean> {
+		try {
+			await navigator.clipboard.writeText(text);
+			return true;
+		} catch {
+			try {
+				const ta = document.createElement('textarea');
+				ta.value = text;
+				ta.style.position = 'fixed';
+				ta.style.opacity = '0';
+				document.body.appendChild(ta);
+				ta.select();
+				const ok = document.execCommand('copy');
+				document.body.removeChild(ta);
+				return ok;
+			} catch {
+				return false;
+			}
+		}
+	}
+
+	async function handleCopy(text: string) {
+		const ok = await copyToClipboard(text);
+		if (ok) toast.success('Copie');
+		else toast.error('Impossible de copier');
+	}
+</script>
+
+<section
+	class="rounded-xl border border-border bg-surface-elevated overflow-hidden"
+	data-testid="profile-badges-section"
+	aria-label="Badges Skilluv"
+>
+	<div class="px-5 py-3 border-b border-border">
+		<span class="text-xs font-bold uppercase tracking-wider text-text-muted">Badges Skilluv</span>
+	</div>
+
+	<div class="p-5 space-y-6">
+		<!-- Section 1 : badge personnel -->
+		<div>
+			<h2 class="font-heading text-lg font-semibold mb-1">Badge Skilluv</h2>
+			<p class="text-xs text-text-muted mb-4">
+				Colle ce badge dans ton profil GitHub, ton CV ou LinkedIn pour montrer ta communaute Skilluv.
+			</p>
+
+			<div class="mb-4 flex items-center justify-center rounded-lg border border-border bg-surface-overlay p-4">
+				{#if badgeUserFailed}
+					<span class="text-xs text-text-muted">Badge pas encore genere</span>
+				{:else}
+					<img
+						src={badgeUserSrc}
+						alt="Skilluv badge {username}"
+						class="h-8"
+						onerror={() => (badgeUserFailed = true)}
+					/>
+				{/if}
+			</div>
+
+			<!-- Markdown snippet -->
+			<div class="mb-3">
+				<div class="flex items-center justify-between mb-1">
+					<span class="text-xs font-semibold uppercase tracking-wider text-text-muted">Markdown</span>
+					<Button variant="ghost" size="sm" onclick={() => handleCopy(userMarkdown)}>
+						<Copy size={12} strokeWidth={2} />
+						Copier
+					</Button>
+				</div>
+				<pre class="bg-surface-overlay rounded-xl p-3 overflow-x-auto text-xs"><code>{userMarkdown}</code></pre>
+			</div>
+
+			<!-- HTML snippet -->
+			<div>
+				<div class="flex items-center justify-between mb-1">
+					<span class="text-xs font-semibold uppercase tracking-wider text-text-muted">HTML</span>
+					<Button variant="ghost" size="sm" onclick={() => handleCopy(userHtml)}>
+						<Copy size={12} strokeWidth={2} />
+						Copier
+					</Button>
+				</div>
+				<pre class="bg-surface-overlay rounded-xl p-3 overflow-x-auto text-xs"><code>{userHtml}</code></pre>
+			</div>
+		</div>
+
+		<!-- Section 2 : badges des repos maintenus (owner uniquement) -->
+		{#if isOwner && ownedProjects && ownedProjects.length > 0}
+			<div class="pt-6 border-t border-border">
+				<h2 class="font-heading text-lg font-semibold mb-1">Badges Skilluv pour tes repos</h2>
+				<p class="text-xs text-text-muted mb-4">
+					Ajoute ces badges au README de tes repos pour montrer la communaute Skilluv active.
+				</p>
+
+				<div class="space-y-6">
+					{#each ownedProjects as project (project.slug)}
+						{@const md = repoMarkdown(project.github_repo_owner, project.github_repo_name)}
+						{@const html = repoHtml(project.github_repo_owner, project.github_repo_name)}
+						<div>
+							<h3 class="text-sm font-semibold mb-2">
+								{project.name}
+								<span class="text-text-muted font-mono font-normal">
+									— {project.github_repo_owner}/{project.github_repo_name}
+								</span>
+							</h3>
+
+							<div class="mb-3 flex items-center justify-center rounded-lg border border-border bg-surface-overlay p-4">
+								<img
+									src={attestationApi.badgeRepoUrl(project.github_repo_owner, project.github_repo_name)}
+									alt="Skilluv badge {project.github_repo_owner}/{project.github_repo_name}"
+									class="h-8"
+								/>
+							</div>
+
+							<div class="mb-3">
+								<div class="flex items-center justify-between mb-1">
+									<span class="text-xs font-semibold uppercase tracking-wider text-text-muted">Markdown</span>
+									<Button variant="ghost" size="sm" onclick={() => handleCopy(md)}>
+										<Copy size={12} strokeWidth={2} />
+										Copier
+									</Button>
+								</div>
+								<pre class="bg-surface-overlay rounded-xl p-3 overflow-x-auto text-xs"><code>{md}</code></pre>
+							</div>
+
+							<div>
+								<div class="flex items-center justify-between mb-1">
+									<span class="text-xs font-semibold uppercase tracking-wider text-text-muted">HTML</span>
+									<Button variant="ghost" size="sm" onclick={() => handleCopy(html)}>
+										<Copy size={12} strokeWidth={2} />
+										Copier
+									</Button>
+								</div>
+								<pre class="bg-surface-overlay rounded-xl p-3 overflow-x-auto text-xs"><code>{html}</code></pre>
+							</div>
+						</div>
+					{/each}
+				</div>
+			</div>
+		{/if}
+	</div>
+</section>
diff --git a/src/lib/components/slice/ActiveSkilluversWidget.svelte b/src/lib/components/slice/ActiveSkilluversWidget.svelte
new file mode 100644
index 0000000..47df6ec
--- /dev/null
+++ b/src/lib/components/slice/ActiveSkilluversWidget.svelte
@@ -0,0 +1,78 @@
+<script lang="ts">
+	import { slicesApi, type ActiveSkilluver } from '$api/slices';
+	import { SkilluError } from '$api/client';
+	import Skeleton from '$components/ui/Skeleton.svelte';
+
+	interface Props {
+		projectSlug: string;
+	}
+
+	let { projectSlug }: Props = $props();
+
+	let loading = $state(true);
+	let error = $state('');
+	let count = $state(0);
+	let users = $state<ActiveSkilluver[]>([]);
+
+	$effect(() => {
+		void projectSlug;
+		load();
+	});
+
+	async function load() {
+		loading = true;
+		error = '';
+		try {
+			const res = await slicesApi.activeSkilluvers(projectSlug, 30);
+			count = res.data.count;
+			users = res.data.users;
+		} catch (err) {
+			error = err instanceof SkilluError ? err.message : 'Erreur';
+		} finally {
+			loading = false;
+		}
+	}
+
+	function initials(name: string): string {
+		return name
+			.split(/\s+/)
+			.map((p) => p[0]?.toUpperCase() ?? '')
+			.join('')
+			.slice(0, 2);
+	}
+</script>
+
+<div class="rounded-2xl border border-border bg-surface-elevated p-4">
+	<h3 class="text-sm font-semibold text-text-primary mb-3">Actifs cette semaine</h3>
+	{#if loading}
+		<Skeleton class="h-10 w-full" rounded="lg" />
+	{:else if error}
+		<p class="text-xs text-text-muted">{error}</p>
+	{:else if count === 0}
+		<p class="text-xs text-text-muted">Aucun Skilluver actif recemment.</p>
+	{:else}
+		<p class="text-sm text-text-primary mb-3">
+			<span class="font-semibold">{count}</span> Skilluver{count > 1 ? 's' : ''} actif{count > 1 ? 's' : ''}
+		</p>
+		<div class="flex -space-x-2">
+			{#each users.slice(0, 5) as u (u.user_id)}
+				<a
+					href={`/profile/${u.username}`}
+					class="relative inline-flex h-9 w-9 items-center justify-center rounded-full border-2 border-surface-elevated bg-surface-overlay text-xs font-semibold text-text-primary hover:z-10 hover:scale-105 transition-transform overflow-hidden"
+					title={u.display_name}
+				>
+					{#if u.avatar_url}
+						<img src={u.avatar_url} alt={u.display_name} class="h-full w-full object-cover" />
+					{:else}
+						{initials(u.display_name || u.username)}
+					{/if}
+				</a>
+			{/each}
+			{#if count > 5}
+				<span class="relative inline-flex h-9 w-9 items-center justify-center rounded-full border-2 border-surface-elevated bg-surface-overlay text-xs font-semibold text-text-muted">
+					+{count - 5}
+				</span>
+			{/if}
+		</div>
+	{/if}
+</div>
diff --git a/src/lib/components/slice/DiaryWidget.svelte b/src/lib/components/slice/DiaryWidget.svelte
new file mode 100644
index 0000000..63560dd
--- /dev/null
+++ b/src/lib/components/slice/DiaryWidget.svelte
@@ -0,0 +1,150 @@
+<script lang="ts">
+	import { slicesApi, type DiaryEntry } from '$api/slices';
+	import { SkilluError } from '$api/client';
+	import { toast } from '$stores/toast.svelte';
+	import Skeleton from '$components/ui/Skeleton.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+
+	interface Props {
+		sliceId: string;
+		canPost: boolean;
+	}
+
+	let { sliceId, canPost }: Props = $props();
+
+	let loading = $state(true);
+	let entries = $state<DiaryEntry[]>([]);
+	let error = $state('');
+
+	let body = $state('');
+	let isPublic = $state(true);
+	let posting = $state(false);
+
+	$effect(() => {
+		void sliceId;
+		load();
+	});
+
+	async function load() {
+		loading = true;
+		error = '';
+		try {
+			const res = await slicesApi.diary(sliceId);
+			entries = res.data.entries;
+		} catch (err) {
+			error = err instanceof SkilluError ? err.message : 'Erreur';
+		} finally {
+			loading = false;
+		}
+	}
+
+	async function submit(e: Event) {
+		e.preventDefault();
+		if (!body.trim() || posting) return;
+		posting = true;
+		try {
+			const res = await slicesApi.postDiaryEntry(sliceId, {
+				body_markdown: body,
+				is_public: isPublic
+			});
+			entries = [res.data, ...entries];
+			body = '';
+			toast.success('Entree publiee');
+		} catch (err) {
+			toast.error(err instanceof SkilluError ? err.message : 'Publication impossible');
+		} finally {
+			posting = false;
+		}
+	}
+
+	function fmtDate(iso: string): string {
+		try {
+			return new Date(iso).toLocaleDateString('fr-FR', {
+				day: 'numeric',
+				month: 'short',
+				hour: '2-digit',
+				minute: '2-digit'
+			});
+		} catch {
+			return iso;
+		}
+	}
+
+	function initials(name: string): string {
+		return name.split(/\s+/).map((p) => p[0]?.toUpperCase() ?? '').join('').slice(0, 2);
+	}
+</script>
+
+<section class="rounded-2xl border border-border bg-surface-elevated p-5">
+	<h2 class="text-lg font-semibold text-text-primary mb-4">Carnet de bord</h2>
+
+	{#if canPost}
+		<form onsubmit={submit} class="mb-6 space-y-3">
+			<textarea
+				bind:value={body}
+				rows="3"
+				placeholder="Ou en es-tu ? Blocages, decouvertes, prochaine etape..."
+				class="w-full rounded-xl border border-border bg-surface px-4 py-3 text-sm text-text-primary placeholder:text-text-muted focus:border-primary focus:ring-1 focus:ring-primary resize-y"
+			></textarea>
+			<div class="flex items-center justify-between gap-3 flex-wrap">
+				<label class="inline-flex items-center gap-2 text-xs text-text-muted cursor-pointer">
+					<input type="checkbox" bind:checked={isPublic} class="rounded border-border" />
+					<span>Public (visible par tous)</span>
+				</label>
+				<Button
+					type="submit"
+					variant="primary"
+					size="sm"
+					disabled={!body.trim() || posting}
+					loading={posting}
+				>
+					Publier
+				</Button>
+			</div>
+		</form>
+	{/if}
+
+	{#if loading}
+		<div class="space-y-3">
+			<Skeleton class="h-16 w-full" rounded="xl" />
+			<Skeleton class="h-16 w-full" rounded="xl" />
+		</div>
+	{:else if error}
+		<p class="text-sm text-text-muted">{error}</p>
+	{:else if entries.length === 0}
+		<p class="text-sm text-text-muted">Aucune entree pour l'instant.</p>
+	{:else}
+		<ul class="space-y-4">
+			{#each entries as e (e.id)}
+				<li class="rounded-xl border border-border/60 bg-surface p-4">
+					<div class="flex items-center justify-between gap-3 mb-2">
+						<div class="flex items-center gap-2 min-w-0">
+							<span
+								class="inline-flex h-7 w-7 items-center justify-center rounded-full bg-surface-overlay text-[10px] font-semibold text-text-primary overflow-hidden shrink-0"
+							>
+								{#if e.author_avatar_url}
+									<img src={e.author_avatar_url} alt={e.author_display_name} class="h-full w-full object-cover" />
+								{:else}
+									{initials(e.author_display_name || e.author_username)}
+								{/if}
+							</span>
+							<a href={`/profile/${e.author_username}`} class="text-sm font-medium text-text-primary hover:text-accent truncate">
+								{e.author_display_name || e.author_username}
+							</a>
+							<span class="text-xs text-text-muted shrink-0">{fmtDate(e.created_at)}</span>
+						</div>
+						{#if e.is_public}
+							<Badge variant="default">Public</Badge>
+						{:else}
+							<Badge variant="warning">Prive</Badge>
+						{/if}
+					</div>
+					<div class="text-sm text-text-primary whitespace-pre-wrap leading-relaxed">
+						{e.body_markdown}
+					</div>
+				</li>
+			{/each}
+		</ul>
+	{/if}
+</section>
diff --git a/src/lib/components/ui/Button.svelte b/src/lib/components/ui/Button.svelte
index c55e245..62337de 100644
--- a/src/lib/components/ui/Button.svelte
+++ b/src/lib/components/ui/Button.svelte
@@ -7,6 +7,10 @@
 		size?: 'sm' | 'md' | 'lg';
 		loading?: boolean;
 		href?: string;
+		/** Anchor-only pass-through attributes (active when `href` is set) */
+		target?: HTMLAnchorAttributes['target'];
+		rel?: HTMLAnchorAttributes['rel'];
+		download?: HTMLAnchorAttributes['download'];
 		children: Snippet;
 	}
 
diff --git a/src/lib/types/index.ts b/src/lib/types/index.ts
index 0ed6876..152e535 100644
--- a/src/lib/types/index.ts
+++ b/src/lib/types/index.ts
@@ -53,7 +53,24 @@ export type NotificationType =
 	| 'rank_promotion'
 	| 'badge_earned'
 	| 'team_slot_match'
-	| 'payout_status_change';
+	| 'payout_status_change'
+	// SKI-97 — evenements workflow challenge (16 nouveaux types).
+	| 'slice_claimed'
+	| 'slice_fork_created'
+	| 'slice_pr_submitted'
+	| 'slice_pr_submitted_announced'
+	| 'slice_ci_green'
+	| 'validation_picked_up_by_you'
+	| 'validation_picked_up_by_other'
+	| 'slice_validated'
+	| 'slice_rejected'
+	| 'slice_merged_upstream'
+	| 'slice_pr_rejected_upstream'
+	| 'validator_application_status_changed'
+	| 'validator_invitation_received'
+	| 'slice_upstream_closed'
+	| 'maintainer_digest_confirmation_sent'
+	| 'maintainer_digest_subscribed';
 
 /** Capabilities P18.4 — sources de permissions user (mentor, curator, etc.). */
 export type Capability =
diff --git a/src/routes/dashboard/slices/+page.svelte b/src/routes/dashboard/slices/+page.svelte
new file mode 100644
index 0000000..c21e7c4
--- /dev/null
+++ b/src/routes/dashboard/slices/+page.svelte
@@ -0,0 +1,235 @@
+<script lang="ts">
+	import { goto } from '$app/navigation';
+	import { slicesApi, type Slice, type SliceStatus } from '$api/slices';
+	import { SkilluError } from '$api/client';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import EmptyState from '$components/ui/EmptyState.svelte';
+	import SegmentedControl from '$components/ui/SegmentedControl.svelte';
+	import Pagination from '$components/ui/Pagination.svelte';
+
+	interface Props {
+		data: {
+			mine: Slice[];
+			mineError: string | null;
+			reco: Slice[];
+			recoMeta: { user_rank_ord?: number; median_difficulty?: number } | null;
+			recoError: string | null;
+		};
+	}
+
+	let { data }: Props = $props();
+
+	const STATUS_LABEL: Record<SliceStatus, string> = {
+		open: 'Ouvert',
+		claimed: 'Reserve',
+		in_progress: 'En cours',
+		submitted: 'PR soumise',
+		ci_green: 'CI verte',
+		pending_validation: 'En validation',
+		validated: 'Validee',
+		merged: 'Merge upstream',
+		closed: 'Ferme',
+		expired: 'Expire'
+	};
+
+	const STATUS_VARIANT: Record<SliceStatus, 'default' | 'primary' | 'accent' | 'success' | 'warning' | 'error'> = {
+		open: 'primary',
+		claimed: 'accent',
+		in_progress: 'warning',
+		submitted: 'accent',
+		ci_green: 'success',
+		pending_validation: 'accent',
+		validated: 'success',
+		merged: 'success',
+		closed: 'default',
+		expired: 'error'
+	};
+
+	type Tab = 'active' | 'done' | 'archived';
+	const ACTIVE: SliceStatus[] = ['claimed', 'in_progress', 'submitted', 'ci_green', 'pending_validation'];
+	const DONE: SliceStatus[] = ['validated', 'merged'];
+	const ARCHIVED: SliceStatus[] = ['expired', 'closed'];
+
+	let tab = $state<Tab>('active');
+	let page = $state(1);
+	const perPage = 12;
+
+	let filtered = $derived.by(() => {
+		const set = tab === 'active' ? ACTIVE : tab === 'done' ? DONE : ARCHIVED;
+		return data.mine.filter((s) => set.includes(s.status));
+	});
+	let totalPages = $derived(Math.max(1, Math.ceil(filtered.length / perPage)));
+	let pageItems = $derived(filtered.slice((page - 1) * perPage, page * perPage));
+
+	$effect(() => {
+		void tab;
+		page = 1;
+	});
+
+	let recoRef: HTMLElement | null = $state(null);
+	function scrollToReco() {
+		recoRef?.scrollIntoView({ behavior: 'smooth', block: 'start' });
+	}
+
+	// --- Claim from reco ---
+	let claimingId = $state<string | null>(null);
+	async function quickClaim(s: Slice) {
+		claimingId = s.id;
+		try {
+			await slicesApi.claim(s.id);
+			toast.success('Challenge reserve');
+			await goto(`/slices/${s.id}`);
+		} catch (err) {
+			if (err instanceof SkilluError && err.status === 403) {
+				toast.warning('Ton rank ou orientation ne correspond pas encore.');
+			} else {
+				toast.error(err instanceof SkilluError ? err.message : 'Reservation impossible');
+			}
+		} finally {
+			claimingId = null;
+		}
+	}
+
+	function daysLeft(iso: string | null): string | null {
+		if (!iso) return null;
+		const diff = new Date(iso).getTime() - Date.now();
+		if (diff <= 0) return 'Expire';
+		return `Reste ${Math.ceil(diff / 86400000)}j`;
+	}
+
+	const tabs = [
+		{ value: 'active' as const, label: 'Actifs' },
+		{ value: 'done' as const, label: 'Completes' },
+		{ value: 'archived' as const, label: 'Archives' }
+	];
+</script>
+
+<svelte:head>
+	<title>Mes challenges — Skilluv</title>
+</svelte:head>
+
+<div class="mx-auto max-w-6xl px-4 py-8">
+	<!-- Section 1 : Mes challenges -->
+	<section class="mb-16">
+		<div class="mb-6 flex flex-wrap items-end justify-between gap-4">
+			<div>
+				<h1 class="font-heading text-3xl sm:text-4xl font-bold text-text-primary tracking-tight">
+					Mes challenges
+				</h1>
+				<p class="mt-2 text-sm text-text-muted">
+					Tes contributions en cours, terminees ou archivees.
+				</p>
+			</div>
+			<SegmentedControl items={tabs} bind:value={tab} />
+		</div>
+
+		{#if data.mineError}
+			<div class="rounded-xl border border-error/30 bg-error/10 p-6 text-center">
+				<p class="text-sm text-error">{data.mineError}</p>
+			</div>
+		{:else if filtered.length === 0}
+			{#if tab === 'active'}
+				<EmptyState
+					variant="scroll"
+					title="Aucun challenge en cours"
+					body="Decouvre les challenges recommandes pour toi ci-dessous."
+				>
+					{#snippet action()}
+						<Button variant="accent" onclick={scrollToReco}>Voir les recommandations</Button>
+					{/snippet}
+				</EmptyState>
+			{:else if tab === 'done'}
+				<EmptyState variant="seal-intact" title="Aucune contribution validee pour le moment" />
+			{:else}
+				<EmptyState variant="bookmark" title="Rien ici" />
+			{/if}
+		{:else}
+			<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+				{#each pageItems as s (s.id)}
+					<article class="rounded-2xl border border-border bg-surface-elevated p-5 flex flex-col gap-3 hover:border-accent/40 transition-colors">
+						<div class="flex flex-wrap items-center gap-2">
+							<Badge variant={STATUS_VARIANT[s.status]}>{STATUS_LABEL[s.status]}</Badge>
+							<Badge variant="default">difficulte {s.difficulty}/5</Badge>
+							{#if s.claim_expires_at && (s.status === 'claimed' || s.status === 'in_progress')}
+								{@const dl = daysLeft(s.claim_expires_at)}
+								{#if dl}<Badge variant="warning">{dl}</Badge>{/if}
+							{/if}
+						</div>
+						<h3 class="font-heading text-lg font-semibold text-text-primary line-clamp-2">
+							{s.title}
+						</h3>
+						<p class="text-sm text-text-muted line-clamp-2 flex-1">{s.description}</p>
+						<div class="pt-2">
+							<Button variant="ghost" size="sm" href={`/slices/${s.id}`}>Voir</Button>
+						</div>
+					</article>
+				{/each}
+			</div>
+
+			<Pagination current={page} total={totalPages} onchange={(p) => (page = p)} />
+		{/if}
+	</section>
+
+	<!-- Section 2 : Recommandes -->
+	<section bind:this={recoRef}>
+		<div class="mb-6">
+			<h2 class="font-heading text-2xl sm:text-3xl font-bold text-text-primary tracking-tight">
+				Recommandes pour toi
+			</h2>
+			{#if data.recoMeta}
+				<p class="mt-2 text-sm text-text-muted">
+					Base sur ton rank
+					{#if data.recoMeta.user_rank_ord != null}
+						(<span class="font-mono">{data.recoMeta.user_rank_ord}</span>)
+					{/if}
+					{#if data.recoMeta.median_difficulty != null}
+						et tes derniers challenges (difficulty mediane :
+						<span class="font-mono">{data.recoMeta.median_difficulty}/5</span>)
+					{/if}
+				</p>
+			{/if}
+		</div>
+
+		{#if data.recoError}
+			<div class="rounded-xl border border-error/30 bg-error/10 p-6 text-center">
+				<p class="text-sm text-error">{data.recoError}</p>
+			</div>
+		{:else if data.reco.length === 0}
+			<EmptyState
+				variant="search"
+				title="Aucune recommandation pour l'instant"
+				body="Ton rank et tes orientations determinent les slices proposees."
+			/>
+		{:else}
+			<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+				{#each data.reco as s (s.id)}
+					<article class="rounded-2xl border border-border bg-surface-elevated p-5 flex flex-col gap-3 hover:border-accent/40 transition-colors">
+						<div class="flex flex-wrap items-center gap-2">
+							<Badge variant={STATUS_VARIANT[s.status]}>{STATUS_LABEL[s.status]}</Badge>
+							<Badge variant="default">difficulte {s.difficulty}/5</Badge>
+							{#if s.min_rank}<Badge variant="default">rank {s.min_rank}</Badge>{/if}
+						</div>
+						<h3 class="font-heading text-lg font-semibold text-text-primary line-clamp-2">
+							{s.title}
+						</h3>
+						<p class="text-sm text-text-muted line-clamp-2 flex-1">{s.description}</p>
+						<div class="flex gap-2 pt-2">
+							<Button
+								variant="primary"
+								size="sm"
+								loading={claimingId === s.id}
+								disabled={claimingId !== null}
+								onclick={() => quickClaim(s)}
+							>
+								Claim
+							</Button>
+							<Button variant="ghost" size="sm" href={`/slices/${s.id}`}>Detail</Button>
+						</div>
+					</article>
+				{/each}
+			</div>
+		{/if}
+	</section>
+</div>
diff --git a/src/routes/dashboard/slices/+page.ts b/src/routes/dashboard/slices/+page.ts
new file mode 100644
index 0000000..d2aad84
--- /dev/null
+++ b/src/routes/dashboard/slices/+page.ts
@@ -0,0 +1,23 @@
+import { slicesApi, type Slice } from '$api/slices';
+import { SkilluError } from '$api/client';
+import type { PageLoad } from './$types';
+
+export const load: PageLoad = async () => {
+	const [mineRes, recoRes] = await Promise.allSettled([
+		slicesApi.mySlices({ per_page: 100 }),
+		slicesApi.feedRecommended(20)
+	]);
+
+	const mine: Slice[] = mineRes.status === 'fulfilled' ? mineRes.value.data.slices : [];
+	const mineError = mineRes.status === 'rejected'
+		? mineRes.reason instanceof SkilluError ? mineRes.reason.message : 'Erreur de chargement'
+		: null;
+
+	const reco: Slice[] = recoRes.status === 'fulfilled' ? recoRes.value.data.slices : [];
+	const recoMeta = recoRes.status === 'fulfilled' ? recoRes.value.data.meta ?? null : null;
+	const recoError = recoRes.status === 'rejected'
+		? recoRes.reason instanceof SkilluError ? recoRes.reason.message : 'Erreur de chargement'
+		: null;
+
+	return { mine, mineError, reco, recoMeta, recoError };
+};
diff --git a/src/routes/for-maintainers/+page.svelte b/src/routes/for-maintainers/+page.svelte
new file mode 100644
index 0000000..c5d6d3b
--- /dev/null
+++ b/src/routes/for-maintainers/+page.svelte
@@ -0,0 +1,318 @@
+<script lang="ts">
+	import { maintainerDigestApi } from '$api/maintainerDigest';
+	import { attestationApi } from '$api/attestation';
+	import { SkilluError } from '$api/client';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Input from '$components/ui/Input.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import { Check, Copy, Mail, ShieldCheck, Users } from '@lucide/svelte';
+
+	// Form state
+	let githubLogin = $state('');
+	let email = $state('');
+	let reposText = $state('');
+	let optIn = $state(true);
+
+	let submitting = $state(false);
+	let submitError = $state<string | null>(null);
+	let submitSuccess = $state<{ email: string } | null>(null);
+
+	// FAQ toggle
+	let openFaq = $state<number | null>(0);
+	function toggleFaq(i: number) {
+		openFaq = openFaq === i ? null : i;
+	}
+
+	// Snippet markdown pour le badge repo (placeholder generique)
+	const sampleOwner = 'skilluv';
+	const sampleRepo = 'skilluv-backend';
+	const badgeUrl = attestationApi.badgeRepoUrl(sampleOwner, sampleRepo);
+	const badgeMarkdown = `[![Skilluv validated](${badgeUrl})](https://skill-uv.com/for-maintainers)`;
+
+	async function copyBadge() {
+		try {
+			await navigator.clipboard.writeText(badgeMarkdown);
+			toast.success('Snippet copie');
+		} catch {
+			window.prompt('Copiez ce snippet :', badgeMarkdown);
+		}
+	}
+
+	function parseRepos(text: string): { valid: string[]; invalid: string[] } {
+		const items = text
+			.split(',')
+			.map((s) => s.trim())
+			.filter(Boolean);
+		const valid: string[] = [];
+		const invalid: string[] = [];
+		const re = /^[a-zA-Z0-9._-]+\/[a-zA-Z0-9._-]+$/;
+		for (const it of items) {
+			if (re.test(it)) valid.push(it);
+			else invalid.push(it);
+		}
+		return { valid, invalid };
+	}
+
+	async function handleSubmit(e: SubmitEvent) {
+		e.preventDefault();
+		submitError = null;
+
+		if (!/^[a-zA-Z0-9-]+$/.test(githubLogin.trim())) {
+			submitError = 'Login GitHub invalide.';
+			return;
+		}
+		if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email.trim())) {
+			submitError = 'Email invalide.';
+			return;
+		}
+		const { valid, invalid } = parseRepos(reposText);
+		if (valid.length === 0) {
+			submitError = 'Renseignez au moins un repo au format owner/name.';
+			return;
+		}
+		if (invalid.length > 0) {
+			submitError = `Format invalide pour : ${invalid.join(', ')}`;
+			return;
+		}
+		if (valid.length > 50) {
+			submitError = 'Maximum 50 repos.';
+			return;
+		}
+		if (!optIn) {
+			submitError = 'Vous devez accepter de recevoir le digest.';
+			return;
+		}
+
+		submitting = true;
+		try {
+			await maintainerDigestApi.subscribe({
+				github_login: githubLogin.trim(),
+				email: email.trim(),
+				repos: valid
+			});
+			submitSuccess = { email: email.trim() };
+		} catch (err) {
+			submitError =
+				err instanceof SkilluError ? err.message : 'Une erreur est survenue.';
+		} finally {
+			submitting = false;
+		}
+	}
+
+	const faqs: Array<{ q: string; a: string }> = [
+		{
+			q: 'Comment Skilluv sait sur quels repos je bosse ?',
+			a: 'Vous les listez a l’inscription. Vous pouvez modifier votre liste a tout moment.'
+		},
+		{
+			q: 'Puis-je m’abonner sans avoir de repo Skilluv-labelise ?',
+			a: 'Oui — le digest sera vide en attendant que vous ajoutiez le label skilluv-challenge sur vos issues.'
+		},
+		{
+			q: 'Comment se desabonner ?',
+			a: 'Un lien dans chaque email, ou l’URL /maintainer-digest/unsubscribe/{token} recue a l’inscription.'
+		}
+	];
+</script>
+
+<svelte:head>
+	<title>Skilluv — Digest hebdo pour maintainers OSS</title>
+	<meta
+		name="description"
+		content="Recevez chaque semaine un resume des contributions Skilluv sur vos repos open-source. Zero spam, unsubscribe en un clic."
+	/>
+	<meta property="og:title" content="Skilluv — Digest hebdo pour maintainers OSS" />
+	<meta
+		property="og:description"
+		content="Un email hebdomadaire, les contributions Skilluv sur vos repos. Zero spam."
+	/>
+	<meta property="og:type" content="website" />
+	<meta name="twitter:card" content="summary_large_image" />
+</svelte:head>
+
+<div class="mx-auto max-w-3xl px-4 py-10 sm:py-16 space-y-16">
+	<!-- Header -->
+	<header class="space-y-4 text-center sm:text-left">
+		<h1 class="font-heading text-3xl sm:text-5xl text-text-primary leading-tight">
+			Vos contributeurs Skilluv, resumes une fois par semaine
+		</h1>
+		<p class="text-lg text-text-muted">
+			Un digest hebdo, zero spam, unsubscribe en un clic.
+		</p>
+	</header>
+
+	<!-- Ce que fait Skilluv -->
+	<section class="space-y-4">
+		<h2 class="font-heading text-2xl text-text-primary">Ce que fait Skilluv</h2>
+		<ul class="space-y-3">
+			<li class="flex gap-3">
+				<Users class="text-primary shrink-0 mt-0.5" size={20} />
+				<span class="text-text-primary">
+					Notre communaute (afro-francophone, autodidactes, reconvertis) contribue a des OSS
+					externes.
+				</span>
+			</li>
+			<li class="flex gap-3">
+				<Check class="text-primary shrink-0 mt-0.5" size={20} />
+				<span class="text-text-primary">
+					Sur les issues que vous labellisez <code class="font-mono text-sm text-accent"
+						>skilluv-challenge</code
+					> (ou celles publiques comme <code class="font-mono text-sm text-accent"
+						>good first issue</code
+					>).
+				</span>
+			</li>
+			<li class="flex gap-3">
+				<ShieldCheck class="text-primary shrink-0 mt-0.5" size={20} />
+				<span class="text-text-primary">
+					On valide leur travail avant merge — la validation Skilluv est un pre-filtre qualite.
+				</span>
+			</li>
+		</ul>
+	</section>
+
+	<!-- Ce que vous recevez -->
+	<section class="space-y-4">
+		<h2 class="font-heading text-2xl text-text-primary">Ce que vous recevez</h2>
+		<ul class="space-y-3">
+			<li class="flex gap-3">
+				<Mail class="text-accent shrink-0 mt-0.5" size={20} />
+				<span class="text-text-primary">
+					Digest hebdomadaire des PRs Skilluv sur vos repos (nb claims, PRs submit, PRs
+					validated).
+				</span>
+			</li>
+			<li class="flex gap-3">
+				<Check class="text-accent shrink-0 mt-0.5" size={20} />
+				<span class="text-text-primary">
+					Zero spam : un email/semaine, avec unsubscribe en 1 clic.
+				</span>
+			</li>
+			<li class="flex gap-3">
+				<ShieldCheck class="text-accent shrink-0 mt-0.5" size={20} />
+				<span class="text-text-primary">
+					Confidentialite : votre email n’est jamais partage.
+				</span>
+			</li>
+		</ul>
+	</section>
+
+	<!-- Badge -->
+	<section class="space-y-4">
+		<div class="flex flex-wrap items-center gap-3">
+			<h2 class="font-heading text-2xl text-text-primary">Notre badge Skilluv</h2>
+			<Badge variant="accent">nouveau</Badge>
+		</div>
+		<p class="text-text-muted">
+			Ajoutez ce badge a votre README pour signaler que votre projet accueille les contributions
+			Skilluv.
+		</p>
+		<div class="rounded-2xl bg-surface-elevated p-6 space-y-4">
+			<div class="flex justify-center">
+				<img src={badgeUrl} alt="Badge Skilluv validated" class="h-8" />
+			</div>
+			<div class="relative">
+				<pre
+					class="overflow-x-auto rounded-xl bg-surface-overlay p-4 text-xs font-mono text-text-primary"><code
+						>{badgeMarkdown}</code
+					></pre>
+				<button
+					type="button"
+					onclick={copyBadge}
+					class="absolute top-2 right-2 inline-flex items-center gap-1.5 rounded-lg bg-primary text-primary-fg px-3 py-1.5 text-xs font-semibold hover:bg-primary-hover"
+					aria-label="Copier le snippet"
+				>
+					<Copy size={14} />
+					Copier
+				</button>
+			</div>
+		</div>
+	</section>
+
+	<!-- FAQ -->
+	<section class="space-y-4">
+		<h2 class="font-heading text-2xl text-text-primary">FAQ</h2>
+		<div class="space-y-2">
+			{#each faqs as faq, i}
+				<div class="rounded-xl border border-border bg-surface-elevated">
+					<button
+						type="button"
+						class="flex w-full items-center justify-between gap-4 px-4 py-3 text-left font-medium text-text-primary hover:bg-surface-overlay/50 transition-colors"
+						onclick={() => toggleFaq(i)}
+						aria-expanded={openFaq === i}
+					>
+						<span>{faq.q}</span>
+						<span class="text-text-muted text-lg leading-none">{openFaq === i ? '-' : '+'}</span>
+					</button>
+					{#if openFaq === i}
+						<div class="px-4 pb-4 text-text-muted">{faq.a}</div>
+					{/if}
+				</div>
+			{/each}
+		</div>
+	</section>
+
+	<!-- Form subscribe -->
+	<section class="space-y-4">
+		<h2 class="font-heading text-2xl text-text-primary">S’abonner</h2>
+		{#if submitSuccess}
+			<div
+				class="rounded-2xl border border-success/30 bg-success/10 p-6 space-y-3"
+				role="status"
+			>
+				<div class="flex items-center gap-2 text-success font-semibold">
+					<Check size={20} />
+					Confirmation demandee
+				</div>
+				<p class="text-text-primary">
+					Email de confirmation envoye a <span class="font-mono">{submitSuccess.email}</span>.
+					Cliquez sur le lien dans l’email pour activer votre abonnement.
+				</p>
+			</div>
+		{:else}
+			<form
+				class="rounded-2xl bg-surface-elevated p-6 space-y-4"
+				onsubmit={handleSubmit}
+				novalidate
+			>
+				<Input
+					label="Login GitHub"
+					bind:value={githubLogin}
+					required
+					autocomplete="username"
+					placeholder="ex. torvalds"
+				/>
+				<Input
+					label="Email"
+					type="email"
+					bind:value={email}
+					required
+					autocomplete="email"
+					placeholder="you@example.com"
+				/>
+				<Input
+					label="Repos"
+					hint="Format : owner/name — separer par virgules (max 50)"
+					bind:value={reposText}
+					placeholder="skilluv/skilluv-backend, skilluv/skilluv-frontend"
+					required
+				/>
+				<label class="flex items-start gap-2 text-sm text-text-primary">
+					<input
+						type="checkbox"
+						bind:checked={optIn}
+						class="mt-0.5 h-4 w-4 rounded border-border accent-primary"
+					/>
+					<span>J’accepte de recevoir le digest hebdomadaire.</span>
+				</label>
+				{#if submitError}
+					<p class="text-sm text-error" role="alert">{submitError}</p>
+				{/if}
+				<Button variant="primary" type="submit" loading={submitting}>
+					Recevoir le digest hebdomadaire
+				</Button>
+			</form>
+		{/if}
+	</section>
+</div>
diff --git a/src/routes/maintainer-digest/confirm/[token]/+page.svelte b/src/routes/maintainer-digest/confirm/[token]/+page.svelte
new file mode 100644
index 0000000..27927b1
--- /dev/null
+++ b/src/routes/maintainer-digest/confirm/[token]/+page.svelte
@@ -0,0 +1,64 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { page } from '$app/stores';
+	import { maintainerDigestApi } from '$api/maintainerDigest';
+	import { SkilluError } from '$api/client';
+	import Button from '$components/ui/Button.svelte';
+	import { CheckCircle2, XCircle, Loader2 } from '@lucide/svelte';
+
+	let state = $state<
+		| { status: 'loading' }
+		| { status: 'success'; email: string }
+		| { status: 'error'; message: string }
+	>({ status: 'loading' });
+
+	onMount(async () => {
+		const token = $page.params.token ?? '';
+		try {
+			const res = await maintainerDigestApi.confirm(token);
+			if (res.data.confirmed) {
+				state = { status: 'success', email: res.data.email };
+			} else {
+				state = { status: 'error', message: 'Confirmation echouee.' };
+			}
+		} catch (err) {
+			state = {
+				status: 'error',
+				message:
+					err instanceof SkilluError
+						? err.message
+						: 'Ce lien de confirmation est invalide ou expire.'
+			};
+		}
+	});
+</script>
+
+<svelte:head>
+	<title>Confirmation abonnement — Skilluv</title>
+	<meta name="robots" content="noindex" />
+</svelte:head>
+
+<div class="mx-auto max-w-lg px-4 py-16">
+	<div class="rounded-2xl bg-surface-elevated p-8 text-center space-y-4">
+		{#if state.status === 'loading'}
+			<Loader2 class="mx-auto animate-spin text-primary" size={40} />
+			<p class="text-text-muted">Confirmation en cours...</p>
+		{:else if state.status === 'success'}
+			<CheckCircle2 class="mx-auto text-success" size={48} />
+			<h1 class="font-heading text-2xl text-text-primary">
+				Abonnement confirme pour {state.email}. Merci !
+			</h1>
+			<p class="text-text-muted">
+				Vous recevrez votre premier digest hebdomadaire prochainement.
+			</p>
+			<Button variant="primary" href="/">Retour a l’accueil</Button>
+		{:else}
+			<XCircle class="mx-auto text-error" size={48} />
+			<h1 class="font-heading text-2xl text-text-primary">
+				Ce lien de confirmation est invalide ou expire.
+			</h1>
+			<p class="text-text-muted">{state.message}</p>
+			<Button variant="primary" href="/for-maintainers">S’abonner a nouveau</Button>
+		{/if}
+	</div>
+</div>
diff --git a/src/routes/maintainer-digest/unsubscribe/[token]/+page.svelte b/src/routes/maintainer-digest/unsubscribe/[token]/+page.svelte
new file mode 100644
index 0000000..33cb172
--- /dev/null
+++ b/src/routes/maintainer-digest/unsubscribe/[token]/+page.svelte
@@ -0,0 +1,61 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { page } from '$app/stores';
+	import { maintainerDigestApi } from '$api/maintainerDigest';
+	import { SkilluError } from '$api/client';
+	import Button from '$components/ui/Button.svelte';
+	import { CheckCircle2, XCircle, Loader2 } from '@lucide/svelte';
+
+	let state = $state<
+		| { status: 'loading' }
+		| { status: 'success'; email: string }
+		| { status: 'error'; message: string }
+	>({ status: 'loading' });
+
+	onMount(async () => {
+		const token = $page.params.token ?? '';
+		try {
+			const res = await maintainerDigestApi.unsubscribe(token);
+			if (res.data.unsubscribed) {
+				state = { status: 'success', email: res.data.email };
+			} else {
+				state = { status: 'error', message: 'Desabonnement echoue.' };
+			}
+		} catch (err) {
+			state = {
+				status: 'error',
+				message: err instanceof SkilluError ? err.message : 'Ce lien est invalide.'
+			};
+		}
+	});
+</script>
+
+<svelte:head>
+	<title>Desabonnement — Skilluv</title>
+	<meta name="robots" content="noindex" />
+</svelte:head>
+
+<div class="mx-auto max-w-lg px-4 py-16">
+	<div class="rounded-2xl bg-surface-elevated p-8 text-center space-y-4">
+		{#if state.status === 'loading'}
+			<Loader2 class="mx-auto animate-spin text-primary" size={40} />
+			<p class="text-text-muted">Desabonnement en cours...</p>
+		{:else if state.status === 'success'}
+			<CheckCircle2 class="mx-auto text-success" size={48} />
+			<h1 class="font-heading text-2xl text-text-primary">
+				Desabonne. Nous ne vous enverrons plus de digest.
+			</h1>
+			<p class="text-text-muted">
+				Vous ne recevrez plus d’emails du digest hebdomadaire ({state.email}).
+			</p>
+			<Button variant="primary" href="/">Retour a l’accueil</Button>
+		{:else}
+			<XCircle class="mx-auto text-error" size={48} />
+			<h1 class="font-heading text-2xl text-text-primary">
+				Ce lien est invalide.
+			</h1>
+			<p class="text-text-muted">{state.message}</p>
+			<Button variant="primary" href="/">Retour a l’accueil</Button>
+		{/if}
+	</div>
+</div>
diff --git a/src/routes/notifications/+page.svelte b/src/routes/notifications/+page.svelte
index a97aaa6..cecf465 100644
--- a/src/routes/notifications/+page.svelte
+++ b/src/routes/notifications/+page.svelte
@@ -1,12 +1,105 @@
 <script lang="ts">
 	import { notificationsApi } from '$api/notifications';
 	import { notifications } from '$stores/notifications.svelte';
+	import { attestationApi } from '$api/attestation';
+	import { auth } from '$stores/auth.svelte';
 	import { SkilluError } from '$api/client';
 	import Button from '$components/ui/Button.svelte';
 	import SegmentedControl from '$components/ui/SegmentedControl.svelte';
 	import EmptyState from '$components/ui/EmptyState.svelte';
 	import { i18n } from '$lib/i18n';
-	import type { Notification } from '$types';
+	import type { Notification, NotificationType } from '$types';
+	import { Rocket, CheckCircle2, UserPlus, Mail } from '@lucide/svelte';
+	import type { Component } from 'svelte';
+
+	// SKI-97 — 4 categories iconiques :
+	//   workflow (claim/PR/CI/merge/close) -> Rocket
+	//   validation (validated/rejected/pickups)  -> CheckCircle2
+	//   candidature validateur                   -> UserPlus
+	//   maintainer digest                        -> Mail
+	const typeIcon: Partial<Record<NotificationType, Component>> = {
+		slice_claimed: Rocket,
+		slice_fork_created: Rocket,
+		slice_pr_submitted: Rocket,
+		slice_pr_submitted_announced: Rocket,
+		slice_ci_green: Rocket,
+		slice_upstream_closed: Rocket,
+		slice_merged_upstream: Rocket,
+		slice_pr_rejected_upstream: Rocket,
+		validation_picked_up_by_you: CheckCircle2,
+		validation_picked_up_by_other: CheckCircle2,
+		slice_validated: CheckCircle2,
+		slice_rejected: CheckCircle2,
+		validator_application_status_changed: UserPlus,
+		validator_invitation_received: UserPlus,
+		maintainer_digest_confirmation_sent: Mail,
+		maintainer_digest_subscribed: Mail
+	};
+
+	// Contexte data payload (best-effort — deprecate CTA si champ absent).
+	interface NotifData {
+		slice_id?: string;
+		slice_title?: string;
+		fork_url?: string;
+		pr_url?: string;
+		repo?: string;
+		claimer?: string;
+		validator?: string;
+		reason?: string;
+		fragments_bonus?: number;
+		invitation_id?: string;
+		domain?: string;
+		status?: string;
+		notes?: string;
+		attestation_hash?: string;
+		upstream_issue_url?: string;
+	}
+
+	function ctx(n: Notification): NotifData {
+		return (n.data as NotifData | null) ?? {};
+	}
+
+	/** Rendu FR du body enrichi. Fallback : `n.body` renvoye par le back. */
+	function renderBody(n: Notification): string {
+		const d = ctx(n);
+		switch (n.notification_type) {
+			case 'slice_claimed':
+				return `Tu as claim la slice ${d.slice_title ?? ''}. 7 jours pour livrer.`;
+			case 'slice_fork_created':
+				return `Ton fork est pret : ${d.fork_url ?? ''}`;
+			case 'slice_pr_submitted':
+				return `PR ${d.pr_url ?? ''} enregistree, en attente CI`;
+			case 'slice_pr_submitted_announced':
+				return 'Commentaire poste sur ta PR';
+			case 'slice_ci_green':
+				return 'Ta PR a passe la CI, en attente de validation Skilluv';
+			case 'validation_picked_up_by_you':
+				return `Tu as pris en charge la validation de la PR de @${d.claimer ?? ''}`;
+			case 'validation_picked_up_by_other':
+				return `Ta PR est en cours de review par @${d.validator ?? ''}`;
+			case 'slice_validated':
+				return 'Ta PR a ete validee. Attestation generee. Fragments credites.';
+			case 'slice_rejected':
+				return `Ta PR a ete refusee par @${d.validator ?? ''}. Raison : ${d.reason ?? '—'}`;
+			case 'slice_merged_upstream':
+				return `Ta PR a ete mergee sur ${d.repo ?? ''}. Bonus de ${d.fragments_bonus ?? 0} fragments.`;
+			case 'slice_pr_rejected_upstream':
+				return 'Ta PR a ete fermee upstream sans merge. Tu peux reprendre la slice ou passer a autre chose.';
+			case 'validator_application_status_changed':
+				return `Ta candidature validateur (${d.domain ?? ''}) a ete ${d.status ?? ''}`;
+			case 'validator_invitation_received':
+				return `Skilluv t'invite a devenir validateur ${d.domain ?? ''}. Raison : ${d.notes ?? '—'}`;
+			case 'slice_upstream_closed':
+				return `L'issue upstream ${d.upstream_issue_url ?? ''} a ete fermee. Ta claim a ete relachee.`;
+			case 'maintainer_digest_confirmation_sent':
+				return 'Email de confirmation envoye';
+			case 'maintainer_digest_subscribed':
+				return 'Ton abonnement digest est confirme';
+			default:
+				return n.body ?? '';
+		}
+	}
+	// TODO(J-05 v2): grouper par slice_id si plusieurs notifs consecutives.
 
 	let items = $state<Notification[]>([]);
 	let loading = $state(true);
@@ -23,7 +116,24 @@
 		challenge_approved: 'text-success',
 		challenge_rejected: 'text-warning',
 		account_banned: 'text-error',
-		account_unbanned: 'text-success'
+		account_unbanned: 'text-success',
+		// SKI-97 — coloration workflow challenge.
+		slice_claimed: 'text-primary',
+		slice_fork_created: 'text-primary',
+		slice_pr_submitted: 'text-primary',
+		slice_pr_submitted_announced: 'text-primary',
+		slice_ci_green: 'text-success',
+		validation_picked_up_by_you: 'text-primary',
+		validation_picked_up_by_other: 'text-primary',
+		slice_validated: 'text-success',
+		slice_rejected: 'text-warning',
+		slice_merged_upstream: 'text-success',
+		slice_pr_rejected_upstream: 'text-warning',
+		validator_application_status_changed: 'text-primary',
+		validator_invitation_received: 'text-primary',
+		slice_upstream_closed: 'text-text-muted',
+		maintainer_digest_confirmation_sent: 'text-info',
+		maintainer_digest_subscribed: 'text-success'
 	};
 
 	$effect(() => {
@@ -125,25 +235,68 @@
 	{:else}
 		<div class="flex flex-col gap-2">
 			{#each items as notif}
-				<button
-					type="button"
+				{@const Icon = typeIcon[notif.notification_type]}
+				{@const d = ctx(notif)}
+				{@const enrichedBody = renderBody(notif)}
+				<div
 					class="flex w-full items-start gap-3 rounded-2xl border p-4 text-left transition-colors
 						{notif.read ? 'border-border bg-surface' : 'border-accent/20 bg-accent/5'}"
-					onclick={() => markRead(notif)}
 				>
-					<!-- Type indicator dot -->
-					<span class="mt-2 h-2 w-2 shrink-0 rounded-full {typeColor[notif.notification_type] ?? 'text-text-muted'} bg-current"></span>
-					<div class="flex-1">
+					<!-- Icon (SKI-97) ou dot fallback -->
+					{#if Icon}
+						<span class="mt-0.5 shrink-0 {typeColor[notif.notification_type] ?? 'text-text-muted'}">
+							<Icon size={16} strokeWidth={2} />
+						</span>
+					{:else}
+						<span class="mt-2 h-2 w-2 shrink-0 rounded-full {typeColor[notif.notification_type] ?? 'text-text-muted'} bg-current"></span>
+					{/if}
+
+					<button
+						type="button"
+						class="flex-1 text-left"
+						onclick={() => markRead(notif)}
+					>
 						<p class="text-sm font-medium {notif.read ? 'text-text-muted' : 'text-text-primary'}">{notif.title}</p>
-						{#if notif.body}
-							<p class="text-xs text-text-muted">{notif.body}</p>
+						{#if enrichedBody}
+							<p class="text-xs text-text-muted">{enrichedBody}</p>
 						{/if}
-					</div>
+
+						<!-- CTA inline SKI-97 (rendus si contexte requis present). -->
+						{#if notif.notification_type === 'slice_rejected' && d.slice_id}
+							<div class="mt-2">
+								<Button variant="ghost" size="sm" href={`/slices/${d.slice_id}`}>
+									Voir raisons et reclaim
+								</Button>
+							</div>
+						{:else if notif.notification_type === 'validator_invitation_received' && d.invitation_id}
+							<div class="mt-2 flex gap-2">
+								<Button variant="primary" size="sm" href={`/settings/validator-invitations/${d.invitation_id}`}>
+									Accepter
+								</Button>
+								<Button variant="ghost" size="sm" href={`/settings/validator-invitations/${d.invitation_id}`}>
+									Refuser
+								</Button>
+							</div>
+						{:else if notif.notification_type === 'slice_validated' && d.attestation_hash}
+							<div class="mt-2">
+								<Button variant="ghost" size="sm" href={attestationApi.pdfUrl(d.attestation_hash)}>
+									Telecharger PDF
+								</Button>
+							</div>
+						{:else if notif.notification_type === 'slice_merged_upstream' && auth.user?.username}
+							<div class="mt-2">
+								<Button variant="ghost" size="sm" href={attestationApi.badgeUserUrl(auth.user.username)}>
+									Partager mon badge
+								</Button>
+							</div>
+						{/if}
+					</button>
+
 					<span class="shrink-0 text-xs text-text-muted">{formatDate(notif.created_at)}</span>
 					{#if !notif.read}
 						<span class="mt-1 h-2 w-2 shrink-0 rounded-full bg-accent"></span>
 					{/if}
-				</button>
+				</div>
 			{/each}
 		</div>
 	{/if}
diff --git a/src/routes/profile/[username]/+page.svelte b/src/routes/profile/[username]/+page.svelte
index a668890..a813198 100644
--- a/src/routes/profile/[username]/+page.svelte
+++ b/src/routes/profile/[username]/+page.svelte
@@ -28,6 +28,7 @@
 	import BadgesWall from '$lib/components/badges/BadgesWall.svelte';
 	import { OrientationList } from '$lib/components/orientations';
 	import { ContributionSection } from '$lib/components/capabilities';
+	import BadgesSection from '$lib/components/profile/BadgesSection.svelte';
 
 	onMount(() => {
 		void geo.ensureCountries();
@@ -360,5 +361,10 @@
 		<div class="mt-6">
 			<BadgesWall badges={badgesData} isOwn={isOwnProfile} />
 		</div>
+
+		<!-- SKI-104 — Badges Skilluv (personnel + repos maintenus si dispo) -->
+		<div class="mt-6">
+			<BadgesSection {username} isOwner={isOwnProfile} />
+		</div>
 	{/if}
 </div>
diff --git a/src/routes/settings/my-validator-applications/+page.svelte b/src/routes/settings/my-validator-applications/+page.svelte
new file mode 100644
index 0000000..0e79f90
--- /dev/null
+++ b/src/routes/settings/my-validator-applications/+page.svelte
@@ -0,0 +1,243 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { goto } from '$app/navigation';
+	import {
+		validatorApplicationsApi,
+		type ValidatorApplication,
+		type ValidatorApplicationStatus,
+		type ValidatorDomain
+	} from '$api/validatorApplications';
+	import { SkilluError } from '$api/client';
+	import { auth } from '$stores/auth.svelte';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import EmptyState from '$components/ui/EmptyState.svelte';
+	import Skeleton from '$components/ui/Skeleton.svelte';
+	import SegmentedControl from '$components/ui/SegmentedControl.svelte';
+
+	type Filter = 'all' | ValidatorApplicationStatus;
+
+	type ListState =
+		| { status: 'loading' }
+		| { status: 'ready'; apps: ValidatorApplication[] }
+		| { status: 'error'; message: string };
+
+	let view: ListState = $state({ status: 'loading' });
+
+	let filter: Filter = $state('all');
+	let actingId: string | null = $state(null);
+
+	const STATUS_BADGE: Record<
+		ValidatorApplicationStatus,
+		'success' | 'warning' | 'error' | 'default'
+	> = {
+		pending: 'warning',
+		accepted: 'success',
+		rejected: 'error',
+		withdrawn: 'default'
+	};
+
+	const STATUS_LABEL: Record<ValidatorApplicationStatus, string> = {
+		pending: 'En attente',
+		accepted: 'Acceptee',
+		rejected: 'Refusee',
+		withdrawn: 'Retiree'
+	};
+
+	const DOMAIN_BADGE: Record<string, 'code' | 'design' | 'game' | 'security' | 'default'> = {
+		code: 'code',
+		design: 'design',
+		game: 'game',
+		security: 'security'
+	};
+
+	function domainVariant(d: ValidatorDomain) {
+		return DOMAIN_BADGE[d] ?? 'default';
+	}
+
+	function formatDate(iso: string): string {
+		try {
+			return new Intl.DateTimeFormat('fr-FR', {
+				dateStyle: 'medium',
+				timeStyle: 'short'
+			}).format(new Date(iso));
+		} catch {
+			return iso;
+		}
+	}
+
+	async function load() {
+		if (!auth.isAuthenticated) {
+			await goto('/auth/login?next=/settings/my-validator-applications');
+			return;
+		}
+		view = { status: 'loading' };
+		try {
+			const res = await validatorApplicationsApi.list();
+			view = { status: 'ready', apps: res.data.applications };
+		} catch (err) {
+			view = {
+				status: 'error',
+				message: err instanceof SkilluError ? err.message : 'Impossible de charger.'
+			};
+		}
+	}
+
+	onMount(load);
+
+	let visibleApps = $derived.by(() => {
+		if (view.status !== 'ready') return [];
+		if (filter === 'all') return view.apps;
+		return view.apps.filter((a) => a.status === filter);
+	});
+
+	async function withdraw(app: ValidatorApplication) {
+		actingId = app.id;
+		try {
+			await validatorApplicationsApi.withdraw(app.id);
+			toast.success('Candidature retiree.');
+			await load();
+		} catch (err) {
+			toast.error(err instanceof SkilluError ? err.message : 'Erreur.');
+		} finally {
+			actingId = null;
+		}
+	}
+
+	async function accept(app: ValidatorApplication) {
+		actingId = app.id;
+		try {
+			await validatorApplicationsApi.accept(app.id);
+			toast.success('Invitation acceptee.');
+			await load();
+		} catch (err) {
+			toast.error(err instanceof SkilluError ? err.message : 'Erreur.');
+		} finally {
+			actingId = null;
+		}
+	}
+</script>
+
+<svelte:head>
+	<title>Mes candidatures validateur — Skilluv</title>
+</svelte:head>
+
+<div class="mx-auto max-w-3xl px-4 py-8">
+	<header class="mb-6 flex flex-col gap-4 sm:flex-row sm:items-end sm:justify-between">
+		<h1
+			class="font-heading text-3xl font-bold"
+			style:font-family="'Fraunces Variable', Georgia, serif"
+		>
+			Mes candidatures validateur
+		</h1>
+		<Button variant="primary" size="sm" href="/settings/validator-application/new">
+			Nouvelle candidature
+		</Button>
+	</header>
+
+	{#if view.status === 'ready' && view.apps.length > 0}
+		<div class="mb-6">
+			<SegmentedControl
+				items={[
+					{ value: 'all', label: 'Toutes' },
+					{ value: 'pending', label: 'En attente' },
+					{ value: 'accepted', label: 'Acceptees' },
+					{ value: 'rejected', label: 'Refusees' },
+					{ value: 'withdrawn', label: 'Retirees' }
+				]}
+				bind:value={filter}
+				size="sm"
+			/>
+		</div>
+	{/if}
+
+	{#if view.status === 'loading'}
+		<div class="flex flex-col gap-3">
+			{#each Array(3) as _}
+				<Skeleton class="h-36 w-full rounded-2xl" />
+			{/each}
+		</div>
+	{:else if view.status === 'error'}
+		<div class="rounded-2xl border border-error/30 bg-error/5 p-6 text-sm text-error">
+			{view.message}
+			<div class="mt-3">
+				<Button variant="secondary" size="sm" onclick={load}>Reessayer</Button>
+			</div>
+		</div>
+	{:else if view.apps.length === 0}
+		<EmptyState
+			variant="scroll"
+			title="Aucune candidature pour l'instant"
+			body="Candidate sur un domaine ou tu maitrises pour rejoindre l'equipe de validateurs."
+		>
+			{#snippet action()}
+				<Button variant="primary" href="/settings/validator-application/new">Candidater</Button>
+			{/snippet}
+		</EmptyState>
+	{:else if visibleApps.length === 0}
+		<EmptyState variant="search" title="Aucune candidature dans ce filtre." />
+	{:else}
+		<div class="flex flex-col gap-4">
+			{#each visibleApps as app (app.id)}
+				<article class="flex flex-col gap-3 rounded-2xl border border-border bg-surface-elevated p-5">
+					<div class="flex flex-wrap items-center gap-2">
+						<Badge variant={domainVariant(app.domain)}>{app.domain}</Badge>
+						<Badge variant={app.origin === 'admin_invite' ? 'accent' : 'default'}>
+							{app.origin === 'admin_invite' ? 'Invitation admin' : 'Candidature'}
+						</Badge>
+						<Badge variant={STATUS_BADGE[app.status]}>{STATUS_LABEL[app.status]}</Badge>
+					</div>
+
+					{#if app.motivation}
+						<p class="text-sm text-text-muted">{app.motivation}</p>
+					{/if}
+
+					{#if app.admin_notes}
+						<div class="rounded-lg bg-primary/10 p-3 text-sm">
+							<p class="mb-1 text-xs font-semibold text-primary">Note admin</p>
+							<p>{app.admin_notes}</p>
+						</div>
+					{/if}
+
+					<div class="text-xs text-text-muted">
+						Cree le {formatDate(app.created_at)}
+						{#if app.updated_at && app.updated_at !== app.created_at}
+							— maj {formatDate(app.updated_at)}
+						{/if}
+					</div>
+
+					{#if app.status === 'pending'}
+						<div class="flex flex-wrap gap-2 border-t border-border pt-3">
+							{#if app.origin === 'admin_invite'}
+								<Button
+									variant="primary"
+									size="sm"
+									loading={actingId === app.id}
+									onclick={() => accept(app)}
+								>
+									Accepter l'invitation
+								</Button>
+								<Button
+									variant="secondary"
+									size="sm"
+									href={`/settings/validator-invitations/${app.id}`}
+								>
+									Voir le detail
+								</Button>
+							{/if}
+							<Button
+								variant="ghost"
+								size="sm"
+								loading={actingId === app.id}
+								onclick={() => withdraw(app)}
+							>
+								Retirer
+							</Button>
+						</div>
+					{/if}
+				</article>
+			{/each}
+		</div>
+	{/if}
+</div>
diff --git a/src/routes/settings/validator-application/new/+page.svelte b/src/routes/settings/validator-application/new/+page.svelte
new file mode 100644
index 0000000..b292389
--- /dev/null
+++ b/src/routes/settings/validator-application/new/+page.svelte
@@ -0,0 +1,247 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { goto } from '$app/navigation';
+	import { api, SkilluError } from '$api/client';
+	import {
+		validatorApplicationsApi,
+		type ValidatorDomain,
+		type ValidatorEligibilityStats,
+		VALIDATOR_MIN_RANK,
+		VALIDATOR_MIN_MERGED_PRS,
+		VALIDATOR_MIN_REPOS_COVERED,
+		VALIDATOR_MIN_TENURE_DAYS
+	} from '$api/validatorApplications';
+	import { auth } from '$stores/auth.svelte';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Select from '$components/ui/Select.svelte';
+	import { Check, X, ArrowLeft } from '@lucide/svelte';
+
+	const DOMAINS: { value: ValidatorDomain; label: string }[] = [
+		{ value: 'code', label: 'Code' },
+		{ value: 'design', label: 'Design' },
+		{ value: 'game', label: 'Game' },
+		{ value: 'security', label: 'Security' },
+		{ value: 'ops', label: 'Ops' },
+		{ value: 'ai', label: 'AI' },
+		{ value: 'soft_skills', label: 'Soft skills' }
+	];
+
+	const RANK_ORD: Record<string, number> = {
+		apprenti: 0,
+		ranger: 1,
+		artisan: 2,
+		maitre: 3,
+		doyen: 4
+	};
+
+	let domain: ValidatorDomain = $state('code');
+	let motivation = $state('');
+	let submitting = $state(false);
+
+	let stats: ValidatorEligibilityStats | null = $state(null);
+	let statsUnavailable = $state(false);
+
+	onMount(async () => {
+		if (!auth.isAuthenticated) {
+			await goto('/auth/login?next=/settings/validator-application/new');
+			return;
+		}
+		try {
+			const res = await api.get<{ data: ValidatorEligibilityStats }>('/users/me/stats');
+			stats = res.data;
+		} catch {
+			// TODO(back): endpoint /users/me/stats attendu par SKI-96 (preview seuils).
+			statsUnavailable = true;
+		}
+	});
+
+	function checkRank(s: ValidatorEligibilityStats): boolean {
+		const min = RANK_ORD[VALIDATOR_MIN_RANK] ?? 0;
+		return (RANK_ORD[s.rank?.toLowerCase()] ?? -1) >= min;
+	}
+
+	function checkPrs(s: ValidatorEligibilityStats, d: ValidatorDomain): boolean {
+		return (s.merged_prs_by_domain?.[d] ?? 0) >= VALIDATOR_MIN_MERGED_PRS;
+	}
+
+	function checkRepos(s: ValidatorEligibilityStats, d: ValidatorDomain): boolean {
+		return (s.repos_covered_by_domain?.[d] ?? 0) >= VALIDATOR_MIN_REPOS_COVERED;
+	}
+
+	function checkTenure(s: ValidatorEligibilityStats): boolean {
+		return (s.tenure_days ?? 0) >= VALIDATOR_MIN_TENURE_DAYS;
+	}
+
+	let eligibility = $derived.by(() => {
+		if (!stats) return null;
+		return {
+			rank: checkRank(stats),
+			prs: checkPrs(stats, domain),
+			repos: checkRepos(stats, domain),
+			tenure: checkTenure(stats)
+		};
+	});
+
+	let allOk = $derived(
+		eligibility
+			? eligibility.rank && eligibility.prs && eligibility.repos && eligibility.tenure
+			: statsUnavailable // fallback : on autorise l'envoi, le back tranchera
+	);
+
+	async function submit() {
+		submitting = true;
+		try {
+			await validatorApplicationsApi.apply({
+				domain,
+				motivation: motivation.trim() || undefined
+			});
+			toast.success('Candidature envoyee.');
+			await goto('/settings/my-validator-applications');
+		} catch (err) {
+			if (err instanceof SkilluError && err.status === 403) {
+				toast.error('Un critere n est pas rempli. Verifie les seuils ci-dessus.');
+			} else {
+				toast.error(err instanceof SkilluError ? err.message : 'Erreur lors de l envoi.');
+			}
+		} finally {
+			submitting = false;
+		}
+	}
+</script>
+
+<svelte:head>
+	<title>Devenir validateur — Skilluv</title>
+</svelte:head>
+
+<div class="mx-auto max-w-2xl px-4 py-8">
+	<div class="mb-4">
+		<a
+			href="/settings/my-validator-applications"
+			class="inline-flex items-center gap-1 text-sm text-text-muted hover:text-text-primary"
+		>
+			<ArrowLeft size={14} strokeWidth={2} />
+			Mes candidatures
+		</a>
+	</div>
+
+	<h1
+		class="mb-3 font-heading text-3xl font-bold"
+		style:font-family="'Fraunces Variable', Georgia, serif"
+	>
+		Devenir validateur Skilluv
+	</h1>
+	<p class="mb-6 text-sm text-text-muted">
+		Les validateurs verifient les PRs Skilluv avant qu'elles soient marquees comme validees. Chaque
+		validation te credite en fragments et augmente ta reputation.
+	</p>
+
+	<div class="mb-6 rounded-2xl border border-border bg-surface-elevated p-5">
+		<label for="domain-select" class="mb-2 block text-sm font-medium">Domaine</label>
+		<Select
+			items={DOMAINS}
+			bind:value={domain}
+			shape="rounded"
+			size="md"
+			class="w-full"
+		/>
+	</div>
+
+	<div class="mb-6 space-y-2 rounded-xl bg-surface-elevated p-4">
+		<h2 class="mb-2 font-semibold">Seuils requis</h2>
+
+		{#if statsUnavailable}
+			<p class="text-sm text-warning">
+				Chargement des stats indisponible pour l'instant. Tu peux candidater — le back verifiera
+				les criteres.
+			</p>
+		{:else if !stats}
+			<p class="text-sm text-text-muted">Chargement...</p>
+		{:else if eligibility}
+			<div class="flex items-start gap-2">
+				<span class="mt-0.5 shrink-0 {eligibility.rank ? 'text-success' : 'text-warning'}">
+					{#if eligibility.rank}
+						<Check size={16} strokeWidth={2.5} />
+					{:else}
+						<X size={16} strokeWidth={2.5} />
+					{/if}
+				</span>
+				<span class="text-sm">
+					Rank Artisan minimum
+					{#if !eligibility.rank}
+						<span class="text-text-muted"> — Tu es {stats.rank}, il faut Artisan.</span>
+					{/if}
+				</span>
+			</div>
+
+			<div class="flex items-start gap-2">
+				<span class="mt-0.5 shrink-0 {eligibility.prs ? 'text-success' : 'text-warning'}">
+					{#if eligibility.prs}
+						<Check size={16} strokeWidth={2.5} />
+					{:else}
+						<X size={16} strokeWidth={2.5} />
+					{/if}
+				</span>
+				<span class="text-sm">
+					{VALIDATOR_MIN_MERGED_PRS} PRs validees sur {domain}
+					{#if !eligibility.prs}
+						<span class="text-text-muted">
+							— {stats.merged_prs_by_domain?.[domain] ?? 0} pour l'instant.
+						</span>
+					{/if}
+				</span>
+			</div>
+
+			<div class="flex items-start gap-2">
+				<span class="mt-0.5 shrink-0 {eligibility.repos ? 'text-success' : 'text-warning'}">
+					{#if eligibility.repos}
+						<Check size={16} strokeWidth={2.5} />
+					{:else}
+						<X size={16} strokeWidth={2.5} />
+					{/if}
+				</span>
+				<span class="text-sm">
+					{VALIDATOR_MIN_REPOS_COVERED} repos couverts
+					{#if !eligibility.repos}
+						<span class="text-text-muted">
+							— {stats.repos_covered_by_domain?.[domain] ?? 0} pour l'instant.
+						</span>
+					{/if}
+				</span>
+			</div>
+
+			<div class="flex items-start gap-2">
+				<span class="mt-0.5 shrink-0 {eligibility.tenure ? 'text-success' : 'text-warning'}">
+					{#if eligibility.tenure}
+						<Check size={16} strokeWidth={2.5} />
+					{:else}
+						<X size={16} strokeWidth={2.5} />
+					{/if}
+				</span>
+				<span class="text-sm">
+					{VALIDATOR_MIN_TENURE_DAYS} jours d'anciennete
+					{#if !eligibility.tenure}
+						<span class="text-text-muted"> — {stats.tenure_days} jours pour l'instant.</span>
+					{/if}
+				</span>
+			</div>
+		{/if}
+	</div>
+
+	<div class="mb-6 rounded-2xl border border-border bg-surface-elevated p-5">
+		<label for="motivation" class="mb-2 block text-sm font-medium">Motivation (optionnel)</label>
+		<textarea
+			id="motivation"
+			bind:value={motivation}
+			maxlength="500"
+			rows="5"
+			class="w-full rounded-xl border border-border bg-surface-overlay p-3 text-sm text-text-primary focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary"
+			placeholder="Pourquoi veux-tu devenir validateur sur ce domaine ?"
+		></textarea>
+		<p class="mt-1 text-xs text-text-muted">{motivation.length}/500</p>
+	</div>
+
+	<Button variant="primary" disabled={!allOk || submitting} loading={submitting} onclick={submit}>
+		Candidater
+	</Button>
+</div>
diff --git a/src/routes/settings/validator-invitations/[id]/+page.svelte b/src/routes/settings/validator-invitations/[id]/+page.svelte
new file mode 100644
index 0000000..67ebeb5
--- /dev/null
+++ b/src/routes/settings/validator-invitations/[id]/+page.svelte
@@ -0,0 +1,174 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { goto } from '$app/navigation';
+	import {
+		validatorApplicationsApi,
+		type ValidatorApplication
+	} from '$api/validatorApplications';
+	import { SkilluError } from '$api/client';
+	import { auth } from '$stores/auth.svelte';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import Skeleton from '$components/ui/Skeleton.svelte';
+	import { ArrowLeft } from '@lucide/svelte';
+
+	let { data } = $props<{ data: { id: string } }>();
+
+	type InviteState =
+		| { status: 'loading' }
+		| { status: 'ready'; app: ValidatorApplication }
+		| { status: 'not-found' }
+		| { status: 'error'; message: string };
+
+	let view: InviteState = $state({ status: 'loading' });
+
+	let acting: 'accept' | 'decline' | null = $state(null);
+
+	function formatDate(iso: string): string {
+		try {
+			return new Intl.DateTimeFormat('fr-FR', {
+				dateStyle: 'long',
+				timeStyle: 'short'
+			}).format(new Date(iso));
+		} catch {
+			return iso;
+		}
+	}
+
+	async function load() {
+		if (!auth.isAuthenticated) {
+			await goto(`/auth/login?next=/settings/validator-invitations/${data.id}`);
+			return;
+		}
+		view = { status: 'loading' };
+		try {
+			const res = await validatorApplicationsApi.list();
+			const found = res.data.applications.find((a) => a.id === data.id);
+			if (!found || found.origin !== 'admin_invite') {
+				view = { status: 'not-found' };
+				return;
+			}
+			view = { status: 'ready', app: found };
+		} catch (err) {
+			view = {
+				status: 'error',
+				message: err instanceof SkilluError ? err.message : 'Erreur.'
+			};
+		}
+	}
+
+	onMount(load);
+
+	async function accept() {
+		if (view.status !== 'ready') return;
+		acting = 'accept';
+		try {
+			await validatorApplicationsApi.accept(view.app.id);
+			toast.success('Invitation acceptee.');
+			await goto('/settings/my-validator-applications');
+		} catch (err) {
+			toast.error(err instanceof SkilluError ? err.message : 'Erreur.');
+		} finally {
+			acting = null;
+		}
+	}
+
+	async function decline() {
+		if (view.status !== 'ready') return;
+		acting = 'decline';
+		try {
+			await validatorApplicationsApi.withdraw(view.app.id);
+			toast.success('Invitation refusee.');
+			await goto('/settings/my-validator-applications');
+		} catch (err) {
+			toast.error(err instanceof SkilluError ? err.message : 'Erreur.');
+		} finally {
+			acting = null;
+		}
+	}
+</script>
+
+<svelte:head>
+	<title>Invitation validateur — Skilluv</title>
+</svelte:head>
+
+<div class="mx-auto max-w-2xl px-4 py-8">
+	<div class="mb-4">
+		<a
+			href="/settings/my-validator-applications"
+			class="inline-flex items-center gap-1 text-sm text-text-muted hover:text-text-primary"
+		>
+			<ArrowLeft size={14} strokeWidth={2} />
+			Mes candidatures
+		</a>
+	</div>
+
+	{#if view.status === 'loading'}
+		<Skeleton class="mb-4 h-8 w-2/3" />
+		<Skeleton class="h-64 w-full rounded-2xl" />
+	{:else if view.status === 'not-found'}
+		<div class="rounded-2xl border border-border bg-surface-elevated p-6">
+			<h1 class="mb-2 text-lg font-semibold">Introuvable</h1>
+			<p class="text-sm text-text-muted">
+				Cette invitation n'existe pas ou n'est plus disponible.
+			</p>
+		</div>
+	{:else if view.status === 'error'}
+		<div class="rounded-2xl border border-error/30 bg-error/5 p-6 text-sm text-error">
+			{view.message}
+			<div class="mt-3">
+				<Button variant="secondary" size="sm" onclick={load}>Reessayer</Button>
+			</div>
+		</div>
+	{:else}
+		{@const app = view.app}
+		<h1
+			class="mb-2 font-heading text-2xl font-bold"
+			style:font-family="'Fraunces Variable', Georgia, serif"
+		>
+			Invitation admin — Devenir validateur {app.domain}
+		</h1>
+
+		<div class="mb-6 rounded-2xl border border-border bg-surface-elevated p-6">
+			<div class="mb-4 flex flex-wrap gap-2">
+				<Badge variant="accent">Invitation admin</Badge>
+				<Badge variant="warning">En attente</Badge>
+			</div>
+
+			<p class="mb-4 text-sm">
+				Un admin Skilluv t'invite a rejoindre l'equipe de validateurs {app.domain}.
+			</p>
+
+			<section class="mb-4">
+				<h2 class="mb-2 text-sm font-semibold">Raison de l'invitation</h2>
+				{#if app.admin_notes}
+					<div class="rounded-lg bg-primary/10 p-3 text-sm">{app.admin_notes}</div>
+				{:else}
+					<p class="text-sm text-text-muted">L'admin n'a pas laisse de note.</p>
+				{/if}
+			</section>
+
+			<p class="text-xs text-text-muted">Recu le {formatDate(app.created_at)}</p>
+		</div>
+
+		<div class="flex flex-wrap gap-3">
+			<Button
+				variant="primary"
+				disabled={acting !== null}
+				loading={acting === 'accept'}
+				onclick={accept}
+			>
+				Accepter
+			</Button>
+			<Button
+				variant="danger"
+				disabled={acting !== null}
+				loading={acting === 'decline'}
+				onclick={decline}
+			>
+				Refuser
+			</Button>
+		</div>
+	{/if}
+</div>
diff --git a/src/routes/settings/validator-invitations/[id]/+page.ts b/src/routes/settings/validator-invitations/[id]/+page.ts
new file mode 100644
index 0000000..6564fd6
--- /dev/null
+++ b/src/routes/settings/validator-invitations/[id]/+page.ts
@@ -0,0 +1,7 @@
+import type { PageLoad } from './$types';
+
+export const ssr = false;
+
+export const load: PageLoad = ({ params }) => {
+	return { id: params.id };
+};
diff --git a/src/routes/slices/[id]/+page.svelte b/src/routes/slices/[id]/+page.svelte
new file mode 100644
index 0000000..5a38b43
--- /dev/null
+++ b/src/routes/slices/[id]/+page.svelte
@@ -0,0 +1,400 @@
+<script lang="ts">
+	import { goto, invalidateAll } from '$app/navigation';
+	import { auth } from '$stores/auth.svelte';
+	import { slicesApi, type Slice, type SliceStatus } from '$api/slices';
+	import { attestationApi } from '$api/attestation';
+	import { SkilluError } from '$api/client';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import ActiveSkilluversWidget from '$components/slice/ActiveSkilluversWidget.svelte';
+	import DiaryWidget from '$components/slice/DiaryWidget.svelte';
+	import { ExternalLink, Check, GitBranch, ShieldCheck } from '@lucide/svelte';
+
+	interface Props {
+		data: { slice: Slice };
+	}
+
+	let { data }: Props = $props();
+	// svelte-ignore state_referenced_locally
+	let slice = $state<Slice>(data.slice);
+
+	$effect(() => {
+		slice = data.slice;
+	});
+
+	// --- Status mapping ---
+	const STATUS_ORDER: SliceStatus[] = [
+		'open',
+		'claimed',
+		'in_progress',
+		'submitted',
+		'ci_green',
+		'pending_validation',
+		'validated',
+		'merged'
+	];
+
+	const STATUS_LABEL: Record<SliceStatus, string> = {
+		open: 'Ouvert',
+		claimed: 'Reserve',
+		in_progress: 'En cours',
+		submitted: 'PR soumise',
+		ci_green: 'CI verte',
+		pending_validation: 'En validation',
+		validated: 'Validee',
+		merged: 'Merge upstream',
+		closed: 'Ferme',
+		expired: 'Expire'
+	};
+
+	const STATUS_VARIANT: Record<SliceStatus, 'default' | 'primary' | 'accent' | 'success' | 'warning' | 'error'> = {
+		open: 'primary',
+		claimed: 'accent',
+		in_progress: 'warning',
+		submitted: 'accent',
+		ci_green: 'success',
+		pending_validation: 'accent',
+		validated: 'success',
+		merged: 'success',
+		closed: 'default',
+		expired: 'error'
+	};
+
+	let currentIdx = $derived(STATUS_ORDER.indexOf(slice.status));
+	let isMine = $derived(!!auth.user && slice.claimed_by_user_id === auth.user.id);
+	let canClaim = $derived(slice.status === 'open' && auth.isAuthenticated);
+	let canSubmitPr = $derived(isMine && (slice.status === 'claimed' || slice.status === 'in_progress'));
+
+	// --- Action state ---
+	let claiming = $state(false);
+	let unclaiming = $state(false);
+	let prUrl = $state('');
+	let announce = $state(false);
+	let submittingPr = $state(false);
+	let claimGateBlocked = $state(false);
+
+	async function doClaim() {
+		claiming = true;
+		claimGateBlocked = false;
+		try {
+			const res = await slicesApi.claim(slice.id);
+			slice = { ...slice, status: 'claimed', claimed_by_user_id: auth.user?.id ?? null, fork_repo_url: res.data.fork_repo_url ?? slice.fork_repo_url };
+			toast.success('Challenge reserve');
+			await invalidateAll();
+		} catch (err) {
+			if (err instanceof SkilluError && err.status === 403) {
+				claimGateBlocked = true;
+			} else {
+				toast.error(err instanceof SkilluError ? err.message : 'Reservation impossible');
+			}
+		} finally {
+			claiming = false;
+		}
+	}
+
+	async function doUnclaim() {
+		if (!confirm('Liberer ce challenge ?')) return;
+		unclaiming = true;
+		try {
+			await slicesApi.unclaim(slice.id);
+			slice = { ...slice, status: 'open', claimed_by_user_id: null };
+			toast.success('Challenge libere');
+			await invalidateAll();
+		} catch (err) {
+			toast.error(err instanceof SkilluError ? err.message : 'Operation impossible');
+		} finally {
+			unclaiming = false;
+		}
+	}
+
+	async function doSubmitPr(e: Event) {
+		e.preventDefault();
+		if (!prUrl.trim() || submittingPr) return;
+		submittingPr = true;
+		try {
+			await slicesApi.submitPr(slice.id, { pr_url: prUrl, announce_publicly: announce });
+			slice = { ...slice, status: 'submitted', submitted_pr_url: prUrl };
+			prUrl = '';
+			announce = false;
+			toast.success('PR soumise');
+			await invalidateAll();
+		} catch (err) {
+			toast.error(err instanceof SkilluError ? err.message : 'Envoi impossible');
+		} finally {
+			submittingPr = false;
+		}
+	}
+
+	function fmtDaysLeft(iso: string | null): string | null {
+		if (!iso) return null;
+		const diff = new Date(iso).getTime() - Date.now();
+		if (diff <= 0) return 'Expire';
+		const days = Math.ceil(diff / 86400000);
+		return `Reste ${days}j`;
+	}
+
+	function truncHash(h: string): string {
+		return h.length > 14 ? `${h.slice(0, 8)}...${h.slice(-4)}` : h;
+	}
+</script>
+
+<svelte:head>
+	<title>{slice.title} — Skilluv</title>
+</svelte:head>
+
+<div class="mx-auto max-w-7xl px-4 py-8">
+	<div class="grid grid-cols-1 lg:grid-cols-[minmax(0,1fr)_320px] gap-8">
+		<!-- Main column -->
+		<article class="min-w-0 max-w-3xl">
+			<!-- Header -->
+			<header class="mb-6">
+				<div class="flex flex-wrap items-center gap-2 mb-3">
+					<Badge variant={STATUS_VARIANT[slice.status]}>{STATUS_LABEL[slice.status]}</Badge>
+					{#if slice.labels[0]}
+						<Badge variant="code">{slice.labels[0]}</Badge>
+					{/if}
+					{#if slice.min_rank}
+						<Badge variant="default">rank &ge; {slice.min_rank}</Badge>
+					{/if}
+					{#if slice.required_orientation_slugs}
+						{#each slice.required_orientation_slugs as o (o)}
+							<Badge variant="accent">{o}</Badge>
+						{/each}
+					{/if}
+					<Badge variant="default">difficulte {slice.difficulty}/5</Badge>
+					{#if slice.claim_expires_at && (slice.status === 'claimed' || slice.status === 'in_progress')}
+						{@const dl = fmtDaysLeft(slice.claim_expires_at)}
+						{#if dl}
+							<Badge variant="warning">{dl}</Badge>
+						{/if}
+					{/if}
+				</div>
+				<h1 class="font-heading text-3xl sm:text-4xl font-bold text-text-primary tracking-tight mb-4">
+					{slice.title}
+				</h1>
+				<div class="flex flex-wrap items-center gap-3 text-sm">
+					{#if slice.external_metadata?.issue_url}
+						<a
+							href={slice.external_metadata.issue_url}
+							target="_blank"
+							rel="noopener noreferrer"
+							class="inline-flex items-center gap-1.5 text-text-muted hover:text-accent transition-colors"
+						>
+							<ExternalLink size={14} strokeWidth={2} />
+							Issue GitHub
+						</a>
+					{/if}
+					{#if slice.fork_repo_url}
+						<a
+							href={slice.fork_repo_url}
+							target="_blank"
+							rel="noopener noreferrer"
+							class="inline-flex items-center gap-1.5 text-text-muted hover:text-accent transition-colors"
+						>
+							<GitBranch size={14} strokeWidth={2} />
+							Ton fork
+						</a>
+					{/if}
+					{#if slice.submitted_pr_url}
+						<a
+							href={slice.submitted_pr_url}
+							target="_blank"
+							rel="noopener noreferrer"
+							class="inline-flex items-center gap-1.5 text-text-muted hover:text-accent transition-colors"
+						>
+							<ExternalLink size={14} strokeWidth={2} />
+							Voir la PR
+						</a>
+					{/if}
+				</div>
+			</header>
+
+			<!-- Description -->
+			<section class="mb-8">
+				<div class="text-text-primary text-base leading-relaxed whitespace-pre-wrap">
+					{slice.description}
+				</div>
+			</section>
+
+			<!-- Acceptance criteria -->
+			{#if slice.acceptance_criteria?.length}
+				<section class="mb-8">
+					<h2 class="text-sm font-semibold uppercase tracking-wider text-text-muted mb-3">
+						Criteres d'acceptation
+					</h2>
+					<ul class="space-y-2">
+						{#each slice.acceptance_criteria as c, i (i)}
+							<li class="flex items-start gap-2 text-sm text-text-primary">
+								<Check size={16} strokeWidth={2.5} class="mt-0.5 shrink-0 text-success" />
+								<span>{c}</span>
+							</li>
+						{/each}
+					</ul>
+				</section>
+			{/if}
+
+			<!-- Stepper -->
+			<section class="mb-8">
+				<h2 class="text-sm font-semibold uppercase tracking-wider text-text-muted mb-4">
+					Workflow
+				</h2>
+				<ol class="relative border-l border-border pl-6 space-y-4">
+					{#each STATUS_ORDER as st, i (st)}
+						{@const reached = i <= currentIdx && slice.status !== 'closed' && slice.status !== 'expired'}
+						{@const current = i === currentIdx}
+						<li class="relative">
+							<span
+								class="absolute -left-[33px] flex h-5 w-5 items-center justify-center rounded-full border-2 {reached
+									? 'border-primary bg-primary text-primary-fg'
+									: 'border-border bg-surface'}"
+							>
+								{#if reached}
+									<Check size={12} strokeWidth={3} />
+								{/if}
+							</span>
+							<span
+								class="text-sm {current ? 'font-semibold text-text-primary' : reached ? 'text-text-primary' : 'text-text-muted'}"
+							>
+								{STATUS_LABEL[st]}
+							</span>
+						</li>
+					{/each}
+				</ol>
+				{#if slice.status === 'closed' || slice.status === 'expired'}
+					<p class="mt-4 text-sm text-text-muted italic">Workflow interrompu ({STATUS_LABEL[slice.status]}).</p>
+				{/if}
+			</section>
+
+			<!-- Rejection block -->
+			{#if slice.validation_reject_reason}
+				<section class="mb-8 rounded-xl border border-error/40 bg-error/10 p-4">
+					<h3 class="text-sm font-semibold text-error mb-2">PR non validee</h3>
+					<p class="text-sm text-text-primary whitespace-pre-wrap">{slice.validation_reject_reason}</p>
+				</section>
+			{/if}
+
+			<!-- Actions -->
+			<section class="mb-8">
+				{#if canClaim}
+					{#if claimGateBlocked}
+						<p class="text-sm text-warning mb-3">
+							Ton rank ou orientation ne correspond pas encore a cette slice.
+						</p>
+					{/if}
+					<Button variant="primary" size="lg" loading={claiming} onclick={doClaim}>
+						Claim ce challenge
+					</Button>
+				{:else if !auth.isAuthenticated && slice.status === 'open'}
+					<Button variant="primary" size="lg" href={`/auth/login?redirect=/slices/${slice.id}`}>
+						Se connecter pour claim
+					</Button>
+				{/if}
+
+				{#if canSubmitPr}
+					<div class="rounded-2xl border border-border bg-surface-elevated p-5">
+						<h3 class="text-base font-semibold text-text-primary mb-4">Soumettre ta PR</h3>
+						<form onsubmit={doSubmitPr} class="space-y-4">
+							<div>
+								<label for="pr-url" class="block text-sm font-medium text-text-primary mb-1.5">
+									URL de la Pull Request
+								</label>
+								<input
+									id="pr-url"
+									type="url"
+									bind:value={prUrl}
+									required
+									placeholder="https://github.com/owner/repo/pull/123"
+									class="h-11 w-full rounded-xl border border-border bg-surface px-4 text-sm text-text-primary placeholder:text-text-muted focus:border-primary focus:ring-1 focus:ring-primary"
+								/>
+							</div>
+							<label class="flex items-start gap-3 text-sm cursor-pointer">
+								<input type="checkbox" bind:checked={announce} class="mt-0.5 rounded border-border" />
+								<span>
+									<span class="text-text-primary">Annoncer publiquement sur la PR que je contribue via Skilluv</span>
+									<span class="block text-xs text-text-muted mt-0.5">
+										Un commentaire sera poste sur ta PR sous ton nom.
+									</span>
+								</span>
+							</label>
+							<div class="flex gap-3">
+								<Button
+									type="submit"
+									variant="primary"
+									disabled={!prUrl.trim() || submittingPr}
+									loading={submittingPr}
+								>
+									Envoyer la PR
+								</Button>
+								<Button
+									type="button"
+									variant="secondary"
+									onclick={doUnclaim}
+									loading={unclaiming}
+									disabled={unclaiming}
+								>
+									Unclaim
+								</Button>
+							</div>
+						</form>
+					</div>
+				{/if}
+
+				{#if isMine && (slice.status === 'submitted' || slice.status === 'ci_green')}
+					<div class="flex flex-wrap items-center gap-3">
+						{#if slice.submitted_pr_url}
+							<Button variant="secondary" href={slice.submitted_pr_url}>Voir la PR</Button>
+						{/if}
+						<Badge variant={slice.status === 'ci_green' ? 'success' : 'warning'}>
+							{slice.status === 'ci_green' ? 'CI verte, en attente validation' : 'En attente CI'}
+						</Badge>
+					</div>
+				{/if}
+
+				{#if slice.status === 'pending_validation'}
+					<p class="text-sm text-text-muted">
+						En cours de review
+						<!-- TODO(back): expose validator_username sur Slice pour afficher le nom du valideur -->
+						{#if slice.validator_user_id}par un valideur Skilluv.{/if}
+					</p>
+				{/if}
+
+				{#if (slice.status === 'validated' || slice.status === 'merged') && slice.attestation_hash}
+					<div class="rounded-2xl border border-success/30 bg-success/5 p-5 space-y-3">
+						<div class="flex flex-wrap items-center gap-2">
+							<Badge variant="success">Attestation generee</Badge>
+							{#if slice.status === 'merged'}
+								<Badge variant="accent">Merge upstream</Badge>
+							{/if}
+						</div>
+						<div class="flex flex-wrap gap-3">
+							<Button variant="primary" href={attestationApi.pdfUrl(slice.attestation_hash)}>
+								Telecharger le PDF de l'attestation
+							</Button>
+							<Button variant="secondary" href={`/verify/${slice.attestation_hash}`}>
+								<ShieldCheck size={14} strokeWidth={2} />
+								Verifier publiquement
+							</Button>
+						</div>
+					</div>
+				{/if}
+			</section>
+
+			<!-- Attestation hint -->
+			{#if slice.attestation_hash}
+				<p class="text-xs text-text-muted mb-8" title={slice.attestation_hash}>
+					Attestation ID :
+					<code class="font-mono">{truncHash(slice.attestation_hash)}</code>
+				</p>
+			{/if}
+
+			<!-- Diary -->
+			<DiaryWidget sliceId={slice.id} canPost={isMine} />
+		</article>
+
+		<!-- Side column -->
+		<aside class="lg:sticky lg:top-24 lg:self-start space-y-4">
+			<ActiveSkilluversWidget projectSlug={slice.project_slug} />
+		</aside>
+	</div>
+</div>
diff --git a/src/routes/slices/[id]/+page.ts b/src/routes/slices/[id]/+page.ts
new file mode 100644
index 0000000..4e29635
--- /dev/null
+++ b/src/routes/slices/[id]/+page.ts
@@ -0,0 +1,16 @@
+import { error } from '@sveltejs/kit';
+import { slicesApi } from '$api/slices';
+import { SkilluError } from '$api/client';
+import type { PageLoad } from './$types';
+
+export const load: PageLoad = async ({ params }) => {
+	try {
+		const res = await slicesApi.get(params.id);
+		return { slice: res.data };
+	} catch (err) {
+		if (err instanceof SkilluError && err.status === 404) {
+			error(404, 'Slice introuvable');
+		}
+		throw err;
+	}
+};
diff --git a/src/routes/validations/[slice_id]/review/+page.svelte b/src/routes/validations/[slice_id]/review/+page.svelte
new file mode 100644
index 0000000..76a08fa
--- /dev/null
+++ b/src/routes/validations/[slice_id]/review/+page.svelte
@@ -0,0 +1,265 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { goto } from '$app/navigation';
+	import {
+		validationApi,
+		type ValidationQueueItem,
+		type ValidationApproveResponse
+	} from '$api/validation';
+	import { attestationApi } from '$api/attestation';
+	import { SkilluError } from '$api/client';
+	import { auth } from '$stores/auth.svelte';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import Skeleton from '$components/ui/Skeleton.svelte';
+	import { ExternalLink, Download, ArrowLeft } from '@lucide/svelte';
+
+	let { data } = $props<{ data: { sliceId: string } }>();
+
+	type ReviewState =
+		| { status: 'loading' }
+		| { status: 'ready'; item: ValidationQueueItem }
+		| { status: 'not-found' }
+		| { status: 'error'; message: string };
+
+	let view: ReviewState = $state({ status: 'loading' });
+
+	let feedback = $state('');
+	let approving = $state(false);
+	let rejecting = $state(false);
+	let approveResult: ValidationApproveResponse | null = $state(null);
+	let submitError: string | null = $state(null);
+
+	const DOMAIN_BADGE: Record<string, 'code' | 'design' | 'game' | 'security' | 'default'> = {
+		code: 'code',
+		design: 'design',
+		game: 'game',
+		security: 'security'
+	};
+
+	function domainVariant(domain: string) {
+		return DOMAIN_BADGE[domain?.toLowerCase()] ?? 'default';
+	}
+
+	function domainFromLabels(item: ValidationQueueItem): string {
+		return item.slice.labels.find((l) => DOMAIN_BADGE[l.toLowerCase()]) ?? 'code';
+	}
+
+	async function load() {
+		if (!auth.isAuthenticated) {
+			await goto(`/auth/login?next=/validations/${data.sliceId}/review`);
+			return;
+		}
+		view = { status: 'loading' };
+		try {
+			// TODO(back): endpoint dedie /slices/{id}/validation aurait ete plus efficace.
+			const res = await validationApi.queue();
+			const found = res.data.items.find((it) => it.slice.id === data.sliceId);
+			if (!found) {
+				view = { status: 'not-found' };
+				return;
+			}
+			view = { status: 'ready', item: found };
+		} catch (err) {
+			view = {
+				status: 'error',
+				message: err instanceof SkilluError ? err.message : 'Impossible de charger la review.'
+			};
+		}
+	}
+
+	onMount(load);
+
+	let canReject = $derived(feedback.length >= 1 && feedback.length <= 2000);
+	let busy = $derived(approving || rejecting);
+
+	async function approve() {
+		if (view.status !== 'ready') return;
+		submitError = null;
+		approving = true;
+		try {
+			const res = await validationApi.approve(view.item.slice.id);
+			approveResult = res.data;
+		} catch (err) {
+			if (err instanceof SkilluError && err.status === 400) {
+				submitError = 'Impossible : tu es le claimer de cette PR.';
+			} else {
+				submitError = err instanceof SkilluError ? err.message : 'Erreur lors de l approbation.';
+			}
+		} finally {
+			approving = false;
+		}
+	}
+
+	async function reject() {
+		if (view.status !== 'ready' || !canReject) return;
+		submitError = null;
+		rejecting = true;
+		try {
+			await validationApi.reject(view.item.slice.id, { reason: feedback });
+			toast.success('PR rejetee.');
+			await goto('/validations/queue');
+		} catch (err) {
+			if (err instanceof SkilluError && err.status === 400) {
+				submitError = 'Impossible : tu es le claimer de cette PR.';
+			} else {
+				submitError = err instanceof SkilluError ? err.message : 'Erreur lors du rejet.';
+			}
+		} finally {
+			rejecting = false;
+		}
+	}
+</script>
+
+<svelte:head>
+	<title>Reviewer une PR — Skilluv</title>
+</svelte:head>
+
+<div class="mx-auto max-w-3xl px-4 py-8">
+	<div class="mb-4">
+		<a
+			href="/validations/queue"
+			class="inline-flex items-center gap-1 text-sm text-text-muted hover:text-text-primary"
+		>
+			<ArrowLeft size={14} strokeWidth={2} />
+			Retour a la queue
+		</a>
+	</div>
+
+	{#if view.status === 'loading'}
+		<Skeleton class="mb-4 h-8 w-2/3" />
+		<Skeleton class="mb-6 h-24 w-full rounded-2xl" />
+		<Skeleton class="mb-4 h-40 w-full rounded-2xl" />
+		<Skeleton class="h-40 w-full rounded-2xl" />
+	{:else if view.status === 'not-found'}
+		<div class="rounded-2xl border border-border bg-surface-elevated p-6">
+			<h1 class="mb-2 text-lg font-semibold">Introuvable</h1>
+			<p class="text-sm text-text-muted">
+				Ce challenge n'existe pas dans ta file de validation. Il a peut-etre deja ete traite.
+			</p>
+		</div>
+	{:else if view.status === 'error'}
+		<div class="rounded-2xl border border-error/30 bg-error/5 p-6 text-sm text-error">
+			{view.message}
+			<div class="mt-3">
+				<Button variant="secondary" size="sm" onclick={load}>Reessayer</Button>
+			</div>
+		</div>
+	{:else}
+		{@const item = view.item}
+		{@const domain = domainFromLabels(item)}
+
+		<header class="mb-6">
+			<h1
+				class="mb-3 font-heading text-2xl font-bold"
+				style:font-family="'Fraunces Variable', Georgia, serif"
+			>
+				{item.slice.title}
+			</h1>
+			<div class="flex flex-wrap gap-2">
+				<Badge variant={domainVariant(domain)}>{domain}</Badge>
+				<Badge variant="accent">difficulte {item.slice.difficulty}</Badge>
+				<Badge variant="success">status {item.slice.status}</Badge>
+			</div>
+		</header>
+
+		{#if approveResult}
+			<div class="mb-6 rounded-2xl border border-success/30 bg-success/10 p-6">
+				<h2 class="mb-2 text-lg font-semibold text-success">Validation approuvee</h2>
+				<p class="mb-4 text-sm text-text-muted">
+					{approveResult.fragments_credited} fragments credites. L'attestation est publique.
+				</p>
+				<p class="mb-4 break-all font-mono text-xs text-text-muted">
+					Attestation ID : {approveResult.attestation_hash}
+				</p>
+				<div class="flex flex-wrap gap-2">
+					<Button
+						variant="primary"
+						size="sm"
+						href={attestationApi.pdfUrl(approveResult.attestation_hash)}
+						target="_blank"
+						rel="noopener"
+					>
+						<Download size={14} strokeWidth={2} />
+						Telecharger le PDF
+					</Button>
+					<Button variant="secondary" size="sm" href="/validations/queue">
+						Retour a la queue
+					</Button>
+				</div>
+			</div>
+		{:else}
+			<div
+				class="mb-6 rounded-xl border border-primary/40 bg-primary/10 p-4 text-sm text-text-primary"
+			>
+				En approvant, tu genereras une attestation qui sera publique via /verify/{'{hash}'} et
+				telechargeable en PDF. Les fragments seront credites au challenger et a toi.
+			</div>
+
+			<section class="mb-6 rounded-2xl border border-border bg-surface-elevated p-5">
+				<h2 class="mb-3 text-base font-semibold">Reviewer la PR</h2>
+				<p class="mb-4 text-sm text-text-muted">
+					L'iframe est bloque par GitHub — utilise ce bouton pour ouvrir la PR dans un nouvel onglet.
+				</p>
+				<Button variant="primary" size="md" href={item.pr_url} target="_blank" rel="noopener">
+					<ExternalLink size={14} strokeWidth={2} />
+					Ouvrir la PR sur GitHub
+				</Button>
+
+				<div class="mt-5 flex items-center gap-3 border-t border-border pt-4">
+					{#if item.claimer_avatar_url}
+						<img src={item.claimer_avatar_url} alt="" class="h-9 w-9 rounded-full object-cover" />
+					{:else}
+						<div class="h-9 w-9 rounded-full bg-surface-overlay"></div>
+					{/if}
+					<div class="min-w-0 flex-1">
+						<p class="truncate text-sm font-medium">{item.claimer_display_name}</p>
+						<a
+							class="truncate text-xs text-text-muted hover:text-primary"
+							href={`/profile/${item.claimer_username}`}
+						>
+							@{item.claimer_username}
+						</a>
+					</div>
+				</div>
+			</section>
+
+			<section class="rounded-2xl border border-border bg-surface-elevated p-5">
+				<h2 class="mb-3 text-base font-semibold">Ton verdict</h2>
+
+				<label for="feedback" class="mb-1.5 block text-sm font-medium">
+					Feedback (obligatoire pour rejeter, 1-2000 caracteres)
+				</label>
+				<textarea
+					id="feedback"
+					bind:value={feedback}
+					maxlength="2000"
+					rows="6"
+					disabled={busy}
+					class="w-full rounded-xl border border-border bg-surface-overlay p-3 text-sm text-text-primary focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary"
+					placeholder="Explique ce qui va (ou pas) dans cette PR."
+				></textarea>
+				<p class="mt-1 text-xs text-text-muted">{feedback.length}/2000</p>
+
+				{#if submitError}
+					<p class="mt-3 text-sm text-error" role="alert">{submitError}</p>
+				{/if}
+
+				<div class="mt-4 flex flex-wrap gap-3">
+					<Button
+						variant="danger"
+						disabled={!canReject || busy}
+						loading={rejecting}
+						onclick={reject}
+					>
+						Rejeter
+					</Button>
+					<Button variant="primary" disabled={busy} loading={approving} onclick={approve}>
+						Approuver
+					</Button>
+				</div>
+			</section>
+		{/if}
+	{/if}
+</div>
diff --git a/src/routes/validations/[slice_id]/review/+page.ts b/src/routes/validations/[slice_id]/review/+page.ts
new file mode 100644
index 0000000..91d71c0
--- /dev/null
+++ b/src/routes/validations/[slice_id]/review/+page.ts
@@ -0,0 +1,8 @@
+import type { PageLoad } from './$types';
+
+// Cookies de session -> hydratation client-only.
+export const ssr = false;
+
+export const load: PageLoad = ({ params }) => {
+	return { sliceId: params.slice_id };
+};
diff --git a/src/routes/validations/queue/+page.svelte b/src/routes/validations/queue/+page.svelte
new file mode 100644
index 0000000..2b4cdb5
--- /dev/null
+++ b/src/routes/validations/queue/+page.svelte
@@ -0,0 +1,227 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { goto } from '$app/navigation';
+	import { validationApi, type ValidationQueueItem } from '$api/validation';
+	import { SkilluError } from '$api/client';
+	import { auth } from '$stores/auth.svelte';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import EmptyState from '$components/ui/EmptyState.svelte';
+	import Skeleton from '$components/ui/Skeleton.svelte';
+	import SegmentedControl from '$components/ui/SegmentedControl.svelte';
+	import { ExternalLink } from '@lucide/svelte';
+
+	type Filter = 'all' | 'mine';
+
+	type QueueState =
+		| { status: 'loading' }
+		| { status: 'ready'; items: ValidationQueueItem[] }
+		| { status: 'no-caps' }
+		| { status: 'error'; message: string };
+
+	let view: QueueState = $state({ status: 'loading' });
+
+	let filter: Filter = $state('all');
+	let pickingId: string | null = $state(null);
+
+	const DOMAIN_BADGE: Record<string, 'code' | 'design' | 'game' | 'security' | 'default'> = {
+		code: 'code',
+		design: 'design',
+		game: 'game',
+		security: 'security'
+	};
+
+	function domainVariant(domain: string) {
+		return DOMAIN_BADGE[domain?.toLowerCase()] ?? 'default';
+	}
+
+	function domainFromLabels(item: ValidationQueueItem): string {
+		return item.slice.labels.find((l) => DOMAIN_BADGE[l.toLowerCase()]) ?? 'code';
+	}
+
+	function shortRepo(url: string): string {
+		try {
+			const u = new URL(url);
+			return `${u.hostname}${u.pathname}`.replace(/^github\.com/, '');
+		} catch {
+			return url;
+		}
+	}
+
+	async function load() {
+		view = { status: 'loading' };
+		if (!auth.isAuthenticated) {
+			await goto('/auth/login?next=/validations/queue');
+			return;
+		}
+		try {
+			const res = await validationApi.queue();
+			view = { status: 'ready', items: res.data.items };
+		} catch (err) {
+			if (err instanceof SkilluError && err.status === 403) {
+				view = { status: 'no-caps' };
+				return;
+			}
+			view = {
+				status: 'error',
+				message: err instanceof SkilluError ? err.message : 'Impossible de charger la file.'
+			};
+		}
+	}
+
+	onMount(load);
+
+	async function pickup(item: ValidationQueueItem) {
+		pickingId = item.slice.id;
+		try {
+			await validationApi.pickup(item.slice.id);
+			if (view.status === 'ready') {
+				view = {
+					status: 'ready',
+					items: view.items.map((it) =>
+						it.slice.id === item.slice.id
+							? { ...it, picked_up_by_me: true, picked_up_at: new Date().toISOString() }
+							: it
+					)
+				};
+			}
+			toast.success('Challenge pris en charge.');
+		} catch (err) {
+			if (err instanceof SkilluError && err.status === 400) {
+				toast.error('Ce challenge a ete pris par un autre validateur.');
+			} else {
+				toast.error(err instanceof SkilluError ? err.message : 'Erreur lors du pick-up.');
+			}
+			// Refetch pour resynchroniser la file (le back est source de verite).
+			await load();
+		} finally {
+			pickingId = null;
+		}
+	}
+
+	let visibleItems = $derived.by(() => {
+		if (view.status !== 'ready') return [];
+		return filter === 'mine' ? view.items.filter((i) => i.picked_up_by_me) : view.items;
+	});
+</script>
+
+<svelte:head>
+	<title>File de validation — Skilluv</title>
+</svelte:head>
+
+<div class="mx-auto max-w-5xl px-4 py-8">
+	<header class="mb-6 flex flex-col gap-4 sm:flex-row sm:items-end sm:justify-between">
+		<div>
+			<h1 class="font-heading text-3xl font-bold" style:font-family="'Fraunces Variable', Georgia, serif">
+				File de validation
+			</h1>
+			<p class="mt-1 text-sm text-text-muted">
+				Les PRs en attente de validation dans tes domaines.
+			</p>
+		</div>
+
+		{#if view.status === 'ready' && view.items.length > 0}
+			<SegmentedControl
+				items={[
+					{ value: 'all', label: 'Toutes' },
+					{ value: 'mine', label: 'Prises par moi' }
+				]}
+				bind:value={filter}
+				size="sm"
+			/>
+		{/if}
+	</header>
+
+	{#if view.status === 'loading'}
+		<div class="grid grid-cols-1 gap-4 lg:grid-cols-2">
+			{#each Array(4) as _}
+				<Skeleton class="h-48 w-full rounded-2xl" />
+			{/each}
+		</div>
+	{:else if view.status === 'no-caps'}
+		<EmptyState
+			variant="lantern"
+			title="Tu n'es pas encore validateur"
+			body="Pour acceder a la file, il faut candidater comme validateur sur au moins un domaine."
+		>
+			{#snippet action()}
+				<Button variant="primary" href="/settings/validator-application/new">Candidater</Button>
+			{/snippet}
+		</EmptyState>
+	{:else if view.status === 'error'}
+		<div class="rounded-2xl border border-error/30 bg-error/5 p-6 text-sm text-error">
+			{view.message}
+			<div class="mt-3">
+				<Button variant="secondary" size="sm" onclick={load}>Reessayer</Button>
+			</div>
+		</div>
+	{:else if visibleItems.length === 0}
+		<EmptyState
+			variant="search"
+			title="Aucune PR a valider dans tes domaines"
+			body="Reviens plus tard, la file se remplit automatiquement."
+		/>
+	{:else}
+		<div class="grid grid-cols-1 gap-4 lg:grid-cols-2">
+			{#each visibleItems as item (item.slice.id)}
+				{@const domain = domainFromLabels(item)}
+				<article class="flex flex-col gap-3 rounded-2xl border border-border bg-surface-elevated p-5">
+					<div class="flex items-start justify-between gap-3">
+						<a
+							href={`/slices/${item.slice.id}`}
+							class="font-heading text-lg font-semibold leading-tight hover:text-primary"
+							style:font-family="'Fraunces Variable', Georgia, serif"
+						>
+							{item.slice.title}
+						</a>
+					</div>
+
+					<div class="flex flex-wrap items-center gap-2">
+						<Badge>{shortRepo(item.repo_url)}</Badge>
+						<Badge variant={domainVariant(domain)}>{domain}</Badge>
+						<Badge variant="accent">difficulte {item.slice.difficulty}</Badge>
+					</div>
+
+					<div class="flex items-center gap-3 border-t border-border pt-3">
+						{#if item.claimer_avatar_url}
+							<img
+								src={item.claimer_avatar_url}
+								alt=""
+								class="h-8 w-8 rounded-full object-cover"
+							/>
+						{:else}
+							<div class="h-8 w-8 rounded-full bg-surface-overlay"></div>
+						{/if}
+						<div class="min-w-0 flex-1">
+							<p class="truncate text-sm font-medium">{item.claimer_display_name}</p>
+							<p class="truncate text-xs text-text-muted">@{item.claimer_username}</p>
+						</div>
+					</div>
+
+					<div class="mt-1 flex flex-wrap items-center gap-2">
+						<Button variant="secondary" size="sm" href={item.pr_url} target="_blank" rel="noopener">
+							<ExternalLink size={14} strokeWidth={2} />
+							Voir la PR
+						</Button>
+
+						{#if item.picked_up_by_me}
+							<Button variant="primary" size="sm" href={`/validations/${item.slice.id}/review`}>
+								Reviewer
+							</Button>
+						{:else}
+							<Button
+								variant="primary"
+								size="sm"
+								loading={pickingId === item.slice.id}
+								onclick={() => pickup(item)}
+							>
+								Prendre en charge
+							</Button>
+						{/if}
+					</div>
+				</article>
+			{/each}
+		</div>
+	{/if}
+</div>
diff --git a/src/routes/validations/queue/+page.ts b/src/routes/validations/queue/+page.ts
new file mode 100644
index 0000000..71467e4
--- /dev/null
+++ b/src/routes/validations/queue/+page.ts
@@ -0,0 +1,5 @@
+// La queue de validation utilise les cookies de session ; on force
+// l'hydratation client-only pour eviter de rejouer la requete cote SSR
+// sans credentials (et pour aligner sur le pattern des autres pages
+// P26 validator).
+export const ssr = false;
diff --git a/src/routes/verify/[hash]/+page.svelte b/src/routes/verify/[hash]/+page.svelte
new file mode 100644
index 0000000..1b8813d
--- /dev/null
+++ b/src/routes/verify/[hash]/+page.svelte
@@ -0,0 +1,269 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import {
+		attestationApi,
+		type AttestationResponse,
+		type AttestationValid
+	} from '$api/attestation';
+	import { SkilluError } from '$api/client';
+	import { toast } from '$stores/toast.svelte';
+	import Button from '$components/ui/Button.svelte';
+	import Badge from '$components/ui/Badge.svelte';
+	import Skeleton from '$components/ui/Skeleton.svelte';
+	import { Download, Share2, ExternalLink, CheckCircle2, XCircle } from '@lucide/svelte';
+
+	let { data } = $props<{ data: { hash: string } }>();
+
+	let state = $state<
+		| { status: 'loading' }
+		| { status: 'ready'; result: AttestationResponse }
+		| { status: 'error'; message: string }
+	>({ status: 'loading' });
+
+	onMount(async () => {
+		try {
+			const result = await attestationApi.verify(data.hash);
+			state = { status: 'ready', result };
+		} catch (err) {
+			const message =
+				err instanceof SkilluError ? err.message : 'Impossible de charger cette attestation.';
+			state = { status: 'error', message };
+		}
+	});
+
+	function formatDate(iso: string): string {
+		try {
+			return new Intl.DateTimeFormat('fr-FR', {
+				dateStyle: 'long',
+				timeStyle: 'short'
+			}).format(new Date(iso));
+		} catch {
+			return iso;
+		}
+	}
+
+	const DOMAIN_BADGE: Record<string, 'code' | 'design' | 'game' | 'security' | 'default'> = {
+		code: 'code',
+		design: 'design',
+		game: 'game',
+		security: 'security'
+	};
+
+	function domainVariant(domain: string) {
+		return DOMAIN_BADGE[domain?.toLowerCase()] ?? 'default';
+	}
+
+	async function copyLink() {
+		const url = typeof window !== 'undefined' ? window.location.href : '';
+		try {
+			await navigator.clipboard.writeText(url);
+			toast.success('Lien copie dans le presse-papiers');
+		} catch {
+			// Fallback : selection manuelle via prompt
+			window.prompt('Copiez ce lien :', url);
+		}
+	}
+
+	function shortHash(h: string): string {
+		return h.length <= 12 ? h : `${h.slice(0, 6)}...${h.slice(-4)}`;
+	}
+
+	let valid = $derived(
+		state.status === 'ready' && state.result.valid === true
+			? (state.result as AttestationValid)
+			: null
+	);
+	let invalid = $derived(
+		state.status === 'ready' && state.result.valid === false ? state.result : null
+	);
+
+	let seoTitle = $derived(
+		valid
+			? `Attestation Skilluv verifiee — ${valid.challenger.display_name}`
+			: 'Attestation Skilluv'
+	);
+	let seoDescription = $derived(
+		valid
+			? `Attestation Skilluv de ${valid.challenger.display_name} pour une contribution validee`
+			: 'Verifiez une attestation Skilluv.'
+	);
+</script>
+
+<svelte:head>
+	<title>{seoTitle}</title>
+	<meta name="description" content={seoDescription} />
+	<meta property="og:title" content={seoTitle} />
+	<meta property="og:description" content={seoDescription} />
+	<meta property="og:type" content="article" />
+	<meta name="twitter:card" content="summary_large_image" />
+	<meta name="twitter:title" content={seoTitle} />
+	<meta name="twitter:description" content={seoDescription} />
+</svelte:head>
+
+<div class="mx-auto max-w-2xl px-4 py-10 sm:py-16">
+	{#if state.status === 'loading'}
+		<div class="rounded-2xl bg-surface-elevated p-6 sm:p-10 space-y-4">
+			<Skeleton class="h-8 w-3/4" />
+			<Skeleton class="h-4 w-1/2" />
+			<div class="flex items-center gap-3 pt-4">
+				<Skeleton class="h-12 w-12 rounded-full" />
+				<div class="flex-1 space-y-2">
+					<Skeleton class="h-4 w-40" />
+					<Skeleton class="h-3 w-24" />
+				</div>
+			</div>
+			<Skeleton class="h-24 w-full" />
+		</div>
+	{:else if state.status === 'error'}
+		<div class="rounded-2xl bg-surface-elevated p-6 sm:p-10 space-y-4">
+			<div class="flex items-center gap-3">
+				<XCircle class="text-error" size={28} />
+				<h1 class="font-heading text-2xl sm:text-3xl text-text-primary">
+					Erreur de chargement
+				</h1>
+			</div>
+			<p class="text-text-muted">{state.message}</p>
+			<Button variant="primary" href="/">Retour a skill-uv.com</Button>
+		</div>
+	{:else if invalid}
+		<div class="rounded-2xl bg-surface-elevated p-6 sm:p-10 space-y-6">
+			<div class="flex flex-wrap items-center gap-3">
+				<h1 class="font-heading text-2xl sm:text-3xl text-text-primary">
+					Attestation introuvable
+				</h1>
+				<Badge variant="error">
+					<XCircle size={12} strokeWidth={2.5} />
+					invalide
+				</Badge>
+			</div>
+			<p class="text-text-muted">
+				{invalid.reason === 'malformed attestation hash'
+					? 'Ce lien ne correspond pas au format d’une attestation Skilluv.'
+					: invalid.reason === 'unknown attestation hash'
+						? 'Aucune attestation ne correspond a ce hash. Elle a peut-etre ete revoquee ou n’a jamais existe.'
+						: invalid.reason}
+			</p>
+			<Button variant="primary" href="/">Retour a skill-uv.com</Button>
+		</div>
+	{:else if valid}
+		<article class="rounded-2xl bg-surface-elevated p-6 sm:p-10 space-y-8">
+			<header class="space-y-3">
+				<div class="flex flex-wrap items-center gap-3">
+					<h1 class="font-heading text-2xl sm:text-3xl text-text-primary">
+						Attestation Skilluv verifiee
+					</h1>
+					<Badge variant="success">
+						<CheckCircle2 size={12} strokeWidth={2.5} />
+						verified
+					</Badge>
+				</div>
+				<p class="text-sm text-text-muted">
+					Delivree le {formatDate(valid.validated_at)}
+				</p>
+			</header>
+
+			<section class="space-y-3">
+				<h2 class="text-xs font-semibold uppercase tracking-wider text-text-subtle">
+					Contributeur
+				</h2>
+				<a
+					href={`/profile/${valid.challenger.username}`}
+					class="flex items-center gap-3 rounded-xl p-2 -m-2 hover:bg-surface-overlay transition-colors"
+				>
+					{#if valid.challenger.avatar_url}
+						<img
+							src={valid.challenger.avatar_url}
+							alt={valid.challenger.display_name}
+							class="h-12 w-12 rounded-full object-cover"
+						/>
+					{:else}
+						<div
+							class="flex h-12 w-12 items-center justify-center rounded-full bg-primary/15 text-primary font-semibold"
+						>
+							{valid.challenger.display_name.slice(0, 1).toUpperCase()}
+						</div>
+					{/if}
+					<div>
+						<div class="font-semibold text-text-primary">{valid.challenger.display_name}</div>
+						<div class="text-sm text-text-muted">@{valid.challenger.username}</div>
+					</div>
+				</a>
+			</section>
+
+			<section class="space-y-3">
+				<h2 class="text-xs font-semibold uppercase tracking-wider text-text-subtle">
+					Validee par
+				</h2>
+				<a
+					href={`/profile/${valid.validator.username}`}
+					class="flex items-center gap-3 rounded-xl p-2 -m-2 hover:bg-surface-overlay transition-colors"
+				>
+					{#if valid.validator.avatar_url}
+						<img
+							src={valid.validator.avatar_url}
+							alt={valid.validator.display_name}
+							class="h-10 w-10 rounded-full object-cover"
+						/>
+					{:else}
+						<div
+							class="flex h-10 w-10 items-center justify-center rounded-full bg-accent/15 text-accent font-semibold"
+						>
+							{valid.validator.display_name.slice(0, 1).toUpperCase()}
+						</div>
+					{/if}
+					<div>
+						<div class="font-medium text-text-primary">{valid.validator.display_name}</div>
+						<div class="text-sm text-text-muted">@{valid.validator.username}</div>
+					</div>
+				</a>
+			</section>
+
+			<section class="space-y-3">
+				<h2 class="text-xs font-semibold uppercase tracking-wider text-text-subtle">
+					Contribution
+				</h2>
+				<div class="flex flex-wrap items-center gap-2">
+					<Badge variant={domainVariant(valid.domain)}>{valid.domain}</Badge>
+					<Badge variant="default">difficulte {valid.difficulty}/5</Badge>
+					{#if valid.merged_upstream}
+						<Badge variant="accent">Merge upstream</Badge>
+					{/if}
+				</div>
+				<p class="text-sm text-text-muted">
+					Repo : <span class="font-mono text-text-primary">{valid.repo}</span>
+				</p>
+				<Button variant="secondary" href={valid.pr_url} target="_blank" rel="noopener noreferrer">
+					<ExternalLink size={16} />
+					Voir la PR
+				</Button>
+			</section>
+
+			<section class="flex flex-wrap gap-3 border-t border-border pt-6">
+				<Button
+					variant="primary"
+					href={attestationApi.pdfUrl(data.hash)}
+					target="_blank"
+					rel="noopener noreferrer"
+					download
+				>
+					<Download size={16} />
+					Telecharger le PDF
+				</Button>
+				<Button variant="secondary" onclick={copyLink}>
+					<Share2 size={16} />
+					Partager
+				</Button>
+			</section>
+
+			<footer class="rounded-xl border border-border bg-surface-overlay/50 p-4">
+				<div class="text-xs uppercase tracking-wider text-text-subtle mb-1">
+					Attestation ID
+				</div>
+				<code
+					class="font-mono text-xs text-text-muted break-all"
+					title={data.hash}
+				>{shortHash(data.hash)}</code>
+			</footer>
+		</article>
+	{/if}
+</div>
diff --git a/src/routes/verify/[hash]/+page.ts b/src/routes/verify/[hash]/+page.ts
new file mode 100644
index 0000000..218dbec
--- /dev/null
+++ b/src/routes/verify/[hash]/+page.ts
@@ -0,0 +1,12 @@
+import type { PageLoad } from './$types';
+
+// L'endpoint public `/verify/{hash}` est servi par le backend derriere
+// le meme host (Caddy). Pour eviter que le SvelteKit SSR ne se resolve
+// lui-meme sur cette route (collision avec le +page.svelte), on force
+// l'hydratation client-only. La page reste indexable via les meta OG
+// injectees a partir du state client.
+export const ssr = false;
+
+export const load: PageLoad = ({ params }) => {
+	return { hash: params.hash };
+};
diff --git a/tests/e2e/parcours/dashboard-slices.spec.ts b/tests/e2e/parcours/dashboard-slices.spec.ts
new file mode 100644
index 0000000..2022841
--- /dev/null
+++ b/tests/e2e/parcours/dashboard-slices.spec.ts
@@ -0,0 +1,17 @@
+/**
+ * P26 v2 SKI-94 — dashboard "mes challenges" + reco feed.
+ * Skip permanent : back P26 non deploye sur staging.
+ */
+import { test, expect } from '@playwright/test';
+
+const HAS_BACK = Boolean(process.env.PUBLIC_API_BASE_URL);
+
+test.describe('@parcours dashboard-slices', () => {
+	test.skip(!HAS_BACK, 'requires PUBLIC_API_BASE_URL');
+
+	test('dashboard slices accessible', async ({ page }) => {
+		test.skip(true, 'P26 v2 back not deployed: /api/me/feed/challenges (SKI-121) + /api/users/me/slices en Todo');
+		await page.goto('/dashboard/slices');
+		await expect(page.locator('h1').first()).toBeVisible({ timeout: 15_000 });
+	});
+});
diff --git a/tests/e2e/parcours/for-maintainers.spec.ts b/tests/e2e/parcours/for-maintainers.spec.ts
new file mode 100644
index 0000000..12c2f1d
--- /dev/null
+++ b/tests/e2e/parcours/for-maintainers.spec.ts
@@ -0,0 +1,16 @@
+/**
+ * P26 v2 SKI-105 — landing publique /for-maintainers + digest opt-in.
+ */
+import { test, expect } from '@playwright/test';
+
+const HAS_BACK = Boolean(process.env.PUBLIC_API_BASE_URL);
+
+test.describe('@parcours for-maintainers', () => {
+	test.skip(!HAS_BACK, 'requires PUBLIC_API_BASE_URL');
+
+	test('landing for-maintainers accessible + form subscribe visible', async ({ page }) => {
+		await page.goto('/for-maintainers');
+		await page.waitForLoadState('domcontentloaded');
+		await expect(page.locator('h1').first()).toBeVisible({ timeout: 15_000 });
+	});
+});
diff --git a/tests/e2e/parcours/slice-detail.spec.ts b/tests/e2e/parcours/slice-detail.spec.ts
new file mode 100644
index 0000000..a187200
--- /dev/null
+++ b/tests/e2e/parcours/slice-detail.spec.ts
@@ -0,0 +1,18 @@
+/**
+ * P26 v2 SKI-93 — page /slices/[id] avec workflow claim/submit-pr.
+ *
+ * Skip tant que /api/slices/{id} n'est pas expose (SKI-72..91 en Todo).
+ */
+import { test, expect } from '@playwright/test';
+
+const HAS_BACK = Boolean(process.env.PUBLIC_API_BASE_URL);
+
+test.describe('@parcours slice-detail', () => {
+	test.skip(!HAS_BACK, 'requires PUBLIC_API_BASE_URL');
+
+	test('page slice detail rendue', async ({ page }) => {
+		test.skip(true, 'P26 v2 back not deployed: /api/slices/{id} SKI-72..91 en Todo');
+		await page.goto('/slices/00000000-0000-0000-0000-000000000000');
+		await expect(page.locator('h1').first()).toBeVisible({ timeout: 15_000 });
+	});
+});
diff --git a/tests/e2e/parcours/validations-queue.spec.ts b/tests/e2e/parcours/validations-queue.spec.ts
new file mode 100644
index 0000000..eb18453
--- /dev/null
+++ b/tests/e2e/parcours/validations-queue.spec.ts
@@ -0,0 +1,17 @@
+/**
+ * P26 v2 SKI-95 — validator queue + review pages.
+ * Skip permanent : back P26 non deploye sur staging.
+ */
+import { test, expect } from '@playwright/test';
+
+const HAS_BACK = Boolean(process.env.PUBLIC_API_BASE_URL);
+
+test.describe('@parcours validations-queue', () => {
+	test.skip(!HAS_BACK, 'requires PUBLIC_API_BASE_URL');
+
+	test('page validations/queue accessible', async ({ page }) => {
+		test.skip(true, 'P26 v2 back not deployed: /api/me/validation/queue SKI-86 en Todo');
+		await page.goto('/validations/queue');
+		await expect(page.locator('h1').first()).toBeVisible({ timeout: 15_000 });
+	});
+});
diff --git a/tests/e2e/parcours/validator-application.spec.ts b/tests/e2e/parcours/validator-application.spec.ts
new file mode 100644
index 0000000..e71e5d0
--- /dev/null
+++ b/tests/e2e/parcours/validator-application.spec.ts
@@ -0,0 +1,23 @@
+/**
+ * P26 v2 SKI-96 — flow candidature validateur.
+ * Skip permanent : back P26 non deploye sur staging.
+ */
+import { test, expect } from '@playwright/test';
+
+const HAS_BACK = Boolean(process.env.PUBLIC_API_BASE_URL);
+
+test.describe('@parcours validator-application', () => {
+	test.skip(!HAS_BACK, 'requires PUBLIC_API_BASE_URL');
+
+	test('page candidature validateur accessible', async ({ page }) => {
+		test.skip(true, 'P26 v2 back not deployed: /api/me/apply-as-validator SKI-81 en Todo');
+		await page.goto('/settings/validator-application/new');
+		await expect(page.locator('h1').first()).toBeVisible({ timeout: 15_000 });
+	});
+
+	test('page my-validator-applications accessible', async ({ page }) => {
+		test.skip(true, 'P26 v2 back not deployed: /api/me/validator-applications SKI-81 en Todo');
+		await page.goto('/settings/my-validator-applications');
+		await expect(page.locator('h1').first()).toBeVisible({ timeout: 15_000 });
+	});
+});
diff --git a/tests/e2e/parcours/verify-hash.spec.ts b/tests/e2e/parcours/verify-hash.spec.ts
new file mode 100644
index 0000000..6eeb1e2
--- /dev/null
+++ b/tests/e2e/parcours/verify-hash.spec.ts
@@ -0,0 +1,19 @@
+/**
+ * P26 v2 SKI-103 — page publique /verify/[hash].
+ *
+ * Skip permanent tant que le back n'expose pas /verify/{hash} (SKI-115 en Todo).
+ * A reactiver quand le back staging repond a l'endpoint.
+ */
+import { test, expect } from '@playwright/test';
+
+const HAS_BACK = Boolean(process.env.PUBLIC_API_BASE_URL);
+
+test.describe('@parcours verify-hash', () => {
+	test.skip(!HAS_BACK, 'requires PUBLIC_API_BASE_URL');
+
+	test('page verify accessible + rend etat invalid pour hash bidon', async ({ page }) => {
+		test.skip(true, 'P26 v2 back not deployed: /verify/{hash} endpoint SKI-115 en Todo');
+		await page.goto('/verify/deadbeef');
+		await expect(page.locator('h1').first()).toBeVisible({ timeout: 15_000 });
+	});
+});