diff --git a/src/App.tsx b/src/App.tsx
index 46c8a2e..6ef5106 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -639,10 +639,10 @@ export default function App() {
 
   return (
     <div
-      className={`min-h-screen flex flex-col font-sans ${workflowStep === 'template-design' || (workflowStep === 'print-view' && !isMobile)
-        ? 'bg-[#323232] text-[#e8e8e8] h-screen overflow-hidden'
+      className={`flex flex-col font-sans h-dvh max-h-dvh overflow-hidden ${workflowStep === 'template-design' || (workflowStep === 'print-view' && !isMobile)
+        ? 'bg-[#323232] text-[#e8e8e8]'
         : workflowStep === 'print-view' && isMobile
-          ? 'bg-slate-100 text-slate-800 h-screen overflow-hidden'
+          ? 'bg-slate-100 text-slate-800'
           : 'bg-slate-50 text-slate-800'
         }`}
     >
@@ -653,36 +653,31 @@ export default function App() {
       */}
       {!(isMobile && workflowStep === 'print-view') && (
         <header
-          className={`no-print bg-slate-950 border-b border-slate-900 shrink-0 shadow flex flex-wrap items-center justify-between gap-4 mobile-template-header ${
-            isMobile && workflowStep === 'template-select' && hasTemplates
+          className={`no-print bg-indigo-700 border-b border-indigo-900 shrink-0 shadow flex flex-wrap items-center justify-between gap-4 mobile-template-header app-header-sticky ${isMobile && workflowStep === 'template-select' && hasTemplates
               ? 'mobile-template-header-row'
               : ''
-          } ${workflowStep === 'template-design' || workflowStep === 'print-view' ? 'px-4 py-2' : 'px-4 py-3 md:px-6 md:py-4'}`}
+            } px-4 py-3 md:px-6 md:py-4`}
         >
           {/* Title logo and slogan description */}
           <div
-            className={`flex items-center gap-3 min-w-0 ${
-              isMobile && workflowStep === 'template-select' && hasTemplates ? 'flex-1' : ''
-            }`}
+            className={`flex items-center gap-3 min-w-0 ${isMobile && workflowStep === 'template-select' && hasTemplates ? 'flex-1' : ''
+              }`}
           >
             <img src={logoUrl} alt="" className="w-10 h-10" aria-hidden />
             <div className="min-w-0">
               <h1 className="text-[18px] font-bold tracking-wider flex items-center gap-2 text-slate-100 uppercase">
                 <span className="truncate">标签设计生成器</span>
               </h1>
-              {workflowStep !== 'template-design' && workflowStep !== 'print-view' && (
-                <p className="text-[11px] text-slate-400">
-                  所见即所得
-                </p>
-              )}
+              <p className="text-[11px] text-slate-400">
+                所见即所得
+              </p>
             </div>
           </div>
 
           {workflowStep === 'template-select' && hasTemplates && (
             <div
-              className={`flex items-center gap-2 shrink-0 ${
-                isMobile ? 'ml-auto' : 'flex-wrap'
-              }`}
+              className={`flex items-center gap-2 shrink-0 ${isMobile ? 'ml-auto' : 'flex-wrap'
+                }`}
             >
               {!isMobile && (
                 <button
@@ -695,11 +690,10 @@ export default function App() {
                 </button>
               )}
               <label
-                className={`inline-flex items-center gap-1.5 bg-white/10 hover:bg-white/15 active:bg-white/20 border border-slate-700 text-slate-100 rounded-xl font-semibold whitespace-nowrap transition shadow-sm cursor-pointer ${
-                  isMobile
+                className={`inline-flex items-center gap-1.5 bg-white/10 hover:bg-white/15 active:bg-white/20 border border-slate-700 text-slate-100 rounded-xl font-semibold whitespace-nowrap transition shadow-sm cursor-pointer ${isMobile
                     ? 'min-h-[40px] px-3 py-2 text-[11px]'
                     : 'px-4 py-2 text-xs'
-                }`}
+                  }`}
               >
                 <Upload className={`${isMobile ? 'w-3.5 h-3.5' : 'w-4 h-4'} shrink-0`} />
                 导入模板
@@ -717,9 +711,9 @@ export default function App() {
 
       {/* Primary Workspace scroll container */}
       <main
-        className={`no-print flex-1 flex flex-col w-full ${workflowStep === 'template-design' || workflowStep === 'print-view'
-          ? 'overflow-hidden min-h-0'
-          : 'overflow-auto p-4 md:p-6 max-w-[1720px] mx-auto gap-6'
+        className={`no-print flex-1 flex flex-col w-full min-h-0 ${workflowStep === 'template-design' || workflowStep === 'print-view'
+          ? 'overflow-hidden'
+          : 'overflow-y-auto scrollbar-hide overscroll-contain p-4 md:p-6 max-w-[1720px] mx-auto gap-6'
           }`}
       >
 
@@ -855,11 +849,10 @@ export default function App() {
                             e.stopPropagation();
                             openPrintView(tmpl.id!);
                           }}
-                          className={`inline-flex items-center gap-1.5 bg-indigo-600 hover:bg-indigo-700 active:bg-indigo-800 text-white transition shadow-xs cursor-pointer ${
-                            isMobile
+                          className={`inline-flex items-center gap-1.5 bg-indigo-600 hover:bg-indigo-700 active:bg-indigo-800 text-white transition shadow-xs cursor-pointer ${isMobile
                               ? 'mobile-primary-btn flex-1 min-w-0 justify-center min-h-[44px] px-4 py-2.5 rounded-xl text-[13px] font-semibold'
                               : 'shrink-0 whitespace-nowrap px-3 py-1.5 rounded-lg text-[11px] font-bold'
-                          }`}
+                            }`}
                         >
                           <Printer className={`${isMobile ? 'w-4 h-4' : 'w-3.5 h-3.5'} shrink-0`} />
                           {isMobile ? '排版生成标签' : '排版导出'}
@@ -869,11 +862,10 @@ export default function App() {
                             e.stopPropagation();
                             handleExportTemplate(tmpl);
                           }}
-                          className={`shrink-0 bg-gray-50 text-gray-500 hover:bg-gray-100 active:bg-gray-200 border border-gray-100 hover:border-gray-300 inline-flex items-center justify-center transition cursor-pointer ${
-                            isMobile
+                          className={`shrink-0 bg-gray-50 text-gray-500 hover:bg-gray-100 active:bg-gray-200 border border-gray-100 hover:border-gray-300 inline-flex items-center justify-center transition cursor-pointer ${isMobile
                               ? 'mobile-icon-btn min-w-[44px] min-h-[44px] rounded-xl'
                               : 'p-1.5 rounded-lg'
-                          }`}
+                            }`}
                           title="导出"
                           aria-label="导出模板"
                         >
@@ -884,11 +876,10 @@ export default function App() {
                             e.stopPropagation();
                             handleDeleteTemplate(tmpl.id!);
                           }}
-                          className={`shrink-0 bg-gray-50 text-rose-500 hover:text-white hover:bg-rose-600 active:bg-rose-700 border border-gray-100 inline-flex items-center justify-center transition cursor-pointer ${
-                            isMobile
+                          className={`shrink-0 bg-gray-50 text-rose-500 hover:text-white hover:bg-rose-600 active:bg-rose-700 border border-gray-100 inline-flex items-center justify-center transition cursor-pointer ${isMobile
                               ? 'mobile-icon-btn min-w-[44px] min-h-[44px] rounded-xl'
                               : 'p-1.5 rounded-lg'
-                          }`}
+                            }`}
                           title="删除模板"
                           aria-label="删除模板"
                         >
diff --git a/src/components/MobileExportView.tsx b/src/components/MobileExportView.tsx
index f17a1c5..67083ec 100644
--- a/src/components/MobileExportView.tsx
+++ b/src/components/MobileExportView.tsx
@@ -85,26 +85,23 @@ export const MobileExportView: React.FC<MobileExportViewProps> = ({
 
   return (
     <div className="mobile-export-view">
-      <header className="no-print bg-slate-950 border-b border-slate-900 shrink-0 shadow mobile-export-header mobile-template-header px-4 py-3">
-        <div className="flex items-center gap-2 min-w-0 w-full">
+      <header className="no-print bg-indigo-700 border-b border-indigo-900 shrink-0 shadow mobile-export-header px-4">
+        <div className="flex items-center w-full min-h-[44px]">
           <button
             type="button"
             onClick={onBack}
-            className="mobile-export-back"
+            className="mobile-export-back shrink-0"
             aria-label="返回"
           >
             <ChevronLeft className="w-5 h-5" />
           </button>
-          <div className="flex items-center gap-3 min-w-0 flex-1">
-            <div className="min-w-0">
-              {/* <h1 className="text-sm font-bold tracking-wider flex items-center gap-2 text-slate-100 uppercase">
-                <span className="truncate">批量标签排版印刷生成器</span>
-              </h1> */}
-              <p className="text-sm font-bold tracking-wider flex items-center gap-2 text-slate-100 uppercase" title={templateName}>
-                {templateName}
-              </p>
-            </div>
-          </div>
+          <p
+            className="flex-1 min-w-0 px-2 text-center text-sm font-bold tracking-wide text-slate-100 truncate"
+            title={templateName}
+          >
+            {templateName}
+          </p>
+          <div className="w-10 shrink-0" aria-hidden />
         </div>
       </header>
 
diff --git a/src/index.css b/src/index.css
index ac4066c..140e85e 100644
--- a/src/index.css
+++ b/src/index.css
@@ -4,9 +4,36 @@
 html,
 body,
 #root {
+  height: 100%;
   overscroll-behavior: none;
 }
 
+html,
+body {
+  overflow: hidden;
+}
+
+/* 可滚动区域隐藏滚动条 */
+.scrollbar-hide {
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+
+.scrollbar-hide::-webkit-scrollbar {
+  display: none;
+  width: 0;
+  height: 0;
+}
+
+.app-header-sticky {
+  position: sticky;
+  top: 0;
+  z-index: 50;
+  align-items: center !important;
+  padding-top: calc(0.75rem + env(safe-area-inset-top, 0px));
+  padding-bottom: 0.75rem;
+}
+
 @theme {
   --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
   --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
@@ -714,7 +741,10 @@ body,
   }
 
   .mobile-export-header {
+    display: flex;
+    align-items: center;
     padding-top: calc(12px + env(safe-area-inset-top, 0px));
+    padding-bottom: 12px;
   }
 
   .mobile-export-back {
@@ -723,7 +753,6 @@ body,
     justify-content: center;
     width: 40px;
     height: 40px;
-    margin: -4px 0;
     border: none;
     border-radius: 10px;
     background: transparent;
@@ -804,12 +833,20 @@ body,
     flex: 1 1 auto;
     min-height: 0;
     overflow-y: auto;
+    scrollbar-width: none;
+    -ms-overflow-style: none;
     -webkit-overflow-scrolling: touch;
     padding: 16px;
     padding-bottom: 20px;
     display: block;
   }
 
+  .mobile-export-content::-webkit-scrollbar {
+    display: none;
+    width: 0;
+    height: 0;
+  }
+
   .mobile-export-content>.mobile-export-card+.mobile-export-card {
     margin-top: 16px;
   }
@@ -1136,7 +1173,7 @@ body,
     cursor: not-allowed;
   }
 
-  .mobile-template-header {
+  .mobile-template-header:not(.mobile-template-header-row) {
     flex-direction: column;
     align-items: stretch !important;
     gap: 8px !important;