diff --git a/src/renderer/inbox/components/NoteCard.tsx b/src/renderer/inbox/components/NoteCard.tsx
index 35618dc..c3277ba 100644
--- a/src/renderer/inbox/components/NoteCard.tsx
+++ b/src/renderer/inbox/components/NoteCard.tsx
@@ -1,5 +1,163 @@
-import React from 'react';
+import React, { useState } from 'react';
 import type { Note } from '@shared/types';
-export function NoteCard({ note }: { note: Note; onDeleted: () => void; onUpdated: (n: Note) => void }) {
-  return <div style={{ background: 'white', padding: 12, marginBottom: 10, borderRadius: 8 }}>{note.rawText}</div>;
+import { inboxApi } from '../api.js';
+import { EditableField } from './EditableField.js';
+import { IntentBanner } from './IntentBanner.js';
+
+interface Props {
+  note: Note;
+  onDeleted: () => void;
+  onUpdated: (n: Note) => void;
+}
+
+const aiBadgeStyle: React.CSSProperties = {
+  display: 'inline-block', marginLeft: 6, padding: '1px 5px',
+  background: '#eee', color: '#666', fontSize: 10, borderRadius: 3, verticalAlign: 'middle'
+};
+
+export function NoteCard({ note, onDeleted, onUpdated }: Props): React.ReactElement {
+  const [rawOpen, setRawOpen] = useState(note.aiStatus !== 'done');
+  const [local, setLocal] = useState(note);
+
+  React.useEffect(() => { setLocal(note); }, [note]);
+
+  const formatted = new Date(note.createdAt).toLocaleString('ko-KR');
+
+  async function handleDelete() {
+    if (!window.confirm('이 기억을 버릴까요? 되돌릴 수 없습니다.')) return;
+    await inboxApi.deleteNote(note.id);
+    onDeleted();
+  }
+
+  async function saveTitle(next: string) {
+    await inboxApi.updateAiFields(note.id, { title: next });
+    const updated = { ...local, aiTitle: next, titleEditedByUser: true };
+    setLocal(updated); onUpdated(updated);
+  }
+
+  async function saveSummary(next: string) {
+    await inboxApi.updateAiFields(note.id, { summary: next });
+    const updated = { ...local, aiSummary: next, summaryEditedByUser: true };
+    setLocal(updated); onUpdated(updated);
+  }
+
+  async function removeTag(tagName: string) {
+    const next = local.tags.filter((t) => t.name !== tagName).map((t) => t.name);
+    await inboxApi.updateAiFields(note.id, { tags: next });
+    const updated = { ...local, tags: local.tags.filter((t) => t.name !== tagName) };
+    setLocal(updated); onUpdated(updated);
+  }
+
+  async function saveIntent(next: string) {
+    await inboxApi.setIntent(note.id, next);
+    const now = new Date().toISOString();
+    const updated = { ...local, userIntent: next, intentPromptedAt: local.intentPromptedAt ?? now };
+    setLocal(updated); onUpdated(updated);
+  }
+
+  const showIntentBanner = local.aiStatus === 'done' && local.intentPromptedAt === null;
+
+  return (
+    <div style={{ background: 'white', padding: 16, marginBottom: 12, borderRadius: 10, boxShadow: '0 1px 2px rgba(0,0,0,0.04)' }}>
+      <div style={{ fontSize: 11, color: '#888' }}>{formatted}</div>
+
+      {showIntentBanner && (
+        <IntentBanner
+          noteId={note.id}
+          onResolved={(intentText) => {
+            const now = new Date().toISOString();
+            const updated = { ...local, userIntent: intentText ?? null, intentPromptedAt: now };
+            setLocal(updated); onUpdated(updated);
+          }}
+        />
+      )}
+
+      {local.aiStatus === 'pending' && (
+        <div style={{ fontSize: 16, fontWeight: 600, color: '#666', marginTop: 4 }}>
+          Inkling이 정리하는 중…
+        </div>
+      )}
+      {local.aiStatus === 'failed' && (
+        <div title={local.aiError ?? ''} style={{ fontSize: 16, fontWeight: 600, color: '#a55', marginTop: 4 }}>
+          정리 보류 — 원문은 안전합니다
+        </div>
+      )}
+      {local.aiStatus === 'done' && (
+        <>
+          <div style={{ marginTop: 4 }}>
+            <EditableField
+              value={local.aiTitle ?? ''}
+              onSave={saveTitle}
+              style={{ display: 'inline-block', fontSize: 16, fontWeight: 600 }}
+              singleLine
+            />
+            {!local.titleEditedByUser && <span style={aiBadgeStyle} title="AI 제안">AI</span>}
+          </div>
+          <div style={{ marginTop: 6 }}>
+            <EditableField
+              value={local.aiSummary ?? ''}
+              onSave={saveSummary}
+              style={{ fontSize: 13, color: '#333', whiteSpace: 'pre-wrap' }}
+              singleLine={false}
+            />
+            {!local.summaryEditedByUser && <span style={aiBadgeStyle} title="AI 제안">AI</span>}
+          </div>
+          {local.tags.length > 0 && (
+            <div style={{ marginTop: 8, display: 'flex', gap: 6, flexWrap: 'wrap' }}>
+              {local.tags.map((t) => (
+                <span
+                  key={t.name}
+                  onClick={() => void removeTag(t.name)}
+                  style={{
+                    background: t.source === 'ai' ? '#eaf3ff' : '#e9f9e4',
+                    color: t.source === 'ai' ? '#0a4b80' : '#236b1a',
+                    padding: '2px 8px', borderRadius: 12, fontSize: 12, cursor: 'pointer'
+                  }}
+                  title={t.source === 'ai' ? 'AI 제안 — 클릭으로 제거' : '내가 추가 — 클릭으로 제거'}
+                >
+                  {t.name}{t.source === 'ai' && <sub style={{ marginLeft: 3, fontSize: 9 }}>AI</sub>}
+                </span>
+              ))}
+            </div>
+          )}
+          {local.userIntent !== null && (
+            <div style={{ marginTop: 10, padding: 8, background: '#fffbe9', borderRadius: 6 }}>
+              <span style={{ fontSize: 12, color: '#7a5a00', marginRight: 6 }}>💡</span>
+              <EditableField
+                value={local.userIntent}
+                onSave={saveIntent}
+                style={{ display: 'inline-block', fontSize: 13, color: '#444' }}
+                singleLine
+              />
+            </div>
+          )}
+        </>
+      )}
+
+      {local.media.length > 0 && (
+        <div style={{ marginTop: 10, display: 'flex', gap: 6 }}>
+          {local.media.map((m) => (
+            <div key={m.id} style={{ width: 48, height: 48, background: '#eee', borderRadius: 4 }} title={m.relPath} />
+          ))}
+        </div>
+      )}
+
+      <div style={{ marginTop: 10 }}>
+        <button onClick={() => setRawOpen((o) => !o)} style={{ background: 'none', border: 'none', color: '#555', fontSize: 12, cursor: 'pointer', padding: 0 }}>
+          {rawOpen ? '▾ 원문 접기' : '▸ 원문 보기'}
+        </button>
+        {rawOpen && (
+          <pre style={{ marginTop: 6, whiteSpace: 'pre-wrap', fontSize: 12, color: '#555', background: '#fafafa', padding: 8, borderRadius: 4 }}>
+            {local.rawText}
+          </pre>
+        )}
+      </div>
+
+      <div style={{ marginTop: 10, textAlign: 'right' }}>
+        <button onClick={() => void handleDelete()} style={{ background: 'none', border: 'none', color: '#c93030', cursor: 'pointer', fontSize: 12 }}>
+          🗑 삭제
+        </button>
+      </div>
+    </div>
+  );
 }