diff --git a/app/der-eine/components/Focus.tsx b/app/der-eine/components/Focus.tsx
index ffac73f..2db5a9a 100644
--- a/app/der-eine/components/Focus.tsx
+++ b/app/der-eine/components/Focus.tsx
@@ -1,18 +1,15 @@
 import type { ReactNode } from "react";
 import { Reveal, RevealGroup, RevealItem } from "../../components/Reveal";
 
-// Circle-badge + brand-orange stroke — same treatment as
-// todo-cards/HowItWorks.tsx's step-3 checkmark icon (a stroked circle
-// around the glyph) and this page's own IconCheck (brand-orange #f6a701
-// stroke), instead of the earlier plain black line icons, which read as a
-// different, colder icon language than the rest of the site.
+// Bold black outline, no fill, no container — matching /todo-cards' own
+// icon language (tool-icon-todo-karten.png, icon-step-2.png/icon-step-3.png:
+// thick uniform-weight black stroke, no color fill, no circle/badge
+// wrapper), not the thinner colored-badge treatment tried first.
 function IconBadge({ children }: { children: ReactNode }) {
   return (
-    <div className="size-16 rounded-full border-2 border-brand flex items-center justify-center shrink-0">
-      <svg width="28" height="28" viewBox="0 0 28 28" fill="none" strokeWidth="1.6" stroke="#f6a701" strokeLinecap="round" strokeLinejoin="round">
-        {children}
-      </svg>
-    </div>
+    <svg width="56" height="56" viewBox="0 0 28 28" fill="none" strokeWidth="2.2" stroke="#231f20" strokeLinecap="round" strokeLinejoin="round" className="h-14 w-auto shrink-0">
+      {children}
+    </svg>
   );
 }