diff --git a/src/components/app/t-postcard.vue b/src/components/app/t-postcard.vue
index bfc20866..5f60868f 100644
--- a/src/components/app/t-postcard.vue
+++ b/src/components/app/t-postcard.vue
@@ -15,7 +15,12 @@
       <div class="tpc-title" :title="card.title" @click="shareCard">{{ card.title }}</div>
     </div>
     <div class="tpc-mid" v-if="card.user !== null">
-      <TpAvatar :data="card.user" position="left" @click="onUserClick()" />
+      <TpAvatar
+        :data="card.user"
+        position="left"
+        :style="{ cursor: props.userClick ? 'pointer' : 'default' }"
+        @click="onUserClick()"
+      />
     </div>
     <div class="tpc-bottom" v-if="card.data !== null">
       <div class="tpc-tags">
@@ -290,9 +295,11 @@ function onUserClick(): void {
 
 .tpc-mid {
   position: relative;
-  width: 100%;
+  width: fit-content;
+  max-width: 100%;
+  box-sizing: border-box;
   padding: 0 10px;
-  cursor: v-bind("props.userClick ? 'pointer' : 'default'");
+  margin-right: auto;
 }
 
 .tpc-bottom {
@@ -317,6 +324,8 @@ function onUserClick(): void {
 
 .tpc-tags {
   display: flex;
+  width: fit-content;
+  max-width: 100%;
   flex-wrap: wrap;
   align-items: flex-start;
   justify-content: flex-start;
@@ -401,11 +410,13 @@ function onUserClick(): void {
 
 .tpc-data {
   display: flex;
-  width: 100%;
+  width: fit-content;
+  max-width: 100%;
   height: 20px;
   align-items: center;
-  justify-content: flex-end;
+  justify-content: center;
   padding: 4px;
+  margin-left: auto;
   column-gap: 8px;
 }
 
diff --git a/src/components/viewPost/tp-avatar.vue b/src/components/viewPost/tp-avatar.vue
index d7e28d5c..238b6881 100644
--- a/src/components/viewPost/tp-avatar.vue
+++ b/src/components/viewPost/tp-avatar.vue
@@ -78,7 +78,7 @@ const levelColor = computed<string>(() => {
   width: 100%;
   max-width: 100%;
   height: 26px;
-  border-top: 2px solid var(--common-shadow-2);
+  border-top: 1px dotted var(--common-shadow-4);
   font-size: 14px;
   opacity: 0.7;
   text-align: v-bind("props.position");
diff --git a/src/components/viewPost/tp-image.vue b/src/components/viewPost/tp-image.vue
index 422f95b6..04124a93 100644
--- a/src/components/viewPost/tp-image.vue
+++ b/src/components/viewPost/tp-image.vue
@@ -103,14 +103,14 @@ function getImageTitle(): string {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin: 10px auto;
+  margin: 8px auto;
 }
 
 .tp-image-box img {
   width: v-bind(imgWidth);
   max-width: 100%;
   height: auto;
-  border-radius: 10px;
+  border-radius: 4px;
   cursor: pointer;
 }
 
@@ -118,14 +118,14 @@ function getImageTitle(): string {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin: 10px auto;
-  column-gap: 5px;
+  margin: 8px auto;
+  column-gap: 4px;
 }
 
 .act {
   position: absolute;
-  right: 5px;
-  bottom: 5px;
+  right: 4px;
+  bottom: 4px;
   display: flex;
   width: 25px;
   height: 25px;
@@ -134,7 +134,7 @@ function getImageTitle(): string {
   justify-content: center;
   border-radius: 50%;
   background: var(--tgc-od-white);
-  box-shadow: 0 0 5px rgb(0 0 0 / 50%);
+  box-shadow: 0 0 4px rgb(0 0 0 / 50%);
   cursor: pointer;
 }
 </style>
diff --git a/src/components/viewPost/tp-linkCard.vue b/src/components/viewPost/tp-linkCard.vue
index bd7813d3..80d66d14 100644
--- a/src/components/viewPost/tp-linkCard.vue
+++ b/src/components/viewPost/tp-linkCard.vue
@@ -69,18 +69,19 @@ async function toLink(): Promise<void> {
 .tp-link-card-box {
   display: flex;
   width: 100%;
-  padding: 10px;
+  box-sizing: border-box;
+  padding: 8px;
   border: 1px solid var(--common-shadow-1);
-  border-radius: 10px;
-  margin-bottom: 10px;
+  border-radius: 4px;
+  margin-bottom: 8px;
   background: var(--app-side-bg);
-  column-gap: 10px;
+  column-gap: 8px;
 }
 
 .tp-link-card-box img {
   max-width: 50%;
   max-height: 180px;
-  border-radius: 10px;
+  border-radius: 4px;
   cursor: pointer;
   transition: all 0.5s;
 }
diff --git a/src/components/viewPost/tp-text.vue b/src/components/viewPost/tp-text.vue
index 7aeb9130..5b92606c 100644
--- a/src/components/viewPost/tp-text.vue
+++ b/src/components/viewPost/tp-text.vue
@@ -148,12 +148,12 @@ function getEmojiName(): string {
   display: inline-flex;
   align-items: flex-end;
   justify-content: center;
-  transform: translateY(5px);
+  margin: 0 4px;
+  transform: translateY(2px);
 }
 
 .tp-text-emoji img {
-  width: 45px;
-  height: 45px;
-  margin: 0 5px;
+  height: 32px;
+  object-fit: contain;
 }
 </style>
diff --git a/src/components/viewPost/vp-btn-reply.vue b/src/components/viewPost/vp-btn-reply.vue
index d88b1add..4fe5dd9b 100644
--- a/src/components/viewPost/vp-btn-reply.vue
+++ b/src/components/viewPost/vp-btn-reply.vue
@@ -22,7 +22,7 @@
       </template>
       <div class="tpr-main-reply">
         <div class="tpr-main-filter">
-          <v-chip color="primary" label @click="handleDebug">回复列表</v-chip>
+          <div class="tpr-title" @click="handleDebug">回复列表</div>
           <v-switch
             v-model="onlyLz"
             color="primary"
@@ -39,7 +39,7 @@
             item-value="value"
             title="排序方式"
           />
-          <v-btn @click="showOverlay = false" icon="mdi-close" class="tpr-btn-close" size="small" />
+          <v-btn @click="showOverlay = false" icon="mdi-close" class="tpr-btn-close" size="32" />
         </div>
         <v-list class="tpr-reply-list">
           <VpReplyItem
@@ -176,7 +176,8 @@ async function handleDebug(): Promise<void> {
 }
 
 .tpr-btn-close {
-  border: 1px solid var(--common-shadow-4);
+  border: 1px solid var(--common-shadow-2);
+  margin-left: auto;
   background: var(--tgc-btn-1);
   color: var(--btn-text);
 }
@@ -186,16 +187,17 @@ async function handleDebug(): Promise<void> {
   display: flex;
   width: 300px;
   height: 400px;
+  box-sizing: border-box;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
-  padding: 5px;
+  padding: 8px;
   border: 1px solid var(--common-shadow-1);
-  border-radius: 5px;
+  border-radius: 4px;
   background: var(--app-page-bg);
-  box-shadow: 5px 5px 8px var(--common-shadow-4);
+  box-shadow: 2px 2px 8px var(--common-shadow-4);
   overflow-y: auto;
-  row-gap: 10px;
+  row-gap: 8px;
 }
 
 .tpr-main-filter {
@@ -203,12 +205,25 @@ async function handleDebug(): Promise<void> {
   width: 100%;
   height: 40px;
   align-items: center;
-  justify-content: space-between;
+  justify-content: flex-start;
   color: var(--app-page-content);
-  column-gap: 10px;
+  column-gap: 4px;
+}
+
+.tpr-title {
+  position: relative;
+  padding: 2px 4px;
+  border-radius: 4px;
+  background: var(--tgc-od-blue);
+  color: var(--tgc-white-1);
+  cursor: pointer;
+  font-family: var(--font-title);
+  white-space: nowrap;
 }
 
 .tpr-select {
+  position: relative;
+  max-width: 100px;
   height: 40px;
   font-size: 12px;
 }
@@ -218,13 +233,15 @@ async function handleDebug(): Promise<void> {
   display: flex;
   width: 100%;
   height: 360px;
+  box-sizing: border-box;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
-  padding: 0 5px;
+  padding-top: 0;
+  padding-right: 4px;
   background: var(--app-page-bg);
-  overflow-y: auto;
-  row-gap: 5px;
+  overflow: hidden auto;
+  row-gap: 8px;
 }
 
 .tpr-list-item {
diff --git a/src/components/viewPost/vp-overlay-image.vue b/src/components/viewPost/vp-overlay-image.vue
index 10a55be7..0a751fc6 100644
--- a/src/components/viewPost/vp-overlay-image.vue
+++ b/src/components/viewPost/vp-overlay-image.vue
@@ -101,7 +101,7 @@ async function onDownload(): Promise<void> {
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
-  row-gap: 20px;
+  row-gap: 12px;
   transition: all 0.5s;
 }
 
@@ -110,9 +110,11 @@ async function onDownload(): Promise<void> {
   display: flex;
   width: 100%;
   max-height: 70%;
+  box-sizing: border-box;
   align-items: flex-start;
   justify-content: center;
-  border-radius: 10px;
+  border: 1px solid var(--tgc-od-white);
+  border-radius: 4px;
   background: v-bind("bgMode === 1 ? 'black' : bgMode === 2 ? 'white' : 'transparent'");
   cursor: zoom-in;
   overflow-y: auto;
@@ -129,7 +131,7 @@ async function onDownload(): Promise<void> {
 .tpoi-top img {
   max-width: 100%;
   max-height: 100%;
-  border-radius: 10px;
+  border-radius: 4px;
   object-fit: contain;
 }
 
@@ -138,23 +140,25 @@ async function onDownload(): Promise<void> {
   width: 100%;
   align-items: flex-end;
   justify-content: space-between;
-  gap: 10px;
+  gap: 8px;
 }
 
 .tpoi-info {
-  padding: 10px;
-  border-radius: 10px;
+  padding: 8px;
+  border: 1px solid var(--tgc-od-white);
+  border-radius: 4px;
   background-color: var(--common-shadow-2);
   color: white;
 }
 
 .tpoi-tools {
   display: flex;
-  padding: 10px;
-  border-radius: 10px;
+  padding: 8px;
+  border: 1px solid var(--tgc-od-white);
+  border-radius: 4px;
   background-color: var(--common-shadow-2);
   color: white;
-  gap: 10px;
+  gap: 4px;
 }
 
 .tpoi-tools v-icon {
diff --git a/src/components/viewPost/vp-reply-item.vue b/src/components/viewPost/vp-reply-item.vue
index 13e39dc8..6c37e6f0 100644
--- a/src/components/viewPost/vp-reply-item.vue
+++ b/src/components/viewPost/vp-reply-item.vue
@@ -71,6 +71,9 @@
       </div>
     </div>
     <div class="tpr-extra" :title="`ID:${props.modelValue.reply.reply_id}`">
+      <div class="tpr-share" @click="share" data-html2canvas-ignore title="分享">
+        <v-icon size="small">mdi-share-variant</v-icon>
+      </div>
       <span
         class="tpr-pin"
         v-if="props.mode === 'main' && props.modelValue.reply.reply_id === props.pinId"
@@ -89,9 +92,6 @@
         {{ props.modelValue.reply.floor_id }}F
       </span>
     </div>
-    <div class="tpr-share" @click="share" data-html2canvas-ignore title="分享">
-      <v-icon size="small">mdi-share-variant</v-icon>
-    </div>
     <div class="tpr-share-info bottom">
       <span>{{ props.modelValue.reply.post_id }}</span>
       <span v-if="props.mode === 'sub'"> | {{ props.modelValue.reply.floor_id }}F</span>
@@ -237,14 +237,14 @@ async function handleUser(): Promise<void> {
   position: relative;
   display: flex;
   width: 100%;
+  box-sizing: border-box;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
-  padding: 5px;
+  padding: 8px;
   border: 1px solid var(--common-shadow-1);
-  border-radius: 5px;
+  border-radius: 4px;
   background: var(--box-bg-1);
-  row-gap: 5px;
   word-break: break-all;
 }
 
@@ -265,12 +265,11 @@ async function handleUser(): Promise<void> {
 .tpr-user {
   position: relative;
   display: flex;
-  width: 100%;
+  max-width: 100%;
   height: 40px;
   align-items: center;
   justify-content: flex-start;
   cursor: pointer;
-  gap: 5px;
 }
 
 .tpru-left {
@@ -331,7 +330,7 @@ async function handleUser(): Promise<void> {
   overflow: hidden;
   align-items: center;
   justify-content: center;
-  column-gap: 5px;
+  column-gap: 4px;
   font-family: var(--font-title);
   font-size: 16px;
   text-overflow: ellipsis;
@@ -350,17 +349,19 @@ async function handleUser(): Promise<void> {
   padding: 0 2px;
   border-radius: 2px;
   background: var(--tgc-od-blue);
+  color: var(--tgc-white-1);
   font-size: 12px;
 }
 
 .tpr-content {
-  width: 100%;
+  position: relative;
+  max-width: 100%;
 }
 
 .tpr-info {
   display: flex;
   width: 100%;
-  align-items: center;
+  align-items: flex-end;
   justify-content: space-between;
   opacity: 0.5;
 }
@@ -369,21 +370,22 @@ async function handleUser(): Promise<void> {
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 5px;
+  font-size: 12px;
+  gap: 4px;
 }
 
 .tpri-right {
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 5px;
+  gap: 4px;
 }
 
 .tpr-like {
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 5px;
+  gap: 4px;
 }
 
 .tpr-reply {
@@ -391,7 +393,7 @@ async function handleUser(): Promise<void> {
   align-items: center;
   justify-content: center;
   cursor: pointer;
-  gap: 5px;
+  gap: 4px;
 }
 
 .tpr-extra {
@@ -400,7 +402,7 @@ async function handleUser(): Promise<void> {
   align-items: center;
   justify-content: flex-end;
   font-size: 12px;
-  gap: 5px;
+  gap: 4px;
 }
 
 .tpr-pin {
@@ -422,7 +424,7 @@ async function handleUser(): Promise<void> {
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 5px;
+  gap: 4px;
   opacity: 0.3;
 
   :last-child {
@@ -442,21 +444,24 @@ async function handleUser(): Promise<void> {
 .tpr-reply-sub {
   position: relative;
   display: flex;
-  width: 100%;
-  max-height: 360px;
+  width: 300px;
+  max-height: 400px;
+  box-sizing: border-box;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
-  padding: 5px;
+  padding: 8px;
+  border-radius: 4px;
   background: var(--app-page-bg);
   overflow-y: auto;
-  row-gap: 5px;
+  row-gap: 8px;
+
+  &.v-list {
+    box-shadow: -4px 0 8px var(--common-shadow-4);
+  }
 }
 
 .tpr-share {
-  position: absolute;
-  bottom: 5px;
-  left: 5px;
   cursor: pointer;
   opacity: 0.3;
 }
@@ -469,17 +474,17 @@ async function handleUser(): Promise<void> {
   justify-content: center;
   color: var(--tgc-od-white);
   font-size: 12px;
-  gap: 5px;
+  gap: 4px;
   text-shadow: 1px 1px 1px var(--tgc-dark-1);
 }
 
 .tpr-share-info.top {
   top: 0;
-  right: 5px;
+  right: 4px;
 }
 
 .tpr-share-info.bottom {
-  bottom: 5px;
-  left: 5px;
+  bottom: 4px;
+  left: 4px;
 }
 </style>
diff --git a/src/utils/TGShare.ts b/src/utils/TGShare.ts
index 6d13e725..e1fb3349 100644
--- a/src/utils/TGShare.ts
+++ b/src/utils/TGShare.ts
@@ -165,7 +165,6 @@ export async function copyToClipboard(buffer: Uint8Array): Promise<void> {
   const url = URL.createObjectURL(blob);
   // todo mac 会报错: https://bugs.webkit.org/show_bug.cgi?id=222262
   if (platform() === "macos") {
-    // todo 待测试
     navigator.clipboard.write([new ClipboardItem({ [blob.type]: blob })]).then(
       () => URL.revokeObjectURL(url),
       (err) => TGLogger.Error(`[copyToClipboard] 复制到剪贴板失败: ${err}`),
diff --git a/src/views/t-post.vue b/src/views/t-post.vue
index 832c4304..c2de8ae7 100644
--- a/src/views/t-post.vue
+++ b/src/views/t-post.vue
@@ -49,6 +49,7 @@
         @click="handleUser(postData.user)"
       />
     </div>
+    <div class="tp-post-divider" />
     <div class="tp-post-title" @click="toPost()">
       <span class="mpt-official" v-if="postData.post.post_status.is_official">官</span>
       <span>{{ postData.post.subject }}</span>
@@ -367,18 +368,18 @@ function handleUser(user: TGApp.BBS.Post.User): void {
   align-items: center;
   justify-content: start;
   color: var(--common-text-title);
+  column-gap: 4px;
   cursor: pointer;
   font-family: var(--font-title);
   font-size: 20px;
 }
 
 .mpt-official {
-  display: inline-block;
-  width: 24px;
+  position: relative;
   align-items: center;
   justify-content: center;
-  border-radius: 5px;
-  margin-right: 2px;
+  padding: 0 4px;
+  border-radius: 4px;
   background: var(--common-shadow-1);
   color: var(--box-text-5);
   font-size: 16px;
@@ -387,10 +388,12 @@ function handleUser(user: TGApp.BBS.Post.User): void {
 
 /* subtitle */
 .tp-post-subtitle {
+  position: relative;
   display: flex;
+  width: fit-content;
   align-items: center;
   justify-content: flex-start;
-  column-gap: 10px;
+  column-gap: 8px;
   font-size: 16px;
   opacity: 0.6;
 }
@@ -400,7 +403,7 @@ function handleUser(user: TGApp.BBS.Post.User): void {
   align-items: center;
   justify-content: center;
   color: var(--common-text-title);
-  column-gap: 5px;
+  column-gap: 4px;
   font-family: var(--font-title);
 }
 
@@ -410,9 +413,17 @@ function handleUser(user: TGApp.BBS.Post.User): void {
   display: flex;
   align-items: end;
   justify-content: space-between;
-  padding-bottom: 10px;
-  border-bottom: 1px dashed var(--common-shadow-2);
-  margin-bottom: 10px;
+}
+
+.tp-post-divider {
+  position: relative;
+  width: 100%;
+  height: 1px;
+  box-sizing: border-box;
+  border: 1px dashed var(--common-shadow-2);
+  border-radius: 1px;
+  margin: 8px 0;
+  background: transparent;
 }
 
 .tp-post-version {
@@ -431,7 +442,7 @@ function handleUser(user: TGApp.BBS.Post.User): void {
   align-items: center;
   justify-content: start;
   color: var(--box-text-4);
-  column-gap: 10px;
+  column-gap: 8px;
   font-size: 14px;
 }
 
@@ -462,7 +473,6 @@ function handleUser(user: TGApp.BBS.Post.User): void {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-left: 10px;
   column-gap: 2px;
   opacity: 0.8;
 
@@ -473,11 +483,14 @@ function handleUser(user: TGApp.BBS.Post.User): void {
 
 /* extra */
 .tp-post-extra {
+  position: relative;
   display: flex;
+  width: fit-content;
+  max-width: 100%;
   flex-wrap: wrap;
   align-items: center;
   justify-content: start;
-  gap: 5px 10px;
+  gap: 4px 8px;
 }
 
 /* collection */
@@ -485,11 +498,11 @@ function handleUser(user: TGApp.BBS.Post.User): void {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: 0 5px;
+  padding: 0 4px;
   border: 1px solid var(--common-shadow-2);
-  border-radius: 5px;
+  border-radius: 4px;
   color: var(--box-text-3);
-  column-gap: 5px;
+  column-gap: 4px;
   cursor: pointer;
   font-family: var(--font-title);
   font-size: 12px;
diff --git a/src/web/utils/annoParser.ts b/src/web/utils/annoParser.ts
index 463e0436..7a9edff0 100644
--- a/src/web/utils/annoParser.ts
+++ b/src/web/utils/annoParser.ts
@@ -262,7 +262,6 @@ function parseAnnoSpan(span: HTMLElement, attr?: Record<string, string>): TGApp.
     }
     return { insert: parse, attributes: spanAttrs };
   }
-  // todo 优化处理
   return { insert: span.textContent ?? "", attributes: spanAttrs };
 }