/* leeda/v3/ui — 共享视觉令牌 (doc 37 §5A / v2.1 重设计) + 前缀化类名 (lui-*, 非 SFC scoped)。
   三端共用 (Hub web / ext / Run WebView2)。注入浮窗场景挂 Shadow DOM 时一并注入本 CSS。
   v2.1: 深色侧栏 token, 三类 tag 色, entity value 右对齐, hover-only copy, div汤折叠。 */
:root {
  /* v2.1 深色面板 token (doc 37 §5A.1) */
  --lui-panel-bg:      #0e141d;
  --lui-panel-border:  #28323f;
  --lui-card-bg:       #151c27;
  --lui-card-border:   #283341;
  --lui-card-active:   #15b8a1;
  --lui-accent:        #15b8a1;   /* teal 主色 */
  --lui-accent-ink:    #04231e;
  --lui-accent-blue:   #5aa9ff;
  --lui-divider:       #232d3a;
  --lui-text-1:        #eaf0f6;
  --lui-text-2:        #cdd6e0;
  --lui-text-gray:     #8b98a8;
  --lui-text-muted:    #566273;
  --lui-tag-whole-bg:  rgba(78,201,212,.16);
  --lui-tag-whole-fg:  #4ec9d4;
  --lui-tag-sec-bg:    rgba(224,168,92,.16);
  --lui-tag-sec-fg:    #e0a85c;
  --lui-tag-field-bg:  rgba(127,207,138,.15);
  --lui-tag-field-fg:  #7fcf8a;
  --lui-human-dot:     #46d369;
  --lui-danger:        #e0564a;
  --lui-icon-btn-bg:   #1a2330;
  --lui-icon-btn-bd:   #2a3543;

  /* legacy aliases (Hub/Run backward compat) */
  --lui-bg:    #0e141d;
  --lui-fg:    #eaf0f6;
  --lui-mut:   #8b98a8;
  --lui-line:  #232d3a;
  --lui-card:  #151c27;
  --lui-gold:  #ffd24a;
  --lui-cyan:  #15b8a1;
  --lui-green: #46d369;
  --lui-blue:  #5aa9ff;
  --lui-red:   #e0564a;
}

/* ── 粒度树 ── */
.lui-ti { font-size: 12px; font-family: 'Noto Sans JP', 'Noto Sans SC', system-ui, sans-serif; }
.lui-row {
  display: flex; align-items: center; gap: 6px;
  padding: 3px 4px; border-radius: 6px;
  position: relative;  /* for hover-only actions */
}
.lui-row.lui-sug { background: rgba(90,169,255,.1); box-shadow: inset 0 0 0 1px rgba(90,169,255,.3); }
.lui-row:hover { background: rgba(255,255,255,.05); }
.lui-caret { width: 12px; flex: none; cursor: pointer; color: var(--lui-text-muted); font-size: 10px; user-select: none; }
.lui-caret.lui-ph { cursor: default; }

/* Tag badges: [整体] / [题] / [字段] */
.lui-lvl { font-size: 9px; font-weight: 700; padding: 1px 5px; border-radius: 4px; flex: none; white-space: nowrap; }
.lui-lvl-document  { background: var(--lui-tag-whole-bg); color: var(--lui-tag-whole-fg); }
.lui-lvl-section   { background: var(--lui-tag-sec-bg);   color: var(--lui-tag-sec-fg);   font-size: 9px; }
.lui-lvl-entity    { background: var(--lui-tag-field-bg); color: var(--lui-tag-field-fg); font-size: 9px; }
.lui-lvl-paragraph { background: #ffffff12; color: #8b98a8; }
.lui-lvl-sentence  { background: #ffffff10; color: #6c7888; }

/* Label + value layout */
.lui-lbl {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--lui-text-1); font-weight: 400;
}
.lui-row-entity .lui-lbl { font-size: 12px; font-weight: 400; color: var(--lui-text-2); }
/* Value (entity right-aligned gray) */
.lui-val {
  flex: none; max-width: 52%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 12px; color: var(--lui-text-gray); text-align: right;
}
/* Collapsed preview text (section/document when folded — same visual as value but auto-margin) */
.lui-preview {
  margin-left: auto; flex: none; max-width: 55%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 12px; color: var(--lui-text-gray); text-align: right;
}
/* Checkbox in selectable (backup card) mode */
.lui-chk {
  flex: none; width: 13px; height: 13px; margin: 0; cursor: pointer;
  accent-color: var(--lui-accent);
}

.lui-badge { font-size: 9px; padding: 0 5px; border-radius: 4px; background: rgba(21,184,161,.2); color: var(--lui-accent); }

/* Actions: fill button always visible; copy button hover-only */
.lui-acts { display: flex; gap: 4px; flex: none; }
.lui-mini {
  font-size: 10px; padding: 1px 6px;
  border: 1px solid var(--lui-card-border); border-radius: 5px;
  background: var(--lui-icon-btn-bg); color: var(--lui-text-2); cursor: pointer;
}
.lui-mini:hover { background: rgba(21,184,161,.2); border-color: var(--lui-accent); }
/* 📋 copy: hidden by default, show on row hover */
.lui-copy-hover { opacity: 0; transition: opacity .15s; }
.lui-row:hover .lui-copy-hover { opacity: 1; }
/* #165 (RF7) per-row [删除] (删本行/本层): hidden by default, show on row hover; red on hover */
.lui-del-hover { opacity: 0; transition: opacity .15s; }
.lui-row:hover .lui-del-hover { opacity: 1; }
.lui-del-hover:hover { background: rgba(224,86,74,.15); border-color: rgba(224,86,74,.5); color: #e0786e; }
/* RF-Z3 (#192, doc46 §7): zone=other rows — greyed; [→主要区域] promote shows on row hover */
.lui-other { opacity: .55; }
.lui-other .lui-lbl, .lui-other .lui-val { color: var(--lui-text-2); }
.lui-promote-hover { opacity: 0; transition: opacity .15s; }
.lui-row:hover .lui-promote-hover { opacity: 1; }
.lui-promote-hover:hover { background: rgba(21,184,161,.2); border-color: var(--lui-accent); color: var(--lui-accent); }
/* #165 hover-copy: selection highlight + copy-mode container (cursor:copy, suppress native selection) */
.lui-hl { background: rgba(21,184,161,.18); box-shadow: inset 0 0 0 1px rgba(21,184,161,.45); border-radius: 4px; }
.lui-copymode { cursor: copy; user-select: none; }
.lui-copymode .lui-acts, .lui-copymode .lui-caret { cursor: default; }

.lui-smp {
  margin: 0 0 2px 26px; font-size: 10px;
  color: var(--lui-text-muted); font-style: italic;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.lui-kids {
  margin-left: 9px; border-left: 1px solid var(--lui-divider); padding-left: 10px;
}
.lui-more { cursor: pointer; color: var(--lui-accent); font-size: 11px; padding: 4px 20px; font-weight: bold; }

/* ── provenance 徽章 ── */
.lui-prov { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; padding: 1px 6px; border-radius: 5px; background: rgba(255,255,255,.06); }
.lui-prov-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--lui-text-muted); }
.lui-prov-human .lui-prov-dot { background: var(--lui-human-dot); }
.lui-prov-human { color: var(--lui-human-dot); }
.lui-prov-machine .lui-prov-dot { background: var(--lui-blue); }
.lui-prov-machine { color: var(--lui-blue); }
.lui-prov-ai .lui-prov-dot { background: var(--lui-gold); }
.lui-prov-ai { color: var(--lui-gold); }

/* ── 候选列表 ── */
.lui-cands-h { font-size: 10px; color: var(--lui-text-muted); margin-bottom: 5px; }
.lui-cands-h b { color: var(--lui-accent); }
.lui-cand {
  display: flex; align-items: center; gap: 8px;
  width: 100%; text-align: left; margin-bottom: 4px;
  padding: 6px 8px; border: 1px solid var(--lui-card-border);
  border-radius: 7px; background: var(--lui-card-bg);
  color: var(--lui-text-1); cursor: pointer; font-size: 12px;
}
.lui-cand:hover { background: rgba(21,184,161,.1); border-color: rgba(21,184,161,.4); }
.lui-ck {
  flex: none; width: 18px; height: 18px; line-height: 18px; text-align: center;
  border-radius: 5px; background: rgba(21,184,161,.15); color: var(--lui-accent);
  font-weight: 800; font-size: 11px;
}
.lui-cv { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: 'Noto Sans JP', ui-monospace, monospace; }

/* ── 四槽位审查卡 ── */
.lui-card { background: var(--lui-card-bg); border: 1px solid var(--lui-card-border); border-radius: 10px; padding: 10px; color: var(--lui-text-1); }
.lui-card-h { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.lui-card-title { flex: 1; font-weight: 800; font-size: 14px; }
.lui-stage { font-size: 10px; padding: 1px 7px; border-radius: 5px; background: var(--lui-gold); color: #1a1a26; font-weight: 700; }
.lui-stage-half_auto { background: #ffb24a; }
.lui-stage-full_auto { background: var(--lui-green); color: #fff; }
.lui-trust { font-size: 10px; padding: 1px 6px; border-radius: 5px; background: rgba(21,184,161,.15); color: var(--lui-accent); }
.lui-slot { margin: 8px 0; }
.lui-slot-h { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: var(--lui-text-muted); display: flex; gap: 6px; align-items: center; margin-bottom: 4px; }
.lui-slot-n { background: var(--lui-gold); color: #1a1a26; border-radius: 8px; padding: 0 6px; font-weight: 700; }
.lui-slot-b { display: flex; flex-direction: column; gap: 3px; }
.lui-step { display: flex; gap: 8px; font-size: 12px; }
.lui-op { color: var(--lui-accent); font-family: ui-monospace, monospace; min-width: 90px; }
.lui-step-name { color: var(--lui-text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lui-var { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.lui-var-k { color: var(--lui-gold); font-family: ui-monospace, monospace; min-width: 110px; }
.lui-var-in { flex: 1; padding: 3px 6px; border: 1px solid var(--lui-card-border); border-radius: 5px; background: var(--lui-icon-btn-bg); color: #fff; }
.lui-var-v { flex: 1; color: var(--lui-text-2); }
.lui-req { font-size: 9px; color: var(--lui-danger); }
.lui-appr { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.lui-appr-r { flex: 1; color: var(--lui-gold); }
.lui-btn-ok, .lui-btn-no { font-size: 11px; padding: 1px 8px; border-radius: 5px; border: 1px solid var(--lui-card-border); cursor: pointer; }
.lui-btn-ok { background: rgba(21,184,161,.2); color: var(--lui-accent); }
.lui-btn-no  { background: rgba(224,86,74,.15); color: var(--lui-danger); }
.lui-exc { font-size: 11px; color: var(--lui-text-muted); font-family: ui-monospace, monospace; }
.lui-card-acts { display: flex; gap: 8px; margin-top: 10px; }
.lui-adopt, .lui-promote { flex: 1; padding: 8px; border: 0; border-radius: 8px; color: #fff; font-weight: 700; cursor: pointer; }
.lui-adopt  { background: linear-gradient(120deg, #0faa96, #15b8a1); }
.lui-promote { background: linear-gradient(120deg, #4a8fe0, #15b8a1); }

/* ── 采纳卡 ── */
.lui-adopt-card { padding: 10px; border-radius: 10px; background: rgba(21,184,161,.08); border: 1px solid rgba(21,184,161,.3); }
.lui-adopt-txt { font-size: 12px; line-height: 1.5; margin-bottom: 8px; }
.lui-adopt-txt b { color: var(--lui-accent); }
.lui-adopt-d { font-size: 11px; color: var(--lui-text-muted); margin-top: 4px; }
.lui-adopt-btn { width: 100%; padding: 7px; border: 0; border-radius: 7px; background: var(--lui-accent); color: var(--lui-accent-ink); font-weight: 700; cursor: pointer; }
.lui-adopt-btn:disabled { opacity: .6; }

/* ── MappingEditor ── */
.lui-mp { font-size: 12px; }
.lui-mp-empty { color: var(--lui-text-muted); padding: 8px 4px; }
.lui-mp-rule { display: flex; align-items: center; gap: 6px; padding: 5px 6px; margin-bottom: 4px; border: 1px solid var(--lui-card-border); border-radius: 7px; background: var(--lui-card-bg); }
.lui-mp-src { color: var(--lui-text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 44%; }
.lui-mp-arrow { color: var(--lui-accent); flex: none; font-size: 11px; }
.lui-mp-sink { flex: 1; color: var(--lui-text-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lui-mp-conf { flex: none; font-size: 10px; padding: 0 5px; border-radius: 4px; }
.lui-mp-hi { color: #46d369; background: rgba(70,211,105,.15); }
.lui-mp-mid { color: #ffd24a; background: rgba(255,210,74,.15); }
.lui-mp-lo { color: var(--lui-danger); background: rgba(224,86,74,.12); }
.lui-mp-x { flex: none; background: rgba(224,86,74,.12); border: 1px solid rgba(224,86,74,.3); color: var(--lui-danger); border-radius: 5px; cursor: pointer; font-size: 11px; line-height: 1; padding: 1px 5px; }
.lui-mp-x:hover { background: rgba(224,86,74,.25); }
.lui-mp-cols { display: flex; gap: 8px; margin-top: 8px; }
.lui-mp-col { flex: 1; }
.lui-mp-h { font-size: 10px; color: var(--lui-text-muted); margin-bottom: 4px; }
.lui-mp-item { display: block; width: 100%; text-align: left; margin-bottom: 3px; padding: 4px 6px; border: 1px solid var(--lui-card-border); border-radius: 6px; background: var(--lui-card-bg); color: var(--lui-text-2); cursor: pointer; font-size: 11px; }
.lui-mp-item.on { border-color: var(--lui-accent); background: rgba(21,184,161,.12); }
.lui-mp-item:disabled { opacity: .5; cursor: default; }