Get the playground to match the popup exactly.

Author: nedtwigg

browser-extension/tests/playground/playground.tsx

@@ -6,7 +6,7 @@ import { PopupPlayground } from './PopupPlayground'
 const root = createRoot(document.getElementById('root')!)
 root.render(
   <div className='min-h-screen bg-slate-100'>
-    <div className='container mx-auto px-6 py-8'>
+    <div className='container px-6 py-8'>
       <div className='bg-white p-6 rounded-lg shadow-sm border border-slate-200 mb-6'>
         <h1 className='text-2xl font-bold text-slate-900 mb-2'>Popup Simulator</h1>
         <p className='text-slate-600'>

browser-extension/tests/playground/style.css

@@ -11,7 +11,7 @@ body {
 
 #root {
   max-width: 1200px;
-  margin: 0 auto;
+  margin: 0;
 }
 
 /* Popup simulator frame */
@@ -24,5 +24,6 @@ body {
   border: 1px solid #e2e8f0;
   border-radius: 8px;
   box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
-  margin: 0 auto;
+  margin: 0;
+  text-align: left;
 }