/* Review Workbench layout: worklist | document viewer | chat, injected as
   siblings of Chainlit's PanelGroup by panels.js. Class prefix: wb-. Themable via
   Chainlit's HSL CSS vars so it follows the light/dark palette. */

#wb-layout-wrapper {
  display: flex;
  flex: 1;
  height: 100%;
  overflow: hidden;
  font-family: var(--font-sans);
  /* One hairline across the full layout width, above the viewer's tab strip. */
  border-top: 1px solid hsl(var(--border));
}

#wb-worklist {
  flex: 0 0 260px;
  min-width: 180px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-right: 1px solid hsl(var(--border));
  padding: 0.5rem;
  font-size: 0.9rem;
}
#wb-worklist > :not(#wb-rows) { flex-shrink: 0; }
#wb-rows {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-gutter: stable;
}

#wb-doc-viewer {
  flex: 0 0 45%;
  min-width: 240px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-right: 1px solid hsl(var(--border));
  /* A type with no configured colour is grey — never inherited from a neighbour. The
     navigation's tiles and the toolbar's document badge both fall back to it. */
  --wb-nav-page-fill-default: #bfbfbf;
  --wb-nav-ink-default: #000000;
}
/* The navigation sits above the viewed content or docks beside it as a full-height
   rail. The navigation host stays first in the markup either way, and nothing is moved
   between the positions, so the content's scroll container keeps its node and offset. */
#wb-doc-viewer[data-nav-position="left"] {
  flex-direction: row;
}
#wb-doc-viewer[data-nav-position="right"] {
  flex-direction: row-reverse;
}
/* Toolbar, status strips and the page/result scroller: the content the navigation
   drives. The toolbar stays attached to it in every position. */
.wb-dv-content {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* Document-viewer toolbar beside the content: the active scope on the left, the current
   source page, the navigation position and the zoom toggle pinned right. The scope and
   page lines start from no width, so a long scope (an Audit document's full description
   and reference) truncates first and the page line gets its full text before the scope
   takes the rest. The two controls never shrink; when a narrow viewer cannot fit them
   on one line they wrap onto the next rather than overlap. The position selector
   carries no visible label: its three choices say what it does, and its accessible
   name and hover text carry the rest. */
.wb-dv-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  padding: 4px 14px;
  min-height: 44px;
  box-sizing: border-box;
  flex-shrink: 0;
}

.wb-dv-page {
  flex: 1000 1 0;
  max-width: max-content;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
  opacity: 0.7;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.wb-dv-toolbar:has(.wb-preaudit-items) .wb-dv-scope:empty,
.wb-dv-toolbar:has(.wb-preaudit-items) .wb-dv-page:empty { display: none; }
.wb-dv-position {
  flex-shrink: 0;
}
.wb-dv-position,
.wb-dv-zoom,
.wb-dv-toolbar .wb-preaudit-group-toggle {
  height: 26px;
  box-sizing: border-box;
}
.wb-dv-toolbar .wb-preaudit-group-toggle {
  flex: 0 0 44px;
  width: 44px;
}
.wb-dv-toolbar .wb-preaudit-group-toggle .wb-developer-toggle-thumb {
  width: 18px;
  height: 18px;
}
.wb-dv-toolbar .wb-preaudit-group-toggle.wb-active .wb-developer-toggle-thumb {
  transform: translateX(18px);
}
.wb-preaudit-group-toggle[hidden] { display: none; }
.wb-preaudit-group-toggle:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.wb-dv-zoom {
  flex-shrink: 0;
  border: 1px solid hsl(var(--border));
  border-radius: 4px;
  background: none;
  color: inherit;
  cursor: pointer;
  padding: 3px 8px;
  font-size: 14px;
  transition: background 0.15s;
}
.wb-dv-zoom:hover {
  background: hsl(var(--muted));
}

/* Scroll container holding the page images or the Bericht diff table */
.wb-dv-scroll {
  flex: 1;
  overflow-y: auto;
  /* No top padding: the content sits as close to the toolbar as the toolbar sits
     to the hairline above it (the toolbar already supplies that gap). */
  padding: 0 0.5rem 0.5rem;
  position: relative; /* page slots' offsetTop is measured against this container */
  background: hsl(var(--background));
}
.wb-dv-pageslot {
  display: flex;
  justify-content: center;
  margin-bottom: 0.5rem;
}

.wb-resize-handle {
  flex: 0 0 6px;
  cursor: col-resize;
  position: relative;
}
.wb-resize-handle::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: hsl(var(--border));
}

/* Give the chat column the remaining width. */
#wb-layout-wrapper > [data-panel-group-direction="horizontal"] {
  flex: 1;
  min-width: 0 !important;
  width: 0;
}

/* Hide protected chat immediately, including when its socket is unavailable. */
#wb-layout-wrapper.wb-access-revoked > [data-panel-group-direction="horizontal"] {
  visibility: hidden;
}

/* Chainlit 2.9.6 renders the transcript as two nested vertical scroll containers.
   In the three-column Workbench the outer one can consume wheel events after the
   inner transcript reaches its end, moving the complete transcript above an empty
   area while the composer stays fixed. Keep the inner container as the only scroll
   owner. `clip` also prevents programmatic scrolling of the redundant wrapper. */
#wb-layout-wrapper
  [role="presentation"]
  > .relative.flex.flex-col.flex-grow.overflow-y-auto {
  min-height: 0;
  overflow: clip;
}

#wb-layout-wrapper
  [role="presentation"]
  > .relative.flex.flex-col.flex-grow.overflow-y-auto
  > .flex.flex-col.flex-grow.overflow-y-auto {
  min-height: 0;
  overscroll-behavior-y: contain;
}

/* Chainlit's ScrollContainer appends an empty spacer with an inline height so the
   latest user message can be placed near the top of a full-window chat. In this
   review shell it creates a large scrollable blank tail between the final message
   and the fixed composer. This is the spacer's exact 2.9.6 position; keep the node
   for Chainlit's ref while removing its layout contribution. */
#wb-layout-wrapper
  [role="presentation"]
  > .relative.flex.flex-col.flex-grow.overflow-y-auto
  > .flex.flex-col.flex-grow.overflow-y-auto
  > .flex-shrink-0:empty {
  height: 0 !important;
}

/* …and let the transcript and the composer use all of it. Chainlit caps the chat at
   `min(48rem, 100vw)` (the default [UI] layout; 60rem for "wide"), sized for a
   full-window chat. Here the chat is already the third column after the worklist and
   the document viewer, so the cap only adds dead margins either side of every message
   and shrinks the composer.

   The cap is applied INLINE, in TWO places, and both must go — unpinning only the
   first widens the composer while every message stays 48rem wide:
     - the `mx-auto` wrappers around the message list and around the composer, and
     - each top-level message row itself (`div.step > div.flex.flex-col`, which takes
       the same value at indent 0 and `100%` when nested).
   Matched on the inline style rather than on the Tailwind classes alone, so the rules
   reach exactly the elements that carry the cap. `100%` rather than `none`: the point
   is to fill the panel, and a row that may hold a wide model-authored table must still
   not push the column into a horizontal scroll. `!important` is required, not
   defensive — nothing else outranks an inline declaration. */
#wb-layout-wrapper [style*="max-width"].mx-auto,
#wb-layout-wrapper .step > [style*="max-width"] {
  max-width: 100% !important;
}

/* Worklist rows */
.wb-row {
  padding: 0.4rem 0.5rem;
  border-radius: 6px;
  cursor: pointer;
  border: 1px solid transparent;
}
.wb-row:hover {
  background: hsl(var(--muted));
}
.wb-row.wb-active {
  border-color: hsl(var(--primary));
  background: hsl(var(--muted));
}
.wb-row-title {
  font-weight: 600;
}
.wb-row-meta {
  font-size: 0.8rem;
  opacity: 0.75;
}
.wb-worklist-status {
  margin: 0.5rem;
  line-height: 1.35;
}
.wb-worklist-error {
  color: hsl(var(--destructive));
}
.wb-worklist-degraded {
  padding-top: 0.5rem;
  border-top: 1px solid hsl(var(--border));
}

/* Document viewer: page images. The zoom mode is a class on the scroll container, so a
   slot can reserve height before its image arrives (see the shared viewer below). */
.wb-page {
  border: 1px solid hsl(var(--border));
  border-radius: 4px;
}

/* ------------------------------------------------------------------------------------
   Shared review navigation (review-nav.js): two aligned tracks between fixed ends — two
   rows above the viewer, or two columns in a rail beside it (`.wb-nav-vertical`, see
   the end of this block).

   The whole middle is ONE grid with fixed page-pitch tracks. A page element sits in one
   track; a document element starts at its stretch's track and spans its page count. That
   is what guarantees the two agree about every boundary — with a container per stretch,
   an intrinsic label width could shift the tracks after it. review-nav.js supplies each
   element's start and span as `--wb-nav-at`/`--wb-nav-span`; the rules here decide
   whether they address columns or rows.

   The look is flat and tonal rather than button-like: a page is a solid tile of its
   document type's colour with its number printed on it, and a document is a framed unit
   holding its tiles and its label. Nothing carries a glyph; state is surface and text.
   ------------------------------------------------------------------------------------ */
.wb-nav {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 4px;
  padding: 0 6px;
  flex-shrink: 0;
  border-bottom: 1px solid hsl(var(--border));
  background: hsl(var(--background));
  /* Proportions come from the agreed design: a page tile is noticeably taller than it
     is wide, the label track is only as thick as its text, and neighbouring tiles are
     as close as they can be while still reading as separate. */
  --wb-nav-column: 32px;
  /* Every tile is the same width, 30 px, one pixel in from each side of its track: two
     pixels of background between tiles of one document. At a document boundary those
     two pixels are the two documents' 1 px frame edges instead, never a narrower edge
     tile — which is the first thing the eye picks up. */
  --wb-nav-tile-gap: 1px;
  --wb-nav-line-row: 4px;
  /* Sized so an A4 portrait miniature fills the tile: a 30 px tile less its 2 px fill
     frame is 26 px wide, so the page is 37 px tall plus the frame. */
  --wb-nav-page-row: 41px;
  /* The label track, as a row above the viewer and as a column beside it: the 10.5 px
     label line plus two pixels either side. */
  --wb-nav-doc-row: 15px;
  --wb-nav-row-gap: 3px;
  --wb-nav-radius: 3px;
  --wb-nav-frame: #16233a;
  /* The ends are the review's input and output: a matched pair of dark fills with
     white labels, so neither reads as a document-type tile. IN is slate, the source
     family of the document frames; OUT is plum, a hue no document type uses. Both keep
     the orange selection ring readable. */
  --wb-nav-all-fill: #44546a;
  --wb-nav-task-fill: #7a3a86;
  /* Optional case context beside IN (preaudit's `Fall`): a third dark fill, teal, so it
     reads as neither input nor result nor any document type, and a compact width that
     still leaves the narrowest viewer one whole page position in the middle. */
  --wb-nav-context-fill: #2f6b6e;
  --wb-nav-context-width: 36px;
  --wb-nav-end-ink: #ffffff;
  --wb-nav-end-width: 48px;
  /* Beside the viewer the ends span the rail's width instead, at this fixed height. */
  --wb-nav-end-height: 32px;
  --wb-nav-edge-shade: rgb(22 35 58 / 0.5);
}
/* `display: grid` above would otherwise outrank the attribute and leave an empty,
   bordered strip — or an empty rail beside the viewer — while no review is mounted. */
.wb-nav[hidden] {
  display: none;
}
/* Both fixed ends cover both rows and stay put while the middle scrolls: the controls
   themselves stretch, so a page row and a document row are one target at each end. */
.wb-nav-fixed {
  display: flex;
  align-items: stretch;
  gap: 3px;
  flex-shrink: 0;
  padding: calc(var(--wb-nav-line-row) + var(--wb-nav-row-gap) + 2px) 0 4px;
}
/* One geometry for both ends: same wrapper, same height, same fixed width. */
.wb-nav-end {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--wb-nav-end-width);
  padding: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  border: none;
  border-radius: var(--wb-nav-radius);
  background: var(--wb-nav-fill, hsl(var(--muted)));
  color: var(--wb-nav-end-ink);
  white-space: nowrap;
  cursor: pointer;
  transition: box-shadow 0.12s, filter 0.12s;
}
.wb-nav-all {
  --wb-nav-fill: var(--wb-nav-all-fill);
}
.wb-nav-task {
  --wb-nav-fill: var(--wb-nav-task-fill);
}
.wb-nav-context {
  --wb-nav-fill: var(--wb-nav-context-fill);
  width: var(--wb-nav-context-width);
}
.wb-nav-end:hover {
  filter: brightness(1.15);
}
/* Selection is elevation plus a ring held off the fill by one pixel of background, so
   a control whose fill happens to match the accent is still readable as selected. */
.wb-nav-end.wb-nav-selected,
.wb-nav-doc.wb-nav-selected {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 1px;
  box-shadow: 0 1px 3px rgb(0 0 0 / 0.24);
}
/* Only the middle scrolls, and both rows move as one because they are one grid. The
   middle's edges shade while there is more to scroll that way, so the tiles read as
   sliding under the fixed ends rather than simply stopping. */
.wb-nav-middle {
  position: relative;
  min-width: 0;
}
.wb-nav-middle::before,
.wb-nav-middle::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 36px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s;
  z-index: 1;
}
.wb-nav-middle::before {
  left: 0;
  background: linear-gradient(to right, var(--wb-nav-edge-shade), transparent);
}
.wb-nav-middle::after {
  right: 0;
  background: linear-gradient(to left, var(--wb-nav-edge-shade), transparent);
}
.wb-nav-middle.wb-nav-more-start::before,
.wb-nav-middle.wb-nav-more-end::after {
  opacity: 1;
}
.wb-nav-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  /* An overlay scrollbar reserves no gutter, and once shown it takes the pointer over a
     strip about 14 px deep along its edge — deeper than the 15 px label track that sits
     on that edge. Mirroring the scroller across the track axis puts its scrollbar on the
     grouping-line edge instead, where it covers only that decorative line and a sliver
     of each tile; the grid is mirrored back, so nothing inside changes. */
  transform: scaleY(-1);
}
.wb-nav-scroll > .wb-nav-grid {
  transform: scaleY(-1);
}
.wb-nav-scroll::-webkit-scrollbar {
  height: 4px;
}
.wb-nav-scroll::-webkit-scrollbar-thumb {
  background: hsl(var(--border));
  border-radius: 2px;
}
.wb-nav-grid {
  position: relative; /* a page button's offset is measured against this */
  display: grid;
  grid-template-columns: repeat(var(--wb-nav-pages, 0), var(--wb-nav-column));
  grid-template-rows: var(--wb-nav-line-row) var(--wb-nav-page-row) var(--wb-nav-doc-row);
  column-gap: 0; /* tile margins carry the gap, so a frame can sit outside them */
  row-gap: var(--wb-nav-row-gap);
  width: max-content;
  padding: 2px 0 4px;
}
/* Every element's place along the axis; its track across the axis is its class's. */
.wb-nav-grid > * {
  grid-column: var(--wb-nav-at) / span var(--wb-nav-span);
}
/* Grouping lines live in a row reserved above the pages, against the same tracks, so a
   group's extent is read off the pages it actually covers. */
.wb-nav-group {
  grid-row: 1;
  align-self: center;
  height: var(--wb-nav-line-row);
  margin: 0 var(--wb-nav-tile-gap);
  border-radius: 2px;
  background: var(--wb-group-fill, hsl(var(--foreground) / 0.28));
}
.wb-nav-group-active {
  outline: 1px solid hsl(var(--primary));
  outline-offset: 1px;
}
/* The document unit: one frame across both rows over that document's columns. Two
   adjacent documents meet in a dark two-pixel line — both frames' edges — where two
   tiles of one document leave background, which is what keeps them visibly separate
   even when they share a type, a colour and a scrolling group. */
.wb-nav-frame {
  grid-row: 2 / 4;
  /* The border fills the gap the tiles leave along the track and one pixel beyond the
     rows across it, hugging its tiles and label without either being resized; its
     radius is the tiles' plus the border, so the corners nest. */
  margin: -1px 0;
  border: 1px solid var(--wb-nav-frame);
  border-radius: calc(var(--wb-nav-radius) + 1px);
  pointer-events: none;
}
.wb-nav-frame-unassigned {
  border-style: dashed;
  border-color: hsl(var(--foreground) / 0.35);
}
.wb-nav-page {
  grid-row: 2;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 var(--wb-nav-tile-gap);
  padding: 0;
  min-width: 0;
  box-sizing: border-box;
  border: none;
  border-radius: var(--wb-nav-radius);
  background: var(--wb-page-fill, var(--wb-nav-page-fill-default));
  cursor: pointer;
  transition: box-shadow 0.12s, filter 0.12s;
}
.wb-nav-page:hover {
  filter: brightness(1.06);
}
/* A tile with a miniature shows the whole page, uncropped and centred inside a frame of
   its type fill, which also shows around any page whose shape differs from the tile.
   The reference moves to a badge of that same fill in the lower-right corner. Without
   the state class (no miniature, or it failed) the tile is the plain centred number. */
.wb-nav-page.wb-nav-page-mini {
  padding: 2px;
}
.wb-nav-page-mini .wb-nav-page-ref {
  position: absolute;
  right: 1px;
  bottom: 1px;
  z-index: 1;
  max-width: calc(100% - 2px);
  padding: 0 2px;
  font-size: 9px;
  line-height: 10px;
  text-align: right;
  border-radius: 2px 0 2px 0;
  background: var(--wb-page-fill, var(--wb-nav-page-fill-default));
}
.wb-nav-mini {
  display: none;
}
.wb-nav-page-mini .wb-nav-mini {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: transparent;
  pointer-events: none;
}
/* The number is printed on the fill; its ink is computed from that fill's luminance by
   the projection, so legibility never depends on which colour was configured. */
.wb-nav-page-ref {
  font-size: 10px;
  line-height: 1;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  color: var(--wb-page-ink, var(--wb-nav-ink-default));
  /* The reference breaks only where review-nav.js allows it (after a multi-file
     reference's colon), never mid-number, so the longest one is never clipped. */
  white-space: normal;
  text-align: center;
}
/* Every page in the active scope is outlined lightly; the one being read is outlined
   solidly and lifted. Declared in this order on purpose — the current page carries both
   classes, so the stronger indication has to be the one that wins. */
.wb-nav-page.wb-nav-scoped {
  outline: 1.5px solid hsl(var(--primary) / 0.5);
  outline-offset: 1px;
}
.wb-nav-page.wb-nav-current {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 1px;
  box-shadow: 0 1px 3px rgb(0 0 0 / 0.24);
}
/* An upper-row overlay in the gap before the first page of a file. It takes no column
   and no lower-row space, so it can never split a document stretch. */
.wb-nav-file-boundary {
  grid-row: 2;
  justify-self: start;
  width: 2px;
  margin-left: -1px;
  background: var(--wb-nav-frame);
  border-radius: 1px;
  pointer-events: none;
}
.wb-nav-doc {
  grid-row: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  /* min-width:0 plus overflow keeps a long German type label from contributing an
     intrinsic width; the fixed tracks above do the rest. */
  min-width: 0;
  box-sizing: border-box;
  overflow: hidden;
  margin: 0 var(--wb-nav-tile-gap);
  padding: 0 4px;
  font-size: 10.5px;
  line-height: 1;
  white-space: nowrap;
  border: none;
  border-radius: var(--wb-nav-radius);
  /* A document with a result wears its type's colour; a missing one is a plain neutral
     surface. That contrast IS the status — there is no glyph to read. */
  background: var(--wb-page-fill, hsl(var(--background)));
  color: var(--wb-page-ink, var(--wb-nav-ink-default));
  cursor: pointer;
  container-type: inline-size;
  transition: box-shadow 0.12s, filter 0.12s;
}
.wb-nav-doc:hover {
  filter: brightness(1.06);
}
.wb-nav-doc-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wb-nav-doc[data-result="missing"] {
  background: hsl(var(--background));
  box-shadow: inset 0 0 0 1px hsl(var(--foreground) / 0.35);
}
/* Retained but no longer matching its pages: an amber surface, and the word itself
   whenever the stretch is wide enough to hold it beside the type label. */
.wb-nav-doc[data-result="outdated"] {
  background: #fbe0a2;
  box-shadow: inset 0 0 0 1px #b9791a;
  color: #4a2f00;
}
.wb-nav-doc-status {
  flex-shrink: 0;
  font-size: 9px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
/* The type label is what identifies the document, so it wins the last few pixels: the
   spelled-out status drops out on a stretch too short for both, leaving the surface
   and the accessible name to carry the state. Measured along the label's own line, so
   the same rule holds for a turned label beside the viewer. */
@container (max-inline-size: 105px) {
  .wb-nav-doc-status {
    display: none;
  }
}
/* A task-supplied physical-file entry: a source file, not a document. Neutral like a
   missing result, dashed like an unassigned run, and labelled by its filename. */
.wb-nav-doc.wb-nav-doc-file {
  background: hsl(var(--background));
  border: 1px dashed hsl(var(--foreground) / 0.45);
}
.wb-nav-doc-unassigned {
  background: transparent;
  color: hsl(var(--foreground) / 0.55);
  cursor: default;
}
.wb-nav :focus-visible {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 1px;
}

/* Beside the viewer: the same grid transposed into a narrow full-height rail. Pages run
   top to bottom, and the tracks sit left to right as grouping line, page column and
   document column on either side of the viewer — docking right moves the rail, it does
   not mirror it. Every size comes from the tokens above: a page tile keeps its portrait
   width and height, so the column is one tile wide and the page pitch is one tile tall
   plus the same gaps. `IN` is fixed at the top and the task results below the middle,
   stacked in their supplied order. Tiles, references and the ends stay upright; only
   document, file and unassigned labels turn, clockwise, reading top to bottom. */
.wb-nav[data-position="left"] {
  border-bottom: none;
  border-right: 1px solid hsl(var(--border));
}
.wb-nav[data-position="right"] {
  border-bottom: none;
  border-left: 1px solid hsl(var(--border));
}
.wb-nav-vertical {
  grid-template-columns: auto;
  grid-template-rows: auto minmax(0, 1fr) auto;
  padding: 6px 0;
  min-height: 0;
}
.wb-nav-vertical .wb-nav-fixed {
  flex-direction: column;
  padding: 0 4px 0 calc(var(--wb-nav-line-row) + var(--wb-nav-row-gap) + 2px);
}
.wb-nav-vertical .wb-nav-end {
  width: auto;
  height: var(--wb-nav-end-height);
}
.wb-nav-vertical .wb-nav-middle {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.wb-nav-vertical .wb-nav-middle::before,
.wb-nav-vertical .wb-nav-middle::after {
  left: 0;
  right: 0;
  width: auto;
  height: 36px;
}
.wb-nav-vertical .wb-nav-middle::before {
  top: 0;
  bottom: auto;
  background: linear-gradient(to bottom, var(--wb-nav-edge-shade), transparent);
}
.wb-nav-vertical .wb-nav-middle::after {
  top: auto;
  bottom: 0;
  background: linear-gradient(to top, var(--wb-nav-edge-shade), transparent);
}
/* The middle is the rail's only scroll owner: the gutter is reserved so a scrollbar
   never narrows the tiles, and reaching either end does not scroll anything outside. */
.wb-nav-vertical .wb-nav-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  /* The same mirroring across the rail's width puts the scrollbar on its left, the
     grouping-line edge, clear of the document column. */
  transform: scaleX(-1);
}
.wb-nav-vertical .wb-nav-scroll > .wb-nav-grid {
  transform: scaleX(-1);
}
.wb-nav-vertical .wb-nav-scroll::-webkit-scrollbar {
  width: 4px;
}
.wb-nav-vertical .wb-nav-grid {
  grid-template-columns:
    var(--wb-nav-line-row)
    calc(var(--wb-nav-column) - 2 * var(--wb-nav-tile-gap))
    var(--wb-nav-doc-row);
  grid-template-rows: repeat(
    var(--wb-nav-pages, 0),
    calc(var(--wb-nav-page-row) + 2 * var(--wb-nav-tile-gap))
  );
  column-gap: var(--wb-nav-row-gap);
  row-gap: 0;
  padding: 0 4px 0 2px;
}
.wb-nav-vertical .wb-nav-grid > * {
  grid-row: var(--wb-nav-at) / span var(--wb-nav-span);
}
.wb-nav-vertical .wb-nav-group {
  grid-column: 1;
  justify-self: center;
  align-self: stretch;
  width: var(--wb-nav-line-row);
  height: auto;
  margin: var(--wb-nav-tile-gap) 0;
}
.wb-nav-vertical .wb-nav-frame {
  grid-column: 2 / 4;
  margin: 0 -1px;
}
.wb-nav-vertical .wb-nav-page {
  grid-column: 2;
  min-height: 0;
  margin: var(--wb-nav-tile-gap) 0;
}
.wb-nav-vertical .wb-nav-file-boundary {
  grid-column: 2;
  justify-self: stretch;
  align-self: start;
  width: auto;
  height: 2px;
  margin: -1px 0 0;
}
/* The label turns as one line of text — letters rotated together, never stacked — and
   its container measures that line, so truncation and the status rule above follow the
   rail's length. The element's box is not rotated; its target is the grid cell. */
.wb-nav-vertical .wb-nav-doc {
  grid-column: 3;
  min-height: 0;
  margin: var(--wb-nav-tile-gap) 0;
  padding: 4px 0;
  writing-mode: vertical-rl;
  text-orientation: sideways;
}

/* Scope + source line beside the navigation: which pages are open and where we are. */
.wb-dv-scope {
  flex: 1 1 0;
  min-width: 0;
  max-width: 100%;
  font-size: 12px;
  /* Muted by colour rather than opacity, so the document badge keeps its true fill. */
  color: hsl(var(--foreground) / 0.75);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* The open document's label on its type's fill — the same fill and ink as its page
   tiles, grey for a type without a configured colour. */
.wb-dv-scope-badge {
  padding: 1px 6px;
  border-radius: 4px;
  font-weight: 700;
  background: var(--wb-page-fill, var(--wb-nav-page-fill-default));
  color: var(--wb-page-ink, var(--wb-nav-ink-default));
}

/* Page geometry for the shared viewer. The zoom mode is a container class, so a slot can
   reserve height before its image arrives. */
.wb-dv-scroll {
  /* Our own compensation restores the reading position after a real geometry change;
     browser scroll anchoring would then apply a second, opposite correction. */
  overflow-anchor: none;
}
/* A hairline under the toolbar that stays put while the content scrolls beneath it. It
   takes no height (so page offsets are unchanged) and spans the content box, which is
   exactly a fit-width page: a page opened at its top has its upper border on this line
   rather than beside it. */
.wb-dv-scroll::before {
  content: "";
  display: block;
  position: sticky;
  top: 0;
  z-index: 2;
  height: 1px;
  margin-bottom: -1px;
  background: hsl(var(--border));
}
.wb-dv-scroll.fit-width .wb-nav-slot .wb-page {
  width: 100%;
  height: auto;
  /* The reserved slot: the cached natural ratio once measured, an A4 portrait
     placeholder until then. The image never sets its own height, so it cannot
     silently enlarge the space reserved for it. */
  aspect-ratio: var(--page-ratio, 0.7071);
  object-fit: contain;
}
.wb-dv-scroll.fit-height .wb-nav-slot .wb-page {
  height: 85vh;
  width: auto;
  max-width: none;
}
.wb-nav-slot {
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
/* A failed page keeps its place, its size and its source reference. */
.wb-nav-slot-failed .wb-page {
  background: hsl(var(--muted));
  border-style: dashed;
}
.wb-nav-slot-retry {
  padding: 2px 8px;
  font-size: 11px;
  border: 1px solid hsl(var(--border));
  border-radius: 4px;
  background: hsl(var(--background));
  color: inherit;
  cursor: pointer;
}

/* Chat draft table */
.wb-draft-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
.wb-draft-table th,
.wb-draft-table td {
  border-bottom: 1px solid hsl(var(--border));
  padding: 0.25rem 0.4rem;
  text-align: left;
}
.wb-draft-head {
  font-weight: 600;
  margin-bottom: 0.4rem;
}
.wb-row-adjusted {
  background: hsl(var(--primary) / 0.08);
}

/* Model-authored markdown tables — the damage overview's room tables. Chainlit
   renders them as a bare <table> with no class of ours, and the chat column is
   narrower than eight columns want: without a scroll container the last columns
   (Betroffene Bauteile, Beleg) clip at the panel edge with no way to reach them.
   `display: block` is what makes overflow-x apply to a table at all. Excludes the
   draft and inspection-report tables, which have their own responsive contract. */
.ai-message table:not(.wb-draft-table):not(.wb-ir-table) {
  display: block;
  overflow-x: auto;
  max-width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}
.ai-message table:not(.wb-draft-table):not(.wb-ir-table) th,
.ai-message table:not(.wb-draft-table):not(.wb-ir-table) td {
  padding: 0.3rem 0.5rem;
  vertical-align: top;
}

/* Compact transcript: message roles use soft fills, while tool steps stay neutral.
   Chainlit's row padding and bottom spacer otherwise compound between messages. */
#wb-layout-wrapper .step {
  padding-top: 3px;
  padding-bottom: 3px;
  font-size: 14px;
  line-height: 21px;
}
#wb-layout-wrapper .step > div > [id^="step-"] {
  padding-bottom: 0;
}
.ai-message {
  gap: 16px;
}
.ai-message > span.inline-block {
  position: relative;
  flex: 0 0 20px;
  min-height: 34px;
  visibility: hidden;
}
.ai-message:has(> .w-0) > span.inline-block {
  display: none;
}
.ai-message > .w-0 {
  position: relative;
  margin-left: 36px;
  min-width: 0;
  min-height: 34px;
}
/* Preserve native content layout while keeping related Markdown sections compact. */
.ai-message .flex.flex-col:has(> .prose),
.group > div.bg-accent.rounded-3xl .flex.flex-col:has(> .prose) {
  gap: 4px;
}
.ai-message .prose,
.group > div.bg-accent.rounded-3xl .prose {
  font-size: inherit;
  line-height: inherit;
}
.ai-message .prose :is(p, [role="article"], li),
.group > div.bg-accent.rounded-3xl .prose :is(p, [role="article"], li) {
  line-height: inherit;
}
.ai-message .prose :is(p, [role="article"], ul, ol),
.group > div.bg-accent.rounded-3xl .prose :is(p, [role="article"], ul, ol) {
  margin-top: 4px;
  margin-bottom: 4px;
}
/* Markdown keeps its heading structure with the Workbench's compact type scale,
   overriding Chainlit's heading sizes even in a wide browser with a narrow chat. */
.ai-message .prose :is(h1, h2, h3, h4, h5, h6),
.group > div.bg-accent.rounded-3xl .prose :is(h1, h2, h3, h4, h5, h6) {
  font-family: inherit;
  font-size: 14px;
  line-height: 21px;
  font-weight: 600;
  letter-spacing: normal;
  margin: 12px 0 4px;
  padding: 0;
  border: 0;
}
.ai-message .prose h1,
.group > div.bg-accent.rounded-3xl .prose h1 {
  font-size: 18px;
  line-height: 24px;
}
.ai-message .prose h2,
.group > div.bg-accent.rounded-3xl .prose h2 {
  font-size: 16px;
  line-height: 22px;
}
.ai-message .prose > :first-child,
.group > div.bg-accent.rounded-3xl .prose > :first-child {
  margin-top: 0;
}
.ai-message .prose > :last-child,
.group > div.bg-accent.rounded-3xl .prose > :last-child {
  margin-bottom: 0;
}

/* Chainlit tool accordions retain their native controls and expanded content. */
button[id^="step-"] {
  background: hsl(var(--muted) / 0.5);
  border: 0;
  border-radius: 6px;
  padding: 4px 10px;
  color: hsl(var(--muted-foreground));
  font-size: 12px;
  line-height: 18px;
  /* Uniform bubble width: don't let a long nowrap value dictate the intrinsic
     size — allow shrinking so the value's ellipsis kicks in instead. */
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
button[id^="step-"]:hover {
  background: hsl(var(--muted) / 0.8);
}
/* Step titles, split by panels.js into "Schlüssel: Wert": expand chevron on the
   left, grey key in a fixed column so the values align, value in black. */
button[id^="step-"] > svg {
  order: -1;
}
button[id^="step-"] .wb-step-key {
  color: hsl(var(--muted-foreground));
  min-width: 11rem;
  text-align: left;
  flex-shrink: 0;
}
button[id^="step-"] .wb-step-value {
  color: hsl(var(--foreground));
  font-weight: 600;
  /* One line, ellipsized to the bubble width (long Leistungen lists). */
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-message > div:not(.w-0) {
  min-width: 0;
  min-height: 34px;
  gap: 4px;
  background: hsl(var(--primary) / 0.08);
  border: 0;
  border-radius: 6px;
  padding: 6px 10px;
}

/* Colored dots and event times share a fixed gutter outside the borderless blocks. */
.ai-message > span.inline-block::before,
.ai-message > .w-0::before,
.group > div.bg-accent.rounded-3xl::before {
  content: "";
  position: absolute;
  top: 6px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.ai-message > span.inline-block::before {
  left: 5px;
  visibility: visible;
  background: hsl(var(--primary) / 0.75);
}
.ai-message > .w-0::before {
  left: -31px;
  background: hsl(var(--muted-foreground) / 0.35);
}
.group:has(> div.bg-accent.rounded-3xl) {
  position: relative;
  min-width: 0;
}
.group > div.bg-accent.rounded-3xl {
  position: relative;
  margin-left: 36px;
  margin-right: 0;
  min-width: 0;
  min-height: 34px;
  max-width: none;
  flex-grow: 1;
  background: hsl(215 79% 46% / 0.08);
  border: 0;
  border-radius: 6px;
  padding: 6px 10px;
}
.group > div.bg-accent.rounded-3xl::before {
  left: -31px;
  background: hsl(215 79% 46% / 0.75);
}
/* Keep edit controls available without reserving a different right-hand column. */
.group > button.edit-message {
  position: absolute;
  right: 0;
  top: 0;
  margin-left: 0;
  z-index: 1;
}
.group:has(> button.edit-message) > div.bg-accent.rounded-3xl {
  padding-right: 50px;
}
/* Persisted local time sits under its dot; full dates remain accessible. */
.wb-transcript-time {
  position: absolute;
  top: 21px;
  width: 36px;
  color: hsl(var(--muted-foreground));
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 400;
  line-height: 12px;
  text-align: center;
  white-space: nowrap;
}
.ai-message > span.inline-block > .wb-transcript-time {
  left: -8px;
  visibility: visible;
}
.ai-message > .w-0 > .wb-transcript-time,
.group > div.bg-accent.rounded-3xl > .wb-transcript-time {
  left: -44px;
}
#wb-layout-wrapper #message-composer {
  border-radius: 8px;
}

/* ── Header chrome. Chainlit's header is a fixed 60px row (p-3, so ~36px of content)
   whose left group holds the new-chat button and the task picker. We give it the
   product identity it lacks and take away the two controls that do not belong in a
   single-purpose review shell. All of it is keyed to Chainlit 2.9.6's markup; see the
   limitations ledger in docs/status.md. ── */

/* Brand block, injected by panels.js: the cockpit's kc-brand / kc-tagline, one size
   step down so title + tagline fit the 60px header. The mark is the same diagonal
   gradient, --kc-warning -> --kc-primary; the start stop has no token here, so it is
   the cockpit's #f9ab00 literal. */
#wb-brand {
  margin-right: 0.75rem;
  white-space: nowrap;
}
.wb-brand {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  color: hsl(var(--foreground));
}
.wb-brand-mark {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 4px;
  background: linear-gradient(135deg, #f9ab00, hsl(var(--primary)));
}
.wb-tagline {
  font-size: 0.6rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: hsl(var(--muted-foreground));
  margin: 0.1rem 0 0;
}

/* Deployment badge, immediately after the app name. Filled in by panels.js from the
   backend's wb-environment ping (a static asset has no other channel to a server
   value), so it is hidden until that arrives rather than guessing an environment.
   Same palette as the cockpit's badge: prod in danger red, dev in the info blue,
   local grey — see apps/cockpit/assets/cockpit.css. */
.wb-env-badge {
  padding: 0.05rem 0.35rem;
  border: 1px solid;
  border-radius: 999px;
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.6;
  text-transform: uppercase;
}
.wb-env-prod {
  color: #d93025;
  border-color: #d93025;
  background: #fce8e6;
}
.wb-env-dev {
  color: #1967d2;
  border-color: #1967d2;
  background: #e8f0fe;
}
.wb-env-local {
  color: #80868b;
  border-color: #bdc1c6;
  background: #f1f3f4;
}

/* A review session is one case in one workflow: a reviewer switches case from the
   worklist and workflow from the picker, so "new chat" only ever drops the transcript.
   The theme toggle goes with the light-pinned cockpit palette (public/theme.json). */
#new-chat-button,
#theme-toggle {
  display: none;
}

/* Task picker, re-homed by panels.js into the header's right-hand tool group. The Dev
   switch precedes it; the picker sits immediately ahead of the readme button. Chainlit styles the
   trigger as a borderless page title (`h-10 px-3 font-semibold text-lg`, chevron
   `!size-5`) — as a tool among the readme and user buttons it reads as a cockpit form
   control instead. Tailwind sets each of these on the element itself, hence !important
   on exactly those properties. */
#chat-profiles {
  /* As wide as the selected task's name on one line (the longest, Estimate Pre-audit
     Review, fits within the cap), never narrower than before; a header that cannot
     fit it shortens the name with an ellipsis rather than wrapping it. The full name
     stays the button's text, so assistive technology reads all of it. */
  flex: 0 1 auto;
  width: auto !important;
  min-width: 0 !important;
  max-width: 16rem !important;
  justify-content: space-between;
  height: 32px !important;
  padding: 0 8px !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: hsl(var(--foreground)) !important;
  border: 1px solid hsl(var(--border)) !important;
  border-radius: var(--radius);
}
#chat-profiles svg {
  flex-shrink: 0;
  width: 1rem !important;
  height: 1rem !important;
}
#chat-profiles > span,
#chat-profiles > span * {
  display: block;
  /* Keeps the earlier 176 px control for short task names (padding and chevron add 36). */
  min-width: 140px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#chat-profiles > span * {
  min-width: 0;
}

#wb-tenant-control {
  display: flex;
  flex: 0 1 14rem;
  width: 14rem;
  min-width: 6rem;
  max-width: 14rem;
}
#wb-tenant-filter {
  width: 100%;
  min-width: 0;
  height: 32px;
  padding: 0 8px;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 500;
  color: hsl(var(--foreground));
  background: hsl(var(--background));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  text-overflow: ellipsis;
}
#wb-tenant-filter:focus-visible {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 2px;
}
#wb-tenant-filter:disabled {
  opacity: 0.6;
}
@media (max-width: 1000px) {
  #wb-tenant-control { max-width: 11rem; }
}

.wb-developer-toggle {
  position: relative;
  flex: 0 0 58px;
  width: 58px;
  height: 32px;
  padding: 3px;
  border: 1px solid hsl(var(--border));
  border-radius: 999px;
  background: hsl(var(--muted));
  color: hsl(var(--muted-foreground));
  cursor: pointer;
  transition: background-color 150ms ease, border-color 150ms ease;
}
.wb-developer-toggle-label {
  position: absolute;
  right: 7px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1;
}
.wb-developer-toggle-thumb {
  display: block;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: hsl(var(--background));
  box-shadow: 0 1px 3px hsl(var(--foreground) / 0.25);
  transition: transform 150ms ease;
}
.wb-developer-toggle.wb-active {
  border-color: hsl(var(--primary));
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground, 0 0% 100%));
}
.wb-developer-toggle.wb-active .wb-developer-toggle-label {
  right: auto;
  left: 7px;
}
.wb-developer-toggle.wb-active .wb-developer-toggle-thumb {
  transform: translateX(26px);
}
.wb-developer-toggle:focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}

/* Chat-profile picker: Chainlit 2.9.6 requires ChatProfile.markdown_description and
   renders it in a radix hover card beside the option — an empty description still
   paints an empty box. Hide the card WITHOUT removing it from layout: `display: none`
   here (or a `:has()` rule on radix's popper wrapper) leaves floating-ui measuring and
   re-positioning a zero-size element as the pointer crosses the options, which reads
   as a flickering, jerky dropdown. `visibility` keeps a real box that paints nothing
   and takes no pointer events. */
#chat-profile-description {
  visibility: hidden !important;
}

/* ── Empty chat column. Chainlit fills an empty transcript with its stock welcome
   state — its own wordmark plus the composer teleported from the footer to the centre
   of the column — and an in-place case switch passes through exactly that state: the
   wipe removes each step and message individually, so the list is empty from the last
   delete until the new case's first step, which waits on a checkpoint read (seconds on
   a cold agent-service). `#welcome-screen` is Chainlit's own id and its component
   returns null as soon as the transcript holds a user/assistant/tool message, so its
   presence IS the "still loading" condition — no signal of ours needs to bracket it.
   Safe because an empty chat here always means loading: every terminal state paints a
   message, including an empty queue (task.empty_message).

   Hide whatever it contains rather than naming the parts (the composer's id is shared
   with the docked footer one, so it must never be targeted unscoped), and replace it
   with the worklist's loading line — same string as showWorklistLoading() in panels.js,
   same dimming as .wb-row-meta. The delay is the point: a switch that completes inside
   it shows nothing at all, so only a genuinely slow load explains itself. It must be an
   animation, not a transition — React remounts this div on every empty transition, and
   Chainlit's own fade latches after the first mount, so a re-entry gets no fade. ── */
#welcome-screen > * {
  display: none;
}
#welcome-screen::before {
  content: "Wird geladen …";
  opacity: 0;
  animation: wb-pending-in 0.2s ease 0.25s forwards;
}
@keyframes wb-pending-in {
  to {
    opacity: 0.75;
  }
}

/* Chainlit's disclaimer under the composer ("LLMs can make mistakes …"). A reviewer here
   judges a draft against the evidence in the panel beside it — that IS the job, and the
   line only competes with the actions. Hidden rather than blanked in
   .chainlit/translations: the string exists in all 21 locale files (the browser picks
   one), and an emptied `.watermark` would still take its flex gap under the composer.
   !important is required, not defensive: the component carries an inline
   `style="display:flex"`, which a class rule cannot outrank. */
.watermark {
  display: none !important;
}

/* ── Bericht: the audit-result inspection report in the Bericht tab. ── */
.wb-ir {
  padding: 8px 4px;
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
  font-size: 0.85rem;
  line-height: 1.5;
  color: hsl(var(--foreground));
}
.wb-ir-pending {
  opacity: 0.7;
  padding: 0.5rem 0;
}

/* Metrics row: status badge + Original / Reduziert / Kürzung / % tiles */
.wb-ir-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.wb-ir-metric {
  padding: 6px 14px;
  border-radius: 6px;
  background: hsl(var(--muted) / 0.35);
  text-align: center;
  min-width: 80px;
}
.wb-ir-status {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  background: none;
  min-width: 0;
}
.wb-ir-status-icon {
  width: 36px;
  height: 36px;
}
/* Grouping selector: pushed to the right of the calculation's status line, sized to
   sit beside the metric tiles rather than compete with them. `margin-left: auto`
   rather than `justify-content` so the tiles keep their own gap. */
.wb-ir-grouping {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
}
.wb-ir-grouping > span {
  opacity: 0.7;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.wb-grouping-select {
  font: inherit;
  font-size: 0.78rem;
  padding: 3px 6px;
  border: 1px solid hsl(var(--border));
  border-radius: 4px;
  background: hsl(var(--background));
  color: inherit;
  max-width: 15rem;
}
.wb-grouping-select:focus-visible {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 1px;
}
.wb-ir-metric-label {
  font-size: 0.72rem;
  opacity: 0.7;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.wb-ir-metric-value {
  font-size: 0.95rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.wb-ir-cut .wb-ir-metric-value {
  color: hsl(4 71% 50%); /* --kc-danger #d93025 */
}

/* Reasoning block, coloured by decision — the cockpit's alert palette: success
   #1e8e3e on #e6f4ea, warning #f9ab00 on #fef7e0, and the neutral greys. */
.wb-ir-reasoning {
  padding: 8px 12px;
  border-radius: 6px;
  margin-bottom: 8px;
  white-space: pre-wrap;
  font-size: 0.84rem;
  line-height: 1.5;
}
.wb-ir-reasoning-ok {
  background: hsl(137 39% 93%);
  border-left: 3px solid hsl(137 65% 34%);
}
.wb-ir-reasoning-warn {
  background: hsl(46 94% 94%);
  border-left: 3px solid hsl(41 100% 49%);
}
.wb-preaudit-check-error {
  background: hsl(5 79% 95%);
  border-left: 3px solid hsl(4 71% 50%);
  color: hsl(3 71% 41%);
}
.wb-ir-reasoning-na {
  background: hsl(var(--muted));
  border-left: 3px solid hsl(213 7% 76%); /* --kc-border-strong #bdc1c6 */
  color: hsl(var(--muted-foreground));
}

/* Line-item table */
.wb-ir-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
  table-layout: fixed;
}
.wb-ir-table th {
  background: hsl(var(--muted) / 0.5);
  padding: 6px 8px;
  text-align: left;
  border-bottom: 2px solid hsl(var(--border));
  border-right: 1px solid hsl(var(--border));
  font-weight: 600;
  white-space: nowrap;
}
.wb-ir-table td {
  padding: 5px 8px;
  border-bottom: 1px solid hsl(var(--border));
  border-right: 1px solid hsl(var(--border));
  vertical-align: top;
}
.wb-ir-table th:last-child,
.wb-ir-table td:last-child {
  border-right: none;
}
.wb-ir-table tbody tr:hover {
  background: hsl(var(--muted) / 0.25);
}
.wb-ir-num {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.wb-ir-unit {
  text-align: center;
  white-space: nowrap;
}
.wb-ir-desc {
  word-wrap: break-word;
  white-space: pre-wrap;
  overflow: hidden;
}
.wb-ir-evidence {
  margin-top: 3px;
  font-size: 0.7rem;
  line-height: 1.35;
  opacity: 0.72;
}
/* Why a free-text position carries its price. Same muted sub-line treatment as
   evidence, deliberately a separate class: a derivation is not evidence. */
.wb-ir-derivation {
  margin-top: 3px;
  font-size: 0.7rem;
  line-height: 1.35;
  font-style: italic;
  opacity: 0.72;
}
.wb-ir-flag {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 5px;
  border-radius: 4px;
  background: hsl(46 94% 94%);
  color: hsl(36 100% 29%);
  font-size: 0.68rem;
  font-weight: 600;
  white-space: nowrap;
}
.wb-estimate-chat-table-wrap {
  max-width: 100%;
  overflow-x: auto;
}
/* Eleven columns: the chat table carries the full planning-row assignment.
   It already scrolled sideways at five columns in the default layout, so the wider
   floor costs nothing that was not already spent — unlike the middle panel, which
   has no scroll container and groups instead. */
.wb-estimate-chat-table {
  min-width: 1290px;
}
.wb-ir-unassigned {
  color: hsl(36 100% 29%);
  font-style: italic;
}
.wb-estimate-result-table th,
.wb-estimate-result-table td {
  padding-left: 2px;
  padding-right: 2px;
}
.wb-estimate-result-table th {
  font-size: 0.65rem;
}
.wb-ir-changed {
  background: hsl(46 94% 94%); /* alert-warning fill #fef7e0 */
}
.wb-ir-changed:hover {
  background: hsl(45 97% 88%) !important; /* its border tint #feefc3 */
}
.wb-ir-section td {
  background: hsl(var(--muted) / 0.5);
  font-weight: 600;
  font-size: 0.78rem;
  padding: 4px 8px !important;
}
.wb-ir-context td {
  background: hsl(210 17% 98%); /* --kc-bg #f8f9fa */
  font-style: italic;
  font-size: 0.78rem;
  color: hsl(var(--muted-foreground));
  padding: 3px 8px !important;
}
.wb-ir-totals td {
  border-top: 2px solid hsl(var(--border));
  padding-top: 6px !important;
  font-weight: 700;
}
.wb-ir-totals-extra {
  font-weight: 400;
  font-size: 0.72rem;
  opacity: 0.75;
}

/* Reduced value stacked under the struck original */
.wb-ir-split {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1.2;
}
.wb-ir-split > span:first-child {
  opacity: 0.6;
  text-decoration: line-through;
  font-size: 0.72rem;
}
.wb-reduced {
  color: hsl(4 71% 50%); /* --kc-danger */
  font-weight: 600;
}

/* Per-line Deckung / Preise checks */
.wb-ir-erg {
  font-size: 0.75rem;
  line-height: 1.35;
}
.wb-ir-check {
  display: block;
  margin-bottom: 4px;
}
.wb-ir-check:last-child {
  margin-bottom: 0;
}
.wb-ir-ok {
  color: hsl(137 65% 34%); /* --kc-success #1e8e3e */
  font-weight: 600;
}
.wb-ir-warn {
  color: hsl(4 71% 50%); /* --kc-danger */
  font-weight: 600;
}
.wb-ir-na {
  color: hsl(207 5% 52%); /* --kc-text-faint #80868b */
  font-style: italic;
}
.wb-ir-rule {
  font-family: var(--font-mono, monospace);
  font-size: 0.7rem;
  font-weight: 600;
  color: hsl(3 71% 41%); /* --kc-danger-hover #b3261e */
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: help;
}

/* Structure Review: logical documents remain separate; source tabs never move. */
/* A retained-but-outdated extraction stays inspectable and says so, every time it is
   opened — the status is a word, not only a colour. */
.wb-structure-status {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 10px;
  background: #fef7e0;
  color: #946200;
}
/* A failed Audit/Estimate source read, under the toolbar whichever view is open; the
   retry re-reads the source mapping alone. */
.wb-dv-source-status {
  flex-shrink: 0;
  padding: 6px 14px;
  font-size: 12px;
  border-bottom: 1px solid hsl(var(--border));
  background: #fef7e0;
  color: #594300;
}
.wb-dv-source-status button,
.wb-result-error button {
  margin-left: 4px;
  padding: 1px 8px;
  font-size: 12px;
  border: 1px solid currentColor;
  border-radius: 4px;
  background: hsl(var(--background));
  color: inherit;
  cursor: pointer;
}
.wb-result-error {
  margin: 12px 16px 0;
}
/* Structure-owned strip under the navigation: the current document's existing findings,
   reachable while reading its source pages — including the missing-result fallback. */
.wb-structure-source-note {
  flex-shrink: 0;
  padding: 4px 14px;
  font-size: 12px;
  border-bottom: 1px solid hsl(var(--border));
  background: hsl(var(--muted));
}
.wb-structure-source-note summary { cursor: pointer; }
.wb-structure { padding: 16px; font-size: 13px; line-height: 1.5; }
.wb-structure-table { overflow-x: auto; margin: 12px 0; }
.wb-structure table { border-collapse: collapse; width: 100%; }
.wb-structure th, .wb-structure td { text-align: left; padding: 8px; border-bottom: 1px solid #e2e8f0; vertical-align: top; }
.wb-structure-selected { background: #eef2ff; }
.wb-structure button { color: #3730a3; text-decoration: underline; cursor: pointer; text-align: left; }
.wb-structure-page { display: inline-block; margin-right: 6px; }
.wb-structure-findings { margin: 8px 0; padding-left: 20px; }
.wb-structure-findings li { margin-bottom: 8px; }
.wb-structure details { margin: 12px 0; }
.wb-structure summary { cursor: pointer; font-weight: 600; }

/* Status views share one compact two-line layout across all review tasks. */
.wb-worklist-control { margin: 0.4rem 0 0.65rem; }
.wb-worklist-control select { min-width: 0; width: 100%; font-size: 0.72rem; padding-inline: 3px; }
#wb-worklist .wb-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 5px;
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  background: transparent;
}
#wb-worklist .wb-row:hover, #wb-worklist .wb-row.wb-active { background: hsl(var(--muted)); }
.wb-row-title, .wb-row-context, .wb-row-kind {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wb-row-details, .wb-row-context { display: flex; align-items: center; gap: 4px; min-width: 0; }
.wb-row-details, .wb-row-time, .wb-row-figure { font-size: 0.72rem; }
.wb-row-time, .wb-row-figure { white-space: nowrap; font-variant-numeric: tabular-nums; text-align: right; }
.wb-row-time { color: hsl(var(--muted-foreground)); }
.wb-row-kind { flex: 1 1000 auto; }
.wb-row-number {
  flex: 0 0 auto;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  direction: rtl;
  text-align: left;
}
/* A chip keeps its full label ("Freigegeben (auto)" must not read as "Freigegeben");
   the context beside it gives way first. */
.wb-chip {
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 1px 4px;
  border-radius: 4px;
  font-size: 0.65rem;
}
.wb-chip-open { color: #a34e00; background: #fff1de; }
.wb-chip-progress { color: #174a87; background: #e8f1ff; }
.wb-chip-done { color: #21643c; background: #e5f5eb; }
.wb-chip-warn { color: #805600; background: #fff2cd; }
.wb-chip-cancelled { color: #555; background: #eee; }
.wb-chip-failed { color: #a52626; background: #ffe8e8; }
#wb-layout-wrapper.wb-read-only #message-composer { display: none; }

/* Developer case controls stay separate from the source-page navigator. */
#wb-case-paging { display: flex; gap: 0.35rem; margin-bottom: 0.6rem; }
#wb-case-paging[hidden], #wb-audit-target-control[hidden] { display: none; }
#wb-case-paging button { font-size: 0.72rem; padding: 0.2rem 0.5rem; }
#wb-audit-target-control { display: block; font-size: 0.72rem; margin-bottom: 0.6rem; }
#wb-audit-target { width: 100%; font-size: inherit; }

/* The active-estimate chooser, first in the viewer toolbar: a compact inline label and
   a select that may shrink (its full choice stays in the option text, hover and
   accessible name) rather than push the position and zoom controls out of the toolbar. */
.wb-preaudit-items {
  display: flex;
  align-items: center;
  gap: 4px;
  /* Takes the line beside position and zoom and shrinks before they would wrap. */
  flex: 0 1 auto;
  min-width: 8rem;
  min-height: 26px;
  font-size: 12px;
}
/* Source context gets a second row; empty result context reserves no extra line. */
.wb-dv-toolbar:has(.wb-preaudit-items):has(.wb-dv-scope:not(:empty), .wb-dv-page:not(:empty))::after {
  content: "";
  order: 1;
  flex-basis: 100%;
  height: 0;
}
.wb-dv-toolbar:has(.wb-preaudit-items) .wb-dv-scope,
.wb-dv-toolbar:has(.wb-preaudit-items) .wb-dv-page {
  order: 2;
}
.wb-preaudit-items-label {
  font-weight: 600;
  white-space: nowrap;
}
.wb-preaudit-items select {
  min-width: 0;
  max-width: 16rem;
  height: 26px;
  box-sizing: border-box;
  padding: 2px 4px;
  font-size: 12px;
  text-overflow: ellipsis;
}
.wb-preaudit-items-status {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.wb-preaudit-items-actor {
  max-width: 10rem;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wb-dv-toolbar:has(.wb-preaudit-items) { position: relative; }
.wb-dv-toolbar:has(.wb-preaudit-items) .wb-preaudit-group-toggle { margin-left: auto; }
.wb-preaudit-active-mark {
  padding: 0 4px;
  border-radius: 3px;
  background: hsl(var(--primary) / 0.12);
  white-space: nowrap;
}
.wb-preaudit-navigation {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  flex-shrink: 0;
  gap: 4px 10px;
  padding: 5px 8px;
  border-bottom: 1px solid hsl(var(--border));
  font-size: 11px;
}
.wb-preaudit-navigation[hidden],
.wb-preaudit-return[hidden] { display: none; }
.wb-preaudit-return {
  border: 1px solid hsl(var(--border));
  border-radius: 4px;
  padding: 3px 6px;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  font: inherit;
  cursor: pointer;
}
.wb-preaudit-return:focus-visible { outline: 2px solid hsl(var(--primary)); outline-offset: 2px; }
.wb-preaudit-navigation-status { overflow-wrap: anywhere; }
.wb-preaudit-table-scroll {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
.wb-preaudit-table-scroll > table { min-width: 44rem; table-layout: auto; }
.wb-preaudit-table-scroll > .wb-preaudit-assessment-table { min-width: 60rem; }
.wb-preaudit-table-scroll td { overflow-wrap: anywhere; }
.wb-preaudit-review,
.wb-preaudit-header-details {
  --wb-preaudit-ink: #222831;
  --wb-preaudit-muted: #68707c;
  --wb-preaudit-line: #e1e4e8;
  --wb-preaudit-soft: #f6f7f9;
  --wb-preaudit-blue: #2455a6;
  --wb-preaudit-amber: #97600a;
}
.wb-preaudit-review {
  container: preaudit-review / inline-size;
  width: 100%;
  min-width: 0;
  color: var(--wb-preaudit-ink);
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 1.5;
}
/* Keep review context above an independently scrolling position table. Expanded
   context has its own bounded scroller so the table stays reachable on short screens. */
#wb-doc:has(> .wb-preaudit-review) {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: clip;
}
#wb-doc:has(> .wb-preaudit-review) > :not(.wb-preaudit-review) { flex-shrink: 0; }
#wb-doc > .wb-preaudit-review {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}
.wb-preaudit-overview {
  flex: 0 1 auto;
  max-height: 65%;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}
.wb-preaudit-review > .wb-preaudit-working-estimate {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-height: 0;
}
.wb-preaudit-working-estimate > :not(.wb-preaudit-table-scroll) { flex-shrink: 0; }
.wb-preaudit-working-estimate > .wb-preaudit-table-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.wb-preaudit-working-table thead {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--wb-preaudit-soft);
}
.wb-preaudit-review *,
.wb-preaudit-review *::before,
.wb-preaudit-review *::after { box-sizing: border-box; }
.wb-preaudit-header { font: inherit; }
.wb-preaudit-processing { margin: 0 0 6px; border: 1px solid #ead8b8; border-radius: 4px; background: #fff6e7; color: var(--wb-preaudit-amber); }
.wb-preaudit-processing > summary { display: flex; align-items: center; gap: 7px; min-height: 32px; padding: 6px 8px; cursor: pointer; list-style: none; font-size: 12px; line-height: 18px; }
.wb-preaudit-processing > summary::-webkit-details-marker { display: none; }
.wb-preaudit-processing > summary > strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.wb-preaudit-processing > summary > span { flex-shrink: 0; }
.wb-preaudit-processing-info { margin-left: auto; }
.wb-preaudit-processing > summary:focus-visible { outline: 2px solid var(--wb-preaudit-blue); outline-offset: 2px; }
.wb-preaudit-processing > div { padding: 0 8px 8px; color: var(--wb-preaudit-ink); font-size: 12px; }
.wb-preaudit-processing > div p { margin: 4px 0 0; }
.wb-preaudit-context { margin-top: 4px; color: var(--wb-preaudit-muted); font-size: 12px; overflow-wrap: anywhere; }
.wb-preaudit-context strong { font-weight: 500; color: var(--wb-preaudit-ink); }
.wb-preaudit-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 14px 0; }
.wb-preaudit-tile { min-width: 0; padding: 10px 9px; background: var(--wb-preaudit-soft); border-radius: 6px; }
.wb-preaudit-tile-up { color: var(--wb-preaudit-blue); background: #edf4ff; }
.wb-preaudit-tile-risks { color: #7854a8; background: #f3edfb; }
.wb-preaudit-tile-down { color: var(--wb-preaudit-amber); background: #fff6e7; }
.wb-preaudit-tile-current { box-shadow: inset 0 0 0 1px var(--wb-preaudit-line); }
.wb-preaudit-tile-label { display: block; font-size: 11px; font-weight: 500; white-space: nowrap; }
.wb-preaudit-tile-risks .wb-preaudit-tile-label { white-space: normal; overflow-wrap: anywhere; }
.wb-preaudit-tile-value { display: block; margin-top: 2px; font-size: clamp(17px, 2.45cqi, 23px); font-weight: 600; line-height: 1.4; letter-spacing: -.025em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.wb-preaudit-tile-long .wb-preaudit-tile-value { white-space: normal; overflow-wrap: anywhere; }
.wb-preaudit-tile-currency { font-size: 11px; font-weight: 400; letter-spacing: 0; }
.wb-preaudit-summary { border-left: 3px solid #d69d35; padding-left: 10px; margin: 0 0 8px; font-size: 14px; }
.wb-preaudit-preview { margin: 0; white-space: normal; }
.wb-preaudit-preview > summary { cursor: pointer; list-style: none; }
.wb-preaudit-preview > summary::-webkit-details-marker { display: none; }
.wb-preaudit-preview-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; white-space: pre-line; overflow-wrap: anywhere; }
.wb-preaudit-working-table .wb-preaudit-preview-text { line-height: inherit; }
/* Bound correction stacks too, reserving room for the current wording. */
.wb-preaudit-preview:not(.wb-preaudit-expanded):not([open]) .wb-preaudit-preview-text { max-height: 3lh; }
.wb-preaudit-preview:not(.wb-preaudit-expanded):not([open]) .wb-ir-split { display: block; line-height: inherit; }
.wb-preaudit-preview:not(.wb-preaudit-expanded):not([open]) .wb-ir-split > span { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.wb-preaudit-preview:not(.wb-preaudit-expanded):not([open]) .wb-ir-split > span:first-child { -webkit-line-clamp: 1; }
.wb-preaudit-preview:not(.wb-preaudit-expanded):not([open]) .wb-ir-split > .wb-reduced { -webkit-line-clamp: 2; }
.wb-preaudit-expanded > .wb-preaudit-preview-text,
.wb-preaudit-preview[open] > summary > .wb-preaudit-preview-text { display: block; -webkit-line-clamp: unset; overflow: visible; }
.wb-preaudit-text-toggle,
.wb-preaudit-preview-more,
.wb-preaudit-preview-less { display: block; border: 0; padding: 3px 0 0; margin: 0; background: transparent; color: var(--wb-preaudit-muted); font: inherit; font-size: 11px; text-align: left; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.wb-preaudit-text-toggle:focus-visible,
.wb-preaudit-preview > summary:focus-visible { outline: 2px solid var(--wb-preaudit-blue); outline-offset: 3px; }
.wb-preaudit-text-toggle[hidden],
.wb-preaudit-preview-less,
.wb-preaudit-preview[open] > summary > .wb-preaudit-preview-more { display: none; }
.wb-preaudit-preview[open] > summary > .wb-preaudit-preview-less { display: block; }
.wb-preaudit-review > .wb-preaudit-reference-warning,
.wb-preaudit-header > .wb-preaudit-reference-warning { color: var(--wb-preaudit-amber); font-size: 12px; margin: 8px 0; overflow-wrap: anywhere; }
.wb-preaudit-header-details { flex-shrink: 0; color: var(--wb-preaudit-muted); font-size: 12px; }
.wb-preaudit-header-details > summary { cursor: pointer; width: fit-content; white-space: nowrap; }
.wb-preaudit-header-details-body {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 20;
  max-height: min(50vh, 28rem);
  overflow: auto;
  background: var(--wb-preaudit-soft);
  border: 1px solid var(--wb-preaudit-line);
  padding: 10px 12px;
  color: var(--wb-preaudit-ink);
  overflow-wrap: anywhere;
  box-shadow: 0 4px 10px #0002;
}
.wb-preaudit-header-details-body p { margin: 4px 0; }
.wb-preaudit-header-details-body ul { padding-left: 18px; }
.wb-preaudit-working-estimate { padding: 0; font: inherit; color: inherit; }
.wb-preaudit-table-scroll > .wb-preaudit-working-table { table-layout: fixed; width: 100%; min-width: calc(560px + var(--wb-preaudit-table-extra, 0px)); border-collapse: collapse; font-size: 13px; line-height: 20px; }
.wb-preaudit-working-table th { background: var(--wb-preaudit-soft); color: #5e6570; font-size: 12px; font-weight: 600; text-align: left; padding: 8px 6px; border-bottom: 2px solid var(--wb-preaudit-line); border-right: 0; vertical-align: top; white-space: nowrap; }
.wb-preaudit-working-table td { padding: 9px 6px; border-bottom: 1px solid var(--wb-preaudit-line); border-right: 0; vertical-align: top; overflow-wrap: anywhere; }
.wb-preaudit-working-table tr > * + * { border-left: 1px solid var(--wb-preaudit-line); }
.wb-preaudit-working-table tr > :is(:first-child, :nth-child(3), :nth-child(4), :nth-child(5)) { padding-left: 5px; padding-right: 5px; }
.wb-preaudit-identity-col { width: var(--wb-preaudit-identity-width, 82px); }
.wb-preaudit-quantity-col { width: var(--wb-preaudit-quantity-width, 48px); }
.wb-preaudit-prices-col { width: var(--wb-preaudit-prices-width, 76px); }
.wb-preaudit-total-col { width: var(--wb-preaudit-total-width, 68px); }
.wb-preaudit-result-col { width: 112px; }
.wb-preaudit-order { display: block; font-size: inherit; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.wb-preaudit-header-full { display: none; }
.wb-preaudit-header-short { display: inline; }
.wb-preaudit-working-table th:nth-child(4),
.wb-preaudit-working-table th:nth-child(5) { text-align: right; }
.wb-preaudit-identity,
.wb-preaudit-code { font-variant-numeric: tabular-nums; }
.wb-preaudit-position,
.wb-preaudit-code { display: block; color: var(--wb-preaudit-muted); font-size: 12px; margin-top: 3px; white-space: nowrap; }
.wb-preaudit-quantity { font-variant-numeric: tabular-nums; }
.wb-preaudit-quantity-amount { display: block; text-align: left; white-space: nowrap; }
.wb-preaudit-quantity-unit { display: block; margin-top: 3px; text-align: left; color: var(--wb-preaudit-muted); font-size: 12px; }
.wb-preaudit-prices,
.wb-preaudit-total { text-align: right; font-variant-numeric: tabular-nums; }
.wb-preaudit-working-price,
.wb-preaudit-total > span { display: block; white-space: nowrap; }
.wb-preaudit-working-price { font-weight: 500; }
.wb-preaudit-price-match { color: #288344; }
.wb-preaudit-price-difference { color: var(--wb-preaudit-amber); }
.wb-preaudit-lv-price { display: block; margin-top: 3px; color: var(--wb-preaudit-muted); font-size: 12px; white-space: nowrap; }
.wb-preaudit-working-table .wb-ir-split { display: flex; flex-direction: column; white-space: normal; }
.wb-preaudit-working-table .wb-ir-split > :first-child { color: #c74c3a; opacity: 1; font-size: 12px; text-decoration: line-through; }
.wb-preaudit-working-table .wb-ir-split > .wb-reduced { color: var(--wb-preaudit-ink); font-weight: 500; text-decoration: none; }
.wb-preaudit-working-table .wb-preaudit-working-price { color: var(--wb-preaudit-ink); }
.wb-preaudit-prices .wb-ir-split > span,
.wb-preaudit-total .wb-ir-split > span { white-space: nowrap; }
.wb-preaudit-quantity .wb-ir-split { align-items: flex-start; }
.wb-preaudit-working-table .wb-ir-ok { color: #288344; }
.wb-preaudit-working-table .wb-ir-warn,
.wb-preaudit-working-table .wb-preaudit-reference-warning { color: var(--wb-preaudit-amber); }
.wb-preaudit-working-table .wb-ir-na { color: var(--wb-preaudit-muted); }
.wb-preaudit-line-result { font-size: 11px; line-height: 1.45; }
.wb-preaudit-line-result strong { font-weight: 500; }
.wb-preaudit-line-result .wb-ir-check { margin-bottom: 4px; }
.wb-preaudit-line-result > div + div { margin-top: 4px; }
.wb-preaudit-line-result details { margin-top: 4px; }
.wb-preaudit-line-result summary { color: var(--wb-preaudit-muted); cursor: pointer; }
.wb-preaudit-line-result details[open] { overflow-wrap: anywhere; }
.wb-preaudit-line-result p { margin: 6px 0; }
.wb-preaudit-line-result .wb-preaudit-line-details[open] { min-width: 0; }
.wb-preaudit-line-result pre { max-width: 100%; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; }
.wb-preaudit-working-table small,
.wb-preaudit-line-details small { display: block; margin-top: 4px; white-space: normal; font-size: 11px; }
.wb-preaudit-line-details { margin-top: 4px; }
.wb-preaudit-line-details summary { cursor: pointer; font-size: 11px; }
.wb-preaudit-line-details p { margin: 6px 0; }
.wb-preaudit-reference-warning { color: hsl(36 100% 29%); }
.wb-preaudit-working-table tfoot th,
.wb-preaudit-working-table tfoot td { background: var(--wb-preaudit-soft); border: 0; padding: 10px 6px; font-weight: 600; color: var(--wb-preaudit-ink); }
.wb-preaudit-working-table tfoot .wb-preaudit-total { white-space: nowrap; }
.wb-preaudit-added-row { background: #edf8f0; }
.wb-preaudit-working-table .wb-preaudit-zero-row { background: #fff1f0; }
.wb-preaudit-working-table .wb-preaudit-edited-row { background: #fff9e8; }
.ai-message a[href^="#wb-preaudit-item?"] {
  color: #0000ee;
  text-decoration: underline;
}
.wb-preaudit-working-table .wb-preaudit-citation-selected > td {
  box-shadow: inset 0 2px 0 #52627a, inset 0 -2px 0 #52627a;
}
.wb-preaudit-working-table .wb-preaudit-citation-selected > td:first-child {
  box-shadow: inset 3px 0 0 #52627a, inset 0 2px 0 #52627a, inset 0 -2px 0 #52627a;
}
.wb-preaudit-citation-selected:focus-visible { outline: 2px solid #52627a; outline-offset: -2px; }
.wb-preaudit-citation-cue {
  display: block;
  margin-top: 4px;
  color: #465268;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  white-space: normal;
}
.wb-preaudit-working-table [data-preaudit-member] > td:first-child { border-left: 4px solid var(--wb-preaudit-group-color); }
.wb-preaudit-order-controls { display: flex; flex-wrap: wrap; gap: 5px; margin: 10px 0; }
.wb-preaudit-order-controls button,
.wb-preaudit-group-fold button,
.wb-preaudit-group-link { font: inherit; font-size: 11px; padding: 4px 7px; border: 1px solid var(--wb-preaudit-line); border-radius: 4px; background: white; cursor: pointer; }
.wb-preaudit-order-controls [aria-pressed="true"] { color: var(--wb-preaudit-blue); background: #edf4ff; border-color: var(--wb-preaudit-blue); }
.wb-preaudit-group-badge { border: 1px solid var(--wb-preaudit-line); border-left: 4px solid var(--wb-preaudit-group-color); border-radius: 4px; padding: 3px 5px; width: fit-content; font-weight: 500; }
.wb-preaudit-group-link { color: var(--wb-preaudit-blue); padding: 1px 4px; margin: 2px 1px; }
.wb-preaudit-counterparts { font-size: 10px; margin-top: 4px; }
.wb-preaudit-group-evidence { margin: 7px 0; }
.wb-preaudit-group-fold > td { border-left: 4px solid var(--wb-preaudit-group-color); background: #fff1f0; }
.wb-preaudit-group-fold > td > button { margin-right: 12px; }
.wb-preaudit-group-fold .wb-preaudit-group-contribution { display: inline-block; }
.wb-preaudit-group-contribution { font-size: 11px; margin: 6px 0; font-variant-numeric: tabular-nums; }
.wb-preaudit-group-up { color: var(--wb-preaudit-blue); }
.wb-preaudit-group-down { color: var(--wb-preaudit-amber); }
.wb-preaudit-legacy-details { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--wb-preaudit-line); }
.wb-preaudit-legacy-details h4 { font-size: 11px; font-weight: 600; margin: 0 0 6px; }
.wb-preaudit-working-estimate [hidden] { display: none !important; }
.wb-preaudit-working-table .wb-preaudit-removed-row { background: #fff1f0; }
.wb-preaudit-removed-status { color: var(--wb-preaudit-amber); }
.wb-preaudit-removed-row .wb-preaudit-working-price { color: var(--wb-preaudit-muted); }
@container preaudit-review (min-width: 880px) {
  .wb-preaudit-identity-col { width: var(--wb-preaudit-identity-width, 92px); }
  .wb-preaudit-header-full { display: inline; }
  .wb-preaudit-header-short { display: none; }
  .wb-preaudit-quantity-col { width: var(--wb-preaudit-quantity-width, 50px); }
  .wb-preaudit-prices-col { width: var(--wb-preaudit-prices-width, 78px); }
  .wb-preaudit-total-col { width: var(--wb-preaudit-total-width, 70px); }
  .wb-preaudit-result-col { width: 116px; }
  .wb-preaudit-working-table td,
  .wb-preaudit-working-table th { padding-left: 7px; padding-right: 7px; }
}
@container preaudit-review (max-width: 599px) {
  .wb-preaudit-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wb-preaudit-tile-value { font-size: 21px; }
  .wb-preaudit-table-scroll { scrollbar-width: auto; }
}
/* Chainlit's message action footer; scope to the selected preaudit task. */
#wb-layout-wrapper:has(.wb-preaudit-items)
  > [data-panel-group-direction="horizontal"] .step .-ml-1\.5.flex.items-center.flex-wrap
  > button[id] {
  max-width: 100%;
  min-width: 0;
  height: auto;
  min-height: 2rem;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
}
.wb-ir-table pre { white-space: pre-wrap; overflow-wrap: anywhere; }