fix: full-width content area + auto-create MediaAssets on render complete

- Remove max-w-* constraints from all data/table pages so content fills available width after sidebar (Billing, MediaBrowser, OrderDetail, WorkerManagement, WorkerActivity, Materials, Tenants, AssetLibrary, NewProductOrder, ProductDetail)
- Narrow form/settings pages keep their max-width (NotificationSettings, Preferences, NewOrder, Notifications)
- render_order_line_task: create MediaAsset record on render success so results immediately appear in Media Browser without requiring the retroactive import button

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/pages/AssetLibrary.tsx

@@ -273,7 +273,7 @@ export default function AssetLibraryPage() {
   })
 
   return (
-    <div className="p-8 max-w-5xl mx-auto">
+    <div className="p-8">
       {/* Header */}
       <div className="mb-6 flex items-center justify-between">
         <div>

frontend/src/pages/Billing.tsx

@@ -125,7 +125,7 @@ export default function BillingPage() {
   const paidCount = invoices.filter(inv => inv.status === 'paid').length
 
   return (
-    <div className="p-6 space-y-5 max-w-screen-xl">
+    <div className="p-6 space-y-5">
       {/* Header */}
       <div className="flex items-center justify-between">
         <div>

frontend/src/pages/Materials.tsx

@@ -200,7 +200,7 @@ export default function MaterialsPage() {
   const totalAliases = materials.reduce((sum, m) => sum + m.aliases.length, 0)
 
   return (
-    <div className="p-8 max-w-5xl mx-auto">
+    <div className="p-8">
       {/* Header */}
       <div className="flex items-center gap-3 mb-6">
         <FlaskConical size={22} className="text-accent" />

frontend/src/pages/MediaBrowser.tsx

@@ -259,7 +259,7 @@ export default function MediaBrowserPage() {
   }
 
   return (
-    <div className="p-6 space-y-5 max-w-screen-xl">
+    <div className="p-6 space-y-5">
       {/* Header */}
       <div className="flex items-center justify-between">
         <div>

frontend/src/pages/NewProductOrder.tsx

@@ -331,7 +331,7 @@ export default function NewProductOrderPage() {
   }
 
   return (
-    <div className="p-8 max-w-6xl mx-auto">
+    <div className="p-8">
       {/* Header */}
       <div className="flex items-center gap-4 mb-6">
         <Link to="/orders/new" className="btn-secondary"><ArrowLeft size={16} />Back</Link>

frontend/src/pages/OrderDetail.tsx

@@ -204,7 +204,7 @@ export default function OrderDetailPage() {
   const activeFilterCount = countActiveFilters(filters)
 
   return (
-    <div className="p-8 max-w-6xl mx-auto">
+    <div className="p-8">
       {/* Header */}
       <div className="flex items-center gap-4 mb-6 flex-wrap">
         <Link to="/orders" className="btn-secondary">

frontend/src/pages/ProductDetail.tsx

@@ -311,7 +311,7 @@ export default function ProductDetailPage() {
   if (!product) return <div className="p-8 text-red-500">Product not found</div>
 
   return (
-    <div className="p-8 max-w-4xl mx-auto">
+    <div className="p-8">
       {/* Back */}
       <Link to="/products" className="inline-flex items-center gap-1 text-sm text-content-secondary hover:text-content mb-4">
         <ArrowLeft size={15} /> Products

frontend/src/pages/Tenants.tsx

@@ -116,7 +116,7 @@ export default function TenantsPage() {
   }
 
   return (
-    <div className="p-6 max-w-5xl mx-auto">
+    <div className="p-6">
       {/* Header */}
       <div className="flex items-center justify-between mb-6">
         <div className="flex items-center gap-3">

frontend/src/pages/WorkerActivity.tsx

@@ -61,7 +61,7 @@ export default function WorkerActivityPage() {
   const isEmpty = !isLoading && events.length === 0
 
   return (
-    <div className="p-8 max-w-5xl mx-auto space-y-6">
+    <div className="p-8 space-y-6">
       <div className="flex items-center gap-3">
         <Activity size={22} className="text-accent" />
         <h1 className="text-2xl font-bold text-content">Worker Activity</h1>

frontend/src/pages/WorkerManagement.tsx

@@ -189,7 +189,7 @@ export default function WorkerManagement() {
   const queueDepths = queueData?.queue_depths ?? {}
 
   return (
-    <div className="p-8 max-w-5xl mx-auto space-y-8">
+    <div className="p-8 space-y-8">
       {/* Header */}
       <div className="flex items-center justify-between">
         <div>