style: 统一列表首项留白并添加背景色过渡

src/components/ui/flatTheme.test.ts

@@ -162,6 +162,23 @@ describe('全站平面主题', () => {
         )
     })
 
+    it('斑马纹首项保留统一顶部留白，背景色平滑过渡并遵循减少动态效果设置', () => {
+        // DOM 环境不计算实际内边距，检查共享规则及之前覆盖首项留白的工具类。
+        const css = readFileSync('src/styles.css', 'utf8')
+        expect(css).toMatch(
+            /\.record-list > article\s*\{[^}]*padding:\s*20px;[^}]*transition:\s*background-color 160ms ease;/
+        )
+        expect(css).toMatch(
+            /@media \(prefers-reduced-motion: reduce\)[\s\S]*transition-duration:\s*0\.01ms !important;/
+        )
+        for (const file of [
+            'src/features/breakdown/components/SubjectList.vue',
+            'src/features/create-drama/CreateDramaPage.vue'
+        ]) {
+            expect(readFileSync(file, 'utf8')).not.toContain('first:pt-0')
+        }
+    })
+
     it('所有页面不再通过工具类添加装饰边框或圆角', () => {
         const files = readdirSync('src', { recursive: true, encoding: 'utf8' }).filter(path => path.endsWith('.vue'))
         for (const path of files) {

src/features/breakdown/components/SubjectList.vue

@@ -31,7 +31,7 @@ const filtered = computed(() =>
             </div>
         </div>
         <div v-if="filtered.length" class="record-list subject-record-list">
-            <article v-for="subject in filtered" :key="subject.profileId" class="py-5 first:pt-0">
+            <article v-for="subject in filtered" :key="subject.profileId">
                 <div class="mb-3 flex flex-wrap items-center gap-3">
                     <h3 class="font-semibold">{{ subject.name }}</h3>
                     <code class="subject-ref">{{ subject.ref }}</code

src/features/create-drama/CreateDramaPage.vue

@@ -151,11 +151,7 @@ function exportScript() {
                     <NScrollbar v-if="tab !== 'episodes'" class="panel-scroll"
                         ><div v-if="tab === 'characters'" class="p-6 lg:p-8">
                             <div v-if="project?.characters.length" class="record-list">
-                                <article
-                                    v-for="character in project.characters"
-                                    :key="character.id"
-                                    class="py-5 first:pt-0"
-                                >
+                                <article v-for="character in project.characters" :key="character.id">
                                     <div class="mb-3 flex items-center gap-3">
                                         <h3 class="text-lg font-semibold">{{ character.name }}</h3>
                                         <NTag size="small" :bordered="false">{{ character.role || '角色' }}</NTag

src/styles.css

@@ -198,8 +198,10 @@
         --app-field-hover: var(--app-surface);
         background: var(--app-subtle);
     }
+    /* 首项与其它条目统一内边距；只过渡背景，避免展开内容和文字发生位移动画。 */
     .record-list > article {
         padding: 20px;
+        transition: background-color 160ms ease;
     }
     .record-list > article:nth-child(even) {
         background: var(--app-subtle);