Badges: clean print output — suppress outlines, hide app chrome, reset layout container

src/routes/+layout.svelte

@@ -290,14 +290,14 @@
 </svelte:head>
 
 {#if browser && (is_offline || api_unreachable)}
-    <div class="fixed top-0 left-0 right-0 z-100 p-4 bg-orange-600/90 text-white text-center shadow-2xl flex items-center justify-center gap-4">
+    <div class="print:hidden fixed top-0 left-0 right-0 z-100 p-4 bg-orange-600/90 text-white text-center shadow-2xl flex items-center justify-center gap-4">
         <span class="text-xl font-bold">{is_offline ? 'Offline' : api_error_msg}</span>
         <button class="btn btn-sm variant-filled-white text-orange-600" onclick={() => window.location.reload()}>Retry</button>
     </div>
 {/if}
 
 {#if browser && flag_expired}
-    <div class="fixed top-0 left-0 right-0 z-50 px-4 py-2 bg-amber-500 text-white shadow-xl flex items-center justify-between gap-4">
+    <div class="print:hidden fixed top-0 left-0 right-0 z-50 px-4 py-2 bg-amber-500 text-white shadow-xl flex items-center justify-between gap-4">
         <p class="text-sm font-semibold">Your session has expired. Please reload or sign in again.</p>
         <div class="flex gap-2 items-center shrink-0">
             <button class="btn btn-sm variant-filled-white text-amber-700" onclick={() => window.location.reload()}>Reload</button>
@@ -310,7 +310,7 @@
     {@render children?.()}
 
     {#if is_hydrating}
-        <div class="fixed inset-0 z-99 flex flex-col items-center justify-center bg-surface-50/80 dark:bg-surface-900/80 backdrop-blur-sm transition-opacity duration-500">
+        <div class="print:hidden fixed inset-0 z-99 flex flex-col items-center justify-center bg-surface-50/80 dark:bg-surface-900/80 backdrop-blur-sm transition-opacity duration-500">
             <div class="preset-filled-surface-100-900 p-8 rounded-2xl shadow-2xl flex flex-col items-center gap-4">
                 <span class="fas fa-cog fa-spin text-5xl text-primary-500"></span>
                 <div class="text-center font-bold text-xl">Hydrating Aether...</div>
@@ -327,10 +327,13 @@
 {/if}
 
 {#if browser && (!$ae_loc?.iframe || $ae_loc?.trusted_access)}
-    <E_app_sys_menu {data} bind:hide={$ae_loc.sys_menu.hide} bind:expand={$ae_sess.sys_menu.expand} />
+    <!-- print:hidden wrapper: sys/debug menus are fixed overlays — must not appear on printed pages -->
+    <div class="print:hidden">
+        <E_app_sys_menu {data} bind:hide={$ae_loc.sys_menu.hide} bind:expand={$ae_sess.sys_menu.expand} />
 
-    <!-- You must be in Edit Mode to initially see the Debug expand button. Once expanded, you can toggle the Edit Mode while still seeing the expanded Debug content. -->
+        <!-- You must be in Edit Mode to initially see the Debug expand button. Once expanded, you can toggle the Edit Mode while still seeing the expanded Debug content. -->
-    {#if $ae_loc.edit_mode || $ae_loc.debug_menu.expand}
+        {#if $ae_loc.edit_mode || $ae_loc.debug_menu.expand}
-        <E_app_debug_menu bind:hide={$ae_loc.debug_menu.hide} bind:expand={$ae_loc.debug_menu.expand} />
+            <E_app_debug_menu bind:hide={$ae_loc.debug_menu.hide} bind:expand={$ae_loc.debug_menu.expand} />
-    {/if}
+        {/if}
+    </div>
 {/if}

src/routes/events/+layout.svelte

@@ -216,6 +216,7 @@
             class:opacity-0={yTop > 250}
             class="
         submenu
+        print:hidden
         z-20
         hover:opacity-100
         absolute top-0 left-0 right-0

src/routes/events/[event_id]/(badges)/badges/[badge_id]/ae_comp__badge_obj_view_v2.svelte

@@ -1003,9 +1003,15 @@
     }
 
     @media print {
+        /* Remove all decorative outlines — only badge content should print */
         .event_badge_wrapper {
+            outline: none !important;
             box-shadow: none;
         }
+        .badge_front,
+        .badge_back {
+            outline: none !important;
+        }
     }
 
     .badge_front,

src/routes/events/[event_id]/(badges)/badges/[badge_id]/print/+page.svelte

@@ -134,6 +134,30 @@
         it dynamically here based on the template's layout field rather than putting
         it in the compiled layout CSS files.
     -->
+
+    <!-- Print chrome reset: applied regardless of layout. Hides app nav and removes
+         the events layout container's background, flex layout, overflow clip, and
+         width constraints so the badge fills the page cleanly. -->
+    <style>
+        @media print {
+            /* Events layout nav bar */
+            .submenu { display: none !important; }
+            /* Events #ae_main_content — override flex, bg, overflow, and size constraints */
+            #ae_main_content {
+                display: block !important;
+                overflow: visible !important;
+                max-width: none !important;
+                width: 100% !important;
+                height: auto !important;
+                min-height: 0 !important;
+                padding: 0 !important;
+                margin: 0 !important;
+                background: transparent !important;
+                gap: 0 !important;
+            }
+        }
+    </style>
+
     {#if $lq__event_badge_template_obj?.layout === 'badge_3.5x5.5_pvc'}
         <style>
             @page { size: 3.5in 5.5in; margin: 0; }