refactor(web): 将全局样式迁移为组件级样式并抽取占位组件

clinical-web/src/components/layout/Header.vue

@@ -30,3 +30,74 @@ const pageGroup = computed(() => String(route.meta.group ?? '工作台'))
     <span class="environment-badge">{{ appStore.environment }}</span>
   </header>
 </template>
+
+<style scoped>
+.clinical-header {
+  display: flex;
+  flex-shrink: 0;
+  gap: 14px;
+  align-items: center;
+  height: var(--header-height);
+  padding: 0 20px;
+  background: #fff;
+  border-bottom: 1px solid var(--line);
+}
+
+.header-page {
+  display: flex;
+  gap: 14px;
+  align-items: baseline;
+  min-width: 0;
+}
+
+.header-title {
+  flex-shrink: 0;
+  color: var(--ink);
+  font-size: 16px;
+  font-weight: 700;
+}
+
+.header-breadcrumb {
+  overflow: hidden;
+  color: var(--mut);
+  font-size: 12px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.header-spacer {
+  flex: 1;
+}
+
+.campus-selector {
+  display: flex;
+  flex-shrink: 0;
+  gap: 6px;
+  align-items: center;
+}
+
+.campus-label {
+  color: var(--mut);
+  font-size: 12px;
+}
+
+.campus-selector select {
+  width: auto;
+  padding: 4px 8px;
+  color: var(--brand-d);
+  font-size: 12.5px;
+  font-weight: 700;
+  background: var(--brand-l);
+  border: 1px solid var(--brand);
+  border-radius: 6px;
+}
+
+.environment-badge {
+  flex-shrink: 0;
+  padding: 3px 8px;
+  color: var(--warn);
+  font-size: 11px;
+  background: var(--warn-l);
+  border-radius: 20px;
+}
+</style>