/* genpill-r2.css — BOT-GENERATOR-4260-INTEGRATE-20260922 候选新增样式文件
 * 边界声明：不覆盖共享件（uiopt-r1/r4/r5/r6-theme 逐字节零动）；本文件只追加 pill r2 形态与
 * pop 单图放大覆写，选择器全部以 .g5-pill-r2 / .g5-pop-localrun 等新类名开道，接口=类名合同（见 RESULT §共享样式接口）。
 * 裁决映射：②工作流 chip+提示词摘要+圆形提交钮 ③pill 本体即进度条（.g5-pill-fill 背景填充，pill 内零独立条）④悬停上区=单独图片 ⑤Alt 复制为 JS 合同（无样式面）。 */
/* .generator-body 基座（r5 链）为 column（R5 题上条下版式）；r2 常态为单行三件（chip+摘要+圆钮），本类自拨 row，不改共享基座。 */
.gen-pill.g5-pill-r2 { position: relative; overflow: hidden; flex-direction: row; align-items: center; gap: 7px; padding: 0 8px 0 12px; }
.gen-pill.g5-pill-r2 > *:not(.g5-pill-fill) { position: relative; z-index: 1; }
.gen-pill.g5-pill-r2 > .g5-pill-fill { position: absolute; inset: 0 auto 0 0; width: 0; z-index: 0; pointer-events: none; border-radius: 999px 0 0 999px; background: linear-gradient(90deg, color-mix(in srgb, var(--accent-ui, #1d4ed8) 18%, transparent), color-mix(in srgb, var(--accent-marker, var(--accent-ui, #1d4ed8)) 34%, transparent)); transition: width .5s cubic-bezier(.2,.8,.2,1); }
.gen-pill.g5-pill-r2.g5-running { box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--accent-ui, #1d4ed8) 55%, transparent); }
.g5-pill-wf { flex: 0 0 auto; font-size: 10.5px; font-weight: 600; line-height: 20px; padding: 0 7px; border-radius: 999px; white-space: nowrap; background: var(--chip-bg, rgba(29,78,216,.08)); color: var(--accent-ui, #1d4ed8); border: 1px solid color-mix(in srgb, var(--accent-ui, #1d4ed8) 28%, transparent); }
.g5-pill-digest { flex: 1 1 auto; min-width: 32px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; color: var(--ink-2, #374151); }
/* 提高特异性（.gen-pill.g5-pill-r2 > button）：全局 button 规则（refinement 链）单类打不过，实测宽被内容撑到 153px（GPB1 调试帧）。 */
.gen-pill.g5-pill-r2 > button.g5-pill-submit { flex: 0 0 26px; box-sizing: border-box; width: 26px; height: 26px; min-width: 26px; padding: 0; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 999px; cursor: pointer; background: var(--surface, #fff); color: var(--accent-ui, #1d4ed8); border: 1px solid color-mix(in srgb, var(--accent-ui, #1d4ed8) 45%, transparent); }
.gen-pill.g5-pill-r2 > button.g5-pill-submit:hover { background: var(--accent-ui, #1d4ed8); color: var(--surface, #fff); }
.gen-pill.g5-pill-r2 > button.g5-pill-submit svg { flex: 0 0 auto; width: 15px; height: 15px; display: block; }
/* GEN-HOVER-PREVIEW-UI-R1（2026-09-23 用户标注图①，推翻原裁决④「上区=单图 168×126 cover」）：上区=全部参考逐张独立、按原图自然比例（无固定宽高/无 cover 裁切）；
   外部承载透明无巨型白底——up 容器 surface/影/内边距撤下，贴面下沉到逐图（每张自持 --surface 底+ --sh-lift+ --r-pop 圆角，不成组框）；
   多张=有界横向滚动（max-width 钳位+overflow，配合 JS tabindex 键盘可达）；与下区（.g5-pop-down min/max 宽）宽度解耦（fit-content 不再被拉伸同宽）。共享 uiopt-r5 链逐字节零动，本文件为 .g5-pop-* 最后写入者（index 挂载序 :26>:22）。 */
.g5-pop.g5-pop-2z .g5-pop-up { width: fit-content; max-width: min(328px, 78vw); max-height: 172px; overflow: auto; background: transparent; border-radius: 0; box-shadow: none; padding: 0; gap: 6px; align-items: flex-start; }
.g5-pop.g5-pop-2z .g5-pop-ref { flex: 0 0 auto; display: block; }
.g5-pop.g5-pop-2z .g5-pop-ref img { width: auto; height: auto; max-width: 152px; max-height: 156px; object-fit: contain; border-radius: var(--r-pop, 10px); background: var(--surface); box-shadow: var(--sh-lift); }
.g5-pop.g5-pop-2z .g5-pop-ref-broken, .g5-pop.g5-pop-2z .g5-pop-noref { white-space: nowrap; } /* 诚实回退文字牌：外观承 r5 noref 合同（surface+lift+r-pop），单行不撑破滚动带 */
.g5-pop-localrun { margin-top: 4px; font-size: 10.5px; line-height: 1.45; color: var(--ink-2, #374151); background: var(--chip-bg, rgba(29,78,216,.06)); border-left: 2px solid var(--accent-ui, #1d4ed8); padding: 3px 6px; border-radius: 0 6px 6px 0; }

/* R418: a single canvas card expands below its pill; reference images remain above it. */
.canvas-card.g5-pill.g5-hover-open {
  height: auto !important;
  min-height: 44px;
  overflow: visible;
  border-radius: 22px 22px var(--r-pop, 10px) var(--r-pop, 10px);
  background: color-mix(in srgb, var(--accent-ui) 12%, var(--card-bg));
  box-shadow: var(--sh-lift);
  z-index: 30;
}
.canvas-card.g5-hover-open > .gen-pill.g5-pill-r2 {
  height: 44px;
  min-height: 44px;
  flex-shrink: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent-ui) 12%, var(--card-bg));
  box-shadow: none;
}
.canvas-card.g5-hover-open > .g5-pop.g5-pop-inline {
  position: static;
  width: 100%;
  max-width: none;
  min-width: 0;
  transform: none;
  margin: 0;
  padding: 0;
  pointer-events: auto;
}
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-up {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 0;
  max-width: 100%;
}
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-down {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: none;
  border-radius: 0 0 var(--r-pop, 10px) var(--r-pop, 10px);
  box-shadow: none;
  background: transparent;
  padding: 6px 12px;
  border-top: 1px solid color-mix(in srgb, var(--accent-ui) 24%, transparent);
}
.g5-hover-open > .g5-pop.g5-pop-inline textarea.g5-pop-prompt {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 48px;
  max-height: min(38vh, 360px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  resize: none;
  margin: 0;
  padding: 2px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font: inherit;
  line-height: 1.5;
  color: var(--ink-1);
  caret-color: var(--ink-1);
  cursor: text;
}
.g5-hover-open > #g5-pop.g5-pop-inline textarea.g5-pop-prompt:focus,
.g5-hover-open > #g5-pop.g5-pop-inline textarea.g5-pop-prompt:focus-visible {
  outline: 1px solid var(--accent-ui);
  outline-offset: 1px;
}

/* Keep the pill unchanged; the prompt unfolds beneath its divider. */
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-down { animation: g5-prompt-open 240ms cubic-bezier(.16,1,.3,1); }
@keyframes g5-prompt-open { from { clip-path: inset(0 0 80% 0); opacity: .5; } to { clip-path: inset(0); opacity: 1; } }
/* Intrinsic height animation stays local to this absolutely positioned canvas card.
   Older engines retain the clip reveal above; reduced-motion below removes both. */
@supports (interpolate-size: allow-keywords) {
  .g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-down {
    interpolate-size: allow-keywords;
    height: auto;
    overflow: hidden;
    animation-name: g5-prompt-unfold;
  }
  @keyframes g5-prompt-unfold {
    from { height: 0; padding-top: 0; padding-bottom: 0; opacity: .5; }
    to { height: auto; padding-top: 6px; padding-bottom: 6px; opacity: 1; }
  }
}
@media (prefers-reduced-motion: reduce) { .g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-down { animation: none; } }

/* Reference previews share the saved card width; rows wrap without nested scrollbars. */
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-up {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(120px, 100%), 1fr));
  width: 100%;
  max-height: none;
  overflow: visible;
  box-sizing: border-box;
}
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-ref { min-width: 0; }
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-ref img {
  display: block;
  max-width: 100%;
  height: auto;
}
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-ref-broken,
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-noref {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Compact generator composer: full text height and a dedicated submit column.
   B-SEND-HIT ①（UX-REDLINE-20261011 项1）本表加载位（index.html 第 11 位）晚于 refinement.css（第 2 位）：
   原先在此把提交钮退回 position:absolute/right/bottom/z-index:2，等于把 refinement.css:5340 已验收的
  「卡态执行钮脱离 textarea 命中面=box 分栏正常流」又盖了回去——钮压回 textarea 命中面上，长文本与钮
   争同一块像素。现按同一方案落地：提示词与钮同行两列（textarea flex:1|min-width:0 + 钮独立列 static），
   文本不可能覆盖钮，钮也永不覆盖文本/滚动条；不加 JS、不改整卡布局、不触碰 pill/expanded 面。 */
.generator-body.gen-compact .gen-compact-content {
  height: auto;
  flex: 0 0 auto;
  gap: 6px;
}
.generator-body.gen-compact .gen-prompt-box {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 0 0 auto;
  min-height: 0;
}
.generator-body.gen-compact .gen-prompt-box textarea[data-gen-prompt] {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 64px;
  max-height: none;
  margin: 0;
  padding: 6px 10px;
  overflow: hidden;
  resize: none;
}
.generator-body.gen-compact .gen-prompt-box textarea[data-gen-prompt]:focus {
  outline: 1px solid var(--accent-ui);
  outline-offset: 0;
  box-shadow: none;
}
.generator-body.gen-compact .gen-prompt-box [data-gen-exec] {
  position: static;
  flex: 0 0 auto;
  align-self: center;
  z-index: auto;
  width: 24px;
  height: 24px;
  margin: 5px;
  opacity: 1;
  pointer-events: auto;
}

/* Pill body: click to expand, drag to move; never a resize affordance. */
.canvas-card.g5-pill > .gen-pill { cursor: grab; }

/* Text reuses the compact generator; image-only controls retain their stored values. */
.generator-body.g5-text-mode [hidden] { display:none !important; }
.generator-body.g5-text-mode .gen-status { display:block; white-space:normal; overflow-wrap:anywhere; }
.generator-body.g5-text-mode [data-gen-text-adopt] { margin-inline-start:8px; }

/* The public submit control lives in gen-controls. Both pointer and keyboard focus get the same visible block. */
.canvas-card .generator-body.gen-compact .gen-composer .gen-controls > [data-gen-exec]:hover,
.canvas-card .generator-body.gen-compact .gen-composer .gen-controls > [data-gen-exec]:focus-visible {
  background: var(--accent-ui, #1d4ed8);
  color: var(--surface, #fff);
}

/* R78 shared API-only model picker. The host-owned native select is the sole value store. */
.api-model-picker { position:relative; display:flex; flex:1 1 auto; min-width:0; width:100%; }
.api-model-picker > select[data-generation-model] { position:absolute; width:1px !important; height:1px; opacity:0; pointer-events:none; padding:0; border:0 !important; }
.api-model-picker > [data-api-picker-open] { width:100%; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; padding:4px 6px; border:1px solid var(--hairline,var(--u6-line,#dedcd3)); border-radius:6px; color:var(--ink-1,var(--u6-ink,#33362f)); background:var(--surface,#fbfaf5); font:inherit; cursor:pointer; }
.api-model-popup { position:fixed; inset:auto; margin:0; box-sizing:border-box; width:min(480px,calc(100vw - 16px)); max-height:min(520px,calc(100vh - 16px)); padding:12px; overflow:auto; color:var(--ink-1,var(--u6-ink,#33362f)); background:var(--surface,#fbfaf5); border:1px solid var(--hairline,var(--u6-line,#dedcd3)); border-radius:12px; font:12px/1.5 var(--font-ui,system-ui); }
.api-model-popup::backdrop { background:transparent; }
.api-model-popup header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.api-model-popup header button { border:0; background:transparent; color:inherit; font-size:20px; cursor:pointer; }
.api-model-popup input[type=search] { width:100%; box-sizing:border-box; padding:8px; color:inherit; background:var(--surface-soft,var(--chip-bg,#f4f2ea)); border:1px solid var(--hairline,var(--u6-line,#dedcd3)); border-radius:6px; font:inherit; }
.api-model-filters { display:flex; gap:8px; margin-top:8px; }
.api-model-filters select { flex:1; min-width:0; padding:6px; font:inherit; color:inherit; background:var(--surface,#fbfaf5); border:1px solid var(--hairline,var(--u6-line,#dedcd3)); border-radius:6px; }
.api-model-compare { display:flex; gap:8px; align-items:center; color:var(--ink-2,var(--u6-ink-soft,#696b65)); }
.api-model-compare button { font:inherit; padding:4px 8px; color:inherit; background:var(--surface-soft,var(--chip-bg,#f4f2ea)); border:1px solid var(--hairline,var(--u6-line,#dedcd3)); border-radius:6px; }
.api-model-popup h3 { font-size:12px; color:var(--ink-2,var(--u6-ink-soft,#696b65)); margin:16px 0 6px; }
.api-model-popup [data-api-model-choice] { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:10px 8px; margin:2px 0; border:0; border-radius:6px; text-align:left; color:inherit; background:transparent; font:inherit; cursor:pointer; }
.api-model-popup [data-api-model-choice] strong,.api-model-popup [data-api-model-choice] small { display:block; }
.api-model-popup [data-api-model-choice] small,.api-model-note { color:var(--ink-2,var(--u6-ink-soft,#696b65)); font-size:11px; }
.api-model-popup [data-api-model-choice][aria-pressed=true],.api-model-popup [data-api-model-choice]:hover:not(:disabled) { background:var(--surface-soft,var(--chip-bg,#f4f2ea)); }
.api-model-popup [data-api-model-choice]:disabled { cursor:not-allowed; }
.api-model-popup [data-api-model-price] { flex:0 0 auto; color:var(--ink-2,var(--u6-ink-soft,#696b65)); font-size:11px; }
.api-model-popup button:focus-visible,.api-model-popup input:focus-visible,.api-model-popup select:focus-visible,[data-api-picker-open]:focus-visible { outline:2px solid var(--accent,var(--u6-pick-deep,#2e6b4f)); outline-offset:2px; }

/* Expanded shell uses the 22px cap above (half the 44px pill height).
   An unbounded radius here scales with the full prompt height and pinches its sides. */

/* PILLFIX-R1（task_57788c341f0b，msg_69c8cef4fa47 指定方向）：相位长文可收缩——uiopt-r5.css:34 的 flex:0 0 auto+nowrap 使 unknown 完整工程句（真实任务待核实·任务号·免责声明）不可缩，把 flex:0 0 26px 的提交钮推出卡右缘=用户第二张截图裁切根因；本卡窄行内改 min-width:0+ellipsis，完整事实（含任务号）保留在相位 span title 与展开卡 gen-status，不删可查依据 */
.g5-pill-phase { flex: 0 0 auto; white-space: nowrap; overflow: visible; }
.gen-pill.g5-pill-r2 .g5-pill-digest { min-width: 0; }
.gen-pill.g5-pill-r2 .g5-pill-wf { max-width: 38%; overflow: hidden; text-overflow: ellipsis; }

/* Keep the 6px visual gap inside the reference preview hover target. */
.g5-hover-open > .g5-pop.g5-pop-inline .g5-pop-up::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 6px;
}

/* Keep the running/unknown status readable beside the prompt digest. */
.gen-pill.g5-pill-r2 .g5-pill-phase:not(:empty) { font-size: 12px; font-weight: 600; padding: 2px 6px; border-radius: 5px; background: var(--chip-bg); }

/* ── W210-R2（task_d9384cafd204）聚焦框贴合胶囊（仅 T5；T6 进度本票不实现，无动画/无满宽洗）──
   实证（r2/probe-frame.cjs 双腿+ringScan）：用户矩形外框 = .g5-running 箍（genpill-r2.css:10
   box-shadow 0 0 0 1.5px accent-ui 金）画在零圆角 .gen-pill.g5-pill-r2 上；conn-handle 近距 .on 态
   （main.js:13354 指针近卡 ±28px 加 .on，user-three-ui.css:215 :has(.conn-handle.on) 放开卡壳
   overflow）使箍越出 999px 胶囊壳可见为直角矩形（hover 弹层态在 genpill-r2.css:46-48 本就
   radius 999+box-shadow:none，非此态）。修复=补胶囊圆角，箍随形；纯 paint，几何/命中零改。 */
.gen-pill.g5-pill-r2 { border-radius: 999px; }

/* 20261017 user feedback: one stable cancel control in the submit position. */
.gen-pill.g5-pill-r2 > button.g5-pill-stop {
  flex: 0 0 26px; width: 26px; min-width: 26px; height: 26px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 !important; margin-left: 0 !important; font-size: 0 !important;
  white-space: nowrap; box-sizing: border-box;
}
.gen-pill.g5-pill-r2 > button.g5-pill-stop::before {
  content: ''; width: 9px; height: 9px; border-radius: 1px; background: currentColor;
}
.gen-pill.g5-pill-r2 > button.g5-pill-stop + button.g5-pill-submit { display: none; }

/* Shared model menu: explicit source buttons inside the dropdown. */
.model-source-tabs{display:flex;gap:4px;margin:0 0 10px;padding:3px;border:1px solid var(--hairline,#dedcd3);border-radius:8px}
.model-source-tabs button{flex:1;padding:7px 12px;border:0;border-radius:5px;background:transparent;color:inherit;font:inherit;cursor:pointer}
.model-source-tabs button[aria-pressed="true"]{background:var(--ink-1,#33362f);color:var(--surface,#fbfaf5)}
.model-source-tabs button:focus-visible{outline:2px solid var(--accent,#9b721d);outline-offset:1px}

/* Editor shares the canvas option rows and interaction, placed in top layer. */
.g5-lb-editor { position: absolute; z-index: 10; box-sizing: border-box; padding: 4px; overflow-x: hidden; overflow-y: auto; border: 1px solid var(--line, #d9d4c8); border-radius: 8px; background: var(--surface, #fffdf9); box-shadow: 0 10px 24px rgba(20, 24, 22, .18); color: var(--ink, #2b2b28); font-size: 11px; line-height: 1.35; text-align: left; }
.g5-lb-editor .g5-lb-group { display: block; }
.g5-lb-editor .g5-lb-glabel { padding: 3px 6px 2px; font-size: 10px; opacity: .72; }
.g5-lb-editor .g5-lb-row { display: block; padding: 4px 6px; border-radius: 5px; white-space: normal; overflow-wrap: anywhere; word-break: break-word; cursor: pointer; }
.g5-lb-editor .g5-lb-row + .g5-lb-row { margin-top: 1px; }
.g5-lb-editor .g5-lb-row:hover, .g5-lb-editor .g5-lb-row.is-active { background: color-mix(in srgb, var(--accent-ui, #3f6f5f) 22%, var(--surface, #fffdf9)); }
.g5-lb-editor .g5-lb-row.is-selected { font-weight: 600; }
.g5-lb-editor .g5-lb-row.is-disabled { cursor: not-allowed; opacity: .5; }
.g5-lb-editor .g5-lb-text { display: block; }

.g5-lb-editor{pointer-events:auto;}