diff --git a/backend/src/main/java/com/openisle/controller/PostController.java b/backend/src/main/java/com/openisle/controller/PostController.java
index 985c9a448..d59d4cb7b 100644
--- a/backend/src/main/java/com/openisle/controller/PostController.java
+++ b/backend/src/main/java/com/openisle/controller/PostController.java
@@ -66,6 +66,7 @@ public class PostController {
       req.getContent(),
       req.getTagIds(),
       req.getType(),
+      req.getPostVisibleScopeType(),
       req.getPrizeDescription(),
       req.getPrizeIcon(),
       req.getPrizeCount(),
@@ -103,7 +104,8 @@ public class PostController {
       req.getCategoryId(),
       req.getTitle(),
       req.getContent(),
-      req.getTagIds()
+      req.getTagIds(),
+      req.getPostVisibleScopeType()
     );
     return ResponseEntity.ok(postMapper.toDetailDto(post, auth.getName()));
   }
diff --git a/backend/src/main/java/com/openisle/dto/PostRequest.java b/backend/src/main/java/com/openisle/dto/PostRequest.java
index 6dce08d18..fa25f9ab9 100644
--- a/backend/src/main/java/com/openisle/dto/PostRequest.java
+++ b/backend/src/main/java/com/openisle/dto/PostRequest.java
@@ -3,6 +3,8 @@ package com.openisle.dto;
 import com.openisle.model.PostType;
 import java.time.LocalDateTime;
 import java.util.List;
+
+import com.openisle.model.PostVisibleScopeType;
 import lombok.Data;
 
 /**
@@ -19,6 +21,7 @@ public class PostRequest {
 
   // optional for lottery posts
   private PostType type;
+  private PostVisibleScopeType postVisibleScopeType;
   private String prizeDescription;
   private String prizeIcon;
   private Integer prizeCount;
diff --git a/backend/src/main/java/com/openisle/dto/PostSummaryDto.java b/backend/src/main/java/com/openisle/dto/PostSummaryDto.java
index b2fc5c1bf..89f668ccf 100644
--- a/backend/src/main/java/com/openisle/dto/PostSummaryDto.java
+++ b/backend/src/main/java/com/openisle/dto/PostSummaryDto.java
@@ -4,6 +4,8 @@ import com.openisle.model.PostStatus;
 import com.openisle.model.PostType;
 import java.time.LocalDateTime;
 import java.util.List;
+
+import com.openisle.model.PostVisibleScopeType;
 import lombok.Data;
 
 /**
@@ -34,4 +36,5 @@ public class PostSummaryDto {
   private PollDto poll;
   private boolean rssExcluded;
   private boolean closed;
+  private PostVisibleScopeType visibleScope;
 }
diff --git a/backend/src/main/java/com/openisle/mapper/PostMapper.java b/backend/src/main/java/com/openisle/mapper/PostMapper.java
index 11b175c59..876b27863 100644
--- a/backend/src/main/java/com/openisle/mapper/PostMapper.java
+++ b/backend/src/main/java/com/openisle/mapper/PostMapper.java
@@ -75,6 +75,7 @@ public class PostMapper {
     dto.setPinnedAt(post.getPinnedAt());
     dto.setRssExcluded(post.getRssExcluded() == null || post.getRssExcluded());
     dto.setClosed(post.isClosed());
+    dto.setVisibleScope(post.getVisibleScope());
 
     List<ReactionDto> reactions = reactionService
       .getReactionsForPost(post.getId())
diff --git a/backend/src/main/java/com/openisle/model/Post.java b/backend/src/main/java/com/openisle/model/Post.java
index b3ecb4a03..dbca2c843 100644
--- a/backend/src/main/java/com/openisle/model/Post.java
+++ b/backend/src/main/java/com/openisle/model/Post.java
@@ -66,6 +66,10 @@ public class Post {
   @Column(nullable = false)
   private PostType type = PostType.NORMAL;
 
+  @Enumerated(EnumType.STRING)
+  @Column(nullable = false)
+  private PostVisibleScopeType visibleScope = PostVisibleScopeType.ALL;
+
   @Column(nullable = false)
   private boolean closed = false;
 
diff --git a/backend/src/main/java/com/openisle/model/PostVisibleScopeType.java b/backend/src/main/java/com/openisle/model/PostVisibleScopeType.java
new file mode 100644
index 000000000..5c3a2e9bb
--- /dev/null
+++ b/backend/src/main/java/com/openisle/model/PostVisibleScopeType.java
@@ -0,0 +1,32 @@
+package com.openisle.model;
+
+import com.fasterxml.jackson.annotation.JsonCreator;
+import com.fasterxml.jackson.annotation.JsonValue;
+
+public enum PostVisibleScopeType {
+    ALL,
+    ONLY_ME,
+    ONLY_REGISTER;
+
+    /**
+     * 防止画面传递错误的值
+     * @param value
+     * @return
+     */
+    @JsonCreator
+    public static PostVisibleScopeType fromString(String value) {
+        if (value == null) return ALL;
+        for (PostVisibleScopeType type : PostVisibleScopeType.values()) {
+            if (type.name().equalsIgnoreCase(value)) {
+                return type;
+            }
+        }
+        // 不匹配时给默认值，而不是抛异常
+        return ALL;
+    }
+
+    @JsonValue
+    public String toValue() {
+        return this.name();
+    }
+}
diff --git a/backend/src/main/java/com/openisle/service/PostService.java b/backend/src/main/java/com/openisle/service/PostService.java
index 7457c947c..edacbcd50 100644
--- a/backend/src/main/java/com/openisle/service/PostService.java
+++ b/backend/src/main/java/com/openisle/service/PostService.java
@@ -1,6 +1,7 @@
 package com.openisle.service;
 
 import com.openisle.config.CachingConfig;
+import com.openisle.exception.NotFoundException;
 import com.openisle.exception.RateLimitException;
 import com.openisle.model.*;
 import com.openisle.repository.CategoryProposalPostRepository;
@@ -252,6 +253,7 @@ public class PostService {
     String content,
     List<Long> tagIds,
     PostType type,
+    PostVisibleScopeType postVisibleScopeType,
     String prizeDescription,
     String prizeIcon,
     Integer prizeCount,
@@ -336,6 +338,14 @@ public class PostService {
     post.setCategory(category);
     post.setTags(new HashSet<>(tags));
     post.setStatus(publishMode == PublishMode.REVIEW ? PostStatus.PENDING : PostStatus.PUBLISHED);
+
+    // 什么都没设置的情况下，默认为ALL
+    if(Objects.isNull(postVisibleScopeType)){
+        post.setVisibleScope(PostVisibleScopeType.ALL);
+    }else{
+        post.setVisibleScope(postVisibleScopeType);
+    }
+
     if (post instanceof LotteryPost) {
       post = lotteryPostRepository.save((LotteryPost) post);
     } else if (post instanceof CategoryProposalPost categoryProposalPost) {
@@ -716,7 +726,7 @@ public class PostService {
       .orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
     if (post.getStatus() != PostStatus.PUBLISHED) {
       if (viewer == null) {
-        throw new com.openisle.exception.NotFoundException("Post not found");
+        throw new com.openisle.exception.NotFoundException("User not found");
       }
       User viewerUser = userRepository
         .findByUsername(viewer)
@@ -1147,7 +1157,8 @@ public class PostService {
     Long categoryId,
     String title,
     String content,
-    java.util.List<Long> tagIds
+    List<Long> tagIds,
+    PostVisibleScopeType postVisibleScopeType
   ) {
     if (tagIds == null || tagIds.isEmpty()) {
       throw new IllegalArgumentException("At least one tag required");
@@ -1179,6 +1190,7 @@ public class PostService {
     post.setContent(content);
     post.setCategory(category);
     post.setTags(new java.util.HashSet<>(tags));
+    post.setVisibleScope(postVisibleScopeType);
     Post updated = postRepository.save(post);
     imageUploader.adjustReferences(oldContent, content);
     notificationService.notifyMentions(content, user, updated, null);
diff --git a/backend/src/main/resources/db/migration/V6__add_visible_scope_to_posts.sql b/backend/src/main/resources/db/migration/V6__add_visible_scope_to_posts.sql
new file mode 100644
index 000000000..2e2e89f6f
--- /dev/null
+++ b/backend/src/main/resources/db/migration/V6__add_visible_scope_to_posts.sql
@@ -0,0 +1 @@
+ALTER TABLE posts ADD COLUMN visible_scope ENUM('ALL', 'ONLY_ME', 'ONLY_REGISTER') NOT NULL DEFAULT 'ALL'
\ No newline at end of file
diff --git a/deploy/deploy_staging.sh b/deploy/deploy_staging.sh
index 2f6a3d066..fbeda44a7 100644
--- a/deploy/deploy_staging.sh
+++ b/deploy/deploy_staging.sh
@@ -36,7 +36,6 @@ echo "👉 Pull base images (for image-based services)..."
 docker compose -f "$compose_file" --env-file "$env_file" pull --ignore-pull-failures
 
 echo "👉 Build images (staging)..."
-# 前端 + OpenSearch 都是自建镜像；--pull 更新其基础镜像
 docker compose -f "$compose_file" --env-file "$env_file" \
   build --pull \
   --build-arg NUXT_ENV=staging \
diff --git a/docker/docker-compose.yaml b/docker/docker-compose.yaml
index 6fd60458a..5bf093c77 100644
--- a/docker/docker-compose.yaml
+++ b/docker/docker-compose.yaml
@@ -161,8 +161,8 @@ services:
         condition: service_started
       websocket-service:
         condition: service_healthy
-      opensearch:
-        condition: service_healthy
+      # opensearch:
+      #   condition: service_healthy
     command: >
       sh -c "apt-get update && apt-get install -y --no-install-recommends curl &&
              mvn clean spring-boot:run -Dmaven.test.skip=true"
diff --git a/frontend_nuxt/components/HeaderComponent.vue b/frontend_nuxt/components/HeaderComponent.vue
index 0833e0e81..9a0cb911a 100644
--- a/frontend_nuxt/components/HeaderComponent.vue
+++ b/frontend_nuxt/components/HeaderComponent.vue
@@ -543,6 +543,7 @@ onMounted(async () => {
 .header-label {
   font-size: 12px;
   line-height: 1;
+  white-space: nowrap;
 }
 
 /* 在线人数的数字文字样式（无背景） */
diff --git a/frontend_nuxt/components/LoginOverlay.vue b/frontend_nuxt/components/LoginOverlay.vue
index af508a404..7149c4fc6 100644
--- a/frontend_nuxt/components/LoginOverlay.vue
+++ b/frontend_nuxt/components/LoginOverlay.vue
@@ -3,15 +3,30 @@
     <div class="login-overlay-blur"></div>
     <div class="login-overlay-content">
       <user-icon class="login-overlay-icon" />
-      <div class="login-overlay-text">请先登录，点击跳转到登录页面</div>
-      <div class="login-overlay-button" @click="goLogin">登录</div>
+      <div class="login-overlay-text">{{ props.text }}</div>
+      <div class="login-overlay-button" @click="goLogin">{{ props.buttonText }}</div>
     </div>
   </div>
 </template>
 
 <script setup>
+const props = defineProps({
+  text: {
+    type: String,
+    default: '请先登录，点击跳转到登录页面',
+  },
+  buttonText: {
+    type: String,
+    default: '登录',
+  },
+  buttonLink: {
+    type: String,
+    default: '/login',
+  },
+})
+
 const goLogin = () => {
-  navigateTo('/login', { replace: true })
+  navigateTo(props.buttonLink, { replace: true })
 }
 </script>
 
diff --git a/frontend_nuxt/components/PostVisibleScopeSelect.vue b/frontend_nuxt/components/PostVisibleScopeSelect.vue
new file mode 100644
index 000000000..b3cadd145
--- /dev/null
+++ b/frontend_nuxt/components/PostVisibleScopeSelect.vue
@@ -0,0 +1,41 @@
+<template>
+  <Dropdown
+    v-model="selected"
+    :fetch-options="fetchTypes"
+    placeholder="选择帖子可见范围"
+  />
+</template>
+
+<script>
+import { computed, ref, watch } from 'vue'
+import Dropdown from '~/components/Dropdown.vue'
+
+export default {
+  name: 'PostVisibleScopeSelect',
+  components: { Dropdown },
+  props: {
+    modelValue: { type: String, default: 'ALL' },
+    // options: { type: Array, default: () => [] },
+  },
+  emits: ['update:modelValue'],
+  setup(props, { emit }) {
+
+    const fetchTypes = async () => {
+      return [
+        { id: 'ALL', name: '全部可见', icon: 'communication' },
+        { id: 'ONLY_ME', name: '仅自己可见', icon: 'user-icon' },
+        { id: 'ONLY_REGISTER', name: '仅注册用户可见', icon: 'peoples-two' },
+      ]
+    }
+
+    const selected = computed({
+      get: () => props.modelValue,
+      set: (v) => emit('update:modelValue', v),
+    })
+
+    return { fetchTypes, selected }
+  },
+}
+</script>
+
+<style scoped></style>
diff --git a/frontend_nuxt/pages/index.vue b/frontend_nuxt/pages/index.vue
index 78a7160a7..ca18a3a7c 100644
--- a/frontend_nuxt/pages/index.vue
+++ b/frontend_nuxt/pages/index.vue
@@ -70,6 +70,7 @@
               <hands v-else-if="article.type === 'PROPOSAL'" class="proposal-icon" />
               <star v-if="!article.rssExcluded" class="featured-icon" />
               {{ article.title }}
+              <lock class="preview-close-icon" v-if="article.isRestricted" />
             </NuxtLink>
             <NuxtLink class="article-item-description main-item" :to="`/posts/${article.id}`">
               <div v-html="stripMarkdownWithTiebaMoji(article.description, 500)"></div>
@@ -295,6 +296,7 @@ const {
       comments: p.commentCount,
       views: p.views,
       rssExcluded: p.rssExcluded || false,
+      isRestricted: p.visibleScope === 'ONLY_ME' || p.visibleScope === 'ONLY_REGISTER',
       time: TimeManager.format(
         selectedTopic.value === '最新回复' ? p.lastReplyAt || p.createdAt : p.createdAt,
       ),
@@ -336,6 +338,7 @@ const fetchNextPage = async () => {
     members: (p.participants || []).map((m) => ({ id: m.id, avatar: m.avatar })),
     comments: p.commentCount,
     views: p.views,
+    isRestricted: p.visibleScope === 'ONLY_ME' || p.visibleScope === 'ONLY_REGISTER',
     rssExcluded: p.rssExcluded || false,
     time: TimeManager.format(
       selectedTopic.value === '最新回复' ? p.lastReplyAt || p.createdAt : p.createdAt,
diff --git a/frontend_nuxt/pages/new-post.vue b/frontend_nuxt/pages/new-post.vue
index 5d03f4dad..cadb35f7e 100644
--- a/frontend_nuxt/pages/new-post.vue
+++ b/frontend_nuxt/pages/new-post.vue
@@ -11,6 +11,7 @@
           <CategorySelect v-model="selectedCategory" />
           <TagSelect v-model="selectedTags" creatable />
           <PostTypeSelect v-model="postType" />
+          <PostVisibleScopeSelect v-model="postVisibleScope"/>
         </div>
         <div class="post-options-right">
           <div class="post-clear" @click="clearPost"><clear-icon /> 清空</div>
@@ -54,6 +55,7 @@ import PollForm from '~/components/PollForm.vue'
 import ProposalForm from '~/components/ProposalForm.vue'
 import { toast } from '~/main'
 import { authState, getToken } from '~/utils/auth'
+import PostVisibleScopeSelect from '~/components/PostVisibleScopeSelect.vue'
 const config = useRuntimeConfig()
 const API_BASE_URL = config.public.apiBaseUrl
 
@@ -62,6 +64,7 @@ const content = ref('')
 const selectedCategory = ref('')
 const selectedTags = ref([])
 const postType = ref('NORMAL')
+const postVisibleScope = ref('ALL')
 const lottery = reactive({
   prizeIcon: '',
   prizeIconFile: null,
@@ -100,6 +103,7 @@ const loadDraft = async () => {
       content.value = data.content || ''
       selectedCategory.value = data.categoryId || ''
       selectedTags.value = data.tagIds || []
+      postVisibleScope.value = data.visiblescope
 
       toast.success('草稿已加载')
     }
@@ -115,6 +119,7 @@ const clearPost = async () => {
   content.value = ''
   selectedCategory.value = ''
   selectedTags.value = []
+  postVisibleScope.value = 'ALL'
   postType.value = 'NORMAL'
   lottery.prizeIcon = ''
   lottery.prizeIconFile = null
@@ -168,6 +173,7 @@ const saveDraft = async () => {
         content: content.value,
         categoryId: selectedCategory.value || null,
         tagIds,
+        postVisibleScopeType:postVisibleScope.value
       }),
     })
     if (res.ok) {
@@ -328,6 +334,7 @@ const submitPost = async () => {
       categoryId: selectedCategory.value,
       tagIds: selectedTags.value,
       type: postType.value,
+      postVisibleScopeType: postVisibleScope.value,
     }
 
     if (postType.value === 'LOTTERY') {
@@ -355,6 +362,7 @@ const submitPost = async () => {
       },
       body: JSON.stringify(payload),
     })
+    
     const data = await res.json()
     if (res.ok) {
       if (data.reward && data.reward > 0) {
diff --git a/frontend_nuxt/pages/posts/[id]/edit.vue b/frontend_nuxt/pages/posts/[id]/edit.vue
index 8ab6e51a3..e4af866e1 100644
--- a/frontend_nuxt/pages/posts/[id]/edit.vue
+++ b/frontend_nuxt/pages/posts/[id]/edit.vue
@@ -10,6 +10,7 @@
         <div class="post-options-left">
           <CategorySelect v-model="selectedCategory" />
           <TagSelect v-model="selectedTags" creatable />
+          <PostVisibleScopeSelect v-model="selectedVisibleScope"/>
         </div>
         <div class="post-options-right">
           <div class="post-clear" @click="clearPost"><clear-icon /> 清空</div>
@@ -44,6 +45,7 @@ import TagSelect from '~/components/TagSelect.vue'
 import { toast } from '~/main'
 import { getToken, authState } from '~/utils/auth'
 import LoginOverlay from '~/components/LoginOverlay.vue'
+import PostVisibleScopeSelect from '~/components/PostVisibleScopeSelect.vue'
 const config = useRuntimeConfig()
 const API_BASE_URL = config.public.apiBaseUrl
 
@@ -51,6 +53,7 @@ const title = ref('')
 const content = ref('')
 const selectedCategory = ref('')
 const selectedTags = ref([])
+const selectedVisibleScope = ref('ALL')
 const isWaitingPosting = ref(false)
 const isAiLoading = ref(false)
 const isLogin = computed(() => authState.loggedIn)
@@ -70,6 +73,7 @@ const loadPost = async () => {
       content.value = data.content || ''
       selectedCategory.value = data.category.id || ''
       selectedTags.value = (data.tags || []).map((t) => t.id)
+      selectedVisibleScope.value = data.visibleScope
     }
   } catch (e) {
     toast.error('加载失败')
@@ -180,6 +184,7 @@ const submitPost = async () => {
         content: content.value,
         categoryId: selectedCategory.value,
         tagIds: selectedTags.value,
+        postVisibleScopeType:selectedVisibleScope.value
       }),
     })
     const data = await res.json()
diff --git a/frontend_nuxt/pages/posts/[id]/index.vue b/frontend_nuxt/pages/posts/[id]/index.vue
index 1bd91fd50..31ce3bf8c 100644
--- a/frontend_nuxt/pages/posts/[id]/index.vue
+++ b/frontend_nuxt/pages/posts/[id]/index.vue
@@ -1,5 +1,22 @@
 <template>
-  <div class="post-page-container">
+  <div v-if="isRestricted" class="restricted-content">
+    <template v-if="visibleScope === 'ONLY_ME'">
+      <LoginOverlay
+        text="这是一篇私密文章，仅作者本人及管理员可见"
+        button-text="返回首页"
+        button-link="/"
+      />
+    </template>
+
+    <template v-else-if="visibleScope === 'ONLY_REGISTER'">
+      <LoginOverlay
+        text="这是一篇仅登录用户可见的文章，请先登录"
+        button-text="登录"
+        button-link="/login"
+      />
+    </template>
+  </div>
+  <div v-else class="post-page-container">
     <div v-if="isWaitingFetchingPost" class="loading-container">
       <l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
     </div>
@@ -16,7 +33,9 @@
           <div v-if="status === 'PENDING'" class="article-pending-button">审核中</div>
           <div v-if="status === 'REJECTED'" class="article-block-button">已拒绝</div>
           <div v-if="!rssExcluded" class="article-featured-button">精品</div>
-          <div v-if="closed" class="article-closed-button">已关闭</div>
+          <div v-if="closed" class="article-gray-button">已关闭</div>
+          <div v-if="visibleScope === 'ONLY_ME'" class="article-gray-button">仅自己可见</div>
+          <div v-if="visibleScope === 'ONLY_REGISTER'" class="article-gray-button">仅登录可见</div>
           <div
             v-if="!closed && loggedIn && !isAuthor && !subscribed"
             class="article-subscribe-button"
@@ -165,25 +184,6 @@
       </div>
     </div>
 
-    <div class="post-page-scroller-container">
-      <div class="scroller">
-        <div v-if="isWaitingFetchingPost" class="scroller-time">loading...</div>
-        <div v-else class="scroller-time">{{ scrollerTopTime }}</div>
-        <div class="scroller-middle">
-          <input
-            type="range"
-            class="scroller-range"
-            :max="totalPosts"
-            :min="1"
-            v-model.number="currentIndex"
-            @input="onSliderInput"
-          />
-          <div class="scroller-index">{{ currentIndex }}/{{ totalPosts }}</div>
-        </div>
-        <div v-if="isWaitingFetchingPost" class="scroller-time">loading...</div>
-        <div v-else class="scroller-time">{{ lastReplyTime }}</div>
-      </div>
-    </div>
     <vue-easy-lightbox
       :visible="lightboxVisible"
       :index="lightboxIndex"
@@ -228,6 +228,7 @@ import { useIsMobile } from '~/utils/screen'
 import Dropdown from '~/components/Dropdown.vue'
 import { ClientOnly } from '#components'
 import { useConfirm } from '~/composables/useConfirm'
+import { Lock } from '@icon-park/vue-next'
 const { confirm } = useConfirm()
 
 const config = useRuntimeConfig()
@@ -241,6 +242,13 @@ const author = ref('')
 const postContent = ref('')
 const category = ref('')
 const tags = ref([])
+const visibleScope = ref('ALL') // 可见范围
+const isRestricted = computed(() => {
+  return (
+    (visibleScope.value === 'ONLY_ME' && !isAuthor.value && !isAdmin.value) ||
+    (visibleScope.value === 'ONLY_REGISTER' && !loggedIn.value)
+  )
+})
 const postReactions = ref([])
 const postReactionsGroupRef = ref(null)
 const postLikeCount = computed(
@@ -497,15 +505,27 @@ const onCommentDeleted = (id) => {
   fetchTimeline()
 }
 
+const tokenHeader = computed(() => {
+  const token = getToken()
+  return token ? { Authorization: `Bearer ${token}` } : {}
+})
 const {
   data: postData,
   pending: pendingPost,
   error: postError,
   refresh: refreshPost,
-} = await useAsyncData(`post-${postId}`, () => $fetch(`${API_BASE_URL}/api/posts/${postId}`), {
-  server: true,
-  lazy: false,
-})
+} = await useAsyncData(
+  `post-${postId}`,
+  async () => {
+    try {
+      return await $fetch(`${API_BASE_URL}/api/posts/${postId}`, { headers: tokenHeader.value })
+    } catch (err) {}
+  },
+  {
+    server: false,
+    lazy: false,
+  },
+)
 
 // 用 pendingPost 驱动现有 UI（替代 isWaitingFetchingPost 手控）
 const isWaitingFetchingPost = computed(() => pendingPost.value)
@@ -519,6 +539,7 @@ watchEffect(() => {
   title.value = data.title
   category.value = data.category
   tags.value = data.tags || []
+  visibleScope.value = data.visibleScope || 'ALL'
   postReactions.value = data.reactions || []
   subscribed.value = !!data.subscribed
   status.value = data.status
@@ -935,7 +956,7 @@ onMounted(async () => {
 <style>
 .post-page-container {
   background-color: var(--background-color);
-  display: flex;
+  display: block;
   flex-direction: row;
 }
 
@@ -948,9 +969,10 @@ onMounted(async () => {
 }
 
 .post-page-main-container {
+  position: relative;
   scrollbar-width: none;
   padding: 20px;
-  width: calc(85% - 40px);
+  width: calc(100% - 40px);
 }
 
 .info-content-text p code {
@@ -1002,6 +1024,35 @@ onMounted(async () => {
   opacity: 0.5;
 }
 
+.skeleton {
+  background-color: #eee;
+  border-radius: 8px;
+  overflow: hidden;
+  position: relative;
+  height: 20px;
+  margin-top: 5px;
+}
+
+.skeleton::before {
+  content: '';
+  display: block;
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  background: linear-gradient(90deg, #eee 0%, #f5f5f7 40%, #e0e0e0 100%);
+  transform: translateX(-100%);
+  animation: skeleton-shimmer 1.5s infinite linear;
+  z-index: 1;
+  border-radius: 8px;
+}
+@keyframes skeleton-shimmer {
+  100% {
+    transform: translateX(100%);
+  }
+}
+
 .user-avatar-container {
   display: flex;
   flex-direction: row;
@@ -1106,7 +1157,7 @@ onMounted(async () => {
   white-space: nowrap;
 }
 
-.article-closed-button,
+.article-gray-button,
 .article-subscribe-button-text,
 .article-featured-button,
 .article-unsubscribe-button-text {
@@ -1159,7 +1210,7 @@ onMounted(async () => {
   font-size: 14px;
 }
 
-.article-closed-button {
+.article-gray-button {
   background-color: var(--background-color);
   color: gray;
   border: 1px solid gray;
@@ -1341,6 +1392,76 @@ onMounted(async () => {
   position: relative;
 }
 
+/* ======== 权限锁定状态 ======== */
+.is-blurred {
+  filter: blur(10px);
+  pointer-events: none;
+  user-select: none;
+  transition: filter 0.3s ease;
+}
+
+/* 遮罩层 */
+.restricted-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 999;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  backdrop-filter: blur(12px);
+  background: rgba(0, 0, 0, 0.45);
+  animation: fadeIn 0.3s ease forwards;
+}
+
+/* 中央提示框 */
+.restricted-content {
+  background: #ffff;
+  color: var(--primary-color);
+  text-align: center;
+}
+
+.restricted-icon {
+  font-size: 60px;
+  opacity: 0.8;
+  margin-bottom: 15px;
+}
+
+.restricted-button {
+  display: inline-block;
+  margin-top: 20px;
+  padding: 10px 18px;
+  background: var(--primary-color);
+  color: white;
+  border-radius: 8px;
+  text-decoration: none;
+  transition: background 0.2s ease;
+}
+
+.restricted-button:hover {
+  background: var(--primary-color-hover);
+}
+
+.restricted-actions {
+  margin-top: 20px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+}
+
+/* 淡入动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
 @media (max-width: 768px) {
   .post-page-main-container {
     width: calc(100% - 20px);
diff --git a/frontend_nuxt/plugins/iconpark.client.ts b/frontend_nuxt/plugins/iconpark.client.ts
index ee11c64f5..3899b1f8b 100644
--- a/frontend_nuxt/plugins/iconpark.client.ts
+++ b/frontend_nuxt/plugins/iconpark.client.ts
@@ -82,6 +82,7 @@ import {
   Share,
   Financing,
   Hands,
+  PreviewCloseOne,
 } from '@icon-park/vue-next'
 
 export default defineNuxtPlugin((nuxtApp) => {
@@ -167,4 +168,5 @@ export default defineNuxtPlugin((nuxtApp) => {
   nuxtApp.vueApp.component('Share', Share)
   nuxtApp.vueApp.component('Financing', Financing)
   nuxtApp.vueApp.component('Hands', Hands)
+  nuxtApp.vueApp.component('PreviewCloseOne', PreviewCloseOne)
 })
diff --git a/frontend_nuxt/utils/markdown.js b/frontend_nuxt/utils/markdown.js
index be28d6dfb..7a6a89caf 100644
--- a/frontend_nuxt/utils/markdown.js
+++ b/frontend_nuxt/utils/markdown.js
@@ -268,23 +268,21 @@ export function stripMarkdownLength(text, length) {
 
 // 朴素文本带贴吧表情
 export function stripMarkdownWithTiebaMoji(text, length){
-  console.error(text)
     if (!text) return ''
 
-  // Markdown 转成纯文本
-  const plain = stripMarkdown(text)
- console.error(plain)
-  // 替换 :tieba123: 为 <img>
-  const withEmoji = plain.replace(/:tieba(\d+):/g, (match, num) => {
-    const key = `tieba${num}`
-    const file = tiebaEmoji[key]
-    return file
-      ? `<img loading="lazy" class="emoji" src="${file}" alt="${key}">`
-      : match // 没有匹配到图片则保留原样
-  })
+    // Markdown 转成纯文本
+    const plain = stripMarkdown(text)
+    // 替换 :tieba123: 为 <img>
+    const withEmoji = plain.replace(/:tieba(\d+):/g, (match, num) => {
+      const key = `tieba${num}`
+      const file = tiebaEmoji[key]
+      return file
+        ? `<img loading="lazy" class="emoji" src="${file}" alt="${key}">`
+        : match // 没有匹配到图片则保留原样
+    })
 
-  // 截断纯文本长度（防止撑太长）
-  const truncated = withEmoji.length > length ? withEmoji.slice(0, length) + '...' : withEmoji
-  return truncated
+    // 截断纯文本长度（防止撑太长）
+    const truncated = withEmoji.length > length ? withEmoji.slice(0, length) + '...' : withEmoji
+    return truncated
 
 }