diff --git a/frontend/app/admin/trades/page.tsx b/frontend/app/admin/trades/page.tsx
index d1f4b9f..b75188b 100644
--- a/frontend/app/admin/trades/page.tsx
+++ b/frontend/app/admin/trades/page.tsx
@@ -1,7 +1,6 @@
 "use client";
 
-import React from "react";
-import { useEffect, useState, useCallback } from "react";
+import { useEffect, useState, useCallback, CSSProperties } from "react";
 import { Permission } from "../../auth-context";
 import { api } from "../../api";
 import { Header } from "../../components/Header";
@@ -341,7 +340,7 @@ export default function AdminTradesPage() {
 }
 
 // Page-specific styles (trade card styles are shared via tradeCardStyles)
-const styles: Record<string, React.CSSProperties> = {
+const styles: Record<string, CSSProperties> = {
   content: {
     flex: 1,
     padding: "2rem",
diff --git a/frontend/app/components/SatsDisplay.tsx b/frontend/app/components/SatsDisplay.tsx
index 8fef594..2a0bfec 100644
--- a/frontend/app/components/SatsDisplay.tsx
+++ b/frontend/app/components/SatsDisplay.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import { CSSProperties } from "react";
 
 /**
  * Format satoshi amount with styled components.
@@ -26,7 +26,7 @@ export function SatsDisplay({ sats }: { sats: number }) {
   }
 
   // Build the display with subtle leading zeros and prominent digits
-  const subtleStyle: React.CSSProperties = {
+  const subtleStyle: CSSProperties = {
     opacity: 0.45,
     fontWeight: 400,
   };
diff --git a/frontend/app/exchange/page.tsx b/frontend/app/exchange/page.tsx
index 047644d..1b1fe6e 100644
--- a/frontend/app/exchange/page.tsx
+++ b/frontend/app/exchange/page.tsx
@@ -1,7 +1,6 @@
 "use client";
 
-import React from "react";
-import { useEffect, useState, useCallback, useMemo } from "react";
+import { useEffect, useState, useCallback, useMemo, ChangeEvent, CSSProperties } from "react";
 import { useRouter } from "next/navigation";
 import { Permission } from "../auth-context";
 import { api } from "../api";
@@ -221,7 +220,7 @@ export default function ExchangePage() {
     setEurAmount(clamped);
   };
 
-  const handleAmountInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const handleAmountInputChange = (e: ChangeEvent<HTMLInputElement>) => {
     const inputValue = e.target.value.replace(/[^0-9]/g, "");
     if (inputValue === "") {
       setEurAmount(eurMin * 100);
@@ -599,7 +598,7 @@ export default function ExchangePage() {
 }
 
 // Page-specific styles
-const styles: Record<string, React.CSSProperties> = {
+const styles: Record<string, CSSProperties> = {
   content: {
     flex: 1,
     padding: "2rem",
diff --git a/frontend/app/styles/shared.ts b/frontend/app/styles/shared.ts
index cc5fd59..6ad0ccc 100644
--- a/frontend/app/styles/shared.ts
+++ b/frontend/app/styles/shared.ts
@@ -1,4 +1,4 @@
-import React from "react";
+import { CSSProperties } from "react";
 
 /**
  * Design tokens - centralized values for consistency.
@@ -54,7 +54,7 @@ const tokens = {
   radius3xl: "24px",
 } as const;
 
-type StyleRecord = Record<string, React.CSSProperties>;
+type StyleRecord = Record<string, CSSProperties>;
 
 // =============================================================================
 // Layout Styles
diff --git a/frontend/app/trades/page.tsx b/frontend/app/trades/page.tsx
index d311187..68d86cd 100644
--- a/frontend/app/trades/page.tsx
+++ b/frontend/app/trades/page.tsx
@@ -1,7 +1,6 @@
 "use client";
 
-import React from "react";
-import { useEffect, useState, useCallback } from "react";
+import { useEffect, useState, useCallback, CSSProperties } from "react";
 import { Permission } from "../auth-context";
 import { api } from "../api";
 import { Header } from "../components/Header";
@@ -258,7 +257,7 @@ export default function TradesPage() {
 }
 
 // Page-specific styles (trade card styles are shared via tradeCardStyles)
-const styles: Record<string, React.CSSProperties> = {
+const styles: Record<string, CSSProperties> = {
   content: {
     flex: 1,
     padding: "2rem",