@import "tailwindcss";

/* 词性与块种类的配色：暗色（含高对比）取 VS Code Dark+，亮色取 Light+。其余界面颜色一律用 --vscode-* 变量。 */
body {
  --cr-keyword: #c586c0;
  --cr-storage: #569cd6;
  --cr-variable: #9cdcfe;
  --cr-function: #dcdcaa;
  --cr-type: #4ec9b0;
  --cr-string: #ce9178;
  --cr-number: #b5cea8;
  --cr-comment: #6a9955;
  --cr-constant: #4fc1ff;

  --cr-kind-import: #c586c0;
  --cr-kind-function: #dcdcaa;
  --cr-kind-type: #4ec9b0;
  --cr-kind-enum: #b180d7;
  --cr-kind-exception: #f14c4c;
  --cr-kind-data: #9cdcfe;
  --cr-kind-branch: #ce9178;
  --cr-kind-loop: #8f9cff;
  --cr-kind-error: #f48771;
  --cr-kind-return: #89d185;
  --cr-kind-statement: #9d9d9d;
  --cr-kind-comment: #6a9955;
  --cr-kind-options: #e5c07b;
  --cr-kind-command: #d7ba7d;
  --cr-kind-stage: #56b6c2;

  margin: 0;
  font-family: var(--vscode-font-family, system-ui, sans-serif);
  font-size: var(--vscode-font-size, 13px);
  color: var(--vscode-foreground);
  background: var(--vscode-editor-background);
}

body.vscode-light,
body.vscode-high-contrast-light {
  --cr-keyword: #af00db;
  --cr-storage: #0000ff;
  --cr-variable: #001080;
  --cr-function: #795e26;
  --cr-type: #267f99;
  --cr-string: #a31515;
  --cr-number: #098658;
  --cr-comment: #008000;
  --cr-constant: #0070c1;

  --cr-kind-import: #af00db;
  --cr-kind-function: #795e26;
  --cr-kind-type: #267f99;
  --cr-kind-enum: #652d90;
  --cr-kind-exception: #cd3131;
  --cr-kind-data: #001080;
  --cr-kind-branch: #a31515;
  --cr-kind-loop: #4f56d6;
  --cr-kind-error: #b5452f;
  --cr-kind-return: #388a34;
  --cr-kind-statement: #6f6f6f;
  --cr-kind-comment: #008000;
  --cr-kind-options: #9a6a00;
  --cr-kind-command: #7c5f12;
  --cr-kind-stage: #127f8c;
}

/* 种类颜色：同一类语义共用一个颜色，图标区分具体是哪种（kindIcons.tsx）。卡片取自己的种类，子层取所属块的种类 */
:is([data-kind="import"], [data-kind="copy"]) { --kind: var(--cr-kind-import); }
[data-kind="function"] { --kind: var(--cr-kind-function); }
:is([data-kind="class"], [data-kind="type"]) { --kind: var(--cr-kind-type); }
[data-kind="trait"] { --kind: var(--cr-storage); }
[data-kind="attribute"] { --kind: var(--cr-constant); }
[data-kind="impl"] { --kind: var(--cr-kind-function); }
[data-kind="enum"] { --kind: var(--cr-kind-enum); }
[data-kind="exception"] { --kind: var(--cr-kind-exception); }
:is([data-kind="field"], [data-kind="const"], [data-kind="variable"], [data-kind="label"]) { --kind: var(--cr-kind-data); }
:is([data-kind="if"], [data-kind="else"], [data-kind="case"]) { --kind: var(--cr-kind-branch); }
:is([data-kind="stage"], [data-kind="module"]) { --kind: var(--cr-kind-stage); }
[data-kind="loop"] { --kind: var(--cr-kind-loop); }
:is([data-kind="try"], [data-kind="catch"], [data-kind="finally"], [data-kind="health"]) { --kind: var(--cr-kind-error); }
:is([data-kind="return"], [data-kind="start"]) { --kind: var(--cr-kind-return); }
:is([data-kind="statement"], [data-kind="interpreter"], [data-kind="directive"]) { --kind: var(--cr-kind-statement); }
[data-kind="comment"] { --kind: var(--cr-kind-comment); }
:is([data-kind="options"], [data-kind="setting"]) { --kind: var(--cr-kind-options); }
:is([data-kind="command"], [data-kind="pipeline"], [data-kind="run"]) { --kind: var(--cr-kind-command); }
/* 库规则认领的块：颜色由规则给，暗色、亮色两个写在元素的 style 上（--kind-dark / --kind-light），这里按主题挑 */
[data-badge] { --kind: var(--kind-dark); }
body:is(.vscode-light, .vscode-high-contrast-light) [data-badge] { --kind: var(--kind-light); }

/* 卡片和它的子层是相邻兄弟，:hover 只落在鼠标下最里面那张卡片上，父卡片不跟着亮 */
.cr-block {
  background: color-mix(in srgb, var(--kind) 7%, transparent);
  border: 1px solid color-mix(in srgb, var(--kind) 35%, transparent);
  transition: background-color 100ms ease-out, border-color 100ms ease-out;
}
.cr-block:hover {
  background: color-mix(in srgb, var(--kind) 14%, transparent);
  border-color: var(--kind);
}
.cr-block[data-kind="comment"] {
  border-style: dashed;
}
.cr-block[data-editing] {
  background: var(--vscode-editor-background);
  border-color: var(--vscode-focusBorder);
}
.cr-block[data-editing]:hover {
  background: color-mix(in srgb, var(--kind) 7%, var(--vscode-editor-background));
}

/* 块右上角的图标按钮：悬停、按下（这一块在编辑）有底色，键盘聚焦描一圈聚焦色 */
.cr-tool {
  color: var(--vscode-descriptionForeground);
}
.cr-tool:hover {
  background: var(--vscode-toolbar-hoverBackground);
}
.cr-tool[data-active] {
  background: var(--vscode-toolbar-activeBackground);
}
.cr-tool:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: -1px;
}
.cr-tool:disabled {
  opacity: 0.4;
}

/* 层级竖线：悬停一个块时，它子层的竖线换成它的种类色，标出这个块管到哪里为止（块和子层中间隔着问答区也算） */
.cr-guide {
  background: var(--vscode-editorIndentGuide-background1);
  transition: background-color 100ms ease-out;
}
.cr-block:hover + .cr-level > * > .cr-guide,
.cr-block:hover + .cr-qa + .cr-level > * > .cr-guide,
.cr-block:hover + .cr-qa + .cr-qa + .cr-level > * > .cr-guide {
  background: var(--kind);
}

/* 属性行、子行平时看不出边框；往外扩出一圈，跳到定义只闪它时亮起来不贴着字，排版不动 */
.cr-prop-row,
.cr-prop-item {
  margin: -1px -4px;
  padding: 0 3px;
  border: 1px solid transparent;
  border-radius: 4px;
}

/* 跳到定义的目标（整块、属性表里的一行 / 子行，或定义处那个名字）：边框和底色往聚焦色闪三下（共 1.5 秒）再复原；减少动态效果时改成静止高亮同样长的时间 */
@keyframes cr-flash {
  50% {
    background: color-mix(in srgb, var(--vscode-focusBorder) 25%, transparent);
    border-color: var(--vscode-focusBorder);
  }
}
@keyframes cr-flash-still {
  from, to {
    background: color-mix(in srgb, var(--vscode-focusBorder) 25%, transparent);
    border-color: var(--vscode-focusBorder);
  }
}
:is(.cr-block, .cr-prop-row, .cr-prop-item, [data-offset])[data-flash] {
  animation: cr-flash 500ms ease-in-out 3;
}
/* 表格里的一行（参数）：边框是和相邻行共用的分隔线，改用画在行里面的一圈聚焦色 */
@keyframes cr-flash-row {
  50% {
    background: color-mix(in srgb, var(--vscode-focusBorder) 25%, transparent);
    box-shadow: inset 0 0 0 1px var(--vscode-focusBorder);
  }
}
@keyframes cr-flash-row-still {
  from, to {
    background: color-mix(in srgb, var(--vscode-focusBorder) 25%, transparent);
    box-shadow: inset 0 0 0 1px var(--vscode-focusBorder);
  }
}
.cr-table-row[data-flash] {
  animation: cr-flash-row 500ms ease-in-out 3;
}

@media (prefers-reduced-motion: reduce) {
  .cr-block,
  .cr-guide {
    transition: none;
  }
  :is(.cr-block, .cr-prop-row, .cr-prop-item, [data-offset])[data-flash] {
    animation: cr-flash-still 1500ms;
  }
  .cr-table-row[data-flash] {
    animation: cr-flash-row-still 1500ms;
  }
}

.cr-kind {
  color: var(--kind);
}

/* 译文和源码共用的文字排版；源码编辑时输入框和着色层都用它，两层逐字对齐 */
.cr-code {
  margin: 0;
  padding: 0;
  border: 0;
  font-family: var(--vscode-editor-font-family, monospace), "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  font-size: var(--vscode-editor-font-size, 12.5px);
  font-weight: var(--vscode-editor-font-weight, normal);
  line-height: 20px;
  letter-spacing: 0;
  tab-size: 4;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  color: var(--vscode-editor-foreground);
}

.cr-role-keyword { color: var(--cr-keyword); }
.cr-role-storage,
.cr-role-operator { color: var(--cr-storage); }
.cr-role-variable { color: var(--cr-variable); }
.cr-role-constant { color: var(--cr-constant); }
.cr-role-function { color: var(--cr-function); }
.cr-role-type { color: var(--cr-type); }
.cr-role-string { color: var(--cr-string); }
.cr-role-number,
.cr-role-literal { color: var(--cr-number); }
.cr-role-comment { color: var(--cr-comment); }
.cr-role-hint { color: var(--vscode-descriptionForeground); }
/* 带自己颜色的词（Segment.color，库规则按库的配色给）：暗色、亮色两个写在元素的 style 上，这里按主题挑，盖过词性的颜色 */
.cr-colored { color: var(--color-dark); }
body:is(.vscode-light, .vscode-high-contrast-light) .cr-colored { color: var(--color-light); }

/* 注释块、函数说明的 Markdown：正文界面字体、注释色，和属性名一样的行高；代码用编辑器字体、垫代码块底色。
   间距压紧：一行注释和一行译文一样高，标题只比正文稍大 */
.cr-markdown {
  font-family: var(--vscode-font-family, system-ui, sans-serif), "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  font-size: var(--vscode-font-size, 13px);
  line-height: 20px;
  color: var(--cr-comment);
  overflow-wrap: break-word;
}
.cr-markdown :is(p, ul, ol, pre, blockquote, table, h1, h2, h3, h4, h5, h6, hr) {
  margin: 0 0 6px;
}
.cr-markdown :is(li, blockquote) > :last-child,
.cr-markdown > :last-child {
  margin-bottom: 0;
}
.cr-markdown :is(ul, ol) {
  padding-left: 20px;
}
.cr-markdown ul { list-style: disc; }
.cr-markdown ol { list-style: decimal; }
.cr-markdown :is(ul, ol) ul { list-style: circle; }
.cr-markdown :is(h1, h2, h3, h4, h5, h6) {
  font-size: 1em;
  font-weight: 600;
}
.cr-markdown h1 { font-size: 1.15em; }
.cr-markdown h2 { font-size: 1.08em; }
/* 行内代码换了字体，行高压成 1 才不把这一行撑高 */
.cr-markdown code {
  padding: 1px 4px;
  border-radius: 3px;
  font-family: var(--vscode-editor-font-family, monospace), "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", monospace;
  font-size: 1em;
  line-height: 1;
  background: var(--vscode-textCodeBlock-background);
}
.cr-markdown pre {
  padding: 4px 8px;
  border-radius: 4px;
  background: var(--vscode-textCodeBlock-background);
  white-space: pre-wrap;
  tab-size: 4;
}
.cr-markdown pre code {
  padding: 0;
  font-size: var(--vscode-editor-font-size, 12.5px);
  line-height: inherit;
  background: none;
}
.cr-markdown a {
  color: var(--vscode-textLink-foreground);
  text-decoration: none;
}
.cr-markdown a:hover {
  color: var(--vscode-textLink-activeForeground);
  text-decoration: underline;
}
/* 仓库链接指的文件或符号不在：红色波浪线，悬停「找不到」（data-tooltip） */
.cr-markdown a.cr-link-broken,
.cr-markdown a.cr-link-broken:hover {
  color: var(--vscode-errorForeground);
  text-decoration: underline wavy;
  text-underline-offset: 2px;
}
/* 仓库图片：按原图比例，宽不超过注释区。点了是仓库链接，打开原图 */
.cr-markdown .cr-repo-image img {
  max-width: 100%;
  height: auto;
}
.cr-markdown .cr-repo-image a,
.cr-markdown .cr-repo-image a:hover {
  text-decoration: none;
}
.cr-markdown blockquote {
  padding: 0 8px;
  border-left: 3px solid var(--vscode-textBlockQuote-border);
  background: var(--vscode-textBlockQuote-background);
}
.cr-markdown table {
  border-collapse: collapse;
}
.cr-markdown :is(th, td) {
  padding: 0 8px;
  border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
}
.cr-markdown th {
  font-weight: 600;
  text-align: left;
}
.cr-markdown hr {
  border: 0;
  border-top: 1px solid color-mix(in srgb, currentColor 30%, transparent);
}

/* 起了中文名的定义处：中文名后面淡淡写原名，字小一号，悬停看完整的「原名 x」 */
.cr-original {
  margin-left: 0.4em;
  font-size: 0.86em;
  color: var(--vscode-descriptionForeground);
}

/*
 * 悬停名字、链接时的定义卡片浮窗：外框同 VS Code 编辑器的悬停框（边框、底色、阴影），标题一行垫悬停框状态栏的底色。
 * 落位时按剩下的空间限宽高（行内样式），卡片再大就在下面那块里滚；那块自己也有个上限，大文件的类不至于占满半屏。
 * 层级低于悬停提示（z-50），浮窗里名字的提示照样盖在它上面
 */
.cr-peek {
  position: fixed;
  z-index: 40;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--vscode-editorHoverWidget-border, var(--vscode-editorWidget-border));
  border-radius: 6px;
  background: var(--vscode-editorHoverWidget-background, var(--vscode-editorWidget-background));
  color: var(--vscode-editorHoverWidget-foreground, var(--vscode-foreground));
  box-shadow: 0 2px 8px var(--vscode-widget-shadow, rgb(0 0 0 / 36%));
}
.cr-peek-head {
  flex-shrink: 0;
  padding: 2px 8px;
  border-bottom: 1px solid var(--vscode-editorHoverWidget-border, var(--vscode-editorWidget-border));
  background: var(--vscode-editorHoverWidget-statusBarBackground, transparent);
  color: var(--vscode-textLink-foreground);
  font-family: var(--vscode-editor-font-family, monospace);
  font-size: 12px;
  line-height: 18px;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}
.cr-peek-head:hover {
  color: var(--vscode-textLink-activeForeground);
  text-decoration: underline;
}
.cr-peek-head:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: -1px;
}
.cr-peek-body {
  min-height: 0;
  max-width: 640px;
  max-height: 420px;
  overflow: auto;
  padding: 6px 8px 6px 0;
}

/* 按住 ⌘ / Ctrl 停在查得到定义的名字上：和编辑器里的链接一样 */
.cr-code [data-link] {
  color: var(--vscode-editorLink-activeForeground);
  text-decoration: underline;
  cursor: pointer;
}

/*
 * 单击名字高亮它在文件里的各处出现：颜色取 VS Code 编辑器的单词高亮，写入（定义、赋值）用强高亮色，读取和按文字认出的用普通高亮色；
 * 主题给了边框色（高对比主题）才描边。很多主题没配单词高亮色，默认的灰底很淡，所以再用 focusBorder 色补一笔：
 * 各处底下一条细线，当前那一处（点中的、用键盘跳到的）描一圈框。筛选栏上「名字 · 2/5」的名字也按普通高亮画。
 * 线和框都画在字框里面，不挤动排版；细线用内阴影画，不占 text-decoration（⌘ 指着名字时的链接下划线用它）
 */
[data-occurrence] {
  outline-offset: -1px;
  box-shadow: inset 0 -1px 0 var(--vscode-focusBorder);
}
[data-occurrence="normal"] {
  background: var(--vscode-editor-wordHighlightBackground);
  outline: 1px solid var(--vscode-editor-wordHighlightBorder, transparent);
}
[data-occurrence="strong"] {
  background: var(--vscode-editor-wordHighlightStrongBackground);
  outline: 1px solid var(--vscode-editor-wordHighlightStrongBorder, transparent);
}
[data-occurrence][data-current] {
  outline: 1px solid var(--vscode-focusBorder);
  box-shadow: none;
}
.cr-occurrence-name {
  padding: 0 3px;
  color: var(--vscode-editor-foreground);
  font-family: var(--vscode-editor-font-family, monospace);
}

/* 属性表的属性名：界面字体，和值一样的行高，两边逐行对齐 */
.cr-prop-label {
  font-size: 12.5px;
  line-height: 20px;
  color: var(--vscode-descriptionForeground);
  white-space: nowrap;
}

/*
 * 框起来的一组词（写在表达式里的遍历）：嵌在译文里的小框，框头是图标和 label，边框、底色、框头取框的样式色（遍历同「循环」块）。
 * 整个框放不下时挪到下一行，比一行还长时占满一行、在框里换行。上下边框算在行高里：框和前后文字顶部对齐、基线对齐，不把这一行撑高；
 * 框里再套的框行高再减 2px，同样不撑高外面那个框的行
 */
.cr-group[data-style="iteration"] { --group: var(--cr-kind-loop); }
.cr-group {
  display: inline-block;
  max-width: 100%;
  padding: 0 5px;
  line-height: 18px;
  vertical-align: top;
  border: 1px solid color-mix(in srgb, var(--group) 45%, transparent);
  border-radius: 4px;
  background: color-mix(in srgb, var(--group) 14%, transparent);
}
.cr-group .cr-group {
  line-height: 16px;
}
.cr-group-head {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-right: 6px;
  vertical-align: top;
  font-family: var(--vscode-font-family, system-ui, sans-serif), "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  font-size: 11px;
  font-weight: 500;
  color: var(--group);
  white-space: nowrap;
}
/* 只有图标的框头（渲染大纲一行前面的「当 … 时」）：图标和后面的字贴近一点；框里没有词时（小标签、类名）框头后面不留空 */
.cr-group-head[data-bare] {
  margin-right: 4px;
}
.cr-group-head:last-child {
  margin-right: 0;
}

/*
 * 渲染大纲一行前面的小框（React 渲染输出卡片）：按条件、条件的一支同「条件」块的颜色；
 * 小标签（名称后面的「具名导出」、属性名后面的「回调」）用规则给的颜色（暗色、亮色各一个，按主题挑）
 */
.cr-group:is([data-style="condition"], [data-style="branch"]) { --group: var(--cr-kind-branch); }
.cr-group[data-colored] { --group: var(--group-dark); }
body:is(.vscode-light, .vscode-high-contrast-light) .cr-group[data-colored] { --group: var(--group-light); }
.cr-group[data-style="tag"] {
  line-height: 16px;
  margin-top: 1px;
}

/*
 * 收起来的一串类名（「样式 N 个类」）：中性色的小框，是个按钮；点开时换成焦点色的边、在下面弹出全部类名，
 * 弹层盖住后面的字，不挤开它们
 */
.cr-group[data-style="classes"] {
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  background: var(--vscode-input-background);
  border-color: var(--vscode-editorWidget-border, var(--vscode-contrastBorder, transparent));
}
.cr-group[data-style="classes"] .cr-group-head {
  font-weight: 400;
  color: var(--vscode-descriptionForeground);
}
.cr-group[data-style="classes"]:hover,
.cr-group[data-style="classes"][data-open] {
  border-color: var(--vscode-focusBorder);
}
.cr-group[data-style="classes"][data-open] .cr-group-head {
  color: var(--vscode-foreground);
}
.cr-classes {
  position: relative;
  display: inline-block;
  vertical-align: top;
}
.cr-classes-popup {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  z-index: 20;
  width: max-content;
  max-width: min(460px, 70vw);
  padding: 6px 8px;
  border: 1px solid var(--vscode-editorHoverWidget-border, var(--vscode-editorWidget-border));
  border-radius: 6px;
  background: var(--vscode-editorHoverWidget-background, var(--vscode-editorWidget-background));
  box-shadow: 0 2px 8px var(--vscode-widget-shadow, rgb(0 0 0 / 36%));
  color: var(--vscode-editorHoverWidget-foreground, var(--vscode-foreground));
  font-family: var(--vscode-editor-font-family, monospace);
  font-size: 12px;
  line-height: 18px;
  white-space: pre-wrap;
}

/*
 * 属性表里带列名的子行（输入参数、数据表的字段）排成的表格：外框圆角，格子之间、行之间一条主题的表格分隔线；
 * 表头垫主题的表头底色（比编辑区深一档或浅一档）、列名用说明色。
 * 整张表格一个网格、每行借用它的列（subgrid），列宽按整列的内容定，见 tableTemplate
 */
.cr-table {
  --cr-table-border: var(--vscode-tree-tableColumnsBorder, var(--vscode-editorWidget-border, var(--vscode-contrastBorder)));
  display: grid;
  border: 1px solid var(--cr-table-border);
  border-radius: 4px;
  overflow: hidden;
}
.cr-table-head,
.cr-table-row {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
}
.cr-table-head {
  background: var(--vscode-keybindingTable-headerBackground, color-mix(in srgb, var(--vscode-foreground) 5%, transparent));
}
.cr-table-row {
  border-top: 1px solid var(--cr-table-border);
}
/* 讲某个子块的行（Rust 实现块的方法表）：第一格是按钮，悬停划下划线；展开时这一行淡淡垫上那一块的种类色 */
.cr-table-row[data-open] {
  background: color-mix(in srgb, var(--kind) 10%, transparent);
}
.cr-item-toggle {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.cr-item-toggle:hover {
  text-decoration: underline;
}

/* 在卡片属性表某一行下面展开的子块（Rust 实现块展开的方法）：和表格一样往里缩一点 */
.cr-slot {
  padding-left: 5px;
}
.cr-table .cr-table-cell {
  padding: 2px 8px;
}
.cr-table .cr-table-cell + .cr-table-cell {
  border-left: 1px solid var(--cr-table-border);
}
.cr-table-head .cr-table-cell {
  font-size: 12px;
  line-height: 20px;
  color: var(--vscode-descriptionForeground);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 编辑：透明输入框垫在底下接收输入和选区，着色层盖在上面只负责显示，高度由着色层撑开 */
.cr-editor {
  position: relative;
}
.cr-editor > textarea {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  resize: none;
  overflow: hidden;
  outline: none;
  background: transparent;
  color: transparent;
  caret-color: var(--vscode-editorCursor-foreground);
}
.cr-editor > textarea::selection {
  color: transparent;
  background: var(--vscode-editor-selectionBackground);
}
.cr-editor > pre {
  position: relative;
  pointer-events: none;
}

/* 筛选栏：钉在预览顶部、横贯整个编辑区，里面的内容和代码块同宽对齐；打开的下拉菜单盖在代码块上面 */
.cr-filter-bar {
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--vscode-editor-background);
  border-bottom: 1px solid var(--vscode-panel-border, transparent);
}
.cr-chip {
  color: var(--vscode-dropdown-foreground, var(--vscode-foreground));
  background: var(--vscode-dropdown-background);
  border: 1px solid var(--vscode-dropdown-border, var(--vscode-dropdown-background));
}
.cr-chip[data-active] {
  border-color: var(--vscode-focusBorder);
}
.cr-chip:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: -1px;
}
.cr-menu {
  color: var(--vscode-editorWidget-foreground, var(--vscode-foreground));
  background: var(--vscode-editorWidget-background);
  border: 1px solid var(--vscode-editorWidget-border, var(--vscode-widget-border, transparent));
  box-shadow: 0 2px 8px var(--vscode-widget-shadow, rgb(0 0 0 / 36%));
}
.cr-menu-divider {
  background: var(--vscode-menu-separatorBackground, var(--vscode-editorWidget-border, var(--vscode-panel-border)));
}
.cr-menu-list {
  outline: none;
}
.cr-option[data-active] {
  background: var(--vscode-list-hoverBackground);
}
/* 键盘在列表里走时，高亮项再描一圈聚焦色 */
.cr-menu-list:focus-visible .cr-option[data-active] {
  outline: 1px solid var(--vscode-list-focusOutline, var(--vscode-focusBorder));
  outline-offset: -1px;
}
.cr-check {
  border: 1px solid var(--vscode-checkbox-border, var(--vscode-editorLineNumber-foreground));
  border-radius: 3px;
  background: var(--vscode-checkbox-background, transparent);
}
.cr-check[data-checked] {
  color: var(--vscode-button-foreground, #fff);
  background: var(--vscode-focusBorder);
  border-color: var(--vscode-focusBorder);
}
.cr-option-count {
  color: var(--vscode-editorLineNumber-foreground);
}
.cr-link {
  color: var(--vscode-textLink-foreground);
}
.cr-link:hover {
  color: var(--vscode-textLink-activeForeground);
  text-decoration: underline;
}
.cr-link:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: 1px;
  border-radius: 2px;
}

/* 跳到定义临时露出来的、本来被筛掉的块：右边一个小提示 */
.cr-temporary {
  color: var(--vscode-descriptionForeground);
  background: color-mix(in srgb, var(--vscode-focusBorder) 15%, transparent);
}

/* 问 AI：块下面的问答区，左边一条链接色竖线；问过的灰字，当前这一轮照常颜色 */
.cr-qa {
  --qa-accent: var(--vscode-textLink-foreground);
  --qa-dim: color-mix(in srgb, var(--vscode-descriptionForeground) 75%, transparent);
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 6px 10px 6px 12px;
  border-left: 2px solid color-mix(in srgb, var(--qa-accent) 50%, transparent);
  font-family: var(--vscode-font-family, system-ui, sans-serif), "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  font-size: 12.5px;
  line-height: 18px;
}
.cr-qa[data-collapsed] {
  gap: 6px;
  padding-top: 2px;
  padding-bottom: 2px;
}
.cr-qa-entry {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cr-qa-head {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.cr-qa-icon {
  flex-shrink: 0;
  color: var(--qa-dim);
}
.cr-qa-entry[data-current] .cr-qa-icon {
  color: var(--qa-accent);
}
.cr-qa-question {
  min-width: 0;
  flex: 1;
  text-align: left;
}
.cr-qa-entry[data-history] .cr-qa-question {
  overflow: hidden;
  color: var(--vscode-descriptionForeground);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cr-qa-entry[data-current] .cr-qa-question {
  color: var(--vscode-foreground);
  font-weight: 500;
}
.cr-qa-when {
  flex-shrink: 0;
  color: var(--qa-dim);
  font-size: 11px;
  line-height: 16px;
}
.cr-qa-delete {
  display: flex;
  width: 22px;
  height: 18px;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  color: var(--qa-dim);
}
.cr-qa-delete:hover {
  color: var(--vscode-foreground);
}
/* 回答的前两行，和回答正文一样往右缩到问题下面 */
.cr-qa-preview {
  display: -webkit-box;
  overflow: hidden;
  padding-left: 18px;
  color: var(--qa-dim);
  font-size: 12px;
  line-height: 18px;
  text-align: left;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.cr-qa-answer {
  padding-left: 18px;
  font-size: 12.5px;
}
.cr-qa .cr-markdown.cr-qa-answer {
  color: var(--vscode-foreground);
}
.cr-qa .cr-qa-entry[data-history] .cr-markdown.cr-qa-answer {
  color: var(--vscode-descriptionForeground);
}
/* 回答还在长：最后一段末尾一个闪的光标 */
.cr-qa-answer[data-streaming] > :last-child::after {
  content: "▍";
  margin-left: 1px;
  color: var(--qa-accent);
  animation: cr-qa-blink 1s steps(1) infinite;
}
@keyframes cr-qa-blink {
  50% { opacity: 0; }
}
.cr-qa-status {
  display: flex;
  align-items: center;
  gap: 6px;
  padding-left: 18px;
  color: var(--vscode-descriptionForeground);
  font-size: 11.5px;
}
.cr-qa-spin {
  animation: cr-qa-spin 900ms linear infinite;
}
@keyframes cr-qa-spin {
  to { transform: rotate(360deg); }
}
/* 重写记录没写进文件：灰字历史里写一行原因，警告色 */
.cr-qa-status[data-warning] {
  color: var(--vscode-editorWarning-foreground, var(--vscode-descriptionForeground));
}
.cr-qa-error {
  display: flex;
  gap: 6px;
  margin-left: 18px;
  padding: 4px 8px;
  border: 1px solid var(--vscode-inputValidation-errorBorder);
  border-radius: 4px;
  background: var(--vscode-inputValidation-errorBackground);
  color: var(--vscode-foreground);
  font-size: 12px;
}
.cr-qa-error > svg {
  color: var(--vscode-errorForeground);
}
.cr-qa-divider {
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--vscode-foreground) 12%, transparent);
}
/* 问题带的图片：一排 40px 的缩略图，和回答一样往右缩到问题下面；贴了还没发的在输入框上面，右上角有「去掉」 */
.cr-qa-thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 2px 0 2px 18px;
}
.cr-qa-thumbs[data-pending] {
  padding: 6px 0 0;
}
.cr-qa-thumb {
  position: relative;
  display: flex;
}
.cr-qa-thumb-open {
  display: flex;
  overflow: hidden;
  width: 40px;
  height: 40px;
  border: 1px solid color-mix(in srgb, var(--vscode-foreground) 18%, transparent);
  border-radius: 4px;
  background: var(--vscode-editor-background);
  cursor: zoom-in;
}
.cr-qa-thumb-open img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cr-qa-thumb-open:hover {
  border-color: var(--vscode-focusBorder);
}
.cr-qa-entry[data-history] .cr-qa-thumb-open img {
  opacity: 0.7;
}
.cr-qa-entry[data-history] .cr-qa-thumb-open:hover img {
  opacity: 1;
}
.cr-qa-thumb-remove {
  position: absolute;
  top: -6px;
  right: -6px;
  display: flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--vscode-widget-border, color-mix(in srgb, var(--vscode-foreground) 25%, transparent));
  border-radius: 50%;
  background: var(--vscode-editorWidget-background, var(--vscode-editor-background));
  color: var(--vscode-descriptionForeground);
}
.cr-qa-thumb-remove:hover {
  color: var(--vscode-foreground);
}
.cr-qa-thumb-open:focus-visible,
.cr-qa-thumb-remove:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: 1px;
}
.cr-qa-notice {
  color: var(--vscode-editorWarning-foreground, var(--vscode-descriptionForeground));
  font-size: 11.5px;
}
/* 看大图：盖住整个预览，图片按比例放到最大，右上角「关闭」 */
.cr-qa-lightbox {
  position: fixed;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  background: rgb(0 0 0 / 65%);
  cursor: zoom-out;
  inset: 0;
}
.cr-qa-lightbox img {
  max-width: 100%;
  max-height: 100%;
  border-radius: 4px;
  box-shadow: 0 6px 28px rgb(0 0 0 / 45%);
  object-fit: contain;
}
.cr-qa-lightbox-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  width: 28px;
  height: 28px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--vscode-widget-border, transparent);
  border-radius: 4px;
  background: var(--vscode-editorWidget-background, var(--vscode-editor-background));
  color: var(--vscode-foreground);
}
.cr-qa-lightbox-close:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: 1px;
}
.cr-qa-input {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  padding: 4px 4px 4px 8px;
  border: 1px solid var(--vscode-input-border, color-mix(in srgb, var(--vscode-foreground) 20%, transparent));
  border-radius: 4px;
  background: var(--vscode-input-background);
}
.cr-qa-input:focus-within {
  border-color: var(--vscode-focusBorder);
}
.cr-qa-input textarea {
  min-width: 0;
  max-height: 160px;
  flex: 1;
  padding: 1px 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--vscode-input-foreground);
  font: inherit;
  resize: none;
  field-sizing: content;
}
.cr-qa-input textarea::placeholder {
  color: var(--vscode-input-placeholderForeground);
}
.cr-qa-input .cr-tool {
  display: flex;
  width: 24px;
  height: 20px;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
}
.cr-qa-input .cr-tool:disabled {
  opacity: 0.4;
}
/* 发送按钮前面的 profile 下拉：只占名字那么宽，长名字截断，输入框还是主角；字号同弹出的选项（弹层按它量宽） */
.cr-qa-input .cr-qa-profile {
  height: 20px;
  max-width: 140px;
  flex-shrink: 0;
  padding: 0 4px 0 6px;
  border-radius: 4px;
  color: var(--vscode-descriptionForeground);
  font-size: 12px;
}
.cr-qa-input .cr-qa-profile:hover {
  background: var(--vscode-toolbar-hoverBackground);
  color: var(--vscode-foreground);
}
.cr-qa-input .cr-qa-profile[aria-expanded="true"] {
  background: var(--vscode-toolbar-activeBackground);
  color: var(--vscode-foreground);
}
.cr-qa-input .cr-qa-profile:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: -1px;
}
.cr-qa-summary {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 4px;
  color: var(--vscode-descriptionForeground);
  font-size: 12px;
}
.cr-qa-summary:hover {
  color: var(--vscode-foreground);
}
.cr-qa-summary:focus-visible,
.cr-qa-question:focus-visible,
.cr-qa-preview:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: 1px;
  border-radius: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .cr-qa-spin,
  .cr-qa-answer[data-streaming] > :last-child::after {
    animation: none;
  }
}

/*
 * 代码差异：配色取 VS Code 编辑器行号旁的改动色带（新增绿、修改蓝、删除红），主题没给时用 Dark Modern 的默认值；
 * 行内的字增删用 diff 编辑器的插入 / 删除文字底色
 */
body {
  --cr-diff-add: var(--vscode-editorGutter-addedBackground, #2ea043);
  --cr-diff-mod: var(--vscode-editorGutter-modifiedBackground, #0078d4);
  --cr-diff-del: var(--vscode-editorGutter-deletedBackground, #f85149);
}

/* 卡片左边外侧的改动色条：3px 宽、和卡片等高；没变的卡片留一条透明的，同一层的卡片照样对齐 */
.cr-change-bar {
  width: 3px;
  flex-shrink: 0;
  border-radius: 1.5px;
}
.cr-change-bar[data-change="add"] { background: var(--cr-diff-add); }
.cr-change-bar[data-change="mod"] { background: var(--cr-diff-mod); }
.cr-change-bar[data-change="del"] { background: var(--cr-diff-del); }
/* 卡片包了一层色条以后不再和子层相邻：悬停卡片时子层竖线换色改按外层认；问答区往右缩到和卡片对齐 */
.cr-change-row:has(> div > .cr-block:hover) + .cr-level > * > .cr-guide,
.cr-change-row:has(> div > .cr-block:hover) + .cr-qa + .cr-level > * > .cr-guide,
.cr-change-row:has(> div > .cr-block:hover) + .cr-qa + .cr-qa + .cr-level > * > .cr-guide {
  background: var(--kind);
}
.cr-change-row + .cr-qa,
.cr-change-row + .cr-qa + .cr-qa {
  margin-left: 8px;
}

/* 新增的卡片（连同它的子卡片）：底色淡绿；最外面那张左上角压着「新增」小标 */
.cr-block[data-change="add"] {
  background: color-mix(in srgb, var(--cr-diff-add) 10%, transparent);
}
.cr-block[data-change="add"]:hover {
  background: color-mix(in srgb, var(--cr-diff-add) 16%, transparent);
}
.cr-added-badge {
  position: absolute;
  top: -8px;
  left: 6px;
  padding: 0 5px;
  border-radius: 3px;
  background: var(--cr-diff-add);
  color: #fff;
  font-size: 10px;
  font-weight: 500;
  line-height: 14px;
  pointer-events: none;
}

/* 删掉的块：红色虚线边、淡红底、半透明，没有编辑、问 AI 按钮；展开后下面是旧内容，整张划掉 */
.cr-removed {
  border: 1px dashed color-mix(in srgb, var(--cr-diff-del) 80%, transparent);
  background: color-mix(in srgb, var(--cr-diff-del) 6%, transparent);
  opacity: 0.6;
}
.cr-block.cr-removed:hover {
  border-color: var(--cr-diff-del);
  background: color-mix(in srgb, var(--cr-diff-del) 10%, transparent);
  opacity: 0.8;
}
.cr-removed-head {
  color: var(--vscode-descriptionForeground);
}
.cr-removed-head:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: 1px;
  border-radius: 2px;
}
.cr-removed-label {
  color: var(--cr-diff-del);
}
.cr-removed-title {
  color: var(--cr-function);
  font-family: var(--vscode-editor-font-family, monospace);
}
.cr-removed-old,
.cr-removed-old * {
  text-decoration-line: line-through;
}

/* 筛选栏第二行：对比基准、改动统计、「只看改动」、上一处 / 下一处 */
.cr-diff-stat[data-change="add"] { color: var(--cr-diff-add); }
.cr-diff-stat[data-change="mod"] { color: var(--cr-diff-mod); }
.cr-diff-stat[data-change="del"] { color: var(--cr-diff-del); }

/* 基准里没有这个文件：顶部一条横幅，卡片不再逐张标绿 */
.cr-new-file {
  border: 1px solid color-mix(in srgb, var(--cr-diff-add) 50%, transparent);
  background: color-mix(in srgb, var(--cr-diff-add) 14%, transparent);
}
.cr-new-file > svg {
  color: var(--cr-diff-add);
}

/*
 * 卡片里的标记：改了的值旧值红底划掉、紧跟新值绿底（.cr-diff-part），说明里增删的字同样（.cr-diff-word，<ins> / <del>）；
 * 新加的行、子行整行淡绿底、左边 +，删掉的整行淡红底、划掉、左边 −；表格的行记号写在第一格前（.cr-diff-sign）
 */
body {
  --cr-diff-add-text: var(--vscode-diffEditor-insertedTextBackground, color-mix(in srgb, var(--cr-diff-add) 32%, transparent));
  --cr-diff-del-text: var(--vscode-diffEditor-removedTextBackground, color-mix(in srgb, var(--cr-diff-del) 32%, transparent));
}
.cr-diff-part,
.cr-diff-word {
  border-radius: 2px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
:is(.cr-diff-part, .cr-diff-word)[data-change="add"],
ins.cr-diff-word {
  background: var(--cr-diff-add-text);
  text-decoration: none;
}
:is(.cr-diff-part, .cr-diff-word)[data-change="del"],
del.cr-diff-word {
  background: var(--cr-diff-del-text);
  text-decoration-line: line-through;
}
.cr-diff-part[data-change="del"] * {
  text-decoration-line: line-through;
}
:is(.cr-prop-row, .cr-prop-item, .cr-table-row)[data-diff="add"] {
  background: color-mix(in srgb, var(--cr-diff-add) 14%, transparent);
}
:is(.cr-prop-row, .cr-prop-item, .cr-table-row)[data-diff="del"] {
  background: color-mix(in srgb, var(--cr-diff-del) 14%, transparent);
}
:is(.cr-prop-row, .cr-prop-item, .cr-table-row)[data-diff="del"] :not(.cr-diff-sign),
.cr-diff-gone,
.cr-diff-gone * {
  text-decoration-line: line-through;
}
:is(.cr-prop-row, .cr-prop-item)[data-diff] {
  position: relative;
}
:is(.cr-prop-row, .cr-prop-item)[data-diff]::before {
  position: absolute;
  top: 0;
  left: -9px;
  width: 8px;
  font-family: var(--vscode-editor-font-family, monospace);
  line-height: 20px;
  text-align: center;
}
:is(.cr-prop-row, .cr-prop-item)[data-diff="add"]::before {
  content: "+";
  color: var(--cr-diff-add);
}
:is(.cr-prop-row, .cr-prop-item)[data-diff="del"]::before {
  content: "−";
  color: var(--cr-diff-del);
}
.cr-diff-sign {
  display: inline-block;
  width: 1.4ch;
  white-space: pre;
}
.cr-diff-sign[data-change="add"] { color: var(--cr-diff-add); }
.cr-diff-sign[data-change="del"] { color: var(--cr-diff-del); }

/* 「只看改动」开关：一个小拨动开关加字，开着时底色同按下的工具按钮、开关换聚焦色 */
.cr-only-changes {
  color: var(--vscode-foreground);
}
.cr-only-changes:hover {
  background: var(--vscode-toolbar-hoverBackground);
}
.cr-only-changes[aria-pressed="true"] {
  background: var(--vscode-toolbar-activeBackground);
}
.cr-only-changes:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: -1px;
}
.cr-switch {
  display: flex;
  width: 26px;
  height: 14px;
  flex-shrink: 0;
  align-items: center;
  padding: 0 2px;
  border: 1px solid var(--vscode-checkbox-border, var(--vscode-editorWidget-border, var(--vscode-panel-border)));
  border-radius: 7px;
  background: var(--vscode-input-background, transparent);
}
.cr-switch-knob {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--vscode-descriptionForeground);
}
.cr-switch[data-on] {
  justify-content: flex-end;
  border-color: var(--vscode-focusBorder);
  background: var(--vscode-focusBorder);
}
.cr-switch[data-on] .cr-switch-knob {
  background: #fff;
}

/* 「只看改动」时连着没变的块折成的一条：虚线框，点开恢复 */
.cr-unchanged {
  border: 1px dashed var(--vscode-editorWidget-border, var(--vscode-panel-border));
  color: var(--vscode-descriptionForeground);
}
.cr-unchanged:hover {
  background: var(--vscode-toolbar-hoverBackground);
}
.cr-unchanged:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: -1px;
}

/* 预览右边缘的总览条：从筛选栏下面贴到底，每处改动按它在文件里的行画一段刻度（删掉的块一条细线），点刻度跳过去 */
.cr-ruler {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 5;
  width: 14px;
  border-left: 1px solid var(--vscode-editorOverviewRuler-border, var(--vscode-panel-border, transparent));
  background: var(--vscode-editor-background);
}
.cr-ruler-track {
  position: absolute;
  inset: 2px 0;
}
.cr-ruler-tick {
  position: absolute;
  left: 3px;
  width: 8px;
  min-height: 4px;
  cursor: pointer;
}
.cr-ruler-tick[data-change="add"] { background: var(--cr-diff-add); }
.cr-ruler-tick[data-change="mod"] { background: var(--cr-diff-mod); }
.cr-ruler-tick[data-change="del"] {
  min-height: 2px;
  height: 2px;
  background: var(--cr-diff-del);
}
.cr-ruler-tick:hover,
.cr-ruler-tick:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
}

/*
 * 钉在顶上的卡片（StickyLines.tsx，同 VS Code 编辑器的 Sticky Scroll）：从筛选栏下沿往下摞，底色、悬停色、下沿的阴影同编辑器的
 * （--vscode-editorStickyScroll*，主题没给时用编辑器底色、控件阴影）。最里那行被顶上去时从上一行下面滑走（层级低一级），整块跟着变矮。
 * 层级在页面内容之上，低于总览条（5）、筛选栏（10）和它的下拉菜单、定义卡片浮窗（40）、下拉列表和悬停提示（50）
 */
.cr-sticky {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 4;
  overflow: hidden;
  background: var(--vscode-editorStickyScroll-background, var(--vscode-editor-background));
  box-shadow: 0 4px 2px -2px var(--vscode-editorStickyScroll-shadow, var(--vscode-widget-shadow, rgb(0 0 0 / 36%)));
}
.cr-sticky-line {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 1;
  background: var(--vscode-editorStickyScroll-background, var(--vscode-editor-background));
  cursor: pointer;
}
.cr-sticky-line[data-last] {
  z-index: 0;
}
.cr-sticky-line:hover {
  background: var(--vscode-editorStickyScrollHover-background, var(--vscode-list-hoverBackground));
}
/* 标题一行放不下省略；空格照源码留着 */
.cr-sticky-title {
  overflow: hidden;
  white-space: pre;
  text-overflow: ellipsis;
}

/* 调用树：盖住编辑区（文件树在预览外面，不会被压暗）。路径用当前块的种类色 */
.cr-call-count {
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border-radius: 7px;
  background: var(--vscode-badge-background);
  color: var(--vscode-badge-foreground);
  font-size: 9px;
  font-weight: 700;
  line-height: 14px;
  text-align: center;
}
.cr-call-overlay {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 32px 24px;
  background: rgb(0 0 0 / 55%);
}
.cr-call-dialog {
  display: flex;
  flex-direction: column;
  width: min(880px, 100%);
  max-height: 100%;
  overflow: hidden;
  border: 1px solid var(--vscode-editorWidget-border, var(--vscode-widget-border, transparent));
  border-radius: 8px;
  background: var(--vscode-editorWidget-background, var(--vscode-editor-background));
  color: var(--vscode-editorWidget-foreground, var(--vscode-foreground));
  box-shadow: 0 8px 28px var(--vscode-widget-shadow);
}
/* 标题一行：「调用树」和符号名整个留着，位置占剩下的宽度 */
.cr-call-title {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--vscode-widget-border, var(--vscode-panel-border, transparent));
}
.cr-call-heading {
  flex-shrink: 0;
  font-weight: 600;
  white-space: nowrap;
}
.cr-call-symbol,
.cr-call-name {
  color: var(--kind);
  font-family: var(--vscode-editor-font-family, monospace);
  font-weight: 600;
  white-space: nowrap;
}
.cr-call-symbol {
  flex-shrink: 0;
}
/* 位置：文件名先放全，目录拿剩下的宽度、放不下末尾省略；文件名自己也放不下时才省略 */
.cr-call-where {
  display: flex;
  flex: 1;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  font-family: var(--vscode-editor-font-family, monospace);
  font-size: 11px;
}
.cr-call-file,
.cr-call-dir {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cr-call-file {
  flex: 0 1 auto;
  min-width: 0;
  color: var(--vscode-foreground);
}
.cr-call-dir {
  flex: 1 1 0;
  min-width: 0;
  color: var(--vscode-disabledForeground, var(--vscode-descriptionForeground));
}
.cr-call-loc {
  color: var(--vscode-disabledForeground, var(--vscode-descriptionForeground));
  font-family: var(--vscode-editor-font-family, monospace);
  font-size: 11px;
}
.cr-call-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  flex-shrink: 0;
  height: 24px;
  margin-left: auto;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--vscode-descriptionForeground);
}
.cr-call-entries {
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 16px 4px;
}
.cr-call-entry {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  border: 1px solid var(--vscode-widget-border, var(--vscode-panel-border, transparent));
  border-radius: 6px;
  background: var(--vscode-input-background, transparent);
  color: var(--vscode-foreground);
  font-size: 12px;
}
.cr-call-entry[aria-selected="true"] {
  border-color: var(--vscode-focusBorder);
  background: var(--vscode-list-activeSelectionBackground);
  color: var(--vscode-list-activeSelectionForeground);
  font-weight: 600;
}
.cr-call-hits {
  color: var(--vscode-disabledForeground, var(--vscode-descriptionForeground));
  font-size: 11px;
  font-weight: 400;
}
.cr-call-entry[aria-selected="true"] .cr-call-hits {
  color: var(--vscode-list-activeSelectionForeground);
}
.cr-call-body {
  min-height: 0;
  padding: 12px 16px 16px;
  overflow: auto;
}
.cr-call-note {
  margin: 8px 0;
  color: var(--vscode-descriptionForeground);
}
.cr-call-note p {
  margin: 0;
}
.cr-call-files {
  margin: 6px 0 0;
  padding-left: 16px;
}
.cr-call-row {
  display: flex;
  align-items: stretch;
  gap: 8px;
}
.cr-call-row + .cr-call-row {
  margin-top: 8px;
}
.cr-call-guide {
  flex-shrink: 0;
  width: 2px;
  border-radius: 1px;
  background: var(--kind);
}
.cr-call-guide[data-folded] {
  align-self: center;
  height: 16px;
  background: var(--vscode-editorIndentGuide-background1, var(--vscode-tree-inactiveIndentGuidesStroke));
}
.cr-call-card {
  flex: 1;
  min-width: 0;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--kind) 35%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--kind) 7%, transparent);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.cr-call-card:hover {
  background: color-mix(in srgb, var(--kind) 12%, transparent);
}
.cr-call-card:focus-visible {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: 1px;
}
.cr-call-card[data-current] {
  border-color: var(--kind);
  background: color-mix(in srgb, var(--kind) 14%, transparent);
}
/* 卡片第一行：图标、名字、detail 占名字后面剩下的宽度，「当前」靠右；第二行只放位置 */
.cr-call-line {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--kind);
}
.cr-call-line > svg {
  flex-shrink: 0;
}
.cr-call-name {
  overflow: hidden;
  flex: 0 1 auto;
  min-width: 0;
  text-overflow: ellipsis;
}
.cr-call-detail {
  overflow: hidden;
  flex: 1 1 0;
  min-width: 0;
  color: var(--vscode-descriptionForeground);
  font-size: 11px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cr-call-card .cr-call-where {
  margin-top: 2px;
}
.cr-call-pill {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  height: 18px;
  margin-left: auto;
  padding: 0 6px;
  border-radius: 9px;
  background: var(--kind);
  color: var(--vscode-editor-background);
  font-size: 11px;
  font-weight: 600;
}
.cr-call-folded {
  align-self: center;
  color: var(--vscode-disabledForeground, var(--vscode-descriptionForeground));
  font-size: 12px;
}