/* CONTENT-BLAME-ENGINE-01 step 8 — Content Viewer provenance (blame) view.
   Lives inside the existing 480px .assistant-overlay (no second surface). Lane colors
   reuse the dashboard's canonical three-state tokens (--st-auto / --st-assisted /
   --st-manual, defined in lib/tokens.css). No unattributed band: the renderer folds
   no-observed-author spans into Human (three-way vocabulary, Shane 2026-07-11). */

.cb-root { padding: 12px 15px 20px; font-size: 12.5px; color: var(--eu-text); }
.cb-empty { padding: 20px 15px; color: var(--eu-muted, #5c6878); font-size: 12px; }

/* score header + three-state bar */
.cb-score { margin-bottom: 10px; }
.cb-scorehead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.cb-pred {
  font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px;
  border: 1px solid var(--eu-border); background: var(--eu-panel-2); color: var(--eu-text);
}
.cb-pred.ai { color: var(--st-auto); border-color: color-mix(in srgb, var(--st-auto) 45%, var(--eu-border)); }
.cb-pred.ai-assisted, .cb-pred.mixed { color: var(--st-assisted); border-color: color-mix(in srgb, var(--st-assisted) 45%, var(--eu-border)); }
.cb-pred.human { color: var(--st-manual); border-color: color-mix(in srgb, var(--st-manual) 45%, var(--eu-border)); }
.cb-cov { font-size: 11px; color: var(--eu-muted-2, #8a93a3); }
.cb-bar {
  display: flex; height: 8px; border-radius: 4px; overflow: hidden;
  background: var(--eu-panel-2); border: 1px solid var(--eu-border);
}
.cb-seg { display: block; height: 100%; }
.cb-seg.ai, .cb-lstat.ai .sw, .cb-badge.ai .sw { background: var(--st-auto); }
.cb-seg.ai_mod, .cb-lstat.ai_mod .sw { background: var(--st-assisted); }
.cb-seg.ai_light, .cb-lstat.ai_light .sw { background: color-mix(in srgb, var(--st-assisted) 50%, var(--eu-panel-2)); }
.cb-seg.human, .cb-lstat.human .sw, .cb-badge.human .sw { background: var(--st-manual); }
.cb-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; }
.cb-lstat { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--eu-muted, #5c6878); }
.cb-lstat .sw { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }
.cb-lstat .n { color: var(--eu-muted-2, #8a93a3); }

/* (badge pills removed 2026-07-10 — redundant with the bar legend + Attribution gutter) */

/* the colored document — per-word provenance.
   Treatment matches the DEV/CODE diff blocks the dashboard already speaks
   (.dv-diff .da/.dd — flat background tints, no underlines; Shane 2026-07-09). */
.cb-doc {
  white-space: pre-wrap; overflow-wrap: break-word; line-height: 1.7;
  font-size: 12.5px; color: var(--eu-text);
  border-top: 1px solid var(--eu-border); padding-top: 12px;
}
.cb-w {
  border-radius: 2px; padding: 1px 2px; cursor: default;
  box-decoration-break: clone; -webkit-box-decoration-break: clone; /* wrapped runs stay solid blocks */
}
.cb-w.ai { background: color-mix(in srgb, var(--st-auto) 24%, transparent); }
.cb-w.ai_mod { background: color-mix(in srgb, var(--st-assisted) 22%, transparent); }
.cb-w.ai_light { background: color-mix(in srgb, var(--st-assisted) 11%, transparent); }
.cb-w.human { background: transparent; }
.cb-w:hover { outline: 1px solid var(--eu-border); }
.cb-w.cb-linked { cursor: pointer; }
.cb-w.cb-linked:hover { outline: 1px solid var(--eu-accent, #2660d6); }

/* view toggle (Highlight | Blame) */
.cb-views { display: inline-flex; gap: 0; margin: 2px 0 10px; border: 1px solid var(--eu-border); border-radius: 6px; overflow: hidden; }
.cb-view-btn {
  border: none; background: var(--eu-panel-2); color: var(--eu-muted, #5c6878);
  font-size: 10.5px; font-weight: 600; padding: 3px 10px; cursor: pointer;
}
.cb-view-btn + .cb-view-btn { border-left: 1px solid var(--eu-border); }
.cb-view-btn.on { background: var(--eu-accent-soft); color: var(--eu-accent, #2660d6); }

/* Attribution view (git-blame-style gutter): per-line author annotation, grouped like
   git blame. Sets its own text color — inheriting the page default was unreadable in
   dark mode (black-on-black, Shane 2026-07-09). */
.cb-blame {
  border-top: 1px solid var(--eu-border); padding-top: 10px;
  font-size: 12px; line-height: 1.55; color: var(--eu-text);
}
.cb-bl-row { display: flex; align-items: baseline; }
.cb-bl-row:hover .cb-bl-line { background: var(--eu-panel-2); }
.cb-bl-gutter {
  flex: none; width: 176px; padding: 0 8px 0 2px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 9.5px; line-height: inherit;
  color: var(--eu-muted, #5c6878); border-right: 2px solid var(--eu-border);
  display: inline-flex; align-items: center; gap: 5px;
}
.cb-bl-gutter .sw { width: 7px; height: 7px; border-radius: 2px; flex: none; }
.cb-bl-gutter .when { color: var(--eu-muted-2, #8a93a3); margin-left: auto; }
.cb-bl-gutter.cb-linked { cursor: pointer; }
.cb-bl-gutter.cb-linked:hover { color: var(--eu-accent, #2660d6); }
.cb-bl-row.ai .cb-bl-gutter { border-right-color: var(--st-auto); }
.cb-bl-row.ai .cb-bl-gutter .sw { background: var(--st-auto); }
.cb-bl-row.ai_mod .cb-bl-gutter { border-right-color: var(--st-assisted); }
.cb-bl-row.ai_mod .cb-bl-gutter .sw { background: var(--st-assisted); }
.cb-bl-row.ai_light .cb-bl-gutter { border-right-color: color-mix(in srgb, var(--st-assisted) 50%, var(--eu-panel-2)); }
.cb-bl-row.ai_light .cb-bl-gutter .sw { background: color-mix(in srgb, var(--st-assisted) 50%, var(--eu-panel-2)); }
.cb-bl-row.human .cb-bl-gutter { border-right-color: var(--st-manual); }
.cb-bl-row.human .cb-bl-gutter .sw { background: var(--st-manual); }
.cb-bl-line { flex: 1; min-width: 0; padding-left: 10px; white-space: pre-wrap; overflow-wrap: break-word; }
/* diff-style band tints (Shane 2026-07-10: the document body must carry the band color,
   like added lines in a diff). The wash rides the inline .cb-bl-txt so it hugs the text —
   full-width block washes made one-token source lines (temps listings) look like bars. */
.cb-bl-txt { border-radius: 2px; padding: 1px 2px; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.cb-bl-row.ai .cb-bl-txt { background: color-mix(in srgb, var(--st-auto) 13%, transparent); }
.cb-bl-row.ai_mod .cb-bl-txt { background: color-mix(in srgb, var(--st-assisted) 12%, transparent); }
.cb-bl-row.ai_light .cb-bl-txt { background: color-mix(in srgb, var(--st-assisted) 6%, transparent); }
.cb-bl-row:hover .cb-bl-txt { filter: brightness(1.08); }
/* minority words inside a line (band differs from the line's dominant): word-level tint on
   top of the wash. Human minorities get the manual-gray tint so they pop out of AI lines. */
.cb-bl-line .cb-w.cb-min.human { background: color-mix(in srgb, var(--st-manual) 30%, transparent); }

/* walkthrough badge (has a responseRef) + journey-drawer mini strip */
.cb-mini { margin-top: 6px; }
.cb-mini-label {
  font-size: 9px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--eu-muted-2, #8a93a3);
}
.cb-bar.cb-bar-mini { height: 5px; margin-top: 3px; }
.cb-mini .cb-legend { margin-top: 4px; gap: 3px 10px; }

/* AI-detected — its own evidence class (spec §10): hatched purple, never the flat
   observed-AI wash. Applies across bar segments, legend, highlight runs, gutter rows. */
.cb-seg.ai_detected, .cb-lstat.ai_detected .sw {
  background: repeating-linear-gradient(45deg, var(--st-auto) 0 3px, color-mix(in srgb, var(--st-auto) 30%, transparent) 3px 6px);
}
.cb-w.ai_detected {
  background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--st-auto) 26%, transparent) 0 6px, color-mix(in srgb, var(--st-auto) 10%, transparent) 6px 12px);
}
.cb-bl-row.ai_detected .cb-bl-gutter { border-right-color: var(--st-auto); border-right-style: dashed; }
.cb-bl-row.ai_detected .cb-bl-gutter .sw {
  background: repeating-linear-gradient(45deg, var(--st-auto) 0 2px, transparent 2px 4px);
}
.cb-bl-row.ai_detected .cb-bl-txt {
  background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--st-auto) 16%, transparent) 0 6px, color-mix(in srgb, var(--st-auto) 6%, transparent) 6px 12px);
}

/* AGENTMAPS-BLAME-ROLLUP-01 (UI) — "Share of Work" corpus rollup card, top of the Live page's
   Content + Data column (#cdShareWork in dashboard.js). Reuses the canonical lane vocabulary
   above (.cb-bar / .cb-seg / .cb-lstat + the --st-* three-state tokens), so light/dark theming
   and lane colors stay single-sourced. Card-only additions below. */
.cd-sharework { padding: 10px 14px 12px; border-bottom: 1px solid var(--eu-border); }
.cd-sharework .sw-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.cd-sharework .sw-title {
  font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--eu-muted, #5c6878);
}
.cd-sharework .cb-views.sw-wt { margin: 0; }
.cd-sharework .cb-views.sw-wt .cb-view-btn { padding: 2px 8px; font-size: 10.5px; }
.cd-sharework .sw-row + .sw-row { margin-top: 10px; }
.cd-sharework .sw-row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 5px; }
.cd-sharework .sw-name {
  font-size: 12px; font-weight: 600; color: var(--eu-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cd-sharework .sw-cov { font-size: 11px; color: var(--eu-muted-2, #8a93a3); white-space: nowrap; flex-shrink: 0; }
.cd-sharework .sw-note { font-size: 11.5px; color: var(--eu-muted, #5c6878); }