feat(ai): add local expert library

apps/web_v1/src/App.css

@@ -1642,6 +1642,13 @@
   color: var(--senlin-muted);
 }
 
+.agent-session-emoji {
+  width: 18px;
+  flex: 0 0 18px;
+  display: inline-grid;
+  place-items: center;
+}
+
 .agent-session:hover,
 .agent-session.active {
   background: color-mix(in srgb, var(--senlin-primary) 8%, var(--senlin-panel));
@@ -1670,6 +1677,148 @@
   scrollbar-width: thin;
 }
 
+.agent-expert-picker {
+  width: min(920px, 100%);
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.agent-expert-heading {
+  display: grid;
+  justify-items: center;
+  gap: 8px;
+  margin-bottom: 2px;
+  text-align: center;
+}
+
+.agent-expert-heading strong {
+  color: var(--senlin-text);
+  font-size: 20px;
+}
+
+.agent-expert-search {
+  width: min(560px, 100%);
+  align-self: center;
+}
+
+.agent-expert-search.arco-input-wrapper {
+  height: 40px;
+  border-radius: 12px;
+  background: color-mix(in srgb, var(--senlin-bg) 68%, var(--senlin-panel));
+}
+
+.agent-expert-categories {
+  display: flex;
+  gap: 7px;
+  overflow-x: auto;
+  padding: 1px 0 4px;
+  scrollbar-width: none;
+}
+
+.agent-expert-categories button {
+  flex: 0 0 auto;
+  border: 1px solid var(--senlin-border);
+  border-radius: 999px;
+  background: var(--senlin-panel);
+  color: var(--senlin-muted);
+  padding: 5px 11px;
+  cursor: pointer;
+  font-size: 12px;
+}
+
+.agent-expert-categories button:hover,
+.agent-expert-categories button.active {
+  border-color: color-mix(in srgb, var(--senlin-primary) 45%, var(--senlin-border));
+  background: var(--senlin-soft-blue);
+  color: var(--senlin-primary);
+}
+
+.agent-expert-loading {
+  min-height: 0;
+}
+
+.agent-expert-loading > .arco-spin-children {
+  min-height: 0;
+}
+
+.agent-expert-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 10px;
+  padding-bottom: 4px;
+}
+
+.agent-expert-card {
+  min-width: 0;
+  min-height: 132px;
+  display: grid;
+  grid-template-columns: 42px minmax(0, 1fr);
+  align-items: start;
+  gap: 11px;
+  border: 1px solid var(--senlin-border);
+  border-radius: 13px;
+  background: var(--senlin-panel);
+  color: var(--senlin-text);
+  padding: 13px;
+  text-align: left;
+  cursor: pointer;
+  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
+}
+
+.agent-expert-card:hover,
+.agent-expert-card.active {
+  border-color: color-mix(in srgb, var(--senlin-primary) 55%, var(--senlin-border));
+  box-shadow: 0 8px 22px color-mix(in srgb, var(--senlin-primary) 10%, transparent);
+  transform: translateY(-1px);
+}
+
+.agent-expert-card.active {
+  background: color-mix(in srgb, var(--senlin-soft-blue) 62%, var(--senlin-panel));
+}
+
+.agent-expert-avatar {
+  width: 42px;
+  height: 42px;
+  display: grid;
+  place-items: center;
+  border-radius: 12px;
+  color: #fff;
+  font-size: 20px;
+}
+
+.agent-expert-copy {
+  min-width: 0;
+  display: grid;
+  gap: 3px;
+}
+
+.agent-expert-copy small {
+  overflow: hidden;
+  color: var(--senlin-primary);
+  font-size: 11px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.agent-expert-copy strong {
+  overflow: hidden;
+  font-size: 14px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.agent-expert-copy > span {
+  display: -webkit-box;
+  overflow: hidden;
+  color: var(--senlin-muted);
+  font-size: 12px;
+  line-height: 1.55;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3;
+}
+
 .agent-empty-state {
   align-self: center;
   display: grid;
@@ -1819,6 +1968,10 @@
   .agent-composer {
     width: calc(100% - 32px);
   }
+
+  .agent-expert-grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
 }
 
 .reply-box,