样式

src/App.vue

@@ -48,8 +48,9 @@ const showHero = computed(
     <layout v-if="isLogin" :layoutData="layoutData" />
     <div v-if="isLogin" class="base-wrap-main alone-page">
         <div class="main-wrapper">
-            <!-- 方案D · 蓝天校园：hero 刊头（首页/全校列表）+ 栏目条 + 页面内容 -->
-            <div class="app-frame">
+            <!-- 方案D · 蓝天校园：hero 刊头（首页/全校列表）+ 栏目条 + 页面内容；
+                 no-hero：无刊头页由 body 顶部留白让出固定顶栏，刊头页靠 hero 负 margin 压入顶栏玻璃之下 -->
+            <div class="app-frame" :class="{ 'no-hero': !showHero }">
                 <HomeHero v-if="showHero"></HomeHero>
                 <ModuleBar></ModuleBar>
                 <div class="app-frame-body">
@@ -77,13 +78,19 @@ body {
     max-width: 1180px;
     margin: 0 auto;
 }
-/* hero 顶入玻璃顶栏之下（对齐原型 topbar margin-bottom:-51px 的叠压效果） */
+/* hero 刊头从视口顶起步：base-wrap-main 零 padding 后无需再抵消旧留白，
+   fixed 玻璃顶栏(z30)直接叠压刊头顶部，即原型 topbar margin-bottom:-51px 的效果 */
 .app-frame .hero {
-    margin-top: -50px;
+    margin-top: 0;
 }
 .app-frame-body {
     padding: 12px 0 56px;
 }
+/* 无刊头页（记录/成长足迹/区域等）：base-wrap-main 已零 padding，固定顶栏(51px)悬在内容上方，
+   这里补回让位（51px 栏高 + 12px 原间隙），栏目条(module-bar)不致压入顶栏之下 */
+.app-frame.no-hero {
+    padding-top: 63px;
+}
 /* 全站页脚：固定窗口底部始终可见，玻璃质感与顶栏呼应；滚动内容以上留白防遮挡 */
 .app-footer {
     position: fixed;

src/assets/styles/profession-ui.css

@@ -35,6 +35,12 @@ body::after { right: -160px; }
    晚于本样式注入）均不得遮挡 body 的天空渐变：html 前缀提到 (0,1,1) 与加载顺序无关地稳赢。
    背景透出是本应用对皮肤声明的唯一越权缝，其余外观仍交皮肤管控 */
 html .base-wrap-main { background: transparent; }
+/* 布局壳纠正（老壳 layout.css 的 56px 顶留白 + 线上皮肤 base.layout.css 的
+   padding:calc(var(--topbar-h) + var(--crumb-h)) 0 0 var(--side-w) 均不适用本应用）：
+   本应用自渲染 fixed 玻璃顶栏、1180px 居中单列，内容从视口顶全宽起步（刊头以负 margin 压入顶栏玻璃之下），
+   外壳不得再加 padding；高度占满视口。html 前缀提到 (0,1,1)，与加载顺序无关地压过两者。
+   固定顶栏(51px)的让位由 .app-frame.no-hero .app-frame-body 按页处理，见 App.vue */
+html .base-wrap-main { padding: 0; height: 100%; }
 a { text-decoration: none; color: inherit; }
 ul, ol { list-style: none; }
 .container { width: 1180px; margin: 0 auto; }