@blade-hq/agent-react 2610.0.0-beta.7 → 2610.0.0-beta.71

package/dist/style.full.css

@@ -10,9 +10,16 @@
  * 两个优先级前提，改这个文件前先确认还成立：
  * - 必须放在 style.css **之前**。`.blade-chat *` 和 style.css 里的 .blade-chat-xxx
  *   同为 (0,1,0)，靠先后顺序分胜负；放后面会把输入框边框这类兜底样式抹掉。
- * - 必须包在 @layer base 里。style.css 是无层样式，优先级高于任何 @layer；这里如果
- *   也不分层，就会盖住 @layer utilities 里的 Tailwind 工具类，组件的 p-4、gap-2 全部失效。 */
-@layer theme, base, components, utilities;
+ * - 必须包在 @layer base 里。分层规则永远输给不分层的作者样式；这里如果
+ *   也不分层，就会盖住 @layer utilities 里的 Tailwind 工具类，组件的 p-4、gap-2 全部失效。
+ *
+ * 层序在这里定一次：这份文件排在最前面，它的 @layer 声明就是三份产物共用的顺序。
+ * properties 是 Tailwind 的 --tw-* 初始值层，排在最前（见 style.css 顶部说明）。
+ * blade-chat-overrides 排在 utilities 之后——SDK 里那些必须压过自己工具类的规则
+ * （窄容器放宽、iOS 聚焦缩放守卫、Markdown 与代码块排版）都写在 style.css 的那一层里。
+ * 名字带 SDK 前缀：宿主样式表里先声明过一个同名的通用层时，全局层序由那次声明定，
+ * SDK 的规则就会掉到 utilities 之前、守卫全部失效。 */
+@layer properties, theme, base, components, utilities, blade-chat-overrides;
 
 @layer base {
   /* preflight 是在 html 上设 line-height 的，组件内所有排版都按它算。不补这一条，
@@ -136,11 +143,107 @@
 /*
  * @blade-hq/agent-react 自包含样式。
  *
- * 组件同时携带 Tailwind class 与 blade-chat-* 前缀类：宿主项目装了 Tailwind 时
- * 由 Tailwind 提供完整视觉；没装时，本文件为核心布局与配色提供等效的普通 CSS，
- * 保证聊天界面开箱可用。所有颜色经由 CSS 变量，宿主可整体换肤。
+ * 这份文件只放 Tailwind 工具类表达不了的东西，其余视觉一律由组件上的 Tailwind
+ * class 定义一次（R1：一个视觉效果只在一处定义）：
+ *
+ * - CSS 变量（主题、圆角、gutter）与 `:host` 尺寸默认值；
+ * - 容器查询（`@container`）：按「容器宽度」而不是视口伸缩的内边距与断点；
+ * - Markdown 排版：正文是 streamdown 生成的 HTML，没有类名可挂，只能在这里写；
+ * - 无 Tailwind 预检时组件仍需要的少量 rest（按钮游标、textarea 去边框）；
+ * - 跨元素的形状约束，如 `.blade-chat-messages-content > div` 的轮次间距。
+ *
+ * 组件上的 Tailwind class 不再需要在这里重复一份。视觉规则的层序见下面
+ * `@layer` 声明：兜底在 components 层，Tailwind 工具类在 utilities 层，
+ * 接入方无层的普通 CSS 天然最高优先——所以 `.blade-chat-user-bubble { background: red }`
+ * 一定生效，不需要 `!important`。
+ */
+
+/* ------------------------------------------------------------ 语义锚点清单
+ *
+ * 公开契约：每个可见区块的根元素固定带一个 blade-chat-* 类，接入方用普通 CSS
+ * 选它即可覆盖 SDK 默认样式（README「样式定制」第 4 层），不需要 !important，
+ * 也不需要跟着 SDK 的构建顺序走。
+ *
+ * 锚点只承担「可被选中」职责，不承载视觉规则。下面的兜底样式里出现的锚点，
+ * 只是恰好需要兜底的那几个；清单本身才是契约的一部分。
+ *
+ * scripts/gen-embed-styles.mjs 会校验这份清单的两件事：源码里出现的每个锚点都
+ * 必须在这里登记；清单里的每个锚点都必须出现在三份 CSS 产物中。新增可见区块时
+ * 先在这里登记锚点，再让元素带上它。
+ *
+ * @blade-chat-anchors
+ * blade-chat
+ * blade-chat-advanced
+ * blade-chat-agent-loop
+ * blade-chat-ask-card
+ * blade-chat-ask-option
+ * blade-chat-assistant-text
+ * blade-chat-assistant-turn
+ * blade-chat-banner
+ * blade-chat-codeblock
+ * blade-chat-codeblock-body
+ * blade-chat-codeblock-header
+ * blade-chat-context-card
+ * blade-chat-context-chevron
+ * blade-chat-context-copy
+ * blade-chat-context-detail
+ * blade-chat-context-group-items
+ * blade-chat-context-icon
+ * blade-chat-context-status
+ * blade-chat-context-summary
+ * blade-chat-context-title
+ * blade-chat-empty
+ * blade-chat-error-bar
+ * blade-chat-error-block
+ * blade-chat-error-row
+ * blade-chat-file-card
+ * blade-chat-file-card-icon
+ * blade-chat-file-card-name
+ * blade-chat-followup
+ * blade-chat-followup-action
+ * blade-chat-host
+ * blade-chat-input
+ * blade-chat-input-inner
+ * blade-chat-input-toolbar
+ * blade-chat-login
+ * blade-chat-markdown
+ * blade-chat-mcp-app
+ * blade-chat-memory-refs
+ * blade-chat-messages
+ * blade-chat-messages-content
+ * blade-chat-messages-scroll
+ * blade-chat-plan
+ * blade-chat-plan-block
+ * blade-chat-prose
+ * blade-chat-queue
+ * blade-chat-queue-item
+ * blade-chat-queue-notice
+ * blade-chat-render-error
+ * blade-chat-replay-bar
+ * blade-chat-scroll-bottom
+ * blade-chat-scroll-bottom-label
+ * blade-chat-textarea
+ * blade-chat-thinking
+ * blade-chat-tool-row
+ * blade-chat-user-bubble
+ * blade-chat-user-col
+ * blade-chat-user-row
  */
 
+/* 层序先定死：兜底排在 Tailwind 工具类之前，换肤和覆盖才有稳定的先后。
+ * 三份产物都从这一行开始，Tailwind 自己那份声明用的是同一个顺序。
+ *
+ * properties 是 Tailwind 自己的 --tw-* 初始值层，必须排在最前：它的 `* { --tw-*: … }`
+ * 一旦排在 utilities 之后，就会把工具类设的 translate / ring / shadow 变量初始化掉。
+ *
+ * 最后一层 blade-chat-overrides 是给「必须压过组件自己 Tailwind 类」的规则用的：窄容器里
+ * 放宽用户消息宽度、iOS 聚焦不缩放、代码块与 Markdown 的排版——这些规则一旦
+ * 掉进 components 层就会被同元素的 utilities 盖掉，等于没写。接入方的普通
+ * CSS 不分层，仍然赢过这里所有层。 */
+@layer properties, theme, base, components, utilities, blade-chat-overrides;
+
+/* 变量不分层：它是主题契约，接入方在页面或祖先元素上重设同名变量即可换肤，
+ * 分层反而让"谁覆盖谁"取决于产物拼接顺序。 */
 :root,
 :host {
   --background: 0 0% 100%;
@@ -189,501 +292,491 @@
   --user-msg-border: 38 30% 19%;
 }
 
-/* ---------------------------------------------------------------- 布局骨架 */
-
-/* <blade-chat> 宿主默认块级 + 默认高度；页面对元素写的任何尺寸规则都会覆盖
- * :host 默认值。host 容器把高度传导给内部 flex 链，消息区撑满、输入框钉底。 */
-:host {
-  display: block;
-  height: 560px;
-}
+@layer components {
+  /* -------------------------------------------------------------- 布局骨架 */
 
-.blade-chat-host {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-}
+  /* <blade-chat> 宿主默认块级 + 默认高度；页面对元素写的任何尺寸规则都会覆盖
+   * :host 默认值。host 容器把高度传导给内部 flex 链，消息区撑满、输入框钉底。 */
+  :host {
+    display: block;
+    height: 560px;
+  }
 
-/* 聊天根容器。SDK 常被嵌进只有 300-400px 宽的侧栏，而宿主页面视口是全宽的，
- * 所以内边距一律按「容器宽度」伸缩，不能用视口断点——那会在窄容器里反向命中最大值。
- * container-type 建在这里（而不是消息区），是为了让消息区和输入区共享同一个 cqi
- * 基准，两者左右边缘才对得齐。代价是内部内容不再向外传递固有宽度，所以宿主需要给
- * 容器一个确定宽度（flex/grid 拉伸或显式宽度都可以）。 */
-.blade-chat {
-  /* 具名容器：宿主或以后的子组件万一在中间又建了个匿名 query container，
-   * 下面的 @container 查询不会悄悄改成以那个为基准。 */
-  container: blade-chat / inline-size;
-  display: flex;
-  flex-direction: column;
-  flex: 1 1 0%;
-  min-height: 0;
-  min-width: 0;
-  overflow: hidden;
-  --blade-chat-gutter: 1rem;
-  --blade-chat-turn-gap: 1.5rem;
-  background: hsl(var(--background));
-  color: hsl(var(--foreground));
-  font-family:
-    system-ui,
-    -apple-system,
-    "Segoe UI",
-    Roboto,
-    "PingFang SC",
-    "Microsoft YaHei",
-    sans-serif;
-}
+  .blade-chat-host {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+  }
 
-/* 上面两个变量的兜底值必须留在 @supports 外面。不能靠「同一个变量写两遍、让浏览器
- * 丢掉无效的那条」降级：自定义属性在声明处不做类型校验，带 cqi 的值在旧浏览器里同样是
- * 合法 token、照样覆盖兜底值，失效发生在 padding: var(...) 的使用处——结果是整条 padding
- * 作废变成 0，而不是回落到兜底值。 */
-@supports (container-type: inline-size) and (width: 1cqi) {
+  /* 聊天根容器。SDK 常被嵌进只有 300-400px 宽的侧栏，而宿主页面视口是全宽的，
+   * 所以内边距一律按「容器宽度」伸缩，不能用视口断点——那会在窄容器里反向命中最大值。
+   * container-type 建在这里（而不是消息区），是为了让消息区和输入区共享同一个 cqi
+   * 基准，两者左右边缘才对得齐。代价是内部内容不再向外传递固有宽度，所以宿主需要给
+   * 容器一个确定宽度（flex/grid 拉伸或显式宽度都可以）。
+   * 底色与文字色也从这里给：根节点上没有对应的 Tailwind class。 */
   .blade-chat {
-    --blade-chat-gutter: clamp(0.875rem, 4cqi, 2.5rem);
-    --blade-chat-turn-gap: clamp(1.25rem, 3cqi, 2.25rem);
+    /* 具名容器：宿主或以后的子组件万一在中间又建了个匿名 query container，
+     * 下面的 @container 查询不会悄悄改成以那个为基准。 */
+    container: blade-chat / inline-size;
+    min-width: 0;
+    --blade-chat-gutter: 1rem;
+    --blade-chat-turn-gap: 1.5rem;
+    background: hsl(var(--background));
+    color: hsl(var(--foreground));
+    font-family:
+      system-ui,
+      -apple-system,
+      "Segoe UI",
+      Roboto,
+      "PingFang SC",
+      "Microsoft YaHei",
+      sans-serif;
   }
-}
-
-.blade-chat-messages {
-  position: relative;
-  flex: 1 1 0%;
-  min-height: 0;
-}
 
-/* 滚动内容的内边距。这一层过去只有 Tailwind class，宿主没装 Tailwind 时消息完全贴边。 */
-.blade-chat-messages-scroll {
-  padding: calc(var(--blade-chat-gutter) * 1.4) var(--blade-chat-gutter)
-    calc(var(--blade-chat-gutter) * 1.1);
-}
+  /* 上面两个变量的兜底值必须留在 @supports 外面。不能靠「同一个变量写两遍、让浏览器
+   * 丢掉无效的那条」降级：自定义属性在声明处不做类型校验，带 cqi 的值在旧浏览器里同样是
+   * 合法 token、照样覆盖兜底值，失效发生在 padding: var(...) 的使用处——结果是整条 padding
+   * 作废变成 0，而不是回落到兜底值。 */
+  @supports (container-type: inline-size) and (width: 1cqi) {
+    .blade-chat {
+      --blade-chat-gutter: clamp(0.875rem, 4cqi, 2.5rem);
+      --blade-chat-turn-gap: clamp(1.25rem, 3cqi, 2.25rem);
+    }
+  }
 
-.blade-chat-messages-content {
-  margin: 0 auto;
-  max-width: 748px;
-}
+  /* 滚动内容的内边距。左右按上面的 gutter 变量走，宿主没装 Tailwind 时消息也不会贴边；
+   * 底部那份补白是消息顶置功能的 spacer（--blade-chat-pin-spacer 由组件写行内变量）。 */
+  .blade-chat-messages-scroll {
+    padding: calc(var(--blade-chat-gutter) * 1.4) var(--blade-chat-gutter)
+      calc(var(--blade-chat-gutter) * 1.1 + var(--blade-chat-pin-spacer, 0px));
+  }
 
-.blade-chat-messages-content > div {
-  display: flex;
-  flex-direction: column;
-  gap: var(--blade-chat-turn-gap);
-  min-width: 0;
-}
+  /* 轮次之间的间距用容器宽度算（见 .blade-chat 的说明），挂在内层容器上。 */
+  .blade-chat-messages-content > div {
+    gap: var(--blade-chat-turn-gap);
+  }
 
-.blade-chat-empty {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 0.75rem;
-  /* 这里的双写是有效降级：cqi 出现在属性值里，旧浏览器会丢掉整条声明并回落到上一条。 */
-  padding: 4rem 0;
-  padding: clamp(2.5rem, 12cqi, 6rem) 0;
-  color: hsl(var(--muted-foreground));
-}
+  .blade-chat-empty {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 0.75rem;
+    /* 这里的双写是有效降级：cqi 出现在属性值里，旧浏览器会丢掉整条声明并回落到上一条。 */
+    padding: 4rem 0;
+    padding: clamp(2.5rem, 12cqi, 6rem) 0;
+    color: hsl(var(--muted-foreground));
+  }
 
-.blade-chat-login,
-.blade-chat-version-mismatch {
-  display: flex;
-  flex: 1 1 0%;
-  align-items: center;
-  justify-content: center;
-  padding: 1.5rem;
-}
+  /* -------------------------------------------------------------- 输入区 */
 
-/* ---------------------------------------------------------------- 消息气泡 */
+  /* 左右内边距和消息区共用同一个 gutter，否则输入框与消息文字左边缘对不齐。
+   * 上下留白由组件上的 py-3 / pt-0 给。 */
+  .blade-chat-input {
+    /* 队列面板占位时组件会加上 border-t-0 收起这条线，所以这里不能写死：写死会
+        盖过那个切换。用变量保留默认值，外层仍按原样渲染一条分隔线。 */
+    border-top: var(--blade-chat-input-top-border, 1px solid hsl(var(--border)));
+    padding-left: var(--blade-chat-gutter);
+    padding-right: var(--blade-chat-gutter);
+  }
 
-.blade-chat-user-row {
-  display: flex;
-  justify-content: flex-end;
-}
+  /* 队列面板的外层左右留白：必须跟下面输入框一致，两边各自居中才不会错位。
+   * 默认跟随本包输入框用的同一个 gutter 变量；宿主输入框用别的留白时（内置 Web
+   * 的输入框外层是 px-5），在自己的样式里覆盖 --blade-chat-queue-gutter 即可。 */
+  .blade-chat-queue {
+    --blade-chat-queue-gutter: var(--blade-chat-gutter, 1rem);
+    padding-left: var(--blade-chat-queue-gutter);
+    padding-right: var(--blade-chat-queue-gutter);
+  }
 
-.blade-chat-user-col {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-  gap: 0.75rem;
-  max-width: 72%;
-}
+  /* ------------------------------------------------- 无 preflight 时的控件复位 */
 
-/* 窄容器里 72% 只剩 250px 左右，一句话就折三行，这里放宽。
- * 这类需要跳变而非连续伸缩的值才用 @container 查询。 */
-@container blade-chat (max-width: 480px) {
-  .blade-chat-user-col {
-    max-width: 88%;
+  /* 组件上的工具类不负责这些：宿主只用 style.css 且自己的 Tailwind 关了 preflight 时，
+     输入框和按钮会退回浏览器默认外观（原生边框、原生按钮底色）。 */
+  .blade-chat-textarea {
+    border: 0;
+    font: inherit;
   }
 
-  .blade-chat-scroll-bottom-label {
-    display: none;
+  .blade-chat-input-inner button,
+  .blade-chat-codeblock-header button,
+  .blade-chat-ask-card button {
+    cursor: pointer;
+    border: 0;
+    background-color: transparent;
   }
-}
 
-.blade-chat-user-bubble {
-  max-width: 100%;
-  border: 1px solid hsl(var(--user-msg-border));
-  background: hsl(var(--user-msg-bg));
-  color: hsl(var(--user-msg-fg));
-  border-radius: 20px;
-  border-bottom-right-radius: 6px;
-  padding: 13px 18px;
-  font-size: 0.875rem;
-  line-height: 1.65;
-}
+  /* ------------------------------------------------------------ 出错条配色 */
 
-.blade-chat-assistant-turn {
-  display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
-}
-
-.blade-chat-assistant-text {
-  font-size: 15px;
-  line-height: 2;
-  color: hsl(var(--foreground));
+  /* 配色由 .blade-chat-error-bar 的 --destructive 变量给，别写死 red-*：
+   * Tailwind 的 dark: 变体跟的是系统偏好，会和 data-theme 主题打架。 */
+  .blade-chat-error-bar {
+    border-bottom-color: hsl(var(--destructive) / 0.3);
+    background: hsl(var(--destructive) / 0.08);
+    color: hsl(var(--destructive));
+  }
 }
 
-.blade-chat-error-row {
-  display: flex;
-  justify-content: center;
-}
+@layer blade-chat-overrides {
+  /* ------------------------------------------------- 窄容器与移动端的手感 */
+  /* 需要跳变而非连续伸缩的值才用 @container：窄容器里 72% 只剩 250px 左右，
+   * 一句话就折三行。这条必须压过组件上的 max-w-[72%]，所以归 blade-chat-overrides。 */
+  @container blade-chat (max-width: 480px) {
+    .blade-chat-user-col {
+      max-width: 88%;
+    }
 
-.blade-chat-error-block {
-  max-width: 85%;
-  border-left: 3px solid hsl(var(--border));
-  padding: 0.25rem 1rem;
-  font-size: 0.875rem;
-  line-height: 1.75rem;
-  color: hsl(var(--muted-foreground));
-}
+    .blade-chat-scroll-bottom-label {
+      display: none;
+    }
+  }
 
-.blade-chat-error-bar {
-  display: flex;
-  align-items: flex-start;
-  gap: 0.5rem;
-  border-bottom: 1px solid hsl(var(--destructive) / 0.3);
-  background: hsl(var(--destructive) / 0.08);
-  padding: 0.75rem 1rem;
-  font-size: 0.875rem;
-  color: hsl(var(--destructive));
-}
+  /* Keep embedded ChatView usable on iOS without forcing every host app to know
+   Safari's 16px focus-zoom threshold. Desktop sizing remains unchanged.
+   text-sm / text-xs 会让输入控件低于 16px，所以这条也归 blade-chat-overrides。 */
+  @media (hover: none) and (pointer: coarse) {
+    .blade-chat-textarea,
+    .blade-chat-ask-card input,
+    .blade-chat-ask-card textarea {
+      font-size: 1rem;
+    }
+
+    .blade-chat-input-inner button {
+      min-width: 44px;
+      min-height: 44px;
+    }
+  }
 
-/* ---------------------------------------------------------------- 输入区 */
+  /* ------------------------------------------------------------- Markdown */
 
-/* 左右内边距和消息区共用同一个 gutter，否则输入框与消息文字左边缘对不齐。 */
-.blade-chat-input {
-  border-top: 1px solid hsl(var(--border));
-  padding: 0.75rem var(--blade-chat-gutter);
-}
+  /* 正文是 streamdown 生成的 HTML，元素上没有类名可挂，排版只能写在这里。
+   * 反过来，带 Tailwind class 的那几个外壳（codeblock、prose 容器）不在这里重复。 */
+  .blade-chat-markdown {
+    min-width: 0;
+  }
 
-.blade-chat-input-inner {
-  margin: 0 auto;
-  display: flex;
-  align-items: flex-end;
-  gap: 0.5rem;
-  max-width: 748px;
-  border: 1px solid hsl(var(--border));
-  background: hsl(var(--card));
-  border-radius: 1rem;
-  padding: 0.5rem 0.75rem;
-}
+  /* 窄容器里真正把版面撑破的是内容而不是内边距：宽表格、大图、超长 URL 都会把整个
+   * 消息区顶宽，然后出现一条横向滚动条。表格自己滚，图片自己缩，长 token 强制断行。 */
+  .blade-chat-markdown [data-streamdown="table-wrapper"] {
+    max-width: 100%;
+    min-width: 0;
+  }
 
-.blade-chat-textarea {
-  flex: 1 1 0%;
-  resize: none;
-  border: 0;
-  background: transparent;
-  color: hsl(var(--foreground));
-  font: inherit;
-  font-size: 0.875rem;
-  line-height: 1.5rem;
-  padding: 0.25rem 0;
-  min-height: 28px;
-  max-height: 12rem;
-  outline: none;
-}
+  /* 横向滚动发生在 table 的父层。streamdown 用 Tailwind 的 overflow-x-auto 实现它，
+   * 宿主没装 Tailwind 时那个类是空的，所以这里用普通 CSS 兜住。 */
+  .blade-chat-markdown [data-streamdown="table-wrapper"] > div:last-child {
+    overflow-x: auto;
+    max-width: 100%;
+  }
 
-/* Keep embedded ChatView usable on iOS without forcing every host app to know
-   Safari's 16px focus-zoom threshold. Desktop sizing remains unchanged. */
-@media (hover: none) and (pointer: coarse) {
-  .blade-chat-textarea,
-  .blade-chat-ask-card input {
-    font-size: 1rem;
+  .blade-chat-markdown img,
+  .blade-chat-markdown video {
+    max-width: 100%;
+    height: auto;
   }
 
-  .blade-chat-input-inner button {
-    min-width: 44px;
-    min-height: 44px;
+  /* 长 URL 和长内联代码是撑宽的另外两个常见肇事者。用 anywhere 而不是 break-word：
+   * 只有 anywhere 参与 min-content 计算，break-word 挡不住 flex item 被顶宽。 */
+  .blade-chat-markdown :not(pre) > code,
+  .blade-chat-markdown a {
+    overflow-wrap: anywhere;
   }
-}
 
-.blade-chat-input-inner button {
-  cursor: pointer;
-  border: 0;
-}
+  .blade-chat-prose p {
+    margin: 0.5em 0;
+  }
 
-/* ------------------------------------------------------------ 文件下载卡片 */
+  .blade-chat-prose > p:first-child,
+  .blade-chat-prose > ul:first-child,
+  .blade-chat-prose > ol:first-child {
+    margin-top: 0;
+  }
 
-.blade-chat-file-card {
-  display: inline-flex;
-  max-width: 100%;
-  margin: 0.25rem 0.5rem 0.25rem 0;
-  align-items: center;
-  gap: 0.5rem;
-  vertical-align: middle;
-}
+  .blade-chat-prose > p:last-child,
+  .blade-chat-prose > ul:last-child,
+  .blade-chat-prose > ol:last-child {
+    margin-bottom: 0;
+  }
 
-.blade-chat-file-card button {
-  display: inline-flex;
-  min-width: 0;
-  align-items: center;
-  gap: 0.375rem;
-  cursor: pointer;
-  border: 1px solid hsl(var(--border));
-  border-radius: 0.375rem;
-  background: hsl(var(--card));
-  color: hsl(var(--card-foreground));
-  padding: 0.375rem 0.625rem;
-  font-size: 0.75rem;
-  font-weight: 500;
-  line-height: 1.25rem;
-  text-align: left;
-}
+  .blade-chat-prose ul,
+  .blade-chat-prose ol {
+    margin: 0.5em 0;
+    padding-left: 1.4em;
+  }
 
-.blade-chat-file-card button:hover:not(:disabled) {
-  background: hsl(var(--accent) / 0.45);
-  border-color: hsl(var(--primary) / 0.45);
-}
+  .blade-chat-prose li {
+    margin: 0.25em 0;
+  }
 
-.blade-chat-file-card button:disabled {
-  cursor: not-allowed;
-  opacity: 0.6;
-}
+  .blade-chat-prose h1 {
+    font-size: 1.25em;
+    font-weight: 600;
+    margin: 1em 0 0.5em;
+  }
 
-.blade-chat-file-card-icon {
-  display: inline-flex;
-  flex-shrink: 0;
-  color: hsl(var(--primary));
-}
+  .blade-chat-prose h2 {
+    font-size: 1.15em;
+    font-weight: 600;
+    margin: 1em 0 0.5em;
+  }
 
-/* 窄容器里文件名不能写死上限，否则短名字留白、长名字仍然顶宽。 */
-.blade-chat-file-card-name {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  max-width: 15rem;
-  max-width: min(15rem, 60cqi);
-}
+  .blade-chat-prose h3,
+  .blade-chat-prose h4 {
+    font-size: 1.05em;
+    font-weight: 600;
+    margin: 0.9em 0 0.4em;
+  }
 
-.blade-chat-file-card-action {
-  flex-shrink: 0;
-  color: hsl(var(--muted-foreground));
-}
+  .blade-chat-prose blockquote {
+    border-left: 3px solid hsl(var(--border));
+    margin: 0.5em 0;
+    padding-left: 0.9em;
+    color: hsl(var(--muted-foreground));
+  }
 
-.blade-chat-file-card-error {
-  font-size: 0.6875rem;
-  color: hsl(var(--destructive));
-}
+  .blade-chat-prose a {
+    color: hsl(var(--primary));
+    text-decoration: underline;
+  }
 
-/* ---------------------------------------------------------------- 工具块 */
+  .blade-chat-prose code {
+    background: hsl(var(--muted) / 0.6);
+    border-radius: 0.25rem;
+    padding: 0.1em 0.35em;
+    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+    font-size: 0.9em;
+  }
 
-.blade-chat-tool,
-.blade-chat-agent-loop,
-.blade-chat-thinking {
-  margin-left: 1rem;
-  font-size: 0.75rem;
-}
+  .blade-chat-prose table {
+    border-collapse: collapse;
+    margin: 0.75em 0;
+    width: 100%;
+  }
 
-.blade-chat-tool-detail pre {
-  overflow: auto;
-  white-space: pre-wrap;
-  border-radius: 0.375rem;
-  background: hsl(var(--muted));
-  padding: 0.5rem;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-  font-size: 11px;
-  color: hsl(var(--foreground));
-}
+  .blade-chat-prose th,
+  .blade-chat-prose td {
+    border: 1px solid hsl(var(--border));
+    padding: 0.4em 0.7em;
+    text-align: left;
+  }
 
-/* ---------------------------------------------------------------- Markdown */
+  /* 代码块正文（<pre>）的排版：外层 codeblock 外壳与滚动由组件上的类给，
+   * 这里只补等宽字体和底色。 */
+  .blade-chat-codeblock-body {
+    background: hsl(var(--muted) / 0.25);
+    padding: 0.875rem 1rem;
+    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+    font-size: 13.5px;
+    line-height: 1.7;
+  }
 
-.blade-chat-markdown {
-  overflow-wrap: break-word;
-  min-width: 0;
-}
+  /* 代码块里的内联 code 不再套一层底色和留白。 */
+  .blade-chat-codeblock-body code {
+    background: transparent;
+    padding: 0;
+  }
 
-/* 窄容器里真正把版面撑破的是内容而不是内边距：宽表格、大图、超长 URL 都会把整个
- * 消息区顶宽，然后出现一条横向滚动条。表格自己滚，图片自己缩，长 token 强制断行。 */
-.blade-chat-markdown [data-streamdown="table-wrapper"] {
-  max-width: 100%;
-  min-width: 0;
-}
+  /* ---------------------------------------------------------------- 动效 */
+
+  .blade-shimmer-text {
+    background: linear-gradient(
+      90deg,
+      hsl(var(--muted-foreground)) 0%,
+      hsl(var(--foreground)) 50%,
+      hsl(var(--muted-foreground)) 100%
+    );
+    background-size: 200% 100%;
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+    color: transparent;
+    animation: blade-shimmer 2s linear infinite;
+  }
 
-/* 横向滚动发生在 table 的父层。streamdown 用 Tailwind 的 overflow-x-auto 实现它，
- * 宿主没装 Tailwind 时那个类是空的，所以这里用普通 CSS 兜住。 */
-.blade-chat-markdown [data-streamdown="table-wrapper"] > div:last-child {
-  overflow-x: auto;
-  max-width: 100%;
+  @keyframes blade-shimmer {
+    from {
+      background-position: 200% 0;
+    }
+    to {
+      background-position: -200% 0;
+    }
+  }
 }
 
-.blade-chat-markdown img,
-.blade-chat-markdown video {
-  max-width: 100%;
-  height: auto;
-}
+/* ------------------------------------------------------------ 消息导航轨 */
 
-/* 长 URL 和长内联代码是撑宽的另外两个常见肇事者。用 anywhere 而不是 break-word：
- * 只有 anywhere 参与 min-content 计算，break-word 挡不住 flex item 被顶宽。 */
-.blade-chat-markdown :not(pre) > code,
-.blade-chat-markdown a {
-  overflow-wrap: anywhere;
+/* 右侧的发言刻度轨。定位绝对：悬停才展开的目录不能占布局宽度，否则同一行的
+ * 内容会被挤窄，而不悬停时那块空间永远是空的。 */
+.blade-turn-nav {
+  position: absolute;
+  right: 0.5rem;
+  top: 50%;
+  transform: translateY(-50%);
+  z-index: 30;
 }
 
-.blade-chat-prose p {
-  margin: 0.5em 0;
+.blade-turn-nav-markers {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  max-height: 20rem;
+  /* 条数超过可视高度时要能滚：固定 hidden 会让后面的刻度永远点不到。
+     滚动条本身藏掉，它只是给长会话兜底。 */
+  overflow-y: auto;
+  scrollbar-width: none;
+  padding: 0.375rem 0.375rem 0.375rem 0;
+  -webkit-mask-image: linear-gradient(
+    to bottom,
+    transparent,
+    black 10%,
+    black 90%,
+    transparent
+  );
+  mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
 }
 
-.blade-chat-prose > p:first-child,
-.blade-chat-prose > ul:first-child,
-.blade-chat-prose > ol:first-child {
-  margin-top: 0;
+.blade-turn-nav-markers::-webkit-scrollbar {
+  display: none;
 }
 
-.blade-chat-prose > p:last-child,
-.blade-chat-prose > ul:last-child,
-.blade-chat-prose > ol:last-child {
-  margin-bottom: 0;
+.blade-turn-nav-spacer-top {
+  margin-top: auto;
 }
-
-.blade-chat-prose ul,
-.blade-chat-prose ol {
-  margin: 0.5em 0;
-  padding-left: 1.4em;
+.blade-turn-nav-spacer-bottom {
+  margin-bottom: auto;
 }
 
-.blade-chat-prose li {
-  margin: 0.25em 0;
+.blade-turn-nav-tick {
+  display: flex;
+  align-items: center;
+  height: 0.875rem;
+  flex-shrink: 0;
+  padding: 0;
+  border: 0;
+  background: none;
+  cursor: pointer;
 }
 
-.blade-chat-prose h1 {
-  font-size: 1.25em;
-  font-weight: 600;
-  margin: 1em 0 0.5em;
+.blade-turn-nav-tick > span {
+  display: block;
+  width: 0.75rem;
+  height: 0.125rem;
+  border-radius: 9999px;
+  background: hsl(var(--muted-foreground) / 0.35);
+  transition: width 0.15s ease, height 0.15s ease, background-color 0.15s ease;
 }
 
-.blade-chat-prose h2 {
-  font-size: 1.15em;
-  font-weight: 600;
-  margin: 1em 0 0.5em;
+.blade-turn-nav-tick[data-hovered="true"] > span {
+  width: 1.25rem;
+  height: 0.25rem;
+  background: hsl(var(--muted-foreground) / 0.7);
 }
 
-.blade-chat-prose h3,
-.blade-chat-prose h4 {
-  font-size: 1.05em;
-  font-weight: 600;
-  margin: 0.9em 0 0.4em;
+.blade-turn-nav-tick[data-active="true"] > span {
+  width: 1.25rem;
+  height: 0.25rem;
+  background: hsl(var(--foreground));
 }
 
-.blade-chat-prose blockquote {
-  border-left: 3px solid hsl(var(--border));
-  margin: 0.5em 0;
-  padding-left: 0.9em;
-  color: hsl(var(--muted-foreground));
+/* 定位的进度与失败提示：贴在刻度轨左侧，不随面板开合。 */
+.blade-turn-nav-status {
+  position: absolute;
+  right: 100%;
+  top: 50%;
+  transform: translateY(-50%);
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  margin-right: 0.5rem;
+  padding: 0.25rem 0.625rem;
+  border: 1px solid hsl(var(--border));
+  border-radius: 9999px;
+  background: hsl(var(--popover));
+  color: hsl(var(--popover-foreground));
+  font-size: 0.75rem;
+  white-space: nowrap;
+  box-shadow: 0 4px 14px hsl(var(--foreground) / 0.12);
 }
 
-.blade-chat-prose a {
+.blade-turn-nav-status button {
+  border: 0;
+  background: none;
+  padding: 0;
   color: hsl(var(--primary));
+  font-size: 0.75rem;
+  cursor: pointer;
   text-decoration: underline;
 }
 
-.blade-chat-prose code {
-  background: hsl(var(--muted) / 0.6);
-  border-radius: 0.25rem;
-  padding: 0.1em 0.35em;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-  font-size: 0.9em;
-}
-
-.blade-chat-prose table {
-  border-collapse: collapse;
-  margin: 0.75em 0;
-  width: 100%;
+.blade-turn-nav-panel {
+  position: absolute;
+  right: 100%;
+  /* 与刻度轨同心：顶对齐会让一个接近上限高度的面板整条往下长，聊天区是 overflow: hidden，
+     视口矮一点下面的条目就被裁掉、连滚都滚不到（滚动容器以为自己有完整高度）。 */
+  top: 50%;
+  transform: translateY(-50%);
+  padding-right: 0.5rem;
 }
 
-.blade-chat-prose th,
-.blade-chat-prose td {
+.blade-turn-nav-list {
+  display: flex;
+  flex-direction: column;
+  width: 20rem;
+  /* 高度上限同时受视口约束，短视口里面板整体缩进去而不是被裁掉。 */
+  max-height: min(28rem, 60vh);
+  overflow-y: auto;
+  padding: 0.25rem 0;
   border: 1px solid hsl(var(--border));
-  padding: 0.4em 0.7em;
-  text-align: left;
+  border-radius: 0.5rem;
+  background: hsl(var(--popover));
+  box-shadow: 0 10px 30px hsl(var(--foreground) / 0.18);
 }
 
-.blade-chat-codeblock {
-  margin: 0.75rem 0;
+.blade-turn-nav-item {
+  flex-shrink: 0;
+  padding: 0.375rem 0.75rem;
+  border: 0;
+  background: none;
+  text-align: left;
+  font-size: 0.75rem;
+  line-height: 1.25rem;
+  color: hsl(var(--popover-foreground));
+  white-space: nowrap;
   overflow: hidden;
-  border: 1px solid hsl(var(--border));
-  border-radius: 0.75rem;
-}
-
-.blade-chat-codeblock-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  height: 34px;
-  border-bottom: 1px solid hsl(var(--border));
-  background: hsl(var(--muted) / 0.5);
-  padding: 0 0.375rem 0 0.875rem;
-  color: hsl(var(--muted-foreground));
-}
-
-.blade-chat-codeblock-header button {
+  text-overflow: ellipsis;
   cursor: pointer;
-  border: 0;
-  background: transparent;
-  display: inline-flex;
-  align-items: center;
-  gap: 0.25rem;
-  color: inherit;
 }
 
-.blade-chat-codeblock-body {
-  margin: 0;
-  overflow-x: auto;
-  background: hsl(var(--muted) / 0.25);
-  padding: 0.875rem 1rem;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-  font-size: 13.5px;
-  line-height: 1.7;
+.blade-turn-nav-item[data-hovered="true"],
+.blade-turn-nav-item[data-active="true"] {
+  background: hsl(var(--accent));
 }
 
-.blade-chat-codeblock-body code {
-  background: transparent;
-  padding: 0;
+/* 定位到某条发言后的短暂高亮。加到消息行本身（data-entry-id 那一层），
+ * 到点由 hook 摘掉类名，不改变滚动位置。内置 Web 的 app.css 有同名镜像。 */
+.blade-turn-nav-flash {
+  animation: blade-turn-nav-flash 1.6s ease-out both;
+  border-radius: 0.5rem;
 }
 
-/* ---------------------------------------------------------------- 动效 */
-
-.blade-shimmer-text {
-  background: linear-gradient(
-    90deg,
-    hsl(var(--muted-foreground)) 0%,
-    hsl(var(--foreground)) 50%,
-    hsl(var(--muted-foreground)) 100%
-  );
-  background-size: 200% 100%;
-  -webkit-background-clip: text;
-  background-clip: text;
-  -webkit-text-fill-color: transparent;
-  color: transparent;
-  animation: blade-shimmer 2s linear infinite;
+/* 减少动效：保留高亮但不动画，用户仍然看得见"定位到哪一条"。 */
+@media (prefers-reduced-motion: reduce) {
+  .blade-turn-nav-flash {
+    animation: none;
+    background-color: hsl(var(--accent) / 0.75);
+  }
 }
 
-@keyframes blade-shimmer {
+@keyframes blade-turn-nav-flash {
   from {
-    background-position: 200% 0;
+    background-color: hsl(var(--accent) / 0.75);
   }
   to {
-    background-position: -200% 0;
+    background-color: transparent;
   }
 }
 
 
 /* ---- Tailwind 编译产物（无 preflight） ---- */
 /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
-@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-amber-100:oklch(96.2% .059 95.617);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-500:oklch(62.3% .214 259.815);--color-rose-100:oklch(94.1% .03 12.58);--color-rose-500:oklch(64.5% .246 16.439);--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-lg:32rem;--container-2xl:42rem;--container-3xl:48rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--font-weight-medium:500;--font-weight-semibold:600;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}}@layer utilities{.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.static{position:static}.right-2{right:calc(var(--spacing) * 2)}.right-4{right:calc(var(--spacing) * 4)}.bottom-4{bottom:calc(var(--spacing) * 4)}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:0}.mx-auto{margin-inline:auto}.my-3{margin-block:calc(var(--spacing) * 3)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.h-4{height:calc(var(--spacing) * 4)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-\[34px\]{height:34px}.h-full{height:100%}.h-px{height:1px}.max-h-48{max-height:calc(var(--spacing) * 48)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-\[400px\]{max-height:400px}.min-h-0{min-height:0}.min-h-\[28px\]{min-height:28px}.w-4{width:calc(var(--spacing) * 4)}.w-8{width:calc(var(--spacing) * 8)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-56{max-width:calc(var(--spacing) * 56)}.max-w-\[72\%\]{max-width:72%}.max-w-\[85\%\]{max-width:85%}.max-w-\[748px\]{max-width:748px}.max-w-full{max-width:100%}.max-w-lg{max-width:var(--container-lg)}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:0}.flex-1{flex:1}.shrink-0{flex-shrink:0}.rotate-90{rotate:90deg}.rotate-180{rotate:180deg}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.resize{resize:both}.resize-none{resize:none}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-hidden{overflow-y:hidden}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-\[20px\]{border-radius:20px}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-br-\[6px\]{border-bottom-right-radius:6px}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-l-\[3px\]{border-left-style:var(--tw-border-style);border-left-width:3px}.border-\[hsl\(var\(--border\)\)\]{border-color:hsl(var(--border))}.border-\[hsl\(var\(--primary\)\/0\.8\)\]{border-color:hsl(var(--primary)/.8)}.border-\[hsl\(var\(--primary\)\/0\.45\)\]{border-color:hsl(var(--primary)/.45)}.border-\[hsl\(var\(--primary-foreground\)\/0\.6\)\]{border-color:hsl(var(--primary-foreground)/.6)}.border-\[hsl\(var\(--ring\)\/0\.6\)\]{border-color:hsl(var(--ring)/.6)}.border-\[hsl\(var\(--user-msg-border\)\)\]{border-color:hsl(var(--user-msg-border))}.border-amber-500\/25{border-color:#f99c0040}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/25{border-color:color-mix(in oklab, var(--color-amber-500) 25%, transparent)}}.border-amber-500\/30{border-color:#f99c004d}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/30{border-color:color-mix(in oklab, var(--color-amber-500) 30%, transparent)}}.border-amber-500\/35{border-color:#f99c0059}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/35{border-color:color-mix(in oklab, var(--color-amber-500) 35%, transparent)}}.border-rose-500\/25{border-color:#ff235740}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/25{border-color:color-mix(in oklab, var(--color-rose-500) 25%, transparent)}}.border-l-\[hsl\(var\(--muted-foreground\)\/0\.5\)\]{border-left-color:hsl(var(--muted-foreground)/.5)}.border-l-\[hsl\(var\(--primary\)\)\]{border-left-color:hsl(var(--primary))}.border-l-amber-400{border-left-color:var(--color-amber-400)}.border-l-blue-500{border-left-color:var(--color-blue-500)}.bg-\[hsl\(var\(--accent\)\)\]{background-color:hsl(var(--accent))}.bg-\[hsl\(var\(--background\)\)\]{background-color:hsl(var(--background))}.bg-\[hsl\(var\(--card\)\)\]{background-color:hsl(var(--card))}.bg-\[hsl\(var\(--muted\)\)\/0\.5\]{background-color:hsl(var(--muted))/.5}.bg-\[hsl\(var\(--muted\)\)\],.bg-\[hsl\(var\(--muted\)\)\]\/40{background-color:hsl(var(--muted))}@supports (color:color-mix(in lab, red, red)){.bg-\[hsl\(var\(--muted\)\)\]\/40{background-color:color-mix(in oklab, hsl(var(--muted)) 40%, transparent)}}.bg-\[hsl\(var\(--muted\)\/0\.2\)\]{background-color:hsl(var(--muted)/.2)}.bg-\[hsl\(var\(--muted\)\/0\.3\)\]{background-color:hsl(var(--muted)/.3)}.bg-\[hsl\(var\(--muted\)\/0\.28\)\]{background-color:hsl(var(--muted)/.28)}.bg-\[hsl\(var\(--muted\)\/0\.35\)\]{background-color:hsl(var(--muted)/.35)}.bg-\[hsl\(var\(--muted\)\/0\.62\)\]{background-color:hsl(var(--muted)/.62)}.bg-\[hsl\(var\(--primary\)\)\]{background-color:hsl(var(--primary))}.bg-\[hsl\(var\(--primary\)\/0\.08\)\]{background-color:hsl(var(--primary)/.08)}.bg-\[hsl\(var\(--primary\)\/0\.12\)\]{background-color:hsl(var(--primary)/.12)}.bg-\[hsl\(var\(--primary-foreground\)\/0\.2\)\]{background-color:hsl(var(--primary-foreground)/.2)}.bg-\[hsl\(var\(--user-msg-bg\)\)\]{background-color:hsl(var(--user-msg-bg))}.bg-amber-500\/8{background-color:#f99c0014}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/8{background-color:color-mix(in oklab, var(--color-amber-500) 8%, transparent)}}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/10{background-color:color-mix(in oklab, var(--color-amber-500) 10%, transparent)}}.bg-rose-500\/10{background-color:#ff23571a}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/10{background-color:color-mix(in oklab, var(--color-rose-500) 10%, transparent)}}.bg-transparent{background-color:#0000}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-transparent{--tw-gradient-from:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.via-amber-400\/40{--tw-gradient-via:#fcbb0066}@supports (color:color-mix(in lab, red, red)){.via-amber-400\/40{--tw-gradient-via:color-mix(in oklab, var(--color-amber-400) 40%, transparent)}}.via-amber-400\/40{--tw-gradient-via-stops:var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-via-stops)}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.object-cover{object-fit:cover}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-\[18px\]{padding-inline:18px}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-\[13px\]{padding-block:13px}.pt-3{padding-top:calc(var(--spacing) * 3)}.pr-1{padding-right:var(--spacing)}.pr-1\.5{padding-right:calc(var(--spacing) * 1.5)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-3\.5{padding-left:calc(var(--spacing) * 3.5)}.pl-5{padding-left:calc(var(--spacing) * 5)}.text-center{text-align:center}.text-left{text-align:left}.font-mono{font-family:var(--font-mono)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-6{--tw-leading:calc(var(--spacing) * 6);line-height:calc(var(--spacing) * 6)}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-8{--tw-leading:calc(var(--spacing) * 8);line-height:calc(var(--spacing) * 8)}.leading-\[1\.65\]{--tw-leading:1.65;line-height:1.65}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[0\.12em\]{--tw-tracking:.12em;letter-spacing:.12em}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.break-words{overflow-wrap:break-word}.whitespace-pre-wrap{white-space:pre-wrap}.text-\[hsl\(var\(--card-foreground\)\)\]{color:hsl(var(--card-foreground))}.text-\[hsl\(var\(--destructive\)\)\]{color:hsl(var(--destructive))}.text-\[hsl\(var\(--foreground\)\)\]{color:hsl(var(--foreground))}.text-\[hsl\(var\(--muted-foreground\)\)\/0\.85\]{color:hsl(var(--muted-foreground))/.85}.text-\[hsl\(var\(--muted-foreground\)\)\],.text-\[hsl\(var\(--muted-foreground\)\)\]\/70{color:hsl(var(--muted-foreground))}@supports (color:color-mix(in lab, red, red)){.text-\[hsl\(var\(--muted-foreground\)\)\]\/70{color:color-mix(in oklab, hsl(var(--muted-foreground)) 70%, transparent)}}.text-\[hsl\(var\(--primary\)\)\]{color:hsl(var(--primary))}.text-\[hsl\(var\(--primary-foreground\)\)\]{color:hsl(var(--primary-foreground))}.text-\[hsl\(var\(--user-msg-fg\)\)\]{color:hsl(var(--user-msg-fg))}.text-amber-100{color:var(--color-amber-100)}.text-amber-100\/55{color:#fef3c68c}@supports (color:color-mix(in lab, red, red)){.text-amber-100\/55{color:color-mix(in oklab, var(--color-amber-100) 55%, transparent)}}.text-amber-100\/75{color:#fef3c6bf}@supports (color:color-mix(in lab, red, red)){.text-amber-100\/75{color:color-mix(in oklab, var(--color-amber-100) 75%, transparent)}}.text-amber-300{color:var(--color-amber-300)}.text-blue-300{color:var(--color-blue-300)}.text-rose-100{color:var(--color-rose-100)}.uppercase{text-transform:uppercase}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.opacity-80{opacity:.8}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.outline-none{--tw-outline-style:none;outline-style:none}@media (hover:hover){.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.group-focus-visible\:opacity-100:is(:where(.group):focus-visible *){opacity:1}.placeholder\:text-\[hsl\(var\(--muted-foreground\)\/0\.5\)\]::placeholder{color:hsl(var(--muted-foreground)/.5)}.placeholder\:text-\[hsl\(var\(--muted-foreground\)\/0\.6\)\]::placeholder{color:hsl(var(--muted-foreground)/.6)}@media (hover:hover){.hover\:border-\[hsl\(var\(--ring\)\/0\.3\)\]:hover{border-color:hsl(var(--ring)/.3)}.hover\:border-\[hsl\(var\(--ring\)\/0\.4\)\]:hover{border-color:hsl(var(--ring)/.4)}.hover\:bg-\[hsl\(var\(--accent\)\)\]:hover{background-color:hsl(var(--accent))}.hover\:bg-transparent:hover{background-color:#0000}.hover\:bg-white\/3:hover{background-color:#ffffff08}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/3:hover{background-color:color-mix(in oklab, var(--color-white) 3%, transparent)}}.hover\:text-\[hsl\(var\(--foreground\)\)\]:hover{color:hsl(var(--foreground))}.hover\:opacity-90:hover{opacity:.9}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:ring-1:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-\[hsl\(var\(--ring\)\)\]:focus-visible{--tw-ring-color:hsl(var(--ring))}.disabled\:cursor-default:disabled{cursor:default}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-60:disabled{opacity:.6}.aria-pressed\:bg-\[hsl\(var\(--primary\)\/0\.1\)\][aria-pressed=true]{background-color:hsl(var(--primary)/.1)}.aria-pressed\:bg-\[hsl\(var\(--primary\)\/0\.14\)\][aria-pressed=true]{background-color:hsl(var(--primary)/.14)}@media (min-width:40rem){.sm\:max-w-\[680px\]{max-width:680px}}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@keyframes spin{to{transform:rotate(360deg)}}
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial;--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-blur:0;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-blur:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}@layer theme{:root,:host{--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-800:oklch(47.3% .137 46.201);--color-emerald-100:oklch(95% .052 163.051);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-800:oklch(43.2% .095 166.913);--color-teal-100:oklch(95.3% .051 180.801);--color-teal-200:oklch(91% .096 180.426);--color-teal-500:oklch(70.4% .14 182.503);--color-teal-800:oklch(43.7% .078 188.216);--color-sky-100:oklch(95.1% .026 236.824);--color-sky-200:oklch(90.1% .058 230.902);--color-sky-500:oklch(68.5% .169 237.323);--color-sky-800:oklch(44.3% .11 240.79);--color-sky-900:oklch(39.1% .09 240.876);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-500:oklch(62.3% .214 259.815);--color-indigo-100:oklch(93% .034 272.788);--color-indigo-200:oklch(87% .065 274.039);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-800:oklch(39.8% .195 277.366);--color-violet-100:oklch(94.3% .029 294.588);--color-violet-200:oklch(89.4% .057 293.283);--color-violet-500:oklch(60.6% .25 292.717);--color-violet-800:oklch(43.2% .232 292.759);--color-fuchsia-100:oklch(95.2% .037 318.852);--color-fuchsia-200:oklch(90.3% .076 319.62);--color-fuchsia-500:oklch(66.7% .295 322.15);--color-fuchsia-800:oklch(45.2% .211 324.591);--color-rose-100:oklch(94.1% .03 12.58);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-800:oklch(45.5% .188 13.697);--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-lg:32rem;--container-2xl:42rem;--container-3xl:48rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--font-weight-medium:500;--font-weight-semibold:600;--tracking-wider:.05em;--leading-relaxed:1.625;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-4xl:2rem;--ease-out:cubic-bezier(0, 0, .2, 1);--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}}@layer utilities{.pointer-events-none{pointer-events:none}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-x-1{inset-inline:var(--spacing)}.top-0{top:0}.top-full{top:100%}.right-2{right:calc(var(--spacing) * 2)}.right-4{right:calc(var(--spacing) * 4)}.bottom-0{bottom:0}.bottom-4{bottom:calc(var(--spacing) * 4)}.bottom-full{bottom:100%}.left-0{left:0}.z-40{z-index:40}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:0}.mx-3{margin-inline:calc(var(--spacing) * 3)}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.my-2{margin-block:calc(var(--spacing) * 2)}.my-3{margin-block:calc(var(--spacing) * 3)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-\[3px\]{margin-top:3px}.mr-1{margin-right:var(--spacing)}.mb-1{margin-bottom:var(--spacing)}.mb-1\.5{margin-bottom:calc(var(--spacing) * 1.5)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.-ml-0\.5{margin-left:calc(var(--spacing) * -.5)}.ml-1{margin-left:var(--spacing)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-10{margin-left:calc(var(--spacing) * 10)}.ml-\[18px\]{margin-left:18px}.ml-auto{margin-left:auto}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.size-3\.5{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.size-\[30px\]{width:30px;height:30px}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-\[2px\]{height:2px}.h-\[18px\]{height:18px}.h-\[34px\]{height:34px}.h-\[640px\]{height:640px}.h-full{height:100%}.h-px{height:1px}.max-h-40{max-height:calc(var(--spacing) * 40)}.max-h-48{max-height:calc(var(--spacing) * 48)}.max-h-56{max-height:calc(var(--spacing) * 56)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-72{max-height:calc(var(--spacing) * 72)}.max-h-\[80vh\]{max-height:80vh}.max-h-\[400px\]{max-height:400px}.min-h-0{min-height:0}.min-h-10{min-height:calc(var(--spacing) * 10)}.min-h-\[28px\]{min-height:28px}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-6{width:calc(var(--spacing) * 6)}.w-8{width:calc(var(--spacing) * 8)}.w-72{width:calc(var(--spacing) * 72)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-56{max-width:calc(var(--spacing) * 56)}.max-w-\[72\%\]{max-width:72%}.max-w-\[680px\]{max-width:680px}.max-w-\[748px\]{max-width:748px}.max-w-\[748px\]\!{max-width:748px!important}.max-w-\[calc\(100vw-2rem\)\]{max-width:calc(100vw - 2rem)}.max-w-\[min\(72vw\,42rem\)\]{max-width:min(72vw,42rem)}.max-w-full{max-width:100%}.max-w-lg{max-width:var(--container-lg)}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:0}.flex-1{flex:1}.shrink-0{flex-shrink:0}.translate-x-\[2px\]{--tw-translate-x:2px;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-\[16px\]{--tw-translate-x:16px;translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-90{rotate:90deg}.rotate-180{rotate:180deg}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.cursor-grab{cursor:grab}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.resize{resize:both}.resize-none{resize:none}.list-none{list-style-type:none}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-\[0fr\]{grid-template-rows:0fr}.grid-rows-\[1fr\]{grid-template-rows:1fr}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.-space-x-1>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * -1) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * -1) * calc(1 - var(--tw-space-x-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-y-hidden{overflow-y:hidden}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-4xl{border-radius:var(--radius-4xl)}.rounded-\[20px\]{border-radius:20px}.rounded-\[22px\]{border-radius:22px}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-\[22px\]{border-top-left-radius:22px;border-top-right-radius:22px}.rounded-b-\[22px\]{border-bottom-right-radius:22px;border-bottom-left-radius:22px}.rounded-br-\[6px\]{border-bottom-right-radius:6px}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-t-0{border-top-style:var(--tw-border-style);border-top-width:0}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-l-\[3px\]{border-left-style:var(--tw-border-style);border-left-width:3px}.border-\[hsl\(var\(--accent-foreground\)\/0\.35\)\]{border-color:hsl(var(--accent-foreground)/.35)}.border-\[hsl\(var\(--border\)\)\]{border-color:hsl(var(--border))}.border-\[hsl\(var\(--border\)\/0\.8\)\]{border-color:hsl(var(--border)/.8)}.border-\[hsl\(var\(--border\)\/0\.55\)\]{border-color:hsl(var(--border)/.55)}.border-\[hsl\(var\(--primary\)\/0\.8\)\]{border-color:hsl(var(--primary)/.8)}.border-\[hsl\(var\(--primary\)\/0\.22\)\]{border-color:hsl(var(--primary)/.22)}.border-\[hsl\(var\(--primary\)\/0\.45\)\]{border-color:hsl(var(--primary)/.45)}.border-\[hsl\(var\(--primary-foreground\)\/0\.6\)\]{border-color:hsl(var(--primary-foreground)/.6)}.border-\[hsl\(var\(--ring\)\/0\.6\)\]{border-color:hsl(var(--ring)/.6)}.border-\[hsl\(var\(--user-msg-border\)\)\]{border-color:hsl(var(--user-msg-border))}.border-amber-500\/25{border-color:#f99c0040}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/25{border-color:color-mix(in oklab, var(--color-amber-500) 25%, transparent)}}.border-amber-500\/30{border-color:#f99c004d}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/30{border-color:color-mix(in oklab, var(--color-amber-500) 30%, transparent)}}.border-amber-500\/35{border-color:#f99c0059}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/35{border-color:color-mix(in oklab, var(--color-amber-500) 35%, transparent)}}.border-red-500\/30{border-color:#fb2c364d}@supports (color:color-mix(in lab, red, red)){.border-red-500\/30{border-color:color-mix(in oklab, var(--color-red-500) 30%, transparent)}}.border-rose-500\/25{border-color:#ff235740}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/25{border-color:color-mix(in oklab, var(--color-rose-500) 25%, transparent)}}.border-transparent{border-color:#0000}.border-l-\[hsl\(var\(--muted-foreground\)\/0\.5\)\]{border-left-color:hsl(var(--muted-foreground)/.5)}.border-l-\[hsl\(var\(--primary\)\)\]{border-left-color:hsl(var(--primary))}.border-l-amber-400{border-left-color:var(--color-amber-400)}.border-l-blue-500{border-left-color:var(--color-blue-500)}.bg-\[hsl\(213_94\%_55\%\)\]{background-color:#2081f8}.bg-\[hsl\(var\(--accent\)\)\]{background-color:hsl(var(--accent))}.bg-\[hsl\(var\(--background\)\)\]{background-color:hsl(var(--background))}.bg-\[hsl\(var\(--background\)\/0\.72\)\]{background-color:hsl(var(--background)/.72)}.bg-\[hsl\(var\(--border\)\/0\.75\)\]{background-color:hsl(var(--border)/.75)}.bg-\[hsl\(var\(--card\)\)\]{background-color:hsl(var(--card))}.bg-\[hsl\(var\(--card\)\/0\.8\)\]{background-color:hsl(var(--card)/.8)}.bg-\[hsl\(var\(--muted\)\)\/0\.5\]{background-color:hsl(var(--muted))/.5}.bg-\[hsl\(var\(--muted\)\)\],.bg-\[hsl\(var\(--muted\)\)\]\/40{background-color:hsl(var(--muted))}@supports (color:color-mix(in lab, red, red)){.bg-\[hsl\(var\(--muted\)\)\]\/40{background-color:color-mix(in oklab, hsl(var(--muted)) 40%, transparent)}}.bg-\[hsl\(var\(--muted\)\/0\.2\)\]{background-color:hsl(var(--muted)/.2)}.bg-\[hsl\(var\(--muted\)\/0\.3\)\]{background-color:hsl(var(--muted)/.3)}.bg-\[hsl\(var\(--muted\)\/0\.5\)\]{background-color:hsl(var(--muted)/.5)}.bg-\[hsl\(var\(--muted\)\/0\.28\)\]{background-color:hsl(var(--muted)/.28)}.bg-\[hsl\(var\(--muted\)\/0\.35\)\]{background-color:hsl(var(--muted)/.35)}.bg-\[hsl\(var\(--muted\)\/0\.55\)\]{background-color:hsl(var(--muted)/.55)}.bg-\[hsl\(var\(--muted\)\/0\.62\)\]{background-color:hsl(var(--muted)/.62)}.bg-\[hsl\(var\(--popover\)\)\]{background-color:hsl(var(--popover))}.bg-\[hsl\(var\(--primary\)\)\]{background-color:hsl(var(--primary))}.bg-\[hsl\(var\(--primary\)\/0\.07\)\]{background-color:hsl(var(--primary)/.07)}.bg-\[hsl\(var\(--primary\)\/0\.08\)\]{background-color:hsl(var(--primary)/.08)}.bg-\[hsl\(var\(--primary\)\/0\.12\)\]{background-color:hsl(var(--primary)/.12)}.bg-\[hsl\(var\(--primary-foreground\)\/0\.2\)\]{background-color:hsl(var(--primary-foreground)/.2)}.bg-\[hsl\(var\(--user-msg-bg\)\)\]{background-color:hsl(var(--user-msg-bg))}.bg-amber-100{background-color:var(--color-amber-100)}.bg-amber-500\/8{background-color:#f99c0014}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/8{background-color:color-mix(in oklab, var(--color-amber-500) 8%, transparent)}}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/10{background-color:color-mix(in oklab, var(--color-amber-500) 10%, transparent)}}.bg-emerald-100{background-color:var(--color-emerald-100)}.bg-fuchsia-100{background-color:var(--color-fuchsia-100)}.bg-indigo-100{background-color:var(--color-indigo-100)}.bg-red-500{background-color:var(--color-red-500)}.bg-red-500\/10{background-color:#fb2c361a}@supports (color:color-mix(in lab, red, red)){.bg-red-500\/10{background-color:color-mix(in oklab, var(--color-red-500) 10%, transparent)}}.bg-rose-100{background-color:var(--color-rose-100)}.bg-rose-500\/10{background-color:#ff23571a}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/10{background-color:color-mix(in oklab, var(--color-rose-500) 10%, transparent)}}.bg-sky-100{background-color:var(--color-sky-100)}.bg-teal-100{background-color:var(--color-teal-100)}.bg-transparent{background-color:#0000}.bg-violet-100{background-color:var(--color-violet-100)}.bg-white{background-color:var(--color-white)}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-transparent{--tw-gradient-from:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.via-amber-400\/40{--tw-gradient-via:#fcbb0066}@supports (color:color-mix(in lab, red, red)){.via-amber-400\/40{--tw-gradient-via:color-mix(in oklab, var(--color-amber-400) 40%, transparent)}}.via-amber-400\/40{--tw-gradient-via-stops:var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-via-stops)}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.object-cover{object-fit:cover}.p-0{padding:0}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-0\.5{padding-inline:calc(var(--spacing) * .5)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-10{padding-inline:calc(var(--spacing) * 10)}.px-\[18px\]{padding-inline:18px}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-\[13px\]{padding-block:13px}.pt-0{padding-top:0}.pt-0\.5{padding-top:calc(var(--spacing) * .5)}.pt-1{padding-top:var(--spacing)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-px{padding-top:1px}.pr-1{padding-right:var(--spacing)}.pr-1\.5{padding-right:calc(var(--spacing) * 1.5)}.pb-0\.5{padding-bottom:calc(var(--spacing) * .5)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-3\.5{padding-left:calc(var(--spacing) * 3.5)}.pl-5{padding-left:calc(var(--spacing) * 5)}.pl-7{padding-left:calc(var(--spacing) * 7)}.text-center{text-align:center}.text-left{text-align:left}.font-mono{font-family:var(--font-mono)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-6{--tw-leading:calc(var(--spacing) * 6);line-height:calc(var(--spacing) * 6)}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-8{--tw-leading:calc(var(--spacing) * 8);line-height:calc(var(--spacing) * 8)}.leading-\[1\.65\]{--tw-leading:1.65;line-height:1.65}.leading-\[22px\]{--tw-leading:22px;line-height:22px}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[0\.12em\]{--tw-tracking:.12em;letter-spacing:.12em}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.\[overflow-wrap\:anywhere\]{overflow-wrap:anywhere}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.whitespace-pre-wrap{white-space:pre-wrap}.text-\[hsl\(var\(--card-foreground\)\)\]{color:hsl(var(--card-foreground))}.text-\[hsl\(var\(--destructive\)\)\]{color:hsl(var(--destructive))}.text-\[hsl\(var\(--foreground\)\)\]{color:hsl(var(--foreground))}.text-\[hsl\(var\(--foreground\)\/0\.8\)\]{color:hsl(var(--foreground)/.8)}.text-\[hsl\(var\(--muted-foreground\)\)\/0\.85\]{color:hsl(var(--muted-foreground))/.85}.text-\[hsl\(var\(--muted-foreground\)\)\],.text-\[hsl\(var\(--muted-foreground\)\)\]\/60{color:hsl(var(--muted-foreground))}@supports (color:color-mix(in lab, red, red)){.text-\[hsl\(var\(--muted-foreground\)\)\]\/60{color:color-mix(in oklab, hsl(var(--muted-foreground)) 60%, transparent)}}.text-\[hsl\(var\(--popover-foreground\)\)\]{color:hsl(var(--popover-foreground))}.text-\[hsl\(var\(--primary\)\)\]{color:hsl(var(--primary))}.text-\[hsl\(var\(--primary-foreground\)\)\]{color:hsl(var(--primary-foreground))}.text-\[hsl\(var\(--user-msg-fg\)\)\]{color:hsl(var(--user-msg-fg))}.text-amber-100{color:var(--color-amber-100)}.text-amber-100\/55{color:#fef3c68c}@supports (color:color-mix(in lab, red, red)){.text-amber-100\/55{color:color-mix(in oklab, var(--color-amber-100) 55%, transparent)}}.text-amber-100\/75{color:#fef3c6bf}@supports (color:color-mix(in lab, red, red)){.text-amber-100\/75{color:color-mix(in oklab, var(--color-amber-100) 75%, transparent)}}.text-amber-300{color:var(--color-amber-300)}.text-amber-500{color:var(--color-amber-500)}.text-amber-800{color:var(--color-amber-800)}.text-blue-300{color:var(--color-blue-300)}.text-emerald-500{color:var(--color-emerald-500)}.text-emerald-800{color:var(--color-emerald-800)}.text-fuchsia-800{color:var(--color-fuchsia-800)}.text-indigo-800{color:var(--color-indigo-800)}.text-red-400{color:var(--color-red-400)}.text-red-500{color:var(--color-red-500)}.text-rose-100{color:var(--color-rose-100)}.text-rose-800{color:var(--color-rose-800)}.text-sky-800{color:var(--color-sky-800)}.text-sky-900{color:var(--color-sky-900)}.text-teal-800{color:var(--color-teal-800)}.text-violet-800{color:var(--color-violet-800)}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-40{opacity:.4}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.opacity-80{opacity:.8}.opacity-100{opacity:1}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-\[hsl\(var\(--background\)\)\]{--tw-ring-color:hsl(var(--background))}.outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.outline-hidden{outline-offset:2px;outline:2px solid #0000}}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[grid-template-rows\,opacity\]{transition-property:grid-template-rows,opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[opacity\,transform\]{transition-property:opacity,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.duration-\[180ms\]{--tw-duration:.18s;transition-duration:.18s}.ease-\[cubic-bezier\(0\.25\,0\.1\,0\.25\,1\)\]{--tw-ease:cubic-bezier(.25,.1,.25,1);transition-timing-function:ease}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.\!running{animation-play-state:running!important}.\[--blade-chat-gutter\:2rem\]{--blade-chat-gutter:2rem}.paused{animation-play-state:paused}.running{animation-play-state:running}.group-open\/context-card\:rotate-180:is(:where(.group\/context-card):is([open],:popover-open,:open) *),.group-open\/context-group\:rotate-180:is(:where(.group\/context-group):is([open],:popover-open,:open) *){rotate:180deg}@media (hover:hover){.group-hover\:opacity-100:is(:where(.group):hover *),.group-hover\/thinking\:opacity-100:is(:where(.group\/thinking):hover *){opacity:1}}.group-focus-visible\:opacity-100:is(:where(.group):focus-visible *),.group-has-\[\:focus-visible\]\:opacity-100:is(:where(.group):has(:focus-visible) *){opacity:1}.placeholder\:text-\[hsl\(var\(--muted-foreground\)\)\]::placeholder{color:hsl(var(--muted-foreground))}.placeholder\:text-\[hsl\(var\(--muted-foreground\)\/0\.5\)\]::placeholder{color:hsl(var(--muted-foreground)/.5)}.placeholder\:text-\[hsl\(var\(--muted-foreground\)\/0\.6\)\]::placeholder{color:hsl(var(--muted-foreground)/.6)}.focus-within\:ring-2:focus-within{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-within\:ring-\[hsl\(var\(--ring\)\/0\.35\)\]:focus-within{--tw-ring-color:hsl(var(--ring)/.35)}@media (hover:hover){.hover\:border-\[hsl\(var\(--ring\)\/0\.3\)\]:hover{border-color:hsl(var(--ring)/.3)}.hover\:border-\[hsl\(var\(--ring\)\/0\.4\)\]:hover{border-color:hsl(var(--ring)/.4)}.hover\:bg-\[hsl\(var\(--accent\)\)\]:hover{background-color:hsl(var(--accent))}.hover\:bg-\[hsl\(var\(--muted\)\/0\.3\)\]:hover{background-color:hsl(var(--muted)/.3)}.hover\:bg-transparent:hover{background-color:#0000}.hover\:bg-white\/3:hover{background-color:#ffffff08}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/3:hover{background-color:color-mix(in oklab, var(--color-white) 3%, transparent)}}.hover\:text-\[hsl\(var\(--foreground\)\)\]:hover{color:hsl(var(--foreground))}.hover\:opacity-90:hover{opacity:.9}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:opacity-100:focus-visible{opacity:1}.focus-visible\:ring-1:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-\[hsl\(var\(--ring\)\)\]:focus-visible{--tw-ring-color:hsl(var(--ring))}.active\:cursor-grabbing:active{cursor:grabbing}.disabled\:cursor-default:disabled{cursor:default}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}@media (hover:hover){.disabled\:hover\:bg-transparent:disabled:hover{background-color:#0000}}.aria-busy\:cursor-wait[aria-busy=true]{cursor:wait}.aria-disabled\:cursor-not-allowed[aria-disabled=true]{cursor:not-allowed}.aria-disabled\:opacity-60[aria-disabled=true]{opacity:.6}.aria-pressed\:bg-\[hsl\(var\(--primary\)\/0\.1\)\][aria-pressed=true]{background-color:hsl(var(--primary)/.1)}.aria-pressed\:bg-\[hsl\(var\(--primary\)\/0\.14\)\][aria-pressed=true]{background-color:hsl(var(--primary)/.14)}@media (prefers-reduced-motion:reduce){.motion-reduce\:transition-none{transition-property:none}}@media (min-width:40rem){.sm\:max-w-\[680px\]{max-width:680px}}@media (prefers-color-scheme:dark){.dark\:bg-amber-500\/25{background-color:#f99c0040}@supports (color:color-mix(in lab, red, red)){.dark\:bg-amber-500\/25{background-color:color-mix(in oklab, var(--color-amber-500) 25%, transparent)}}.dark\:bg-emerald-500\/25{background-color:#00bb7f40}@supports (color:color-mix(in lab, red, red)){.dark\:bg-emerald-500\/25{background-color:color-mix(in oklab, var(--color-emerald-500) 25%, transparent)}}.dark\:bg-fuchsia-500\/25{background-color:#e12afb40}@supports (color:color-mix(in lab, red, red)){.dark\:bg-fuchsia-500\/25{background-color:color-mix(in oklab, var(--color-fuchsia-500) 25%, transparent)}}.dark\:bg-indigo-500\/25{background-color:#625fff40}@supports (color:color-mix(in lab, red, red)){.dark\:bg-indigo-500\/25{background-color:color-mix(in oklab, var(--color-indigo-500) 25%, transparent)}}.dark\:bg-rose-500\/25{background-color:#ff235740}@supports (color:color-mix(in lab, red, red)){.dark\:bg-rose-500\/25{background-color:color-mix(in oklab, var(--color-rose-500) 25%, transparent)}}.dark\:bg-sky-500\/25{background-color:#00a5ef40}@supports (color:color-mix(in lab, red, red)){.dark\:bg-sky-500\/25{background-color:color-mix(in oklab, var(--color-sky-500) 25%, transparent)}}.dark\:bg-teal-500\/25{background-color:#00baa740}@supports (color:color-mix(in lab, red, red)){.dark\:bg-teal-500\/25{background-color:color-mix(in oklab, var(--color-teal-500) 25%, transparent)}}.dark\:bg-violet-500\/25{background-color:#8d54ff40}@supports (color:color-mix(in lab, red, red)){.dark\:bg-violet-500\/25{background-color:color-mix(in oklab, var(--color-violet-500) 25%, transparent)}}.dark\:text-amber-200{color:var(--color-amber-200)}.dark\:text-emerald-200{color:var(--color-emerald-200)}.dark\:text-fuchsia-200{color:var(--color-fuchsia-200)}.dark\:text-indigo-200{color:var(--color-indigo-200)}.dark\:text-rose-200{color:var(--color-rose-200)}.dark\:text-sky-200{color:var(--color-sky-200)}.dark\:text-teal-200{color:var(--color-teal-200)}.dark\:text-violet-200{color:var(--color-violet-200)}}.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker{display:none}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}