diff --git a/frontend/components/Scanner.tsx b/frontend/components/Scanner.tsx
index 93d6e204..4c1512a8 100644
--- a/frontend/components/Scanner.tsx
+++ b/frontend/components/Scanner.tsx
@@ -216,9 +216,9 @@ export default function Scanner({ onScanSuccess, onOCRMatch, paused }: ScannerPr
   return (
     <div className="w-full max-w-md mx-auto flex flex-col gap-6">
       {/* Video Viewport Area */}
-      <div className="relative w-full aspect-square overflow-hidden rounded-[2.5rem] shadow-[0_20px_50px_rgba(0,0,0,0.5)] bg-background border-2 border-slate-800/50">
-        <div className="absolute inset-0 z-10 pointer-events-none flex items-center justify-center">
-          <div className="w-[85%] h-[85%] border border-primary/30 rounded-[2rem] relative">
+      <div className="relative w-full aspect-square overflow-hidden rounded-[2.5rem] shadow-[0_20px_50px_rgba(0,0,0,0.5)] bg-background border-2 border-slate-800/50 p-4 sm:p-6">
+        <div className="absolute inset-4 sm:inset-6 z-10 pointer-events-none flex items-center justify-center">
+          <div className="w-full h-full border border-primary/30 rounded-[2rem] relative">
             <div className="absolute top-0 left-0 w-10 h-10 border-t-4 border-l-4 border-primary rounded-tl-2xl shadow-[0_0_15px_rgba(59,130,246,0.5)]" />
             <div className="absolute top-0 right-0 w-10 h-10 border-t-4 border-r-4 border-primary rounded-tr-2xl shadow-[0_0_15px_rgba(59,130,246,0.5)]" />
             <div className="absolute bottom-0 left-0 w-10 h-10 border-b-4 border-l-4 border-primary rounded-bl-2xl shadow-[0_0_15px_rgba(59,130,246,0.5)]" />