From a468bdad41ee590a4819e1002589cd4a3e51da10 Mon Sep 17 00:00:00 2001
From: Pascal Garber <pascal@artandcode.studio>
Date: Thu, 15 Oct 2026 15:52:09 +0200
Subject: [PATCH 1/2] design(achievements): draft seal artwork

---
 .../achievements/first-chapter-locked.svg     | 27 +++++++++++++++++
 .../data/achievements/first-chapter.svg       | 27 +++++++++++++++++
 .../achievements/first-program-locked.svg     | 30 +++++++++++++++++++
 .../data/achievements/first-program.svg       | 30 +++++++++++++++++++
 .../data/achievements/game-played-locked.svg  | 26 ++++++++++++++++
 .../data/achievements/game-played.svg         | 26 ++++++++++++++++
 .../data/achievements/open-source-locked.svg  | 29 ++++++++++++++++++
 .../data/achievements/open-source.svg         | 29 ++++++++++++++++++
 .../data/achievements/supporter-locked.svg    | 26 ++++++++++++++++
 .../app-gnome/data/achievements/supporter.svg | 26 ++++++++++++++++
 10 files changed, 276 insertions(+)
 create mode 100644 packages/app-gnome/data/achievements/first-chapter-locked.svg
 create mode 100644 packages/app-gnome/data/achievements/first-chapter.svg
 create mode 100644 packages/app-gnome/data/achievements/first-program-locked.svg
 create mode 100644 packages/app-gnome/data/achievements/first-program.svg
 create mode 100644 packages/app-gnome/data/achievements/game-played-locked.svg
 create mode 100644 packages/app-gnome/data/achievements/game-played.svg
 create mode 100644 packages/app-gnome/data/achievements/open-source-locked.svg
 create mode 100644 packages/app-gnome/data/achievements/open-source.svg
 create mode 100644 packages/app-gnome/data/achievements/supporter-locked.svg
 create mode 100644 packages/app-gnome/data/achievements/supporter.svg

diff --git a/packages/app-gnome/data/achievements/first-chapter-locked.svg b/packages/app-gnome/data/achievements/first-chapter-locked.svg
new file mode 100644
index 00000000..d4e015f4
--- /dev/null
+++ b/packages/app-gnome/data/achievements/first-chapter-locked.svg
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "first-chapter", locked state — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="book" d="M64 46 C57 39 48 37 38 39 V80 C48 78 57 80 64 86
+        C71 80 80 78 90 80 V39 C80 37 71 39 64 46 Z" fill="#5e5c64"/>
+  <rect id="book-spine" x="60" y="44" width="8" height="42" fill="#d5d3d0"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/first-chapter.svg b/packages/app-gnome/data/achievements/first-chapter.svg
new file mode 100644
index 00000000..4de341db
--- /dev/null
+++ b/packages/app-gnome/data/achievements/first-chapter.svg
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "first-chapter" — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="book" d="M64 46 C57 39 48 37 38 39 V80 C48 78 57 80 64 86
+        C71 80 80 78 90 80 V39 C80 37 71 39 64 46 Z" fill="#1a5fb4"/>
+  <rect id="book-spine" x="60" y="44" width="8" height="42" fill="#a8cdfc"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/first-program-locked.svg b/packages/app-gnome/data/achievements/first-program-locked.svg
new file mode 100644
index 00000000..d5402de8
--- /dev/null
+++ b/packages/app-gnome/data/achievements/first-program-locked.svg
@@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "first-program", locked state — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <rect id="chip-leg-l1" x="32" y="46" width="16" height="8" rx="4" fill="#5e5c64"/>
+  <rect id="chip-leg-r1" x="80" y="46" width="16" height="8" rx="4" fill="#5e5c64"/>
+  <rect id="chip-leg-l2" x="32" y="66" width="16" height="8" rx="4" fill="#5e5c64"/>
+  <rect id="chip-leg-r2" x="80" y="66" width="16" height="8" rx="4" fill="#5e5c64"/>
+  <rect id="chip-body" x="42" y="36" width="44" height="48" rx="7" fill="#5e5c64"/>
+  <rect id="chip-die" x="52" y="48" width="24" height="24" rx="4" fill="#d5d3d0"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/first-program.svg b/packages/app-gnome/data/achievements/first-program.svg
new file mode 100644
index 00000000..f28b440e
--- /dev/null
+++ b/packages/app-gnome/data/achievements/first-program.svg
@@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "first-program" — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <rect id="chip-leg-l1" x="32" y="46" width="16" height="8" rx="4" fill="#1a5fb4"/>
+  <rect id="chip-leg-r1" x="80" y="46" width="16" height="8" rx="4" fill="#1a5fb4"/>
+  <rect id="chip-leg-l2" x="32" y="66" width="16" height="8" rx="4" fill="#1a5fb4"/>
+  <rect id="chip-leg-r2" x="80" y="66" width="16" height="8" rx="4" fill="#1a5fb4"/>
+  <rect id="chip-body" x="42" y="36" width="44" height="48" rx="7" fill="#1a5fb4"/>
+  <rect id="chip-die" x="52" y="48" width="24" height="24" rx="4" fill="#a8cdfc"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/game-played-locked.svg b/packages/app-gnome/data/achievements/game-played-locked.svg
new file mode 100644
index 00000000..cc690fb3
--- /dev/null
+++ b/packages/app-gnome/data/achievements/game-played-locked.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "game-played", locked state — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="dpad" d="M52 30 H76 V48 H94 V72 H76 V90 H52 V72 H34 V48 H52 Z" fill="#5e5c64"/>
+  <circle id="dpad-hub" cx="64" cy="60" r="7" fill="#d5d3d0"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/game-played.svg b/packages/app-gnome/data/achievements/game-played.svg
new file mode 100644
index 00000000..61b30dcd
--- /dev/null
+++ b/packages/app-gnome/data/achievements/game-played.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "game-played" — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="dpad" d="M52 30 H76 V48 H94 V72 H76 V90 H52 V72 H34 V48 H52 Z" fill="#1a5fb4"/>
+  <circle id="dpad-hub" cx="64" cy="60" r="7" fill="#a8cdfc"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/open-source-locked.svg b/packages/app-gnome/data/achievements/open-source-locked.svg
new file mode 100644
index 00000000..1f2aecdd
--- /dev/null
+++ b/packages/app-gnome/data/achievements/open-source-locked.svg
@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "open-source", locked state — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="branch-bars" d="M64 80 V58 M64 58 L48 46 M64 58 L80 46" fill="none"
+        stroke="#5e5c64" stroke-width="9" stroke-linecap="round" stroke-linejoin="round"/>
+  <circle id="branch-root" cx="64" cy="80" r="9" fill="#5e5c64"/>
+  <circle id="branch-left" cx="48" cy="44" r="9" fill="#5e5c64"/>
+  <circle id="branch-right" cx="80" cy="44" r="9" fill="#5e5c64"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/open-source.svg b/packages/app-gnome/data/achievements/open-source.svg
new file mode 100644
index 00000000..2d8352e3
--- /dev/null
+++ b/packages/app-gnome/data/achievements/open-source.svg
@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "open-source" — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="branch-bars" d="M64 80 V58 M64 58 L48 46 M64 58 L80 46" fill="none"
+        stroke="#1a5fb4" stroke-width="9" stroke-linecap="round" stroke-linejoin="round"/>
+  <circle id="branch-root" cx="64" cy="80" r="9" fill="#1a5fb4"/>
+  <circle id="branch-left" cx="48" cy="44" r="9" fill="#1a5fb4"/>
+  <circle id="branch-right" cx="80" cy="44" r="9" fill="#1a5fb4"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/supporter-locked.svg b/packages/app-gnome/data/achievements/supporter-locked.svg
new file mode 100644
index 00000000..48e04b8f
--- /dev/null
+++ b/packages/app-gnome/data/achievements/supporter-locked.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "supporter", locked state — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="heart" d="M64 82 C52 72 38 62 38 50 C38 42 44 38 51 38 C57 38 62 42 64 46
+        C66 42 71 38 77 38 C84 38 90 42 90 50 C90 62 76 72 64 82 Z" fill="#5e5c64"/>
+  </g>
+</svg>
diff --git a/packages/app-gnome/data/achievements/supporter.svg b/packages/app-gnome/data/achievements/supporter.svg
new file mode 100644
index 00000000..983da0f6
--- /dev/null
+++ b/packages/app-gnome/data/achievements/supporter.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+Achievement draft "supporter" — learn6502.
+Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
+the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
+a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+-->
+<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+     xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
+    </linearGradient>
+    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
+    </linearGradient>
+  </defs>
+  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
+  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
+  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
+  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
+  <g id="motif" transform="translate(0,-2)">
+  <path id="heart" d="M64 82 C52 72 38 62 38 50 C38 42 44 38 51 38 C57 38 62 42 64 46
+        C66 42 71 38 77 38 C84 38 90 42 90 50 C90 62 76 72 64 82 Z" fill="#1a5fb4"/>
+  </g>
+</svg>

From fb9d5c7204c6b3426696aa1079c87b430394f047 Mon Sep 17 00:00:00 2001
From: Pascal Garber <pascal@artandcode.studio>
Date: Thu, 15 Oct 2026 17:03:57 +0200
Subject: [PATCH 2/2] design(achievements): rework as per-app objects

---
 .../achievements/first-chapter-locked.svg     | 36 ++++++++---------
 .../data/achievements/first-chapter.svg       | 36 ++++++++---------
 .../achievements/first-program-locked.svg     | 39 ++++++++-----------
 .../data/achievements/first-program.svg       | 39 ++++++++-----------
 .../data/achievements/game-played-locked.svg  | 35 ++++++++---------
 .../data/achievements/game-played.svg         | 35 ++++++++---------
 .../data/achievements/open-source-locked.svg  | 38 ++++++++----------
 .../data/achievements/open-source.svg         | 38 ++++++++----------
 .../data/achievements/supporter-locked.svg    | 35 ++++++++---------
 .../app-gnome/data/achievements/supporter.svg | 39 ++++++++++---------
 10 files changed, 174 insertions(+), 196 deletions(-)

diff --git a/packages/app-gnome/data/achievements/first-chapter-locked.svg b/packages/app-gnome/data/achievements/first-chapter-locked.svg
index d4e015f4..b047fe1c 100644
--- a/packages/app-gnome/data/achievements/first-chapter-locked.svg
+++ b/packages/app-gnome/data/achievements/first-chapter-locked.svg
@@ -1,27 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "first-chapter", locked state — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a9bad3"/><stop offset="1" stop-color="#8e9fba"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e3e9f2"/><stop offset="1" stop-color="#d2dae7"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="book" d="M64 46 C57 39 48 37 38 39 V80 C48 78 57 80 64 86
-        C71 80 80 78 90 80 V39 C80 37 71 39 64 46 Z" fill="#5e5c64"/>
-  <rect id="book-spine" x="60" y="44" width="8" height="42" fill="#d5d3d0"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#5d6c84"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#5d6c84"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#c3cfe1"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#5d6c84" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M0 -6 C-6 -12 -13 -14 -20 -13 V14 C-13 13 -6 14 0 19 C6 14 13 13 20 14 V-13 C13 -14 6 -12 0 -6 Z" fill="#5d6c84"/><rect x="-3" y="-7" width="6" height="26" fill="#d2dae7"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/first-chapter.svg b/packages/app-gnome/data/achievements/first-chapter.svg
index 4de341db..2690af84 100644
--- a/packages/app-gnome/data/achievements/first-chapter.svg
+++ b/packages/app-gnome/data/achievements/first-chapter.svg
@@ -1,27 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "first-chapter" — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#3584e4"/><stop offset="1" stop-color="#1a5fb4"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffffff"/><stop offset="1" stop-color="#dceafd"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="book" d="M64 46 C57 39 48 37 38 39 V80 C48 78 57 80 64 86
-        C71 80 80 78 90 80 V39 C80 37 71 39 64 46 Z" fill="#1a5fb4"/>
-  <rect id="book-spine" x="60" y="44" width="8" height="42" fill="#a8cdfc"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#103b74"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#103b74"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#84bbfd"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#84bbfd"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#1a5fb4" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M0 -6 C-6 -12 -13 -14 -20 -13 V14 C-13 13 -6 14 0 19 C6 14 13 13 20 14 V-13 C13 -14 6 -12 0 -6 Z" fill="#1a5fb4"/><rect x="-3" y="-7" width="6" height="26" fill="#dceafd"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/first-program-locked.svg b/packages/app-gnome/data/achievements/first-program-locked.svg
index d5402de8..2a53043e 100644
--- a/packages/app-gnome/data/achievements/first-program-locked.svg
+++ b/packages/app-gnome/data/achievements/first-program-locked.svg
@@ -1,30 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "first-program", locked state — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a9bad3"/><stop offset="1" stop-color="#8e9fba"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e3e9f2"/><stop offset="1" stop-color="#d2dae7"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <rect id="chip-leg-l1" x="32" y="46" width="16" height="8" rx="4" fill="#5e5c64"/>
-  <rect id="chip-leg-r1" x="80" y="46" width="16" height="8" rx="4" fill="#5e5c64"/>
-  <rect id="chip-leg-l2" x="32" y="66" width="16" height="8" rx="4" fill="#5e5c64"/>
-  <rect id="chip-leg-r2" x="80" y="66" width="16" height="8" rx="4" fill="#5e5c64"/>
-  <rect id="chip-body" x="42" y="36" width="44" height="48" rx="7" fill="#5e5c64"/>
-  <rect id="chip-die" x="52" y="48" width="24" height="24" rx="4" fill="#d5d3d0"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#5d6c84"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#5d6c84"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#c3cfe1"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#5d6c84" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><rect x="-23" y="-10" width="9" height="6" rx="3" fill="#5d6c84"/><rect x="14" y="-10" width="9" height="6" rx="3" fill="#5d6c84"/><rect x="-23" y="4" width="9" height="6" rx="3" fill="#5d6c84"/><rect x="14" y="4" width="9" height="6" rx="3" fill="#5d6c84"/><rect x="-15" y="-15" width="30" height="30" rx="4" fill="#5d6c84"/><rect x="-7" y="-7" width="14" height="14" rx="3" fill="#d2dae7"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/first-program.svg b/packages/app-gnome/data/achievements/first-program.svg
index f28b440e..6656cc10 100644
--- a/packages/app-gnome/data/achievements/first-program.svg
+++ b/packages/app-gnome/data/achievements/first-program.svg
@@ -1,30 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "first-program" — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#3584e4"/><stop offset="1" stop-color="#1a5fb4"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffffff"/><stop offset="1" stop-color="#dceafd"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <rect id="chip-leg-l1" x="32" y="46" width="16" height="8" rx="4" fill="#1a5fb4"/>
-  <rect id="chip-leg-r1" x="80" y="46" width="16" height="8" rx="4" fill="#1a5fb4"/>
-  <rect id="chip-leg-l2" x="32" y="66" width="16" height="8" rx="4" fill="#1a5fb4"/>
-  <rect id="chip-leg-r2" x="80" y="66" width="16" height="8" rx="4" fill="#1a5fb4"/>
-  <rect id="chip-body" x="42" y="36" width="44" height="48" rx="7" fill="#1a5fb4"/>
-  <rect id="chip-die" x="52" y="48" width="24" height="24" rx="4" fill="#a8cdfc"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#103b74"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#103b74"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#84bbfd"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#84bbfd"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#1a5fb4" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><rect x="-23" y="-10" width="9" height="6" rx="3" fill="#1a5fb4"/><rect x="14" y="-10" width="9" height="6" rx="3" fill="#1a5fb4"/><rect x="-23" y="4" width="9" height="6" rx="3" fill="#1a5fb4"/><rect x="14" y="4" width="9" height="6" rx="3" fill="#1a5fb4"/><rect x="-15" y="-15" width="30" height="30" rx="4" fill="#1a5fb4"/><rect x="-7" y="-7" width="14" height="14" rx="3" fill="#dceafd"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/game-played-locked.svg b/packages/app-gnome/data/achievements/game-played-locked.svg
index cc690fb3..fd1fe123 100644
--- a/packages/app-gnome/data/achievements/game-played-locked.svg
+++ b/packages/app-gnome/data/achievements/game-played-locked.svg
@@ -1,26 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "game-played", locked state — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a9bad3"/><stop offset="1" stop-color="#8e9fba"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e3e9f2"/><stop offset="1" stop-color="#d2dae7"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="dpad" d="M52 30 H76 V48 H94 V72 H76 V90 H52 V72 H34 V48 H52 Z" fill="#5e5c64"/>
-  <circle id="dpad-hub" cx="64" cy="60" r="7" fill="#d5d3d0"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#5d6c84"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#5d6c84"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#c3cfe1"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#5d6c84" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M-7 -18 H7 V-7 H18 V7 H7 V18 H-7 V7 H-18 V-7 H-7 Z" fill="#5d6c84"/><circle cx="0" cy="0" r="4" fill="#d2dae7"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/game-played.svg b/packages/app-gnome/data/achievements/game-played.svg
index 61b30dcd..431fc1e5 100644
--- a/packages/app-gnome/data/achievements/game-played.svg
+++ b/packages/app-gnome/data/achievements/game-played.svg
@@ -1,26 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "game-played" — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#3584e4"/><stop offset="1" stop-color="#1a5fb4"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffffff"/><stop offset="1" stop-color="#dceafd"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="dpad" d="M52 30 H76 V48 H94 V72 H76 V90 H52 V72 H34 V48 H52 Z" fill="#1a5fb4"/>
-  <circle id="dpad-hub" cx="64" cy="60" r="7" fill="#a8cdfc"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#103b74"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#103b74"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#84bbfd"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#84bbfd"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#1a5fb4" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M-7 -18 H7 V-7 H18 V7 H7 V18 H-7 V7 H-18 V-7 H-7 Z" fill="#1a5fb4"/><circle cx="0" cy="0" r="4" fill="#dceafd"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/open-source-locked.svg b/packages/app-gnome/data/achievements/open-source-locked.svg
index 1f2aecdd..4be6c722 100644
--- a/packages/app-gnome/data/achievements/open-source-locked.svg
+++ b/packages/app-gnome/data/achievements/open-source-locked.svg
@@ -1,29 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "open-source", locked state — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a9bad3"/><stop offset="1" stop-color="#8e9fba"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e3e9f2"/><stop offset="1" stop-color="#d2dae7"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="branch-bars" d="M64 80 V58 M64 58 L48 46 M64 58 L80 46" fill="none"
-        stroke="#5e5c64" stroke-width="9" stroke-linecap="round" stroke-linejoin="round"/>
-  <circle id="branch-root" cx="64" cy="80" r="9" fill="#5e5c64"/>
-  <circle id="branch-left" cx="48" cy="44" r="9" fill="#5e5c64"/>
-  <circle id="branch-right" cx="80" cy="44" r="9" fill="#5e5c64"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#5d6c84"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#5d6c84"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#c3cfe1"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#5d6c84" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M0 16 V-2 M0 -2 L-12 -11 M0 -2 L12 -11" fill="none" stroke="#5d6c84" stroke-width="6" stroke-linecap="round"/><circle cx="0" cy="16" r="6" fill="#5d6c84"/><circle cx="-13" cy="-13" r="6" fill="#5d6c84"/><circle cx="13" cy="-13" r="6" fill="#5d6c84"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/open-source.svg b/packages/app-gnome/data/achievements/open-source.svg
index 2d8352e3..458cb473 100644
--- a/packages/app-gnome/data/achievements/open-source.svg
+++ b/packages/app-gnome/data/achievements/open-source.svg
@@ -1,29 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "open-source" — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#3584e4"/><stop offset="1" stop-color="#1a5fb4"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffffff"/><stop offset="1" stop-color="#dceafd"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="branch-bars" d="M64 80 V58 M64 58 L48 46 M64 58 L80 46" fill="none"
-        stroke="#1a5fb4" stroke-width="9" stroke-linecap="round" stroke-linejoin="round"/>
-  <circle id="branch-root" cx="64" cy="80" r="9" fill="#1a5fb4"/>
-  <circle id="branch-left" cx="48" cy="44" r="9" fill="#1a5fb4"/>
-  <circle id="branch-right" cx="80" cy="44" r="9" fill="#1a5fb4"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#103b74"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#103b74"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#84bbfd"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#84bbfd"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#84bbfd"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#84bbfd"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#1a5fb4" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M0 16 V-2 M0 -2 L-12 -11 M0 -2 L12 -11" fill="none" stroke="#1a5fb4" stroke-width="6" stroke-linecap="round"/><circle cx="0" cy="16" r="6" fill="#1a5fb4"/><circle cx="-13" cy="-13" r="6" fill="#1a5fb4"/><circle cx="13" cy="-13" r="6" fill="#1a5fb4"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/supporter-locked.svg b/packages/app-gnome/data/achievements/supporter-locked.svg
index 48e04b8f..c4e985b9 100644
--- a/packages/app-gnome/data/achievements/supporter-locked.svg
+++ b/packages/app-gnome/data/achievements/supporter-locked.svg
@@ -1,26 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "supporter", locked state — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#b5b3b0"/><stop offset="1" stop-color="#9a9996"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#e6e4e1"/><stop offset="1" stop-color="#d5d3d0"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a9bad3"/><stop offset="1" stop-color="#8e9fba"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e3e9f2"/><stop offset="1" stop-color="#d2dae7"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#5e5c64"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#5e5c64"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="heart" d="M64 82 C52 72 38 62 38 50 C38 42 44 38 51 38 C57 38 62 42 64 46
-        C66 42 71 38 77 38 C84 38 90 42 90 50 C90 62 76 72 64 82 Z" fill="#5e5c64"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#5d6c84"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#5d6c84"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#c3cfe1"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#c3cfe1"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#c3cfe1"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#5d6c84" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M0 18 C-10 9 -20 1 -20 -8 C-20 -14 -15 -18 -9 -18 C-4 -18 -1 -15 0 -12 C1 -15 4 -18 9 -18 C15 -18 20 -14 20 -8 C20 1 10 9 0 18 Z" fill="#5d6c84"/></g>
 </svg>
diff --git a/packages/app-gnome/data/achievements/supporter.svg b/packages/app-gnome/data/achievements/supporter.svg
index 983da0f6..17d91b65 100644
--- a/packages/app-gnome/data/achievements/supporter.svg
+++ b/packages/app-gnome/data/achievements/supporter.svg
@@ -1,26 +1,29 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 Achievement draft "supporter" — learn6502.
-Shared base shape across all three apps: a 10-lobe scalloped seal (union of ten discs, so
-the rim waves instead of showing cog teeth), an 8 px front profile like the app icons, and
-a recessed round field. Only the motif is app-specific. No text, no raster, no filters.
+The object is a game cartridge with a label; only the motif changes per achievement. Shared frame across all
+three apps: 192 x 96 (2:1), 2 px grid, drawn for raster heights 48 and 96 logical px, with a
+locked state that keeps the geometry as a muted silhouette. Title and description come from
+gettext and are drawn next to the artwork, never inside it.
+No text, no raster, no filters, no baked shadows.
 -->
-<svg width="128" height="128" viewBox="0 0 128 128" version="1.1"
+<svg width="192" height="96" viewBox="0 0 192 96" version="1.1"
      xmlns="http://www.w3.org/2000/svg">
   <defs>
-    <linearGradient id="rim" x1="0" y1="8" x2="0" y2="116" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#62a0ea"/><stop offset="1" stop-color="#3584e4"/>
-    </linearGradient>
-    <linearGradient id="field" x1="0" y1="26" x2="0" y2="90" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#dceafd"/><stop offset="1" stop-color="#a8cdfc"/>
-    </linearGradient>
+    <linearGradient id="body" x1="0" y1="6" x2="0" y2="90" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f9e483"/><stop offset="1" stop-color="#e5a50a"/></linearGradient>
+    <linearGradient id="field" x1="0" y1="14" x2="0" y2="82" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fffdf2"/><stop offset="1" stop-color="#f9e9b8"/></linearGradient>
+    <clipPath id="label"><rect x="52" y="14" width="92" height="68" rx="6"/></clipPath>
+    <linearGradient id="holo" x1="0" y1="96" x2="192" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#99c1f0"/><stop offset="0.3" stop-color="#dc8add"/><stop offset="0.6" stop-color="#f9f06b"/><stop offset="1" stop-color="#8ff0a4"/></linearGradient>
   </defs>
-  <path id="seal-profile" d="M103.35 53.21 A13 13 0 0 1 103.35 78.79 A13 13 0 0 1 88.32 99.47 A13 13 0 0 1 64.00 107.38 A13 13 0 0 1 39.68 99.47 A13 13 0 0 1 24.65 78.79 A13 13 0 0 1 24.65 53.21 A13 13 0 0 1 39.68 32.53 A13 13 0 0 1 64.00 24.62 A13 13 0 0 1 88.32 32.53 A13 13 0 0 1 103.35 53.21 Z" fill="#1a5fb4"/>
-  <path id="seal" d="M103.35 45.21 A13 13 0 0 1 103.35 70.79 A13 13 0 0 1 88.32 91.47 A13 13 0 0 1 64.00 99.38 A13 13 0 0 1 39.68 91.47 A13 13 0 0 1 24.65 70.79 A13 13 0 0 1 24.65 45.21 A13 13 0 0 1 39.68 24.53 A13 13 0 0 1 64.00 16.62 A13 13 0 0 1 88.32 24.53 A13 13 0 0 1 103.35 45.21 Z" fill="url(#rim)"/>
-  <circle id="field-bezel" cx="64" cy="58" r="34" fill="#1a5fb4"/>
-  <circle id="field" cx="64" cy="58" r="32" fill="url(#field)"/>
-  <g id="motif" transform="translate(0,-2)">
-  <path id="heart" d="M64 82 C52 72 38 62 38 50 C38 42 44 38 51 38 C57 38 62 42 64 46
-        C66 42 71 38 77 38 C84 38 90 42 90 50 C90 62 76 72 64 82 Z" fill="#1a5fb4"/>
-  </g>
+  <path id="shell-edge" d="M18 6 H174 A10 10 0 0 1 184 16 V80 A10 10 0 0 1 174 90 H18 A10 10 0 0 1 8 80 V16 A10 10 0 0 1 18 6 Z" fill="#63452c"/>
+  <path id="shell" d="M19 10 H173 A7 7 0 0 1 180 17 V79 A7 7 0 0 1 173 86 H19 A7 7 0 0 1 12 79 V17 A7 7 0 0 1 19 10 Z" fill="url(#body)"/>
+  <rect id="connector" x="16" y="20" width="26" height="56" rx="4" fill="#63452c"/>
+  <rect id="pin-1" x="20" y="26" width="18" height="6" rx="3" fill="#fcefa8"/><rect id="pin-2" x="20" y="38" width="18" height="6" rx="3" fill="#fcefa8"/><rect id="pin-3" x="20" y="50" width="18" height="6" rx="3" fill="#fcefa8"/><rect id="pin-4" x="20" y="62" width="18" height="6" rx="3" fill="#fcefa8"/>
+  <rect id="ridge-1" x="152" y="24" width="6" height="48" rx="3" fill="#fcefa8"/><rect id="ridge-2" x="162" y="24" width="6" height="48" rx="3" fill="#fcefa8"/><rect id="ridge-3" x="172" y="24" width="6" height="48" rx="3" fill="#fcefa8"/>
+  <rect id="label" x="52" y="14" width="92" height="68" rx="6" fill="url(#field)"/>
+  <g clip-path="url(#label)"><path id="holo-band" d="M52 82 L86 14 H104 L70 82 Z" fill="url(#holo)"/></g>
+  <rect id="label-frame" x="56" y="18" width="84" height="60" rx="4" fill="none" stroke="#63452c" stroke-width="4"/>
+  <g id="motif" transform="translate(98,48) scale(1.12)"><path d="M0 18 C-10 9 -20 1 -20 -8 C-20 -14 -15 -18 -9 -18 C-4 -18 -1 -15 0 -12 C1 -15 4 -18 9 -18 C15 -18 20 -14 20 -8 C20 1 10 9 0 18 Z" fill="#63452c"/></g>
+  <path d="M46 9 Q47.5 14.5 53 16 Q47.5 17.5 46 23 Q44.5 17.5 39 16 Q44.5 14.5 46 9 Z" fill="#fffdf2"/>
+  <path d="M150 78 Q151.3 82.7 156 84 Q151.3 85.3 150 90 Q148.7 85.3 144 84 Q148.7 82.7 150 78 Z" fill="#fffdf2"/>
 </svg>