/* Directly maintained component stylesheet — Plan 758: CSS modularisation.
 * Edit this file directly; frontend/static/osperan.css imports it.
 * -----------------------------------------------------------------------
 * components.css — UI components, feature modules, view-specific rules.
 */
/* ======================================================================
 * Content column + page transitions
 * ====================================================================== */

:root {
  --forge-dyn-border: 1px solid var(--border-subtle);
  --forge-dyn-fg: var(--text-secondary);
  --forge-dyn-fill: var(--surface-muted);
  --forge-dyn-stroke: var(--border-subtle);
  --surface: var(--surface-primary);
  --text-link: var(--brand-blue);
}

.forge-source-review-details {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
}
.forge-source-review-details > summary {
  color: var(--text-secondary);
  cursor: pointer;
  font-weight: 600;
}

.forge-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: var(--bg-page);
  gap: 0;
  /* Clip horizontal overflow so the page-header band's full-bleed
       pseudo-element (extending past page_root's 1600px cap) is cut
       cleanly at .forge-content's left/right edges. overflow-x: clip
       (not hidden) preserves the topbar's position: sticky. */
  overflow-x: clip;
}
.forge-page {
  display: flex;
  flex-direction: column;
  padding: 24px 32px 40px;
  flex: 1;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
  align-items: stretch;
  gap: 0;
  /* A short fade keeps route changes perceptible without shifting content. */
  animation: page-in var(--motion-slow) var(--ease-out-quart) both;
  container-type: inline-size;
  container-name: forge-page;
}
/* NiceGUI 3.9+ renders ui.column() with default_classes='nicegui-column'.
   nicegui.css defines .nicegui-column { align-items: flex-start } which
   collapses children to content-width at every nesting level.
   This two-class rule (specificity 0,2,0) beats nicegui.css (0,1,0)
   and applies recursively to every ui.column() inside a page. */
.forge-page .nicegui-column,
.forge-content .nicegui-column {
  align-items: stretch;
}

/* Motion keyframes — shared by .forge-page entrance, AI
   processing pulse, popovers, skeleton loaders. Reduced-motion overrides
   for these keyframes live in tokens.css (prefers-reduced-motion block). */
@keyframes page-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes scale-in {
  from {
    opacity: 0;
    transform: scale(0.96);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes pulse-ring {
  0% {
    box-shadow: 0 0 0 0 rgba(var(--terracotta-rgb), 0.4);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(var(--terracotta-rgb), 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(var(--terracotta-rgb), 0);
  }
}
@keyframes shimmer {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(100%);
  }
}
.forge-bulk-review-pulse-dot {
  width: 8px;
  height: 8px;
  background: var(--brand-blue-bright);
  border-radius: 50%;
  display: inline-block;
  animation: pulse-ring 1.2s infinite;
  flex: none;
}
/* Backwards-compatible alias — existing rules referencing forgePageFade keep
   their behaviour. New uses should prefer fade-in / page-in directly. */
@keyframes forgePageFade {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.forge-data-table-wrap {
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  background: var(--bg-card);
}
.forge-data-table,
.forge-queue-table,
.forge-matrix-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
}
.forge-matrix-table { min-width: 760px; }
.forge-data-table caption,
.forge-queue-table caption,
.forge-matrix-table caption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.forge-data-table--compact thead th,
.forge-data-table--compact tbody td {
  padding: 8px 10px;
}
.forge-data-table thead th,
.forge-queue-table thead th,
.forge-matrix-table thead th {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 700;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}
.forge-data-table tbody td,
.forge-data-table tbody th,
.forge-queue-table tbody td,
.forge-queue-table tbody th,
.forge-matrix-table tbody td,
.forge-matrix-table tbody th {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  vertical-align: top;
}
.forge-data-table tbody tr:hover,
.forge-queue-table tbody tr:hover,
.forge-matrix-table tbody tr:hover { background: var(--bg-page); }
.forge-data-table tbody tr:last-child td,
.forge-queue-table tbody tr:last-child td,
.forge-matrix-table tbody tr:last-child td {
  border-bottom: 0;
}
.forge-data-table__cell--right {
  text-align: right;
}
.forge-data-table__cell--center {
  text-align: center;
}
.forge-data-table__cell--anywhere {
  overflow-wrap: anywhere;
}
.forge-data-table__cell--nowrap {
  white-space: nowrap;
}
.forge-data-table__cell--muted {
  color: var(--text-muted);
}
.forge-data-table__cell--left { text-align: left; }
.forge-queue-table,
.forge-matrix-table {
  background: var(--bg-card);
}
.forge-queue-table__cell--selection,
.forge-queue-table__caret-cell {
  width: 42px;
  padding-inline: 8px !important;
  text-align: center;
}
.forge-queue-table__cell--actions { text-align: right; white-space: nowrap; }
.forge-queue-table__expansion td { padding: 12px 16px; }
.forge-queue-table__child[hidden] { display: none; }
.forge-queue-table__caret { min-width: 32px; min-height: 32px; }
.forge-queue-table__group-header { font-weight: 600; }
.forge-queue-table__group--expandable .forge-queue-table__child { background: var(--surface-alt); }
.forge-matrix-table thead th,
.forge-matrix-table tbody td { text-align: center; }
.forge-matrix-table thead th:first-child,
.forge-matrix-table tbody th { text-align: left; }
.forge-matrix-table tbody th { white-space: nowrap; }
.forge-data-table__row--clickable {
  cursor: pointer;
}
.forge-data-table__row--clickable:hover {
  background: color-mix(in srgb, var(--tint-blue) 24%, transparent);
}
.forge-data-table__link {
  color: var(--brand-blue);
  font-weight: 600;
  text-decoration: none;
}
.forge-data-table__link:hover {
  text-decoration: underline;
}
.forge-data-table__sort {
  cursor: pointer;
  user-select: none;
}
.forge-summary-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin: 10px 0 16px;
}
.forge-summary-metric {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  background: var(--surface-muted);
}
.forge-summary-metric__label {
  display: block;
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
}
.forge-summary-metric__value {
  display: block;
  margin-top: 3px;
  color: var(--text-primary);
  font-size: 1rem;
  overflow-wrap: anywhere;
}
.forge-row-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}
.forge-row-actions--left {
  justify-content: flex-start;
}
.forge-link {
  color: var(--brand-blue);
  font-weight: 700;
  text-decoration: none;
}
.forge-link:hover,
.forge-link:focus-visible {
  text-decoration: underline;
}

.forge-galaxy-zoom {
  appearance: none;
}




/* ======================================================================
 * Skeleton loaders
 * ====================================================================== */

.skeleton {
  background: linear-gradient(
    90deg,
    var(--tint-slate) 0%,
    var(--border) 50%,
    var(--tint-slate) 100%
  );
  background-size: 200% 100%;
  animation: skeletonPulse 1.4s linear infinite;
  border-radius: var(--radius-sm);
  display: inline-block;
  min-height: 0.9rem;
}
.skeleton-line {
  height: 0.9rem;
  width: 100%;
  margin-bottom: 8px;
  border-radius: var(--radius-xs);
}
.skeleton-title {
  height: 1.3rem;
  width: 45%;
  margin-bottom: 14px;
  border-radius: var(--radius-xs);
}
.skeleton-block {
  height: 80px;
  width: 100%;
  border-radius: var(--radius-lg);
}
/* Plan 117 — product deep-dive initial-load skeleton (shell.py) */
.forge-product-load-skeleton {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.forge-product-skeleton-header {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-width: 540px;
}
.forge-product-skeleton-subtitle {
  width: 55%;
  margin-bottom: 0;
}
.forge-product-skeleton-nav {
  width: 100%;
}
.forge-product-skeleton-nav-bar {
  display: block;
  height: 44px;
  width: 100%;
  border-radius: var(--radius-md);
}
.forge-product-stage-skeleton {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding: 16px 24px;
  box-sizing: border-box;
}
.forge-product-skeleton-line-short {
  width: 72%;
}

/* Plan 120 — alias validation hint on Fields rows (inline under value). */
.fields-task-validation {
  margin-top: 2px;
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.35;
}

@keyframes skeletonPulse {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

/* ======================================================================
 * Status pill helper (consolidated)
 * ====================================================================== */

.pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
  border: 1px solid transparent;
}
.pill-red {
  background: var(--tint-red);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-danger) 18%, transparent);
}
.pill-amber {
  background: var(--tint-amber);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-warning) 18%, transparent);
}
.pill-green {
  background: var(--tint-green);
  color: var(--brand-green);
  border-color: color-mix(in srgb, var(--status-success) 20%, transparent);
}
.pill-blue {
  background: var(--tint-blue);
  color: var(--brand-blue);
  border-color: color-mix(in srgb, var(--brand-blue) 20%, transparent);
}
.pill-purple {
  background: var(--brand-ai-tint);
  color: var(--brand-ai);
  border-color: color-mix(in srgb, var(--brand-ai) 20%, transparent);
}
.pill-slate {
  background: var(--tint-slate);
  color: var(--text-secondary);
  border-color: color-mix(in srgb, var(--brand-slate) 18%, transparent);
}
/* Plan 75: canonical interactive filter chip. Replaces hand-rolled
 * border-radius:999px filter buttons in gaps.py / data.py. ``.active`` is
 * the selected state; pair the label with a "Label · N" count. */
.forge-chip--pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  transition:
    background 120ms ease-out,
    color 120ms ease-out,
    border-color 120ms ease-out;
}
.forge-chip--pill:hover {
  background: var(--tint-slate);
  color: var(--text-primary);
}
.forge-chip--pill:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}
.forge-chip--pill.active {
  background: var(--surface-control-active);
  color: var(--text-primary);
  border-color: var(--border-control-active);
}
.pill-sub {
  margin-left: 4px;
  font-weight: 500;
  opacity: 0.78;
  font-size: var(--text-xs);
}

/* ----------------------------------------------------------------------
 * Plan 61 Phase D — pill confidence indicator
 *
 * When a pill carries ``data-confidence`` we render a soft 2px band
 * along the bottom edge whose width tracks the confidence value. Reads
 * as a quiet "Osperan is N% confident" cue without competing visually
 * with the status colour the pill already communicates.
 * ---------------------------------------------------------------------- */
.pill[data-confidence],
.badge[data-confidence] {
  position: relative;
  padding-bottom: 4px;
}
.pill[data-confidence]::after,
.badge[data-confidence]::after {
  content: "";
  position: absolute;
  left: 6px;
  right: 6px;
  bottom: 2px;
  height: 2px;
  border-radius: var(--radius-xs);
  background: linear-gradient(
    90deg,
    currentColor 0%,
    currentColor calc(var(--pill-confidence, 0) * 1%),
    color-mix(in srgb, var(--brand-slate) 18%, transparent) calc(var(--pill-confidence, 0) * 1%),
    color-mix(in srgb, var(--brand-slate) 18%, transparent) 100%
  );
  opacity: 0.55;
}
.pill[data-confidence="0"]::after,
.badge[data-confidence="0"]::after {
  display: none;
}
/* The Python helper renders ``style="--pill-confidence:N;"`` inline so
   the CSS gradient picks up the exact percentage without needing one
   selector per integer. */

/* ----------------------------------------------------------------------
 * Plan 61 Phase D — confidence_bar_html
 * Compact bar+label rendered inline next to status pills across the
 * portfolio / workstation / picker / feed views.
 * ---------------------------------------------------------------------- */
.confidence-bar {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-muted);
  line-height: 1;
  white-space: nowrap;
}
.confidence-bar__track {
  display: inline-block;
  width: var(--confidence-track, 64px);
  height: 4px;
  border-radius: var(--radius-xs);
  background: color-mix(in srgb, var(--brand-slate) 22%, transparent);
  overflow: hidden;
  position: relative;
}
.confidence-bar__fill {
  display: block;
  height: 100%;
  width: 100%;
  border-radius: inherit;
  background: var(--brand-blue);
  transform-origin: left center;
  transition: transform 280ms ease-out;
}
/* All confidence tiers use brand-blue fill — the bar width communicates the
   score; the color does not need to encode a tier (Plan 288). */
.confidence-bar--green .confidence-bar__fill {
  background: var(--brand-blue);
}
.confidence-bar--amber .confidence-bar__fill {
  background: var(--brand-blue);
}
.confidence-bar--red .confidence-bar__fill {
  background: var(--brand-blue);
}
.confidence-bar--slate .confidence-bar__fill {
  background: var(--brand-blue);
}
.confidence-bar__track {
  background: var(--tint-blue);
}
.confidence-bar__label {
  font-variant-numeric: tabular-nums;
}
@media (prefers-reduced-motion: reduce) {
  .confidence-bar__fill {
    transition: none;
  }
}

/* ----------------------------------------------------------------------
 * Plan 61 Phase D — subreason chips
 *
 * The same chip family is reused inline next to status pills (where it
 * acts as an AI-derived "why" suffix) and inside KPI / deep-dive
 * surfaces (where it explains what Osperan concluded). Each chip carries
 * a 16px material icon so it visually clusters with other AI cues.
 * ---------------------------------------------------------------------- */
.subreason-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.2;
  color: var(--text-secondary);
  background: var(--tint-slate);
  border: 1px solid color-mix(in srgb, var(--brand-slate) 18%, transparent);
  white-space: nowrap;
}
.subreason-chip .material-icons {
  font-size: var(--text-xs);
  opacity: 0.75;
}
.subreason-chip--amber {
  background: var(--tint-amber);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-warning) 18%, transparent);
}
.subreason-chip--red {
  background: var(--tint-red);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-danger) 20%, transparent);
}
.subreason-chip--green {
  background: var(--tint-green);
  color: var(--brand-green);
  border-color: color-mix(in srgb, var(--status-success) 20%, transparent);
}
.subreason-chip--blue {
  background: var(--tint-blue);
  color: var(--brand-blue);
  border-color: color-mix(in srgb, var(--brand-blue) 20%, transparent);
}

/* ----------------------------------------------------------------------
 * Plan 61 Phase D — workstation reasoning timeline
 *
 * Collapsible vertical log of "what Osperan did + the outcome" entries
 * shown beneath each workstation task. Renders as a quiet, audit-grade
 * artifact so the operator can trace the AI's chain of reasoning even
 * after the task moves out of "AI running".
 * ---------------------------------------------------------------------- */
.workstation-reasoning-timeline {
  margin-top: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  background: var(--bg-card);
  padding: 0;
  overflow: hidden;
}
.workstation-reasoning-timeline > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--brand-blue);
  cursor: pointer;
  list-style: none;
}
.workstation-reasoning-timeline > summary::-webkit-details-marker {
  display: none;
}
.workstation-reasoning-timeline > summary .material-icons {
  font-size: var(--text-base);
  color: var(--brand-blue);
}
.workstation-reasoning-count {
  margin-left: auto;
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-muted);
  background: var(--tint-blue);
  padding: 1px 8px;
  border-radius: var(--radius-pill);
}
.workstation-reasoning-list {
  list-style: none;
  margin: 0;
  padding: 4px 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-top: 1px solid var(--border);
}
.workstation-reasoning-entry {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 10px;
  align-items: start;
  padding-top: 8px;
  position: relative;
}
.workstation-reasoning-entry::before {
  content: "";
  position: absolute;
  left: 60px;
  top: 18px;
  bottom: -10px;
  width: 1px;
  background: color-mix(in srgb, var(--brand-slate) 30%, transparent);
}
.workstation-reasoning-entry:last-child::before {
  display: none;
}
.workstation-reasoning-time {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  padding-top: 2px;
  text-align: right;
}
.workstation-reasoning-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: var(--text-sm);
  color: var(--text-primary);
}
.workstation-reasoning-step {
  font-weight: 600;
}
.workstation-reasoning-outcome {
  font-size: var(--text-xs);
  color: var(--text-secondary);
  font-weight: 500;
}

/* ======================================================================
 * Product page — multi-cert redesign (Plan: Phase 4 cert-switch UX)
 * Cross-fade utility used on the main pane and the cert rail group
 * when the focused obligation changes; ``forge-fade-active`` is the
 * one-shot trigger class added to the holder by the shell on switch.
 * ====================================================================== */

.forge-fade {
  transition: opacity 150ms ease-out;
}
.forge-fade-active {
  opacity: 0.35;
}

/* Focused-pill reinforcement — wedge points down at the cert rail,
   sibling pills hover-lift slightly so the row feels live. */
.forge-oblig-pill {
  position: relative;
}
.forge-oblig-pill.is-focused::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -7px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid var(--brand-blue);
}
.forge-oblig-pill.is-clickable:hover {
  transform: translateY(-1px);
  box-shadow: 0 1px 4px rgba(var(--navy-rgb), 0.08);
}

/*
 * Product-page LHS stage rail.
 *
 * ``min-width`` / ``max-width`` used to be inline styles on the
 * ``ui.column()`` that owns this rail (see frontend/views/
 * product_page/rail.py:render_rail). We moved them here so the
 * responsive ``@media`` rule below can override them — inline
 * styles win over media-query rules.
 */
.forge-rail {
  min-width: 212px;
  max-width: 228px;
  padding: 8px 4px;
}

/*
 * Below ~1100px viewport width (typical for narrow demo monitors,
 * 13" laptops, or split-screen reviews) the product detail page is
 * tight: a 240-280px filter rail elsewhere in the chrome plus this
 * 220px rail leaves the main panel below 700px. Collapsing the rail
 * to icon-only buys ~170px back. Labels are still reachable via
 * each item's ``title=`` tooltip — the JSON nav state is unchanged.
 */
@media (max-width: 1100px) {
  .forge-rail {
    min-width: 56px;
    max-width: 56px;
    padding: 8px 0;
  }
  .forge-rail .forge-rail-item {
    justify-content: center;
    padding: 8px 4px !important;
  }
  .forge-rail .forge-rail-item-label,
  .forge-rail .forge-rail-badge,
  .forge-rail .forge-rail-section-text,
  .forge-rail .forge-rail-section-sub {
    display: none;
  }
  .forge-rail .forge-rail-section {
    padding: 6px 4px !important;
    text-align: center;
  }
  /* Keep the cert-section accent (it uses a top border, not the
     * label) so users still see the visual divider between the
     * product half and the cert half of the rail. */
}

/* Cert rail section gets a coloured top border that matches the
   focused obligation's pill colour. The shell sets the colour via
   a CSS custom property (``--cert-accent``) on the rail container. */
.forge-rail-section.is-cert {
  border-top: 2px solid var(--cert-accent, var(--brand-blue));
  margin-top: 6px;
  padding-top: 10px;
}

/* Breadcrumb in the page header (cert-scoped stages only). */
.forge-cert-crumb {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
  font-size: var(--text-sm);
  color: var(--text-secondary);
  margin: 6px 0 -2px 0;
}
.forge-cert-crumb .crumb-sep {
  color: var(--text-muted);
  opacity: 0.55;
}
.forge-cert-crumb .crumb-cert {
  color: var(--cert-accent, var(--brand-blue));
  font-weight: 700;
  cursor: pointer;
  border-bottom: 1px dashed transparent;
}
.forge-cert-crumb .crumb-cert:hover {
  border-bottom-color: var(--cert-accent, var(--brand-blue));
}
.forge-cert-crumb .crumb-stage {
  color: var(--text-primary);
  font-weight: 600;
}

/* Sources stage — responsive document library.
   Rows behave like compact cards so long filenames and feed chips wrap
   inside the product detail pane instead of squeezing fixed columns. */
.forge-sources-toolbar {
  flex-wrap: wrap;
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--tint-slate);
}
.forge-source-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.forge-source-card {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(280px, 420px);
  align-items: center;
  gap: 18px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  box-shadow: var(--shadow-sm);
}
.forge-source-card.is-superseded {
  opacity: 0.66;
  background: color-mix(in srgb, var(--bg-card) 74%, var(--tint-slate));
}
.forge-source-main {
  min-width: 0;
}
.forge-source-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 700;
}
.forge-source-card.is-superseded .forge-source-title {
  font-style: italic;
}
.forge-source-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 3px;
  color: var(--text-muted);
  font-size: var(--text-sm);
}
.forge-source-error {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: var(--text-sm);
}
.forge-source-status-block {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: center;
  gap: 12px;
}
.forge-source-state {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}
.forge-source-state .forge-source-status-note {
  color: var(--text-muted);
  font-size: var(--text-sm);
  line-height: 1.25;
}
.forge-source-external-declaration {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  flex-wrap: wrap;
}
.forge-source-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  flex-wrap: wrap;
}
@media (max-width: 1100px) {
  .forge-source-card {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  details.forge-source-card > summary {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .forge-source-status-block {
    grid-template-columns: minmax(0, 1fr);
    justify-items: end;
  }
}
@media (max-width: 760px) {
  .forge-source-card {
    grid-template-columns: minmax(0, 1fr);
  }
  .forge-source-status-block {
    justify-self: start;
    justify-items: start;
  }
  .forge-source-actions {
    justify-content: flex-start;
  }
}

/* ======================================================================
 * Source slot (required document slots — extraction review gate)
 * ====================================================================== */

.forge-required-slots {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-top: var(--space-3);
}

.forge-source-slot {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  border: 1px solid var(--border-muted);
  background: var(--surface-elevated);
}

.forge-source-slot--missing {
  border-color: var(--color-warning-border);
  background: var(--color-warning-surface);
}

.forge-source-slot--review-required {
  border-color: var(--color-info-border);
  background: var(--color-info-surface);
}

/* ======================================================================
 * Toast / notification restyle (Quasar q-notification override)
 * ====================================================================== */

.q-notification {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-lg) !important;
  padding: 12px 16px !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-sm);
  border-left: 3px solid var(--brand-blue) !important;
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
}
.q-notification--negative {
  border-left-color: var(--text-primary) !important;
}
.q-notification--warning {
  border-left-color: var(--text-primary) !important;
}
.q-notification--positive {
  border-left-color: var(--brand-green) !important;
}
.q-notification--info {
  border-left-color: var(--brand-blue) !important;
}

/* ======================================================================
 * Refined card shadows (layered) + Ask Osperan inline panel
 * ====================================================================== */

.card {
  box-shadow: var(--shadow-md);
}
.card:hover {
  box-shadow: var(--shadow-lg);
}
.kpi-tile {
  box-shadow: var(--shadow-md);
}
.kpi-tile.clickable:hover,
.kpi-tile.clickable:focus-visible {
  box-shadow: var(--shadow-lg);
}
.queue-card {
  box-shadow: var(--shadow-md);
}

/* Ask Osperan — floating user-initiated assistant, separate from activity status. */
.forge-ask-floating {
  position: fixed;
  right: 24px;
  bottom: 74px;
  top: auto;
  transform: none;
  z-index: 61;
  font-family: inherit;
  pointer-events: none;
}
.forge-ask-floating-trigger,
.forge-ask-floating-panel {
  pointer-events: auto;
}
.forge-ask-floating-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-width: 0;
  max-width: 280px;
  padding: 8px 14px 8px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-md, 0 6px 18px rgba(var(--navy-rgb), 0.08));
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 700;
  cursor: pointer;
  transition:
    transform 140ms cubic-bezier(0.25, 0, 0, 1),
    box-shadow 140ms cubic-bezier(0.25, 0, 0, 1);
}
.forge-ask-floating-trigger:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(var(--navy-rgb), 0.12);
}
.forge-ask-floating-trigger:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}
.forge-ask-floating-trigger > .material-icons {
  color: var(--brand-ai);
  flex: 0 0 auto;
}
.forge-ask-floating-trigger .forge-ask-caret {
  transition: transform 0.15s cubic-bezier(0.25, 0, 0, 1);
  color: var(--text-muted);
  flex: 0 0 auto;
}
.forge-ask-floating-trigger[aria-expanded="true"] .forge-ask-caret {
  transform: rotate(180deg);
}
.forge-ask-trigger-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1 1 auto;
  min-width: 0;
}
.forge-ask-floating-panel {
  position: absolute;
  right: calc(100% + 10px);
  bottom: 0;
  top: auto;
  transform: none;
  display: none;
  width: 420px;
  max-height: min(640px, calc(100vh - 48px));
  overflow-y: auto;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: 0 18px 36px rgba(var(--navy-rgb), 0.16);
}
.forge-ask-floating.is-open .forge-ask-floating-panel {
  display: block;
}
.forge-ask-floating-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  background: var(--bg-card);
  z-index: 1;
}
.forge-ask-floating-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.forge-ask-floating-title .material-icons {
  color: var(--brand-ai);
  font-size: var(--text-md);
}
.forge-ask-floating-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  border-radius: var(--radius-md);
}
.forge-ask-floating-close:hover {
  background: var(--tint-slate);
}
.forge-ask-floating-close:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 1px;
}
.forge-ask-floating .forge-ask-body {
  padding: 12px 14px 14px;
}
.forge-ask-dismiss-sticky {
  position: absolute;
  top: 8px;
  right: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: transparent;
  border: 0;
  border-radius: var(--radius-md);
  cursor: pointer;
  color: var(--text-muted);
}
.forge-ask-dismiss-sticky:hover {
  background: var(--tint-slate);
}
.forge-ask-dismiss-sticky .material-icons {
  font-size: var(--text-base);
}

@media (prefers-reduced-motion: reduce) {
  .forge-ask-floating-trigger,
  .forge-ask-floating-trigger .forge-ask-caret {
    transition: none;
  }
}

.forge-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Preset / recents chip layout */
.forge-ask-presets {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 4px 0 12px;
}
.forge-ask-presets:empty {
  display: none;
}
.forge-ask-preset-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.forge-ask-preset-group-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.forge-ask-preset-group-title {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.forge-ask-clear {
  background: transparent;
  border: none;
  padding: 0;
  font-size: var(--text-xs);
  color: var(--text-secondary);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.forge-ask-clear:hover {
  color: var(--text-primary);
}
.forge-ask-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.forge-ask-chip {
  border: 1px solid var(--border);
  background: var(--bg-card);
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  color: var(--text-primary);
  cursor: pointer;
  transition:
    background 0.12s cubic-bezier(0.25, 0, 0, 1),
    border-color 0.12s cubic-bezier(0.25, 0, 0, 1);
  max-width: 100%;
  text-align: left;
  line-height: 1.2;
}
.forge-ask-chip:hover {
  background: var(--tint-slate);
  border-color: var(--border-strong);
}
.forge-ask-chip--recent {
  color: var(--text-secondary);
}

/* Legacy check/warn inline icons used inside ui.html fragments */
.i-check-ok::before {
  content: "check_circle";
  font-family: "Material Icons";
  font-size: var(--text-sm);
  color: var(--brand-green);
  vertical-align: -2px;
  margin-right: 4px;
}
.i-warn::before {
  content: "warning";
  font-family: "Material Icons";
  font-size: var(--text-sm);
  color: var(--text-primary);
  vertical-align: -2px;
  margin-right: 4px;
}
.i-x-fail::before {
  content: "cancel";
  font-family: "Material Icons";
  font-size: var(--text-sm);
  color: var(--text-primary);
  vertical-align: -2px;
  margin-right: 4px;
}
.i-chev::before {
  content: "chevron_right";
  font-family: "Material Icons";
  font-size: var(--text-base);
  vertical-align: -3px;
  margin-left: 2px;
}

/* Plan 801: :active press feedback for buttons and interactive surfaces.
 * Scale-down gives instant "click registered" tactile feedback before
 * navigation completes. Scoped to q-btn so Quasar handles disabled state. */
.q-btn:not(.disabled):not([disabled]):active {
  transform: scale(0.98);
  transition: transform 0.05s;
}

/* Honor user preference for reduced motion — Plan 798: consolidated block.
 * All animation and transition declarations in this file are suppressed here.
 * Local @media (prefers-reduced-motion) blocks near each animation are kept
 * for readability; this block is the authoritative catch-all. */
@media (prefers-reduced-motion: reduce) {
  .kpi-tile,
    .queue-card,
    .side-section,
    .cert-card,
    .reg-sidebar-card,
    .metric-mini,
    .card,
    .next-action-btn,
    .xray-spotlight,
    .provenance-badge,
    .forge-sidebar,
    .forge-nav-link,
    .forge-collapse-btn,
    .forge-collapse-btn .material-icons,
    .forge-page,
    /* Plan 798 additions */
    .forge-help-backdrop,
    .reg-monitor-panel.panel-enter,
    .kpi-strip[data-kpi-scope],
    .kpi-shimmer-item::after,
    .progress-bar .fill,
    .forge-bulk-review-pulse-dot,
    .forge-gap-skeleton,
    .forge-ps-skeleton-row,
    .forge-preconditions-pulse {
    transition: none !important;
    animation: none !important;
  }
  .nap-spin {
    animation: none;
    border-right-color: currentColor;
  }
  .skeleton {
    animation: none;
    background: var(--tint-slate);
  }
  /* Plan 801: suppress active-state scale under reduced-motion preference */
  .q-btn:not(.disabled):not([disabled]):active {
    transform: none;
  }
}

/* ======================================================================
 * Help popover (page-level contextual help panel)
 * ====================================================================== */

.forge-help-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(var(--navy-rgb), 0.45);
  z-index: 9999;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 72px 20px 20px;
  animation: forgePageFade 0.15s ease-out;
}
.forge-help-panel {
  width: min(360px, 92vw);
  background: var(--bg-card);
  color: var(--text-primary);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-xl);
  padding: 18px 20px;
}
.forge-help-title {
  font-size: var(--text-base);
  font-weight: 700;
  margin-bottom: 8px;
}
.forge-help-body {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  line-height: 1.5;
  margin-bottom: 14px;
}
.forge-help-shortcuts {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  background: var(--tint-slate);
  border-radius: var(--radius-md);
  margin-bottom: 14px;
}
.forge-help-shortcuts > div {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--text-sm);
  color: var(--text-secondary);
}
.forge-help-shortcuts kbd {
  font-family: "SF Mono", ui-monospace, monospace;
  font-size: var(--text-xs);
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-bottom-width: 2px;
  border-radius: var(--radius-xs);
  padding: 1px 6px;
  color: var(--text-primary);
}
.forge-help-close {
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  border: none;
  padding: 6px 14px;
  font-size: var(--text-sm);
  font-weight: 600;
  border-radius: var(--radius-sm);
  cursor: pointer;
}
.forge-help-close:hover {
  filter: brightness(1.08);
}

/* ======================================================================
 * Portfolio Impact tab (Regulatory Monitor)
 * ====================================================================== */

/* Impact chip — pill button used in the Regulation chip ribbon.
 * Width is capped so long titles get a clean single-line ellipsis
 * instead of wrapping mid-word; height is fixed so chips line up
 * across rows even when one is the active filled state. */
.impact-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 220px;
  height: 28px;
  padding: 0 12px;
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition:
    transform 0.08s cubic-bezier(0.25, 0, 0, 1),
    filter 0.12s cubic-bezier(0.25, 0, 0, 1),
    box-shadow 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.impact-chip:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
}
.impact-chip.active {
  box-shadow: 0 0 0 2px var(--border-blue);
}
.impact-chip-dot {
  flex: 0 0 auto;
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.impact-chip-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.impact-chip-count {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 18px;
  padding: 0 6px;
  font-size: var(--text-xs);
  font-weight: 600;
  background: rgba(var(--navy-rgb), 0.08);
  color: inherit;
  border-radius: var(--radius-pill);
  margin-left: 2px;
}
.impact-chip.impact-chip-all.active .impact-chip-count {
  background: rgba(var(--card-rgb), 0.22);
}

/* Fixed table layout pins each column's rendered width to the
 * ``width`` attribute on its <th> regardless of content length.
 * Without this, long category names (e.g. "Articulating hedge
 * trimmers", "Combi trimmers (modular)") stretch their columns
 * past the JS auto-fit estimate and the rightmost rendered column
 * gets clipped at the card edge. */
.impact-matrix {
  table-layout: fixed;
  /* `width: 100%` (the old default) made the table always match the
     * card width, so column widths were *compressed* and
     * `overflow-x: auto` never gained scroll width. Use max-content
     * against the *fixed* <th> widths so the real grid is at least
     * as wide as regulation + (visible categories × 116) + total; add
     * `min-width: 100%` so a sparse / narrow matrix still fills the
     * scroll strip when the intrinsic width is smaller. */
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
/* Category column header — wrap long names onto two lines instead
 * of forcing the column wider. Hyphenation keeps awkward breaks
 * like "Brushcut-/ters" rare and the hard cap stops a single
 * long word from blowing the column. */
.impact-matrix-col-name {
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  line-height: 1.15;
}
.impact-matrix td button.impact-cell:hover {
  transform: scale(1.02);
  filter: brightness(1.04);
}
.impact-matrix td button.impact-cell:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}
.impact-matrix thead th:first-child {
  z-index: 2;
  box-shadow: 1px 0 0 var(--border) inset;
}

/* Make the horizontal scroller obvious when categories overflow the
 * viewport — a flush-to-edge thin scrollbar that doesn't disappear
 * on mac-style auto-hide. Users should know there's more to see. */
#impact-matrix-scroll {
  /* In flex row layouts, the default `min-width: auto` can block
     * horizontal overflow; allow the strip to size to the card and
     * scroll the wider table. */
  min-width: 0;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
#impact-matrix-scroll::-webkit-scrollbar {
  height: 10px;
}
#impact-matrix-scroll::-webkit-scrollbar-track {
  background: var(--tint-slate);
  border-radius: var(--radius-sm);
}
#impact-matrix-scroll::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: var(--radius-sm);
}
#impact-matrix-scroll::-webkit-scrollbar-thumb:hover {
  background: var(--text-secondary);
}

/* Inline "show all N" convenience link inside the matrix hint —
 * lets the user widen the default auto-fit crop without hunting
 * for checkboxes in the left rail. */
#impact-matrix-hint .rm-show-all-cats {
  background: transparent;
  border: none;
  color: var(--brand-blue);
  font-weight: 600;
  font-size: var(--text-sm);
  cursor: pointer;
  padding: 0;
}
#impact-matrix-hint .rm-show-all-cats:hover {
  text-decoration: underline;
}
#impact-matrix-hint .rm-show-all-cats[data-hidden="1"] {
  display: none;
}

.impact-brief-card {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(360px, 1.15fr);
  gap: 16px;
  align-items: stretch;
  width: 100%;
  padding: 16px;
  background: linear-gradient(135deg, var(--bg-card), var(--tint-blue));
  border: 1px solid var(--border-cool);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-sm);
}
.impact-brief-copy {
  min-width: 0;
}
.impact-brief-eyebrow {
  margin-bottom: 4px;
  color: var(--brand-blue);
  font-size: var(--text-xs);
  font-weight: var(--font-weight-display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.impact-brief-title {
  color: var(--text-primary);
  font-size: var(--text-base);
  font-weight: var(--font-weight-display);
  line-height: 1.25;
}
.impact-brief-body {
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.45;
}
.impact-brief-body strong {
  color: var(--text-primary);
}
.impact-brief-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}
.impact-brief-stat {
  min-width: 0;
  padding: 10px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.impact-brief-stat strong {
  display: block;
  overflow: hidden;
  color: var(--text-primary);
  font-size: var(--text-base);
  font-weight: var(--font-weight-display);
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.impact-brief-stat span {
  display: block;
  margin-top: 4px;
  color: var(--text-muted);
  font-size: var(--text-xs);
  line-height: 1.25;
}
@media (max-width: 1120px) {
  .impact-brief-card {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .impact-brief-stats {
    grid-template-columns: 1fr;
  }
}

.impact-timeline-bar {
  transition:
    filter 0.12s cubic-bezier(0.25, 0, 0, 1),
    transform 0.08s cubic-bezier(0.25, 0, 0, 1);
}
.impact-timeline-bar:hover {
  filter: brightness(1.08);
}
.impact-timeline-bar:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}
.impact-timeline {
  width: 100%;
  min-width: 0;
}
.impact-timeline-row {
  width: 100%;
  min-width: 0;
}
.impact-bar-wrapper {
  min-width: 0;
}

.impact-view-toggle .impact-view-btn + .impact-view-btn {
  border-left: 0;
}
.impact-view-toggle .impact-view-btn:hover:not([data-active="true"]) {
  background: var(--tint-slate);
}

/* ======================================================================
 * Regulatory Monitor redesign (segmented tabs, dense rows, facets,
 * detail drawer). Phase 1+ from docs/TODO-regulatory-accept-flow.md.
 * ====================================================================== */

/* Canonical underline tabs. Every view shares this visual treatment;
 * local scope classes may adjust placement and spacing only. */
.seg-tabs {
  display: flex;
  width: 100%;
  min-width: 0;
  gap: 4px;
  margin: 0 0 18px;
  max-width: 100%;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
}
.seg-tabs::-webkit-scrollbar {
  display: none;
}
.seg-tab {
  appearance: none;
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  margin-bottom: 0;
  padding: 10px 14px;
  font-family: inherit;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-secondary);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  transition:
    color var(--motion-base) var(--ease-out-quart),
    border-color var(--motion-base) var(--ease-out-quart);
}
.seg-tab:hover {
  color: var(--text-primary);
}
.seg-tab.active {
  color: var(--brand-blue);
  font-weight: 700;
  border-bottom-color: var(--brand-blue);
}
.seg-tab-icon {
  font-size: var(--text-md);
}
.seg-tab-count {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-muted);
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 2px 8px;
  min-width: 22px;
  text-align: center;
}
.seg-tab.active .seg-tab-count {
  color: var(--brand-blue);
  border-color: var(--border-strong);
  background: var(--bg-soft);
}

/* Plan 350: Signals badge — red count indicator on the Signals tab header. */
.forge-tab-badge {
  background: var(--accent-red);
  color: var(--color-white);
  border-radius: 9999px;
  font-size: 0.6875rem;
  padding: 1px 6px;
  margin-left: 6px;
  vertical-align: middle;
}

.seg-panels {
  width: 100%;
}
.seg-panel {
  display: none;
  width: 100%;
}

/* CSS-level fallback: server-rendered data-active-tab makes the default panel
 * visible before JS bootBar() runs. Lower specificity than .seg-panel.active
 * so JS class state takes over once the component mounts. */
[data-active-tab="queue"] .seg-panel[data-tab="queue"] {
  display: block;
}
[data-active-tab="overview"] .seg-panel[data-tab="overview"] {
  display: block;
}
[data-active-tab="coverage"] .seg-panel[data-tab="coverage"] {
  display: block;
}
[data-active-tab="feed"] .seg-panel[data-tab="feed"] {
  display: block;
}
[data-active-tab="actions"] .seg-panel[data-tab="actions"] {
  display: block;
}
[data-active-tab="matrix"] .seg-panel[data-tab="matrix"] {
  display: block;
}
[data-active-tab="sources"] .seg-panel[data-tab="sources"] {
  display: block;
}
[data-active-tab="gaps"] .seg-panel[data-tab="gaps"] {
  display: block;
}
[data-active-tab="declare"] .seg-panel[data-tab="declare"] {
  display: block;
}
[data-active-tab="activity"] .seg-panel[data-tab="activity"] {
  display: block;
}
[data-active-tab="settings"] .seg-panel[data-tab="settings"] {
  display: block;
}
[data-active-tab="scope"] .seg-panel[data-tab="scope"] {
  display: block;
}
[data-active-tab="document-templates"] .seg-panel[data-tab="document-templates"] {
  display: block;
}
[data-active-tab="confirm-requirements"] .seg-panel[data-tab="confirm-requirements"] {
  display: block;
}
[data-active-tab="incoming"] .seg-panel[data-tab="incoming"] {
  display: block;
}
[data-active-tab="source_scans"] .seg-panel[data-tab="source_scans"] {
  display: block;
}
[data-active-tab="accepted_authority"] .seg-panel[data-tab="accepted_authority"] {
  display: block;
}
[data-active-tab="impact"] .seg-panel[data-tab="impact"] {
  display: block;
}

.seg-panel.active {
  display: block;
}

/* Plan 1521: seg-panel CSS-level fallbacks for routes added after the
 * original static list. Mirrors the pattern on lines 1639–1680. */
[data-active-tab="market"] .seg-panel[data-tab="market"] {
  display: block;
}
[data-active-tab="reference"] .seg-panel[data-tab="reference"] {
  display: block;
}
[data-active-tab="roadmap"] .seg-panel[data-tab="roadmap"] {
  display: block;
}
[data-active-tab="allocation"] .seg-panel[data-tab="allocation"] {
  display: block;
}
[data-active-tab="performance"] .seg-panel[data-tab="performance"] {
  display: block;
}
[data-active-tab="members"] .seg-panel[data-tab="members"] {
  display: block;
}

/* Plan 1521: prevent wide tables inside monitoring and team panels from
 * creating horizontal page overflow. */
.monitoring-tab-content,
.monitoring-tab-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
  min-width: 0;
  width: 100%;
}.monitoring-panels .monitoring-radar-queue,
.team-panels,
.team-workload-panels {
  overflow-x: auto;
  max-width: 100%;
}

.forge-radar-signal-cell .forge-radar-signal-title,
.forge-radar-signal-cell .forge-radar-signal-sub {
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  word-break: break-word;
}

.forge-radar-signal-sub {
  display: block;
  margin-top: var(--space-1, 4px);
  color: var(--text-muted);
  font-size: var(--text-sm, 0.875rem);
}

.monitoring-interpretations-shell {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
}

.monitoring-interpretations-heading {
  margin: 0 0 var(--space-2, 8px);
  font-size: var(--text-md, 1rem);
  font-weight: 600;
}

.monitoring-source-scans-shell {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
  width: 100%;
  min-width: 0;
}

.monitoring-source-scan-latest {
  align-items: start;
  background: var(--surface-muted);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  display: grid;
  gap: 4px;
  padding: 12px 14px;
}

.monitoring-source-scan-latest strong {
  color: var(--text-primary);
  font-weight: 750;
}

.monitoring-source-scan-latest span {
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
}

.monitoring-source-scan-run-cell,
.monitoring-source-scan-attention-cell,
.monitoring-source-scan-change-cell,
.monitoring-source-scan-review-cell,
.monitoring-source-scan-issue-cell {
  min-width: 0;
}

.monitoring-source-scan-run-cell strong,
.monitoring-source-scan-attention-cell strong,
.monitoring-source-scan-change-cell strong,
.monitoring-source-scan-review-cell strong,
.monitoring-source-scan-issue-cell strong {
  display: block;
  color: var(--text-primary);
  font-weight: 750;
}

.monitoring-source-scan-run-cell span,
.monitoring-source-scan-attention-cell span,
.monitoring-source-scan-change-cell span,
.monitoring-source-scan-review-cell span,
.monitoring-source-scan-issue-cell span {
  display: block;
  color: var(--text-secondary);
  overflow-wrap: normal;
  word-break: normal;
}

.monitoring-source-scan-run-cell small,
.monitoring-source-scan-change-cell small,
.monitoring-source-scan-review-cell small {
  display: block;
  color: var(--text-muted);
  font-size: 0.78rem;
  overflow-wrap: normal;
  word-break: normal;
}

.monitoring-source-scan-disclosure > summary {
  cursor: pointer;
  color: var(--text-primary);
  font-weight: 600;
}

.monitoring-source-scan-disclosure[open] > summary {
  margin-bottom: var(--space-3, 12px);
}

.monitoring-source-scan-detail-cell {
  min-width: 0;
}

.monitoring-source-scan-detail-panel {
  display: grid;
  gap: var(--space-4, 16px);
  min-width: 0;
  padding: 0;
}

.monitoring-source-scan-boundary {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.4;
}

.monitoring-source-scan-source-rows {
  display: grid;
  gap: 0;
  min-width: 0;
}

.monitoring-source-scan-source-row {
  align-items: start;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  display: grid;
  gap: 4px var(--space-2, 8px);
  grid-template-columns: minmax(180px, 1.1fr) minmax(92px, max-content) minmax(220px, 1.4fr) minmax(104px, max-content);
  min-width: 0;
  padding: 8px 0;
}

.monitoring-source-scan-source-row__name,
.monitoring-source-scan-source-row__result {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.monitoring-source-scan-source-row__name {
  color: var(--text-primary);
  font-weight: 600;
}

.monitoring-source-scan-source-row__status {
  font-weight: 650;
  white-space: nowrap;
}

.monitoring-source-scan-source-row__status.is-failed {
  color: var(--danger);
}

.monitoring-source-scan-source-row__status.is-changed {
  color: var(--accent);
}

.monitoring-source-scan-source-row__status.is-unchanged {
  color: var(--text-muted);
}

.monitoring-source-scan-source-row__result {
  color: var(--text-secondary);
}

.monitoring-source-scan-stages {
  border-left: 2px solid var(--border-subtle);
  color: var(--text-muted);
  display: grid;
  font-size: 0.78rem;
  gap: 3px;
  grid-column: 1 / -1;
  list-style: none;
  margin: 4px 0 0;
  min-width: 0;
  padding: 0 0 0 var(--space-2, 8px);
}

.monitoring-source-scan-source-row__link {
  color: var(--text-link);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.monitoring-source-scan-technical {
  grid-column: 1 / -1;
  color: var(--text-muted);
  font-size: 0.78rem;
}

.monitoring-source-scan-technical > summary {
  cursor: pointer;
  font-weight: 600;
}

.monitoring-source-scan-technical span {
  display: block;
  margin-top: 2px;
  overflow-wrap: anywhere;
}

.monitoring-source-scan-disclosure__empty {
  color: var(--text-muted);
}

.monitoring-accepted-authority-shell {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
}

.monitoring-accepted-authority-scope {
  min-width: 0;
}

.monitoring-accepted-authority {
  min-width: 0;
}

.monitoring-accepted-authority-section {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 8px);
}

.monitoring-accepted-authority-action {
  display: inline-flex;
  max-width: 100%;
}

.monitoring-authority-detail {
  display: grid;
  gap: var(--space-3, 12px);
  padding: var(--space-3, 12px);
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-card);
}

.monitoring-authority-decision-use-block {
  display: grid;
  gap: 2px;
}

.monitoring-authority-decision-use {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
  line-height: 1.5;
}

.monitoring-authority-audit-disclosure {
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg);
  padding: var(--space-2, 8px) var(--space-3, 12px);
}

.monitoring-authority-audit-disclosure > summary {
  cursor: pointer;
  color: var(--text-primary);
  font-size: var(--text-sm, 0.875rem);
  font-weight: 700;
}

.monitoring-authority-audit-disclosure > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.monitoring-authority-audit-hint {
  margin: var(--space-2, 8px) 0;
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
}

.monitoring-authority-source-guidance {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
  line-height: 1.5;
}

.forge-table-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3, 12px);
  flex-wrap: wrap;
  padding: var(--space-2, 8px) 0;
}

.forge-table-pagination__summary {
  color: var(--text-muted);
  font-size: var(--text-sm, 0.875rem);
  font-weight: 700;
}

.forge-table-pagination__controls {
  display: flex;
  align-items: center;
  gap: var(--space-2, 8px);
  flex-wrap: wrap;
}

.forge-table-pagination__button {
  white-space: nowrap;
}

.monitoring-authority-detail-kicker {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.monitoring-authority-detail-surface {
  width: 100%;
}

.monitoring-authority-detail-surface .forge-data-table th,
.monitoring-authority-detail-surface .forge-data-table td {
  vertical-align: top;
}

.monitoring-authority-detail-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3, 12px);
  flex-wrap: wrap;
}

.monitoring-authority-row-copy {
  display: grid;
  gap: 0.35rem;
}

.monitoring-authority-row-copy strong {
  color: var(--text-primary);
}

.monitoring-authority-row-detail {
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
}

.monitoring-authority-row-detail > summary {
  cursor: pointer;
  font-weight: 700;
}

.monitoring-authority-row-detail > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.monitoring-authority-row-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--space-2, 8px);
  min-width: 7.5rem;
}

.monitoring-authority-row-reason {
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
  overflow-wrap: anywhere;
}

.monitoring-authority-row-review-host:empty {
  display: none;
}

.monitoring-authority-row-review {
  display: grid;
  gap: var(--space-4, 16px);
  margin-top: var(--space-3, 12px);
  padding: var(--space-4, 16px);
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
}

.monitoring-authority-row-review-current {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(260px, 1.2fr);
  gap: var(--space-3, 12px);
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
}

.monitoring-authority-row-review-current__item {
  display: grid;
  align-content: start;
  gap: 4px;
  min-width: 0;
  padding-block: var(--space-2, 8px);
  border-top: 1px solid var(--border-subtle);
}

.monitoring-authority-row-review-current__item.is-wide {
  grid-column: 1 / -1;
}

.monitoring-authority-row-review-current__item span,
.monitoring-authority-row-review-section-title {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.monitoring-authority-row-review-current__item strong,
.monitoring-authority-row-review-current__item p {
  margin: 0;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}

.monitoring-authority-row-review-current__item p {
  line-height: 1.45;
}

.monitoring-authority-row-review-fields,
.monitoring-authority-row-review-notes {
  display: grid;
  gap: var(--space-3, 12px);
  width: 100%;
}

.monitoring-authority-row-review-fields {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.monitoring-authority-row-review-field {
  min-width: 0;
}

.monitoring-authority-row-review-field.is-wide {
  grid-column: 1 / -1;
}

.monitoring-authority-row-review-actions {
  justify-content: flex-end;
}

@media (max-width: 720px) {
  .monitoring-authority-row-review-current {
    grid-template-columns: 1fr;
  }
}

.forge-conn-intake-list {
  margin: var(--space-2, 8px) 0 0;
  padding-left: 1.1rem;
}

.forge-conn-intake-item {
  margin-bottom: var(--space-1, 4px);
  font-size: var(--text-sm, 0.875rem);
}

.forge-conn-intake-status {
  color: var(--text-muted);
}

/* Regulatory Monitor body shell. Header, KPIs, and primary tabs are page-level
 * chrome; the rail and RHS content render as separate cards inside this shell. */
.reg-monitor-body {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}

/* Panel swap driven by data-active-tab on a root wrapper.
 * Panels that are not active are visually hidden but kept in the DOM
 * so their NiceGUI state survives tab switches. */
.reg-monitor {
  width: 100%;
}
.reg-monitor-panel {
  display: none;
  width: 100%;
}
.reg-monitor[data-active-tab="feed"] .reg-monitor-panel[data-tab="feed"] {
  display: block;
}
.reg-monitor[data-active-tab="inbox"] .reg-monitor-panel[data-tab="inbox"] {
  display: block;
}
.reg-monitor[data-active-tab="proposals"]
  .reg-monitor-panel[data-tab="proposals"] {
  display: block;
}
.reg-monitor[data-active-tab="news"] .reg-monitor-panel[data-tab="news"] {
  display: block;
}
.reg-monitor[data-active-tab="watchlist"]
  .reg-monitor-panel[data-tab="watchlist"] {
  display: block;
}
.reg-monitor[data-active-tab="roadmap"] .reg-monitor-panel[data-tab="roadmap"] {
  display: block;
}
.reg-monitor[data-active-tab="impact"] .reg-monitor-panel[data-tab="impact"] {
  display: block;
}
.reg-monitor[data-active-tab="queue"] .reg-monitor-panel[data-tab="queue"] {
  display: block;
}
.reg-monitor[data-active-tab="team"] .reg-monitor-panel[data-tab="team"] {
  display: block;
}
.reg-monitor[data-active-tab="ongoing"] .reg-monitor-panel[data-tab="ongoing"] {
  display: block;
}
.reg-monitor[data-active-tab="completed"]
  .reg-monitor-panel[data-tab="completed"] {
  display: block;
}

/* Panel enter animation: subtle fade+lift on tab switch. */
@keyframes regPanelEnter {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.reg-monitor-panel.panel-enter {
  animation: regPanelEnter 150ms cubic-bezier(0.25, 0, 0, 1) forwards;
}

/* KPI shimmer while tiles are loading (aria-busy="true" on the strip).
   Uses transform: translateX for GPU compositing instead of background-position (Plan 476). */
@keyframes kpiShimmerSlide {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(200%);
  }
}
.forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-value,
.forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-label,
.forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-meta {
  position: relative;
  background: var(--tint-slate);
  overflow: hidden;
  border-radius: var(--radius-xs);
  color: transparent !important;
  min-width: 48px;
  display: inline-block;
  user-select: none;
}
.forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-value::after,
.forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-label::after,
.forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-meta::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(var(--card-rgb), 0.4) 50%,
    transparent 100%
  );
  transform: translateX(-100%);
  animation: kpiShimmerSlide 1.2s ease-in-out infinite;
}

/* Canonical AI action chrome — button + optional helper metadata. */
.forge-ai-action-cluster,
.reg-scan-cluster {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.forge-ai-action-cluster:not(.reg-scan-cluster) {
  justify-content: space-between;
  width: 100%;
}
.forge-ai-action-cluster--inline {
  justify-content: flex-start;
}
.forge-ai-action-copy {
  min-width: 220px;
  flex: 1 1 280px;
}
.forge-ai-action-title {
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.forge-ai-action-helper {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  line-height: 1.45;
  margin-top: 2px;
}
.forge-ai-action-controls {
  justify-content: flex-end;
}
.forge-ai-action-meta,
.reg-scan-timestamp {
  font-size: var(--text-sm);
  color: var(--text-muted);
}
.reg-scan-timestamp {
  white-space: nowrap;
}
.forge-ai-action-meta strong,
.reg-scan-timestamp strong {
  color: var(--text-secondary);
  font-weight: 600;
}

/* Regulatory triage lane chips.
   Per-lane accent flows in via the inline --chip-color custom property
   set by _triage_chips_html() (red / amber / slate / purple). */
.forge-triage-strip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.forge-triage-chips {
  display: inline-flex;
  align-items: stretch;
  gap: 6px;
  flex-wrap: wrap;
}
.forge-triage-chip {
  --chip-color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px 3px 4px;
  border-radius: var(--radius-pill);
  border: 1px solid color-mix(in srgb, var(--chip-color) 32%, transparent);
  background: color-mix(in srgb, var(--chip-color) 7%, var(--bg-card));
  color: var(--text-primary);
  font-size: var(--text-sm);
  line-height: 1.2;
  white-space: nowrap;
  transition:
    background 0.15s cubic-bezier(0.25, 0, 0, 1),
    border-color 0.15s cubic-bezier(0.25, 0, 0, 1),
    opacity 0.15s cubic-bezier(0.25, 0, 0, 1);
}
.forge-triage-chip:hover {
  background: color-mix(in srgb, var(--chip-color) 14%, var(--bg-card));
  border-color: color-mix(in srgb, var(--chip-color) 55%, transparent);
}
.forge-triage-chip-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: var(--radius-pill);
  background: var(--chip-color);
  color: var(--color-white);
  font-size: var(--text-xs);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.forge-triage-chip-label {
  font-weight: 600;
  color: var(--text-primary);
}
.forge-triage-chip[data-zero="1"] {
  opacity: 0.62;
}
.forge-triage-chip[data-zero="1"] .forge-triage-chip-count {
  background: var(--text-muted);
}

.forge-triage-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-ai);
  box-shadow: 0 0 0 0 var(--brand-ai-glow);
  animation: forge-triage-pulse 1.4s ease-out infinite;
  flex: 0 0 auto;
}
@keyframes forge-triage-pulse {
  0% {
    box-shadow: 0 0 0 0 var(--brand-ai-glow);
  }
  70% {
    box-shadow: 0 0 0 10px transparent;
  }
  100% {
    box-shadow: 0 0 0 0 transparent;
  }
}
@media (prefers-reduced-motion: reduce) {
  .forge-triage-pulse {
    animation: none;
  }
}
.forge-triage-strip[data-streaming="1"] .forge-triage-chip {
  border-style: dashed;
}

/* AI-assisted primary actions — slate pill via --button-ai-* tokens.
   Distinct from orange business CTAs (.forge-btn--primary / --button-primary-*).
   Adds the `is-processing` state with a pulse-ring affordance
   so AI surfaces have a non-color cue for live work.
   `is-processing` is owned by frontend.ui.ai_processing
   (`ai_action_lifecycle`); feature views must not toggle it directly. */
.q-btn.forge-btn--ai {
  border-radius: var(--radius-pill);
  padding: 8px 14px;
  min-height: 36px;
  font-weight: var(--font-weight-display);
  letter-spacing: 0;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--button-ai-bg) 22%, transparent);
  transition:
    transform 0.14s var(--ease-out-quart),
    box-shadow 0.14s var(--ease-out-quart),
    filter 0.14s var(--ease-out-quart);
}
.q-btn.forge-btn--ai:not(.disabled) {
  background: linear-gradient(
    135deg,
    var(--button-ai-bg),
    var(--button-ai-bg-hover)
  ) !important;
  color: var(--button-ai-text) !important;
}
.q-btn.forge-btn--ai:not(.disabled):hover {
  box-shadow: 0 10px 22px color-mix(in srgb, var(--button-ai-bg) 30%, transparent);
  filter: brightness(1.03);
  transform: translateY(-1px);
}
.q-btn.forge-btn--ai:active {
  filter: brightness(0.88);
  transform: scale(0.98) translateY(0.5px);
  box-shadow: 0 4px 10px color-mix(in srgb, var(--button-ai-bg) 20%, transparent);
}
.q-btn.forge-btn--ai .q-btn__content {
  gap: 6px;
  flex-wrap: nowrap;
}
.q-btn.forge-btn--ai .forge-ai-mark {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  display: block;
  order: -1;
  filter: brightness(0) invert(1);
}
.q-btn.forge-btn--ai .q-icon,
.q-btn.forge-btn--ai .material-icons {
  font-size: var(--text-md);
}
.q-btn.forge-btn--ai.disabled,
.q-btn.forge-btn--ai[disabled] {
  background: var(--border-strong) !important;
  color: var(--button-ai-text) !important;
  box-shadow: none;
  opacity: 0.75 !important;
}
.q-btn.forge-btn--ai:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--button-ai-bg) 45%, transparent);
  outline-offset: 2px;
}

/* Button taxonomy (Plan 87) — ghost / primary / danger.
   `button(tone=...)` in frontend/components/shared.py applies these classes;
   without rules here Quasar fills the gap with its default blue, so every
   non-AI button renders blue regardless of tone. All three are scoped to
   `.q-btn` so they win against Quasar's base button styles. */
.q-btn.forge-btn--ghost {
  border-radius: var(--radius-pill);
  padding: 6px 14px;
  min-height: 34px;
  font-weight: var(--font-weight-display);
  letter-spacing: 0;
  background: transparent !important;
  background: var(--button-secondary-bg) !important;
  border: 1px solid var(--button-secondary-border) !important;
  color: var(--button-secondary-text) !important;
  box-shadow: none;
  transition:
    background 0.14s var(--ease-out-quart),
    border-color 0.14s var(--ease-out-quart),
    color 0.14s var(--ease-out-quart);
}
.q-btn.forge-btn--ghost:not(.disabled):hover {
  background: var(--button-secondary-bg-hover) !important;
  border-color: var(--button-secondary-bg-hover) !important;
  color: var(--button-secondary-text-hover) !important;
}
.q-btn.forge-btn--ghost.disabled,
.q-btn.forge-btn--ghost[disabled] {
  opacity: 0.55 !important;
}
.q-btn.forge-btn--ghost:focus-visible {
  outline: 2px solid var(--border-control-active);
  outline-offset: 2px;
}

.q-btn.forge-btn--primary {
  border-radius: var(--radius-pill);
  padding: 6px 14px;
  min-height: 34px;
  font-weight: var(--font-weight-display);
  letter-spacing: 0;
  background: var(--button-primary-bg) !important;
  border: 1px solid var(--button-primary-border) !important;
  color: var(--button-primary-text) !important;
  box-shadow: none;
  transition:
    filter 0.14s var(--ease-out-quart),
    transform 0.14s var(--ease-out-quart);
}
.q-btn.forge-btn--primary:not(.disabled):hover {
  background: var(--button-primary-bg-hover) !important;
  border-color: var(--button-primary-bg-hover) !important;
  filter: none;
}
.q-btn.forge-btn--primary:active {
  background: var(--button-primary-bg-active) !important;
  border-color: var(--button-primary-bg-active) !important;
  transform: translateY(0.5px);
}
.q-btn.forge-btn--primary.disabled,
.q-btn.forge-btn--primary[disabled] {
  opacity: 0.6 !important;
}
.q-btn.forge-btn--primary:focus-visible {
  outline: 2px solid var(--button-primary-bg);
  outline-offset: 2px;
}

.q-btn.forge-btn--danger {
  border-radius: var(--radius-pill);
  padding: 6px 14px;
  min-height: 34px;
  font-weight: var(--font-weight-display);
  letter-spacing: 0;
  background: var(--button-danger-bg) !important;
  border: 1px solid var(--button-danger-border) !important;
  color: var(--button-danger-text) !important;
  box-shadow: none;
  transition:
    background 0.14s var(--ease-out-quart),
    filter 0.14s var(--ease-out-quart);
}
.q-btn.forge-btn--danger:not(.disabled):hover {
  background: var(--button-danger-bg-hover) !important;
}
.q-btn.forge-btn--danger.disabled,
.q-btn.forge-btn--danger[disabled] {
  opacity: 0.55 !important;
}
.q-btn.forge-btn--danger:focus-visible {
  outline: 2px solid var(--brand-red);
  outline-offset: 2px;
}

.q-btn.forge-btn--manual {
  border-radius: var(--radius-pill);
  padding: 6px 14px;
  min-height: 34px;
  font-weight: var(--font-weight-display);
  letter-spacing: 0;
  background: transparent !important;
  border: 1px solid var(--brand-brown) !important;
  color: var(--brand-brown) !important;
  box-shadow: none;
  transition:
    background 0.14s var(--ease-out-quart),
    border-color 0.14s var(--ease-out-quart),
    color 0.14s var(--ease-out-quart);
}
.q-btn.forge-btn--manual:not(.disabled):hover {
  background: color-mix(in srgb, var(--brand-brown) 10%, var(--bg-card)) !important;
}
.q-btn.forge-btn--manual.disabled,
.q-btn.forge-btn--manual[disabled] {
  opacity: 0.55 !important;
}
.q-btn.forge-btn--manual:focus-visible {
  outline: 2px solid var(--brand-brown);
  outline-offset: 2px;
}
/* AI processing affordance — pulse-ring around the button while an AI op
   is in flight. Toggled by adding `is-processing` class (or
   `data-processing="true"` on a sibling AI surface). */
.q-btn.forge-btn--ai.is-processing,
.forge-ai-surface[data-processing="true"] {
  animation: pulse-ring 1.6s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.forge-ai-processing {
  margin-top: 8px;
  padding: 12px 14px;
  background: var(--bg-card);
  border: 1px solid color-mix(in srgb, var(--brand-ai) 24%, var(--border));
  border-left: 3px solid var(--brand-ai);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-sm);
  max-width: 520px;
}
.forge-ai-processing__head {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--brand-ai-hover);
  font-size: var(--text-sm);
  font-weight: 700;
}
.forge-ai-processing__detail {
  margin-top: 6px;
  color: var(--text-secondary);
  font-size: var(--text-sm);
}
@media (prefers-reduced-motion: reduce) {
  .q-btn.forge-btn--ai {
    transition: none;
  }
  .q-btn.forge-btn--ai:not(.disabled):hover,
  .q-btn.forge-btn--ai:active {
    transform: none;
  }
  .q-btn.forge-btn--ai.is-processing,
  .forge-ai-surface[data-processing="true"] {
    animation: none;
  }
  button.forge-btn--ai {
    transition: none;
  }
  button.forge-btn--ai:not([disabled]):hover,
  button.forge-btn--ai:active {
    transform: none;
  }
}

/* Native HTML actions (button_html and action links) — mirror Plan 87 Quasar tones. */
.forge-btn {
  appearance: none;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-sizing: border-box;
  text-decoration: none;
  line-height: 1.3;
  white-space: nowrap;
  border-radius: var(--radius-pill);
  padding: 6px 14px;
  min-height: 34px;
  font-weight: var(--font-weight-display);
  letter-spacing: 0;
  transition:
    background 0.14s var(--ease-out-quart),
    border-color 0.14s var(--ease-out-quart),
    color 0.14s var(--ease-out-quart),
    filter 0.14s var(--ease-out-quart),
    transform 0.14s var(--ease-out-quart);
}
.forge-btn--sm {
  padding: 4px 10px;
  min-height: 28px;
  font-size: var(--text-sm);
}
.forge-btn .material-icons {
  font-size: var(--text-base);
}
.forge-btn--ghost {
  background: var(--button-secondary-bg);
  border: 1px solid var(--button-secondary-border);
  color: var(--button-secondary-text);
}
.forge-btn--ghost:not([disabled]):not([aria-disabled="true"]):hover {
  background: var(--button-secondary-bg-hover);
  border-color: var(--button-secondary-bg-hover);
  color: var(--button-secondary-text-hover);
}
.forge-btn--ghost[disabled],
.forge-btn--ghost[aria-disabled="true"] {
  opacity: 0.55;
  cursor: not-allowed;
}
.forge-btn--ghost:focus-visible {
  outline: 2px solid var(--border-control-active);
  outline-offset: 2px;
}
.forge-btn--primary {
  background: var(--button-primary-bg);
  border: 1px solid var(--button-primary-border);
  color: var(--button-primary-text);
}
.forge-btn--primary:not([disabled]):not([aria-disabled="true"]):hover {
  background: var(--button-primary-bg-hover);
  border-color: var(--button-primary-bg-hover);
  filter: none;
}
.forge-btn--primary:active {
  background: var(--button-primary-bg-active);
  border-color: var(--button-primary-bg-active);
  transform: translateY(0.5px);
}
.forge-btn--primary[disabled],
.forge-btn--primary[aria-disabled="true"] {
  opacity: 0.6;
  cursor: not-allowed;
}
.forge-btn--primary:focus-visible {
  outline: 2px solid var(--button-primary-bg);
  outline-offset: 2px;
}
.forge-btn--danger {
  background: var(--button-danger-bg);
  border: 1px solid var(--button-danger-border);
  color: var(--button-danger-text);
}
.forge-btn--danger:not([disabled]):not([aria-disabled="true"]):hover {
  background: var(--button-danger-bg-hover);
}
.forge-btn--danger[disabled],
.forge-btn--danger[aria-disabled="true"] {
  opacity: 0.55;
  cursor: not-allowed;
}
.forge-btn--danger:focus-visible {
  outline: 2px solid var(--brand-red);
  outline-offset: 2px;
}
.forge-btn--manual {
  background: transparent;
  border: 1px solid var(--brand-brown);
  color: var(--brand-brown);
}
.forge-btn--manual:not([disabled]):not([aria-disabled="true"]):hover {
  background: color-mix(in srgb, var(--brand-brown) 10%, var(--bg-card));
}
.forge-btn--manual[disabled],
.forge-btn--manual[aria-disabled="true"] {
  opacity: 0.55;
  cursor: not-allowed;
}
.forge-btn--manual:focus-visible {
  outline: 2px solid var(--brand-brown);
  outline-offset: 2px;
}
button.forge-btn--ai {
  border-radius: var(--radius-pill);
  padding: 8px 14px;
  min-height: 36px;
  font-weight: var(--font-weight-display);
  letter-spacing: 0;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--button-ai-bg) 22%, transparent);
  background: linear-gradient(135deg, var(--button-ai-bg), var(--button-ai-bg-hover));
  color: var(--button-ai-text);
  border: none;
}
button.forge-btn--ai:not([disabled]):hover {
  box-shadow: 0 10px 22px color-mix(in srgb, var(--button-ai-bg) 30%, transparent);
  filter: brightness(1.03);
  transform: translateY(-1px);
}
button.forge-btn--ai:active {
  filter: brightness(0.88);
  transform: scale(0.98) translateY(0.5px);
  box-shadow: 0 4px 10px color-mix(in srgb, var(--button-ai-bg) 20%, transparent);
}
button.forge-btn--ai[disabled] {
  background: var(--border-strong);
  color: var(--button-ai-text);
  box-shadow: none;
  opacity: 0.75;
  cursor: not-allowed;
}
button.forge-btn--ai:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--button-ai-bg) 45%, transparent);
  outline-offset: 2px;
}

/* NOTE: the ghost / primary / danger tone rules live in the Plan 87 block
 * above (search ".q-btn.forge-btn--ghost"). An earlier Plan 56 duplicate of
 * those three blocks was removed here — two `!important` definitions of the
 * same selector made the resolved style depend on source order, which let
 * Quasar's default blue leak through on some buttons. One selector, one
 * definition. */

/* -- Segmented pill toggle --------------------------------------- */
.forge-pill-toggle {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 3px;
  gap: 2px;
  background: var(--bg-card);
  overflow-x: auto;
  scrollbar-width: thin;
}
.forge-pill-toggle__seg {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 5px 14px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--text-secondary);
  background: transparent;
  border: none;
  cursor: pointer;
  transition:
    background 0.12s,
    color 0.12s;
}
.forge-pill-toggle__seg.is-active {
  background: var(--surface-control-active);
  color: var(--text-primary);
}
.forge-pill-toggle__seg:not(.is-active):hover {
  background: var(--bg-hover, rgba(var(--navy-rgb), 0.04));
  color: var(--text-primary);
}
.forge-pill-toggle__seg:focus-visible {
  outline: 2px solid var(--border-control-active);
  outline-offset: 2px;
}
.forge-pill-toggle__seg.has-icon {
  gap: 4px;
  padding: 5px 12px;
}
.forge-pill-toggle__icon {
  font-size: 16px;
  line-height: 1;
  opacity: 0.8;
}
.forge-pill-toggle__seg.is-active .forge-pill-toggle__icon {
  opacity: 1;
}
.forge-pill-toggle__label {
  line-height: 1;
}
.forge-compliance-track-summary {
  margin: -2px 0 10px;
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.45;
}

/* ================================================================ */

/* ----------------------------------------------------------------
 * Low-emphasis AI trigger — used by ai_link_button() for inline
 * disclosure affordances inside chip rows / table cells. Pairs with
 * .forge-btn--ai (primary slate CTA) which is owned by
 * ai_action_button(). Visual baseline matches the previous bare
 * `ui.button(...).style("color:var(--brand-ai);opacity:0.9;")` link
 * that lived inline at gaps.py:1715 before the migration.
 * ---------------------------------------------------------------- */
.forge-btn--ai-link {
  color: var(--brand-ai);
  opacity: 0.9;
  font-size: 0.72rem;
  letter-spacing: 0;
}
.forge-btn--ai-link:hover {
  opacity: 1;
}
.forge-btn--ai-link[disabled],
.forge-btn--ai-link.disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* ----------------------------------------------------------------
 * Dense inbox row (Feed) — the "regulation_row" component.
 * Left 4px border takes the urgency color. Background stays neutral
 * so Feed no longer looks like a coloured card pile.
 * ---------------------------------------------------------------- */
.reg-row {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  align-items: start;
  gap: 12px;
  padding: 12px 16px 12px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-left: 4px solid var(--border-strong);
  border-radius: var(--radius-lg);
  margin-bottom: 6px;
  transition:
    background 0.12s cubic-bezier(0.25, 0, 0, 1),
    border-color 0.12s cubic-bezier(0.25, 0, 0, 1),
    box-shadow 0.12s cubic-bezier(0.25, 0, 0, 1);
  cursor: pointer;
}
.reg-row:hover {
  background: var(--bg-page);
  box-shadow: var(--shadow-sm);
}
.reg-row:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}
.reg-row.urg-high {
  border-left-color: var(--text-primary);
}
.reg-row.urg-medium {
  border-left-color: var(--text-primary);
}
.reg-row.urg-low {
  border-left-color: var(--brand-green);
}
.reg-row.is-read .reg-row-title {
  font-weight: 500;
  color: var(--text-secondary);
}
.reg-row.is-read {
  opacity: 0.85;
}
.reg-row--low-relevance {
  opacity: 0.55;
}
.reg-row--low-relevance .reg-row-title {
  font-weight: 400;
}
.reg-row--low-relevance .reg-ai-verdict {
  display: none;
}
.reg-row.urg-high {
  opacity: 1;
}
.reg-row.is-starred {
  background: var(--tint-amber);
}
.reg-row.is-starred .reg-row-title {
  color: var(--text-primary);
  font-weight: 600;
}
.reg-row-check {
  padding-top: 2px;
}
.reg-row-check input {
  width: 16px;
  height: 16px;
  cursor: pointer;
}
.reg-row-main {
  min-width: 0;
  grid-column: 2;
}
.reg-row-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 2px;
}
.reg-row-title {
  font-weight: 700;
  font-size: var(--text-sm);
  color: var(--text-primary);
  flex: 1 1 200px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.reg-row-meta {
  font-size: var(--text-sm);
  color: var(--text-muted);
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
}
.reg-row-meta .sep {
  opacity: 0.6;
}

/* News feed — table-internal bulk selection bar (Plan 204). Sits at the
 * top of ``.feed-rows`` so bulk actions read as row-list chrome, not a
 * standalone band above the data surface. */
.feed-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.feed-selection-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  background: var(--bg-page);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  margin-bottom: 2px;
}
.feed-selection-bar .rm-toolbar-left,
.feed-selection-bar .rm-toolbar-right {
  gap: 8px;
}

.reg-row-action {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  line-height: 1.4;
  margin-top: 4px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.reg-row-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}
.reg-row-side {
  text-align: right;
  min-width: 64px;
  font-size: var(--text-sm);
  color: var(--text-muted);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}
.reg-row-side .reg-row-count {
  font-weight: 700;
  color: var(--text-primary);
  font-size: var(--text-sm);
}

/* Regulatory Monitor — mapped-signal cards */
.reg-impact-path {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
}
.reg-impact-path-node {
  display: inline-flex;
  align-items: center;
  max-width: 260px;
  padding: 4px 8px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.reg-impact-path-node + .reg-impact-path-node::before {
  content: "\2192";
  color: var(--text-muted);
  margin-right: 8px;
  margin-left: -3px;
}
/* Small material-icon glyph in legacy bucket pills (Plan 202). */
.material-icons.rm-feed-icon-sm {
  font-size: 16px;
}
.reg-mapped-signals-title {
  display: flex;
  flex-direction: column;
  min-width: 220px;
  margin-right: 4px;
  padding: 8px 12px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.reg-mapped-signals-title strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}
.reg-mapped-signals-title span {
  color: var(--text-muted);
  font-size: var(--text-xs);
}
.reg-ai-verdict,
.reg-ai-confidence {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: var(--font-weight-display);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.reg-ai-verdict {
  color: var(--brand-blue);
  background: var(--tint-blue);
  border: 1px solid var(--border);
}
.reg-ai-confidence {
  color: var(--text-secondary);
  background: var(--tint-slate);
  border: 1px solid var(--border);
}
.reg-ai-reason,
.reg-ai-suggestion {
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.45;
}
.reg-ai-reason strong,
.reg-ai-suggestion strong {
  color: var(--text-primary);
}
.reg-ai-suggestion {
  padding: 8px 10px;
  background: var(--tint-blue);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.reg-row-reg-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.reg-row-reg-title {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  line-height: 1.4;
}
.reg-row-family-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.reg-ai-evidence {
  gap: 4px;
}
.reg-evidence-quote {
  display: block;
  margin-top: 4px;
  padding: 4px 10px;
  border-left: 3px solid var(--border-strong);
  color: var(--text-muted);
  font-size: var(--text-sm);
  font-style: italic;
  line-height: 1.45;
}
.reg-drawer-ai-summary {
  padding: 12px;
  margin-bottom: 10px;
  background: var(--tint-blue);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.reg-drawer-ai-summary .reg-impact-path {
  margin-top: 8px;
}

@media (max-width: 760px) {
  .reg-row {
    grid-template-columns: 24px 1fr;
  }
  .reg-row-side {
    grid-column: 2;
    align-items: flex-start;
    text-align: left;
  }
}

/* ----------------------------------------------------------------------
 * Regulatory Monitor — Plan 133 status strip (watchlist / in-scope counts)
 *
 * Python emits `.status-strip-label` + `.status-strip-count` as sibling
 * spans; flex gap supplies the space after the colon (avoid “Watchlist:0”).
 * ---------------------------------------------------------------------- */
.reg-monitor-status-strip {
  display: flex;
  flex-direction: column;
  gap: 6px;
  /* Nested inside .forge-page-header-zone; tight gap above (sits just under the title row),
       banners wrapper or KPI pane below owns its own spacing. */
  margin: 4px 0 0;
}
.status-strip-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
}
.status-strip-label {
  flex: 0 0 auto;
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}
.status-strip-count {
  flex: 0 0 auto;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}
.status-strip-pills {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.status-strip-pill {
  display: inline-flex;
  align-items: center;
  max-width: 240px;
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: var(--text-xs);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.feed-facet-group,
.rm-facet-group {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 10px 12px;
}
.feed-facet-title,
.rm-facet-title {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--brand-blue);
  margin-bottom: 8px;
}
.rm-facet-hint {
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-bottom: 6px;
  line-height: 1.35;
}
.feed-facet-option,
.rm-facet-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  font-size: var(--text-sm);
  color: var(--text-primary);
  cursor: pointer;
}
.feed-facet-option input,
.rm-facet-option input {
  accent-color: var(--brand-blue);
  cursor: pointer;
}
.feed-facet-option .count,
.rm-facet-option .count {
  margin-left: auto;
  font-size: var(--text-xs);
  color: var(--text-muted);
  font-weight: 600;
}
.feed-empty {
  font-size: var(--text-sm);
}

/* Toggle-pill list (jurisdiction / category) inside facet groups */
.facet-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.facet-pill {
  appearance: none;
  font-family: inherit;
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  font-weight: 600;
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  cursor: pointer;
  transition:
    background 0.12s cubic-bezier(0.25, 0, 0, 1),
    color 0.12s cubic-bezier(0.25, 0, 0, 1),
    border-color 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.facet-pill:hover {
  color: var(--text-primary);
  border-color: var(--border-strong);
}
.facet-pill.active {
  background: var(--tint-blue);
  color: var(--brand-blue);
  border-color: color-mix(in srgb, var(--brand-blue) 35%, transparent);
}

/* ----------------------------------------------------------------
 * Roadmap Gantt (Phase 3)
 * ---------------------------------------------------------------- */
.rm-gantt {
  position: relative;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 16px 20px 20px 20px;
  overflow-x: auto;
}
.rm-gantt-head {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 6px;
  font-size: var(--text-xs);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
}
.rm-gantt-row {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 16px;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px dashed var(--border);
}
.rm-gantt-row:last-child {
  border-bottom: none;
}
.rm-gantt-label {
  min-width: 0;
}
.rm-gantt-label-title {
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rm-gantt-label-sub {
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-top: 2px;
}
.rm-gantt-track {
  position: relative;
  height: 36px;
  background: var(--tint-slate);
  border-radius: var(--radius-sm);
}
.rm-gantt-today {
  position: absolute;
  top: -6px;
  bottom: -6px;
  width: 2px;
  background: var(--brand-blue);
  opacity: 0.85;
  z-index: 2;
}
.rm-gantt-today::before {
  content: "Today";
  position: absolute;
  top: -16px;
  left: 4px;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--brand-blue);
  background: var(--bg-card);
  padding: 0 4px;
  border-radius: var(--radius-xs);
}
.rm-gantt-bar {
  position: absolute;
  top: 3px;
  bottom: 3px;
  background: var(--tint-blue);
  border: 1px solid color-mix(in srgb, var(--brand-blue) 35%, transparent);
  border-radius: var(--radius-xs);
  overflow: hidden;
  cursor: pointer;
  transition: filter 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.rm-gantt-bar:hover {
  filter: brightness(1.05);
}
.rm-gantt-bar.urg-high {
  background: var(--tint-red);
  border-color: color-mix(in srgb, var(--status-danger) 40%, transparent);
}
.rm-gantt-bar.urg-medium {
  background: var(--tint-amber);
  border-color: color-mix(in srgb, var(--status-warning) 40%, transparent);
}
.rm-gantt-bar.urg-low {
  background: var(--tint-green);
  border-color: color-mix(in srgb, var(--status-success) 40%, transparent);
}
.rm-gantt-bar-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: color-mix(in srgb, var(--brand-blue) 25%, transparent);
}
.rm-gantt-bar.urg-high .rm-gantt-bar-fill {
  background: color-mix(in srgb, var(--status-danger) 30%, transparent);
}
.rm-gantt-bar.urg-medium .rm-gantt-bar-fill {
  background: color-mix(in srgb, var(--status-warning) 30%, transparent);
}
.rm-gantt-bar.urg-low .rm-gantt-bar-fill {
  background: color-mix(in srgb, var(--status-success) 35%, transparent);
}
.rm-gantt-bar-label {
  position: relative;
  z-index: 1;
  padding: 3px 8px;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Chip shown on rows whose real deadline falls past the axis cap
 * (currently 3 years). Pinned to the bar's right edge so the row
 * still signals "this exists, far future" without stretching the
 * shared axis for everyone else. */
.rm-gantt-far {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  padding: 1px 6px;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--text-primary);
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
}
.rm-gantt-axis {
  display: grid;
  gap: 0;
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-top: 6px;
  padding-left: 296px; /* matches label col + gap */
}
.rm-gantt-axis-tick {
  border-left: 1px dashed var(--border);
  padding: 2px 0 0 4px;
  white-space: nowrap;
}

/* Inline status pill (clickable to cycle) in the action plan table */
.rm-status-pill {
  appearance: none;
  border: 1px solid transparent;
  font-family: inherit;
  font-size: var(--text-xs);
  font-weight: 700;
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition:
    filter 0.12s cubic-bezier(0.25, 0, 0, 1),
    transform 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.rm-status-pill:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.rm-status-pill.s-not_started {
  background: var(--tint-red);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-danger) 25%, transparent);
}
.rm-status-pill.s-in_progress {
  background: var(--tint-amber);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-warning) 25%, transparent);
}
.rm-status-pill.s-done {
  background: var(--tint-green);
  color: var(--brand-green);
  border-color: color-mix(in srgb, var(--status-success) 25%, transparent);
}
.rm-status-pill.s-ai_working {
  background: var(--tint-blue);
  color: var(--brand-blue);
  border-color: color-mix(in srgb, var(--brand-blue) 25%, transparent);
}
.rm-status-pill.s-ready_for_review {
  background: var(--tint-amber);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-warning) 25%, transparent);
}
.rm-status-pill.s-blocked {
  background: var(--tint-red);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-danger) 25%, transparent);
}
.rm-status-pill.s-resolved {
  background: var(--tint-green);
  color: var(--brand-green);
  border-color: color-mix(in srgb, var(--status-success) 25%, transparent);
}

.rm-action-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 82px;
  min-height: 30px;
  padding: 8px 12px;
  border-radius: var(--radius-pill);
  border: 1px solid rgba(var(--card-rgb), 0.32);
  color: var(--color-white);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-display);
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.055em;
  white-space: nowrap;
  box-shadow:
    0 8px 18px rgba(var(--navy-rgb), 0.16),
    0 1px 2px rgba(var(--navy-rgb), 0.14);
  transition:
    box-shadow 0.12s cubic-bezier(0.25, 0, 0, 1),
    filter 0.12s cubic-bezier(0.25, 0, 0, 1),
    transform 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.rm-action-cta--review {
  background: linear-gradient(
    135deg,
    var(--brand-amber-bright),
    var(--brand-amber)
  );
}
.rm-action-cta--fix {
  background: linear-gradient(135deg, var(--brand-orange), var(--brand-red));
}
.rm-action-cta--resolved {
  background: linear-gradient(135deg, var(--brand-green), var(--brand-green));
}
.rm-action-cta:hover {
  color: var(--color-white);
  filter: brightness(1.06) saturate(1.08);
  transform: translateY(-2px);
  box-shadow:
    0 12px 24px rgba(var(--navy-rgb), 0.22),
    0 2px 4px rgba(var(--navy-rgb), 0.16);
}

/* Owner field (client-stub) */
.rm-owner-input {
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-primary);
  font-family: inherit;
  font-size: var(--text-sm);
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  max-width: 140px;
}
.rm-owner-input::placeholder {
  color: var(--text-muted);
}

/* Keep the shared section header spaced like a distinct Roadmap block. */
.rm-body > .forge-section-header {
  margin: 20px 0 10px 0;
  padding-top: 18px;
  border-top: 1px solid var(--border);
}
.rm-gantt-section {
  margin-bottom: 0;
}

/* ----------------------------------------------------------------
 * Regulation detail drawer (Phase 4)
 * ---------------------------------------------------------------- */
.reg-drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(var(--navy-rgb), 0.4);
  z-index: 9000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s cubic-bezier(0.25, 0, 0, 1);
}
.reg-drawer-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}
.reg-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  width: min(480px, 96vw);
  background: var(--bg-card);
  border-left: 1px solid var(--border);
  box-shadow: var(--shadow-xl);
  transform: translateX(100%);
  transition: transform 0.18s cubic-bezier(0.25, 0, 0, 1);
  z-index: 9001;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.reg-drawer.open {
  transform: translateX(0);
}
.reg-drawer-header {
  padding: 16px 20px 14px 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.reg-drawer-header-text {
  flex: 1;
  min-width: 0;
}
.reg-drawer-title {
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.3;
}
.reg-drawer-sub {
  font-size: var(--text-sm);
  color: var(--text-muted);
  margin-top: 4px;
}
.reg-drawer-close {
  appearance: none;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-secondary);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.12s;
}
.reg-drawer-close:hover {
  background: var(--tint-slate);
}
.reg-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px 20px 20px;
}
.reg-drawer-section {
  margin-bottom: 18px;
}
.reg-drawer-section-title {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--brand-blue);
  margin-bottom: 8px;
}
.reg-drawer-section-body {
  font-size: var(--text-sm);
  color: var(--text-primary);
  line-height: 1.5;
}
.reg-drawer-section-body .kv-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 10px;
  padding: 3px 0;
  font-size: var(--text-sm);
}
.reg-drawer-section-body .kv-row .kv-key {
  color: var(--text-muted);
  font-weight: 600;
}
.reg-drawer-footer {
  padding: 12px 20px;
  border-top: 1px solid var(--border);
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  background: var(--bg-page);
}

/* ----------------------------------------------------------------
 * Shared panel shell — identical frame every Monitor tab renders
 * into. Left rail + body column; toolbar sits at the top of the
 * body column (NOT above the rail) so the rail can stay tall and
 * scroll independently on deep tables.
 * ---------------------------------------------------------------- */
.rm-panel-layout {
  display: grid;
  grid-template-columns: minmax(0, 240px) minmax(0, 1fr);
  gap: 20px;
  width: 100%;
  align-items: start;
  isolation: isolate;
}
/* Products page needs a wider rail than the Monitor (more facet groups). */
.product-picker-layout {
  grid-template-columns: minmax(0, 280px) minmax(0, 1fr);
}
/* Facet groups inside the products rail are rendered as a single ui.html
 * slot (not individual flex children), so the parent gap: 12px doesn't
 * reach between them. Adjacent-sibling margin adds the gap only between
 * consecutive groups without affecting the SEARCH card above. */
.product-picker-facets .rm-facet-group + .rm-facet-group {
  margin-top: 12px;
}
/* Narrow the facet rail on mid-sized viewports so the Gantt /
 * matrix body gets more horizontal budget. Below ~980 px the rail
 * collapses to a single column (see full-collapse rule below). */
@media (max-width: 1360px) {
  .rm-panel-layout {
    grid-template-columns: minmax(0, 210px) minmax(0, 1fr);
    gap: 16px;
  }
  .product-picker-layout {
    grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
  }
}
@media (max-width: 1200px) {
  .rm-panel-layout {
    grid-template-columns: minmax(0, 188px) minmax(0, 1fr);
    gap: 14px;
  }
  .product-picker-layout {
    grid-template-columns: minmax(0, 230px) minmax(0, 1fr);
  }
}
@media (max-width: 980px) {
  .rm-panel-layout {
    grid-template-columns: 1fr;
  }
}
/* Rail-collapsed state: user toggled the rail off via the Monitor
 * "Hide filters" button; body reclaims the full grid column. A
 * floating "Show filters" pill appears in the body toolbar. */
.rm-panel-layout[data-rail-collapsed="1"] {
  grid-template-columns: minmax(0, 1fr);
}
.rm-panel-layout[data-rail-collapsed="1"] .rm-facets {
  display: none;
}
/* .rm-facets is the canonical left-rail filter container. */
.rm-facets {
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: sticky;
  top: 72px;
  z-index: 2;
  align-self: start;
  width: 100%;
  min-width: 0;
}
.rm-facets-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 28px;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--brand-blue);
  font-weight: 700;
}
.rm-facets-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.rm-facets-toggle,
.rm-facets-clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  min-height: 44px;
  padding: 2px 8px;
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-secondary);
  cursor: pointer;
  line-height: 1;
  text-decoration: none;
  /* Reset text-transform/letter-spacing inherited from .rm-facets-header
       so the buttons render mixed-case ("Clear" / "Hide") while the
       parent header span ("Filters") keeps its uppercase eyebrow style. */
  text-transform: none;
  letter-spacing: 0;
  transition:
    background 0.12s cubic-bezier(0.25, 0, 0, 1),
    color 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.rm-facets-toggle:hover,
.rm-facets-clear:hover {
  background: var(--tint-slate);
  color: var(--text-primary);
}
.rm-show-filters {
  display: none;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 4px 12px;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-secondary);
  cursor: pointer;
}
.rm-show-filters:hover {
  background: var(--tint-slate);
  color: var(--text-primary);
}
.rm-show-filters .material-icons {
  font-size: var(--text-base);
}
.rm-panel-layout[data-rail-collapsed="1"] .rm-show-filters {
  display: inline-flex;
}
.rm-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  position: relative;
  z-index: 1;
}
/* Plan 41 — .product-picker-scope-row retired. The owner-scope and
   view-mode pill toggles now mount inside render_page_header's right-
   aligned actions slot; the layout chrome that wrapped them is no
   longer needed. */

.rm-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
/* Two-row toolbar variant: controls row on top, chip ribbon below,
 * both inside a single white bordered card. The modifier overrides
 * the single-row flex layout so the card stacks vertically and
 * stretches its children to full width. */
.rm-toolbar--with-chips {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 0;
}
.rm-toolbar--with-chips .rm-toolbar-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 14px;
}
.rm-toolbar--with-chips .rm-toolbar-left {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.rm-toolbar--with-chips .rm-chip-cloud {
  border-top: 1px solid var(--border);
  grid-template-rows: 44px;
}
.rm-toolbar--with-chips .rm-chip-cloud__inner {
  padding: 6px 14px 10px;
}
.rm-toolbar--with-chips .rm-chip-cloud[data-expanded="1"] {
  grid-template-rows: 320px;
}
/* Timestamp shown after a successful fetch-news cycle */
.forge-ai-action-meta {
  font-size: var(--text-sm);
  color: var(--text-muted);
  white-space: nowrap;
}
.rm-toolbar-left {
  flex: 1 1 auto;
  min-width: 0;
  font-size: var(--text-sm);
  color: var(--text-secondary);
  display: flex;
  align-items: center;
  gap: 10px;
}
.rm-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
/* Impact regulation chip ribbon — pill-row that lives just below
 * the toolbar. Default state shows up to ``--rm-chip-row-cap``
 * pixels (≈ one row of pills); the trailing "+N more" toggle in
 * the same row flips ``data-expanded="1"`` to reveal the rest
 * inline. We use ``max-height`` (not ``display:none`` per chip)
 * so the transition is smooth and the chips remain in DOM order
 * for tab/keyboard navigation. */
.rm-chip-cloud {
  --chip-cloud-max: min(400px, 50vh);
  display: grid;
  grid-template-rows: 44px; /* one comfortable row of chips */
  overflow: hidden;
  transition: grid-template-rows 200ms cubic-bezier(0.25, 0, 0, 1);
}
.rm-chip-cloud[data-expanded="1"] {
  grid-template-rows: var(--chip-cloud-max);
  overflow-y: auto;
  scrollbar-width: thin;
}
.rm-chip-cloud[data-expanded="1"]::-webkit-scrollbar {
  width: 6px;
}
.rm-chip-cloud[data-expanded="1"]::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: var(--radius-xs);
}
.rm-chip-cloud__inner {
  min-height: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 6px 2px 2px 2px;
}
.rm-chip-more-wrap {
  display: inline-flex;
  margin-left: auto;
}
.rm-chip-more {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 12px;
  background: var(--bg-card);
  border: 1px dashed var(--border-strong);
  color: var(--text-secondary);
  border-radius: var(--radius-pill);
  font-weight: 600;
  font-size: var(--text-sm);
  cursor: pointer;
  white-space: nowrap;
  transition:
    background 0.12s cubic-bezier(0.25, 0, 0, 1),
    color 0.12s cubic-bezier(0.25, 0, 0, 1),
    border-color 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.rm-chip-more:hover {
  background: var(--tint-slate);
  color: var(--text-primary);
  border-style: solid;
}

/* Roadmap "showing X of Y" + filter-hint messaging (sits in the
 * toolbar left slot; separates cleanly from any view toggle on
 * the right). */
.rm-toolbar-hint {
  font-size: var(--text-sm);
  color: var(--text-muted);
}

/* Page-level context-aware KPI strips — both sets are emitted
 * server-side, the inactive scope gets inline display:none so the
 * correct strip shows on first paint without a JS flash. Tiny
 * listener (see regulatory_monitor.py) flips them on tab change. */
/* Monitor strips have 4 tiles (default: Unread / Actions / At risk /
 * Next deadline; impact: Revenue / In scope / Exposure / Next),
 * not 6 like the Portfolio dashboard. Override the global
 * Portfolio-tailored 6-column default so the 4 tiles fill the
 * full page width instead of leaving two empty columns on the
 * right. 4×1 → 2×2 on narrower viewports. */
.kpi-strip[data-kpi-scope] {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1100px) {
  .kpi-strip[data-kpi-scope] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* Demo polish: soft fade-in when a scoped KPI strip transitions
 * from display:none back to its default display (triggered by
 * tab-change JS). display:none itself blocks transitions so we
 * use an `animation` which re-runs whenever the element enters
 * the render tree. prefers-reduced-motion callers skip it. */
.kpi-strip[data-kpi-scope] {
  animation: kpi-strip-fade-in 180ms ease-out;
}
@keyframes kpi-strip-fade-in {
  from {
    opacity: 0;
    transform: translateY(-2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .kpi-strip[data-kpi-scope] {
    animation: none;
  }
}
/* Demo polish: skeleton shimmer for KPI tiles whose backing data
 * is still loading — replaces the old "—" + "loading…" placeholder
 * so first paint on Overview doesn't look broken. See kpi_tile.py
 * ``skeleton=True`` path. */
.kpi-skeleton {
  position: relative;
  display: block;
  border-radius: var(--radius-xs);
  background: var(--border);
  overflow: hidden;
}
.kpi-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(var(--card-rgb), 0.4) 50%,
    transparent 100%
  );
  transform: translateX(-100%);
  animation: kpiShimmerSlide 1.4s ease-in-out infinite;
}
.kpi-skeleton-value {
  height: 1.6rem;
  width: 70%;
}
.kpi-skeleton-sublabel {
  height: 0.7rem;
  width: 45%;
  margin-top: 6px;
}
@media (prefers-reduced-motion: reduce) {
  .kpi-skeleton {
    animation: none;
    opacity: 0.5;
  }
  .kpi-skeleton::after {
    animation: none;
  }
  .forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-value::after,
  .forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-label::after,
  .forge-kpi-pane .kpi-strip[aria-busy="true"] .kpi-meta::after {
    animation: none;
  }
}
/* Demo polish: the Overview hero subtitle appends a snapshot + velocity
 * clause once those land, so on narrow viewports it can wrap to 3+
 * lines and shove the KPI strip down. Clamp every page-header
 * subtitle to 2 lines; any longer message should live in a tooltip
 * or an info card below the header. */
/* Plan 72: page-title type scale tokenised — was a hardcoded 1.5rem inline
 * style in page_header._TITLE_STYLE. --text-xl ≈ clamp(1.25rem,1.5vw,1.75rem),
 * which matches the prior 1.5rem at typical workspace widths. */
.forge-page-title {
  font-size: var(--text-xl);
  line-height: 1.2;
  font-weight: 600;
  color: var(--text-primary);
  letter-spacing: -0.01em;
  margin: 0;
}
.forge-page-subtitle {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.875rem;
  line-height: 1.25rem;
  color: var(--text-secondary);
  margin-top: 6px;
}
/* Industry Benchmark two-column page layout: main content + sticky
 * 320px Market Activity rail. CSS Grid keeps the rail anchored in its
 * column regardless of main-content height changes (tab switching).
 * Collapses to a single column below 900px. */
.benchmark-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 24px;
  align-items: start;
}
@media (max-width: 900px) {
  .benchmark-layout {
    grid-template-columns: 1fr;
  }
}
.benchmark-th {
  padding: 12px 16px;
  color: var(--text-secondary);
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  background: var(--bg-page);
  border-bottom: 1px solid var(--border);
}
.benchmark-th--left {
  text-align: left;
}
.benchmark-th--right {
  text-align: right;
}
.benchmark-row--self {
  background: var(--tint-blue);
}
.benchmark-rank {
  width: 48px;
  color: var(--text-muted);
  font-weight: 600;
}
.benchmark-company {
  font-weight: 500;
  color: var(--text-primary);
}
.benchmark-company--self {
  font-weight: 700;
  color: var(--brand-blue);
}
.benchmark-num {
  text-align: right;
  color: var(--text-secondary);
}
.benchmark-strong {
  font-weight: 600;
  color: var(--text-primary);
}
.benchmark-muted {
  font-size: 0.75rem;
  color: var(--text-muted);
}
.benchmark-updated {
  color: var(--text-muted);
  font-size: 0.8rem;
}
.benchmark-metric-cell {
  text-align: right;
}
.benchmark-metric {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.benchmark-metric .progress-bar {
  flex: 0 0 80px;
  max-width: 80px;
}
.benchmark-metric-value {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--text-primary);
}
/* Facet options for the shared rail — Roadmap & Impact pick up
 * the same look the Feed rail already has via .feed-facet-option
 * but use this new class so selectors are clean. */
.rm-facet-group {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 12px 14px;
  box-shadow: var(--shadow-sm);
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  overflow: hidden;
}
.rm-facet-title {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--brand-blue);
  margin-bottom: 10px;
}
.rm-facet-hint {
  margin: -3px 0 8px;
  font-size: var(--text-xs);
  line-height: 1.3;
  color: var(--text-muted);
}
/* SSR-style search form used in the workstation/roadmap rails (anchor-link
 * paradigm). Submits via Enter to the page route with hidden inputs that
 * preserve the rest of the active filters. */
.rm-facet-search {
  display: block;
  margin: 0;
}
.rm-facet-search input[type="text"] {
  width: 100%;
  box-sizing: border-box;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--bg-page);
  color: var(--text-primary);
  font-size: var(--text-sm);
  line-height: 1.25;
  outline: none;
  transition:
    border-color 0.12s cubic-bezier(0.25, 0, 0, 1),
    box-shadow 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.rm-facet-search input[type="text"]:focus {
  border-color: var(--brand-blue);
  box-shadow: 0 0 0 3px var(--tint-blue);
}
.rm-facet-search input[type="text"]::placeholder {
  color: var(--text-muted);
}
.rm-facet-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  /* Breathing room — the rail used to feel "squeezed" because
       28px rows with 3px padding stack into a wall of dense lines
       once a page has 6–9 facet groups. 30px + 5px padding
       lets the labels relax without changing the type scale. */
  min-height: 30px;
  padding: 4px 0;
  font-size: var(--text-sm);
  color: var(--text-primary);
  cursor: pointer;
  line-height: 1.3;
}
.rm-facet-option > span:not(.dot):not(.count) {
  min-width: 0;
  overflow-wrap: anywhere;
}
.rm-facet-option input {
  accent-color: var(--brand-blue);
  cursor: pointer;
  width: 13px;
  height: 13px;
  margin: 0;
  flex: 0 0 auto;
}
.rm-facet-option .count {
  margin-left: auto;
  font-size: var(--text-xs);
  color: var(--text-muted);
  font-weight: 600;
}
.rm-facet-option .dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--border-strong);
  flex: 0 0 auto;
}
.rm-facet-option.urg-high .dot {
  background: var(--brand-red);
}
.rm-facet-option.urg-medium .dot {
  background: var(--brand-amber-bright);
}
.rm-facet-option.urg-low .dot {
  background: var(--brand-green);
}

/* ---------------------------------------------------------------------
 * Briefing hero — the page's headline AI moment, mounted above the
 * KPI strip on the manager dashboard. While the simulated stream is
 * active a status row with a pulsing dot surfaces work-in-progress
 * messages; once a "done" event lands the caller flips streaming off
 * and the typewriter caret hides.
 * ------------------------------------------------------------------- */
.ai-insights-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 20px;
  width: 100%;
  box-sizing: border-box;
}
.ai-insights-card__label {
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  color: var(--text-secondary);
  font-weight: 700;
  margin-bottom: 8px;
}
.ai-insights-card__empty {
  font-size: 0.88rem;
  color: var(--text-primary);
}
.ai-insights-footer {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
  font-size: 0.78rem;
  color: var(--text-secondary);
}
.ai-insight-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 0;
  font-size: 0.88rem;
  color: var(--text-primary);
  line-height: 1.4;
  flex-wrap: wrap;
}
.ai-insight-row__text {
  flex: 1;
  min-width: 0;
}
.briefing-link {
  color: var(--brand-blue);
  text-decoration: none;
  border-bottom: 1px dotted var(--brand-blue);
  padding-bottom: 1px;
  transition:
    color 120ms cubic-bezier(0.25, 0, 0, 1),
    border-color 120ms cubic-bezier(0.25, 0, 0, 1);
}
.briefing-link:hover,
.briefing-link:focus-visible {
  color: var(--brand-blue-bright);
  border-bottom-color: var(--brand-blue-bright);
  box-shadow: var(--focus-ring);
  outline: none;
}

/* ---------------------------------------------------------------------
 * Activity dock — persistent "what is Osperan working on?" indicator
 * mounted from frame() and visible across every authenticated page.
 * Collapsed state is a small bottom-right pill; click expands a panel
 * listing every active AI task with its current step, elapsed time,
 * and an optional drilldown anchor.
 * ------------------------------------------------------------------- */
.activity-dock-host {
  position: relative;
  z-index: 0;
}
/* Keep scroll targets clear of the fixed activity dock without adding a
   permanent visible footer band to short pages. */
.q-page {
  scroll-padding-bottom: 96px;
}
.activity-dock {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 60;
  font-family: inherit;
  pointer-events: none;
}
.activity-dock-pill,
.activity-dock-panel {
  pointer-events: auto;
}

/* Modal dialogs own pointer interaction; keep the fixed dock from covering
   Quasar menu options that extend beneath its bottom-right footprint. */
body:has(.q-dialog[aria-modal="true"]) .activity-dock {
  visibility: hidden;
}
.activity-dock-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px 8px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-md, 0 6px 18px rgba(var(--navy-rgb), 0.08));
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  max-width: 360px;
  transition:
    transform 140ms cubic-bezier(0.25, 0, 0, 1),
    box-shadow 140ms cubic-bezier(0.25, 0, 0, 1);
}
.activity-dock-pill:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(var(--navy-rgb), 0.12);
}
.activity-dock-pill:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}
.activity-dock-pill-icon {
  color: var(--brand-blue);
  font-size: var(--text-md);
  flex: 0 0 auto;
}
.activity-dock-pill-summary {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1 1 auto;
}
.activity-dock-pill-chev {
  color: var(--text-secondary);
  font-size: var(--text-md);
  flex: 0 0 auto;
  transition: transform 160ms cubic-bezier(0.25, 0, 0, 1);
}
.activity-dock[data-expanded="true"] .activity-dock-pill-chev {
  transform: rotate(180deg);
}
.activity-dock-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-blue);
  box-shadow: 0 0 0 0 var(--brand-ai-glow);
  animation: activity-dock-pulse 1.6s ease-out infinite;
  flex: 0 0 auto;
}
@keyframes activity-dock-pulse {
  0% {
    box-shadow: 0 0 0 0 var(--brand-ai-glow);
  }
  70% {
    box-shadow: 0 0 0 8px transparent;
  }
  100% {
    box-shadow: 0 0 0 0 transparent;
  }
}
.activity-dock-panel {
  position: absolute;
  right: 0;
  bottom: calc(100% + 10px);
  width: 360px;
  max-height: 460px;
  overflow-y: auto;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  box-shadow: 0 18px 36px rgba(var(--navy-rgb), 0.16);
  display: none;
  flex-direction: column;
}
.activity-dock[data-expanded="true"] .activity-dock-panel {
  display: flex;
}
.activity-dock-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  background: var(--bg-card);
  z-index: 1;
}
.activity-dock-panel-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: var(--text-sm);
  color: var(--text-primary);
}
.activity-dock-panel-title .material-icons {
  color: var(--brand-blue);
  font-size: var(--text-md);
}
.activity-dock-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  border-radius: var(--radius-md);
}
.activity-dock-close:hover {
  background: var(--tint-slate);
}
.activity-dock-close:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 1px;
}
.activity-dock-list {
  display: flex;
  flex-direction: column;
}
.activity-dock-entry {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
}
.activity-dock-entry:last-child {
  border-bottom: none;
}
.activity-dock-entry-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--text-sm);
  color: var(--text-primary);
  font-weight: 700;
}
.activity-dock-entry-icon {
  color: var(--brand-blue);
  font-size: var(--text-base);
  flex: 0 0 auto;
}
.activity-dock-entry-title {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.activity-dock-entry-elapsed {
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  flex: 0 0 auto;
}
.activity-dock-entry-step {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--text-sm);
  color: var(--text-secondary);
  line-height: 1.4;
}
.activity-dock-entry-target {
  font-size: var(--text-xs);
}
.activity-dock-target {
  color: var(--brand-blue);
  text-decoration: none;
  border-bottom: 1px dotted var(--brand-blue);
}
.activity-dock-target:hover,
.activity-dock-target:focus-visible {
  color: var(--brand-blue-bright);
  border-bottom-color: var(--brand-blue-bright);
  box-shadow: var(--focus-ring);
  outline: none;
}
.activity-dock-empty {
  padding: 18px 14px;
  font-size: var(--text-sm);
  color: var(--text-secondary);
  text-align: center;
}
@media (max-width: 720px) {
  .forge-ask-floating {
    right: 12px !important;
    bottom: 74px !important;
    top: auto !important;
    transform: none !important;
  }
  .forge-ask-floating-trigger {
    max-width: calc(100vw - 24px);
  }
  .forge-ask-floating-panel {
    right: 0 !important;
    top: auto !important;
    bottom: calc(100% + 10px) !important;
    transform: none !important;
    width: calc(100vw - 24px);
    max-width: 420px;
    max-height: min(640px, calc(100vh - 132px));
  }
  .activity-dock {
    right: 12px;
    bottom: 12px;
  }
  .activity-dock-panel {
    width: calc(100vw - 24px);
    max-width: 360px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .activity-dock-pulse {
    animation: none;
  }
}

/* ---------------------------------------------------------------------
 * Workstation inline step trace — shown under task rows with
 * ai_status == "running". One pulsing dot anchors the trace; the
 * step list cycles through up to four lines via pure CSS keyframes
 * so a re-render of the row keeps the rhythm without re-fetching
 * anything from the backend.
 * ------------------------------------------------------------------- */
.workstation-step-trace {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 8px 0 4px;
  padding: 8px 12px;
  background: var(--tint-blue);
  border: 1px solid var(--border-cool, var(--border));
  border-radius: var(--radius-lg);
  color: var(--text-primary);
  font-size: var(--text-sm);
}
.workstation-step-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-blue);
  box-shadow: 0 0 0 0 var(--brand-ai-glow);
  animation: activity-dock-pulse 1.6s ease-out infinite;
  flex: 0 0 auto;
  margin-top: 6px;
}
.workstation-step-cycle {
  --ws-step-count: 4;
  position: relative;
  flex: 1 1 auto;
  min-height: 1.4em;
}
.workstation-step-cycle ul {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
  height: 1.4em;
}
.workstation-step-cycle li {
  --ws-step-idx: 0;
  position: absolute;
  inset: 0;
  margin: 0;
  line-height: 1.4;
  color: var(--text-primary);
  opacity: 0;
  transform: translateY(4px);
  /* Each step is shown for ``cycle / count`` seconds. We hard-set the
     * total cycle duration to 12s when there are 4 steps (3s per step)
     * which keeps the rhythm calm and readable. The keyframe holds for
     * the slot's full duration, then fades out. */
  animation: workstation-step-cycle calc(var(--ws-step-count) * 3s) infinite;
  animation-delay: calc(var(--ws-step-idx) * 3s);
}
@keyframes workstation-step-cycle {
  0% {
    opacity: 0;
    transform: translateY(4px);
  }
  4% {
    opacity: 1;
    transform: translateY(0);
  }
  25% {
    opacity: 1;
    transform: translateY(0);
  }
  29% {
    opacity: 0;
    transform: translateY(-4px);
  }
  100% {
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .workstation-step-pulse {
    animation: none;
  }
  .workstation-step-cycle li {
    animation: none;
    opacity: 1;
    transform: none;
    position: static;
  }
  .workstation-step-cycle ul {
    height: auto;
  }
  .workstation-step-cycle li + li {
    margin-top: 4px;
  }
}

/* ---------------------------------------------------------------------
 * Ask Osperan streaming result card — rendered by
 * shared QA answer renderers and used by
 * both the persistent query bar and the Cmd+K Ask Osperan mode. The card
 * has four visual layers (eyebrow, status pill, narrative, citation /
 * suggestion rows). Each layer fades in as its event arrives over the
 * long-running progress helpers so the experience reads as
 * a live LLM answer.
 * ------------------------------------------------------------------- */
.ask-forge-card {
  margin-top: 10px;
  padding: 14px 16px 12px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 10px;
  animation: ask-forge-card-in 220ms ease-out;
  position: relative;
  overflow: hidden;
}
.ask-forge-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--brand-ai-hover);
}
.ask-forge-eyebrow .material-icons {
  font-size: var(--text-sm);
  color: var(--brand-ai);
}
.ask-forge-question {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.45;
}
.ask-evidence-question {
  display: grid;
  gap: 4px;
  padding: 8px 10px;
  background: var(--bg-page);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow-wrap: anywhere;
}
.ask-evidence-question__label {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--text-muted);
}
.ask-evidence-question__text {
  font-size: var(--text-sm);
  color: var(--text-primary);
  line-height: 1.45;
}
.ask-forge-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  padding: 4px 10px;
  background: var(--brand-ai-tint);
  border: 1px solid color-mix(in srgb, var(--brand-ai) 25%, transparent);
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  color: var(--brand-ai-hover);
  font-weight: 500;
  animation: ask-forge-status-fade 220ms ease-out;
}
.ask-forge-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-ai);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand-ai) 50%, transparent);
  animation: ask-forge-pulse 1.4s ease-out infinite;
}
.ask-forge-status-text {
  line-height: 1.2;
}
.ask-evidence-processing-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ask-evidence-processing-steps span {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border: 1px solid color-mix(in srgb, var(--brand-ai) 18%, transparent);
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--brand-ai) 6%, transparent);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  font-weight: 600;
}
.ask-forge-narrative {
  font-size: var(--text-sm);
  line-height: 1.55;
  color: var(--text-primary);
  max-width: 72ch;
  animation: ask-forge-narrative-in 240ms ease-out;
}
.ask-forge-narrative p {
  margin: 0 0 6px 0;
}
.ask-forge-narrative p:last-child {
  margin-bottom: 0;
}
.ask-forge-narrative ul {
  margin: 4px 0 0 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ask-forge-narrative li {
  line-height: 1.5;
}
.ask-forge-narrative strong {
  color: var(--text-primary);
}
.ask-forge-narrative em {
  color: var(--brand-blue);
  font-style: normal;
  font-weight: 500;
}
.ask-forge-narrative a {
  color: var(--brand-blue);
  text-decoration: none;
  border-bottom: 1px dotted var(--brand-blue);
}
.ask-forge-narrative a:hover,
.ask-forge-narrative a:focus-visible {
  color: var(--brand-blue-dark);
  border-bottom-color: var(--brand-blue-dark);
  box-shadow: var(--focus-ring);
  outline: none;
}
.ask-forge-narrative-empty {
  height: 18px;
  border-radius: var(--radius-sm);
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand-ai) 4%, transparent) 0%,
    color-mix(in srgb, var(--brand-ai) 10%, transparent) 50%,
    color-mix(in srgb, var(--brand-ai) 4%, transparent) 100%
  );
  background-size: 200% 100%;
  animation: ask-forge-shimmer 1.4s ease-in-out infinite;
}
/* Typewriter caret on the streaming narrative. */
.ask-forge-typewriter::after {
  content: "\258D";
  display: inline-block;
  margin-left: 2px;
  color: var(--brand-ai);
  font-weight: 400;
  animation: ask-forge-caret 1s steps(2, start) infinite;
}
.ask-forge-row-label {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin-right: 6px;
  align-self: center;
}
.ask-forge-citations,
.ask-forge-suggestions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding-top: 6px;
  border-top: 1px dashed var(--border);
  animation: ask-forge-row-in 260ms ease-out;
}
.ask-forge-citation {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  background: var(--bg-page);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  color: var(--text-primary);
  text-decoration: none;
  transition:
    background 120ms cubic-bezier(0.25, 0, 0, 1),
    border-color 120ms cubic-bezier(0.25, 0, 0, 1),
    color 120ms cubic-bezier(0.25, 0, 0, 1);
}
.ask-forge-citation .material-icons {
  font-size: var(--text-sm);
  color: var(--brand-blue);
}
.ask-forge-citation:hover,
.ask-forge-citation:focus-visible {
  background: var(--brand-ai-tint);
  border-color: color-mix(in srgb, var(--brand-ai) 40%, transparent);
  color: var(--brand-blue);
  box-shadow: var(--focus-ring);
  outline: none;
}
.ask-evidence-answer-group {
  display: grid;
  gap: 10px;
}
.ask-evidence-answer-list {
  display: grid;
  gap: 8px;
}
.ask-evidence-answer-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--brand-ai) 3%, var(--bg-card));
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  animation: ask-forge-row-in 260ms ease-out;
}
.ask-evidence-answer-item__body {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.ask-evidence-answer-item__title {
  font-size: var(--text-sm);
  font-weight: 800;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}
.ask-evidence-answer-item__text {
  font-size: var(--text-sm);
  line-height: 1.45;
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}
.ask-evidence-answer-item__sources {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px;
}
.ask-evidence-citation-chip {
  padding: 2px 7px;
  font-size: var(--text-xs);
  font-weight: 800;
  color: var(--brand-ai-hover);
}
.ask-forge-suggestion {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: var(--brand-ai-tint);
  border: 1px solid color-mix(in srgb, var(--brand-ai) 20%, transparent);
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  color: var(--brand-ai-hover);
  cursor: pointer;
  font-family: inherit;
  transition:
    background 120ms cubic-bezier(0.25, 0, 0, 1),
    border-color 120ms cubic-bezier(0.25, 0, 0, 1),
    color 120ms cubic-bezier(0.25, 0, 0, 1);
}
.ask-forge-suggestion .material-icons {
  font-size: var(--text-sm);
  color: var(--brand-ai);
}
.ask-forge-suggestion:hover,
.ask-forge-suggestion:focus-visible {
  background: color-mix(in srgb, var(--brand-ai) 15%, transparent);
  border-color: color-mix(in srgb, var(--brand-ai) 45%, transparent);
  color: var(--brand-ai);
  box-shadow: var(--focus-ring);
  outline: none;
}
.ask-forge-error {
  border-color: color-mix(in srgb, var(--status-danger) 40%, transparent);
  background: color-mix(in srgb, var(--status-danger) 4%, transparent);
}
.ask-forge-error .ask-forge-eyebrow {
  color: var(--brand-red-dark);
}
.ask-forge-error .ask-forge-eyebrow .material-icons {
  color: var(--text-primary);
}
.ask-forge-error-body {
  font-size: var(--text-sm);
  color: var(--brand-red-dark);
  line-height: 1.5;
}

@keyframes ask-forge-card-in {
  from {
    opacity: 0;
    transform: translateY(2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes ask-forge-status-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes ask-forge-narrative-in {
  from {
    opacity: 0;
    transform: translateY(2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes ask-forge-row-in {
  from {
    opacity: 0;
    transform: translateY(2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes ask-forge-pulse {
  0% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand-ai) 50%, transparent);
    transform: scale(0.9);
  }
  70% {
    box-shadow: 0 0 0 8px transparent;
    transform: scale(1.05);
  }
  100% {
    box-shadow: 0 0 0 0 transparent;
    transform: scale(0.9);
  }
}
@keyframes ask-forge-caret {
  50% {
    opacity: 0;
  }
}
@keyframes ask-forge-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ask-forge-card,
  .ask-forge-status,
  .ask-forge-narrative,
  .ask-forge-citations,
  .ask-forge-suggestions,
  .ask-evidence-answer-item {
    animation: none;
  }
  .ask-forge-pulse {
    animation: none;
  }
  .ask-forge-typewriter::after {
    animation: none;
  }
  .ask-forge-narrative-empty {
    animation: none;
  }
}

/* ===========================================================================
   AI provenance footer — canonical disclosure for LLM-rendered surfaces.
   Mirrors forge-product-integrity.mdc: every AI surface discloses model +
   timestamp + input hash. Used by ai_provenance_footer.summary_meta_footer_html;
   classes are consumed verbatim from that helper.
   ========================================================================== */
.forge-ai-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 0.75rem;
  color: var(--text-secondary);
}
.forge-ai-footer-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--brand-ai-tint);
  border: 1px solid var(--brand-ai);
  color: var(--brand-ai);
  font-weight: 600;
  font-size: 0.72rem;
  letter-spacing: 0.01em;
  line-height: 1.2;
}
.forge-ai-footer-chip .material-icons {
  color: var(--brand-ai);
}
.forge-ai-footer-meta {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
}
.forge-ai-footer-key {
  text-transform: uppercase;
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
  font-weight: 600;
}
.forge-ai-footer-value {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  color: var(--text-primary);
  word-break: break-word;
  min-width: 0;
}
.forge-ai-footer[data-forge-ai-footer="placeholder"] .forge-ai-footer-value {
  color: var(--text-secondary);
  font-style: italic;
}
@media (max-width: 720px) {
  .forge-ai-footer {
    gap: 6px 12px;
    font-size: 0.7rem;
  }
  .forge-ai-footer-chip {
    font-size: 0.68rem;
  }
}

.forge-manager-decision-row {
  display: grid;
  grid-template-columns: minmax(9rem, 14rem) minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
}

.forge-manager-decision-row__object {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-1);
}

.forge-manager-decision-row__meta,
.forge-manager-decision-row__evidence {
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.35;
}

.forge-manager-decision-row__status,
.forge-manager-decision-row__actions {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.forge-manager-decision-row__status {
  min-width: 0;
  justify-content: flex-start;
}

.forge-manager-decision-row__actions {
  justify-content: flex-end;
}

.forge-manager-decision-status {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.forge-manager-decision-status__detail {
  min-width: 0;
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.4;
}

@media (max-width: 720px) {
  .forge-manager-decision-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .forge-manager-decision-row__object {
    grid-column: 1 / -1;
  }

  .forge-manager-decision-row__status {
    grid-column: 1;
  }

  .forge-manager-decision-row__actions {
    grid-column: 2;
  }
}

@keyframes manager-attention-pulse {
  0% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand-blue) 45%, transparent);
  }
  70% {
    box-shadow: 0 0 0 6px transparent;
  }
  100% {
    box-shadow: 0 0 0 0 transparent;
  }
}

/* ===========================================================================
   Ripple set-piece overlay (Plan 61 Phase E)
   ========================================================================== */
.ripple-overlay-host {
  /* The portfolio view toggles visibility on the host wrapper. The
       overlay itself is fixed-position so it renders above the rest of
       the dashboard regardless of where the host sits in the DOM. */
  position: relative;
  z-index: 1500;
}
.ripple-overlay {
  position: fixed;
  inset: 0;
  z-index: 1500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: ripple-overlay-in 200ms ease-out;
}
.ripple-overlay-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(var(--navy-rgb), 0.45);
  backdrop-filter: blur(2px);
}
.ripple-overlay-card {
  position: relative;
  width: min(720px, 100%);
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px 20px 18px;
  border-radius: var(--radius-xl);
  background: var(--bg-card);
  border: 1px solid var(--border);
  box-shadow: 0 24px 60px rgba(var(--navy-rgb), 0.25);
  overflow-y: auto;
  animation: ripple-overlay-card-in 220ms ease-out;
}
.ripple-overlay-head {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-right: 32px;
}
.ripple-overlay-head-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--brand-blue);
}
.ripple-overlay-head-eyebrow .material-icons {
  font-size: var(--text-base);
}
.ripple-overlay-head-title {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 700;
  line-height: 1.4;
  color: var(--text-primary);
}
.ripple-overlay-head-subtitle {
  font-size: var(--text-sm);
  color: var(--text-secondary);
}
.ripple-overlay-head-meta {
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-top: 2px;
}
.ripple-overlay-close {
  position: absolute;
  top: -4px;
  right: -4px;
  background: transparent;
  border: 0;
  color: var(--text-muted);
  cursor: pointer;
  width: 32px;
  height: 32px;
  border-radius: var(--radius-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ripple-overlay-close:hover {
  background: rgba(var(--navy-rgb), 0.06);
}
.ripple-overlay-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  align-self: flex-start;
  border-radius: var(--radius-pill);
  background: var(--tint-info);
  color: var(--brand-blue);
  font-size: var(--text-sm);
  font-weight: 600;
}
.ripple-overlay-pulse {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--brand-blue);
  animation: manager-attention-pulse 1.6s ease-in-out infinite;
}
.ripple-overlay-affected {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  border-radius: var(--radius-lg);
  background: var(--bg-page);
  border: 1px solid var(--border);
}
.ripple-overlay-affected-head {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--text-secondary);
}
.ripple-overlay-affected-head .material-icons {
  font-size: var(--text-base);
}
.ripple-overlay-affected-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ripple-overlay-affected-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 8px;
  border-radius: var(--radius-md);
  background: var(--bg-card);
  border: 1px solid transparent;
  animation: ripple-overlay-affected-in 200ms ease-out;
}
.ripple-overlay-affected-icon {
  font-size: var(--text-base);
  color: var(--brand-blue);
  margin-top: 2px;
}
.ripple-overlay-affected-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1 1 auto;
}
.ripple-overlay-affected-sku {
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-primary);
}
.ripple-overlay-affected-sku a {
  color: var(--brand-blue);
  text-decoration: none;
  border-bottom: 1px dotted var(--brand-blue);
}
.ripple-overlay-affected-sku a:hover {
  color: var(--brand-blue-dark);
}
.ripple-overlay-affected-reason {
  font-size: var(--text-sm);
  color: var(--text-secondary);
}
.ripple-overlay-draft {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  border-radius: var(--radius-lg);
  background: var(--tint-info);
  border: 1px solid var(--color-info-border);
}
.ripple-overlay-draft-head {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--brand-blue);
}
.ripple-overlay-draft-head .material-icons {
  font-size: var(--text-base);
}
.ripple-overlay-draft-body {
  font-size: var(--text-sm);
  line-height: 1.55;
  color: var(--text-primary);
}
.ripple-overlay-draft-body a {
  color: var(--brand-blue);
  text-decoration: none;
  border-bottom: 1px dotted var(--brand-blue);
}
.ripple-overlay-typewriter::after {
  content: "\2589";
  margin-left: 2px;
  color: var(--brand-blue);
  animation: ask-forge-caret 1s steps(1) infinite;
}
.ripple-overlay-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
}
.ripple-overlay-footer-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: var(--radius-md);
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  font-size: var(--text-sm);
  font-weight: 600;
  text-decoration: none;
  transition: background 120ms cubic-bezier(0.25, 0, 0, 1);
}
.ripple-overlay-footer-cta:hover {
  background: var(--button-primary-bg-hover);
}
.ripple-overlay-footer-cta .material-icons {
  font-size: var(--text-base);
}
.ripple-overlay-footer-secondary {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 8px 14px;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
}
.ripple-overlay-footer-secondary:hover {
  background: var(--bg-page);
}

@keyframes ripple-overlay-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes ripple-overlay-card-in {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes ripple-overlay-affected-in {
  from {
    opacity: 0;
    transform: translateX(-4px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ripple-overlay,
  .ripple-overlay-card,
  .ripple-overlay-affected-item,
  .ripple-overlay-pulse {
    animation: none;
  }
  .ripple-overlay-typewriter::after {
    animation: none;
  }
}

/* Plan 62: ripple footer button when DoC preview hand-off is wired */
.ripple-overlay-footer-cta--preview {
  border: 0;
  cursor: pointer;
  font-family: inherit;
}
.ripple-overlay-footer-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-secondary);
  text-decoration: none;
  margin-right: auto;
}
.ripple-overlay-footer-link:hover {
  color: var(--brand-blue);
}
.ripple-overlay-footer-link .material-icons {
  font-size: var(--text-base);
}

/* ===========================================================================
   EU DoC / DoP side-by-side preview (Plan 62)
   ========================================================================== */
.doc-preview-host {
  /* Mirrors .ripple-overlay-host: the portfolio view toggles
       visibility on this wrapper, while the overlay element itself
       is fixed-position so it renders above the rest of the page. */
  position: relative;
  z-index: 1600;
}
.doc-preview-overlay {
  position: fixed;
  inset: 0;
  z-index: 1600;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: doc-preview-overlay-in 200ms ease-out;
}
.doc-preview-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(var(--navy-rgb), 0.5);
  backdrop-filter: blur(2px);
}
.doc-preview-card {
  position: relative;
  width: min(1080px, 100%);
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px 24px 18px;
  border-radius: var(--radius-xl);
  background: var(--bg-card);
  border: 1px solid var(--border);
  box-shadow: 0 24px 60px rgba(var(--navy-rgb), 0.28);
  overflow-y: auto;
  animation: doc-preview-card-in 220ms ease-out;
}
.doc-preview-head {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-right: 32px;
}
.doc-preview-head-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--brand-blue);
}
.doc-preview-head-eyebrow .material-icons {
  font-size: var(--text-base);
}
.doc-preview-readonly-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--status-success) 12%, transparent);
  color: var(--brand-green);
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.doc-preview-readonly-chip .material-icons {
  font-size: var(--text-sm);
}
.doc-preview-head-title {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 700;
  line-height: 1.4;
  color: var(--text-primary);
}
.doc-preview-head-subtitle {
  font-size: var(--text-sm);
  color: var(--text-secondary);
}
.doc-preview-head-product {
  font-size: var(--text-sm);
  color: var(--text-muted);
}
.doc-preview-head-meta {
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-top: 2px;
}
.doc-preview-close {
  position: absolute;
  top: -4px;
  right: -4px;
  background: transparent;
  border: 0;
  color: var(--text-muted);
  cursor: pointer;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.doc-preview-close:hover {
  background: rgba(var(--navy-rgb), 0.06);
}
.doc-preview-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  align-self: flex-start;
  border-radius: var(--radius-pill);
  background: var(--tint-info);
  color: var(--brand-blue);
  font-size: var(--text-sm);
  font-weight: 600;
}
.doc-preview-pulse {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--brand-blue);
  animation: manager-attention-pulse 1.6s ease-in-out infinite;
}
.doc-preview-diff-summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  align-self: flex-start;
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--status-warning) 10%, transparent);
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 600;
}
.doc-preview-diff-summary .material-icons {
  font-size: var(--text-base);
}
.doc-preview-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.doc-preview-column {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 14px 12px;
  border-radius: var(--radius-card);
  background: var(--bg-page);
  border: 1px solid var(--border);
  min-height: 0;
}
.doc-preview-column--proposed {
  background: var(--tint-info);
  border-color: var(--color-info-border);
}
.doc-preview-column-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.doc-preview-column-title {
  margin: 0;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.doc-preview-column-meta {
  font-size: var(--text-xs);
  color: var(--text-muted);
}
.doc-preview-column-lines {
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: var(--text-sm);
  line-height: 1.55;
  color: var(--text-primary);
  white-space: pre-wrap;
  word-break: break-word;
}
.doc-preview-line {
  padding: 2px 6px;
  border-radius: var(--radius-xs);
  border-left: 3px solid transparent;
}
.doc-preview-line.changed {
  background: color-mix(in srgb, var(--status-warning) 10%, transparent);
  border-left-color: var(--text-primary);
}
.doc-preview-column--proposed .doc-preview-line.changed {
  background: color-mix(in srgb, var(--status-success) 12%, transparent);
  border-left-color: var(--brand-green);
}
.doc-preview-spacer {
  padding: 0;
  height: 6px;
}
.doc-preview-line-text {
  display: inline;
}
/* Screen-reader-only label for changed lines so AT announce the diff. */
.doc-preview-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.doc-preview-rationale {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 14px;
  border-radius: var(--radius-lg);
  background: var(--tint-info);
  border: 1px solid var(--color-info-border);
  animation: doc-preview-rationale-in 280ms ease-out;
}
.doc-preview-rationale--pending {
  opacity: 0.55;
}
.doc-preview-rationale-head {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--brand-blue);
}
.doc-preview-rationale-head .material-icons {
  font-size: var(--text-base);
}
.doc-preview-rationale-body {
  margin: 0;
  font-size: var(--text-sm);
  line-height: 1.55;
  color: var(--text-primary);
}
.doc-preview-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.doc-preview-footer-note {
  font-size: var(--text-xs);
  color: var(--text-muted);
}
.doc-preview-footer-secondary {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 8px 14px;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
}
.doc-preview-footer-secondary:hover {
  background: var(--bg-page);
}

@keyframes doc-preview-overlay-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes doc-preview-card-in {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes doc-preview-rationale-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 880px) {
  .doc-preview-columns {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .doc-preview-overlay,
  .doc-preview-card,
  .doc-preview-rationale,
  .doc-preview-pulse {
    animation: none;
  }
}

/*
 * Source-document row actions
 *
 * Each row in the Source Documents table can fire up to four actions
 * (View / Download / Delete / Update). Rendering them as inline pills
 * forced the table to ~1100px and ate horizontal headroom. We collapse
 * them into a single <details class="sd-actions"> kebab-style menu
 * triggered by a "Actions" pill; the global click handler in
 * frontend/views/products.py still wires each .sd-btn class to the
 * existing emitEvent('sd_action', …) plumbing.
 */
.sd-actions {
  position: relative;
  display: inline-block;
}
.sd-actions > summary {
  list-style: none;
  cursor: pointer;
  padding: 0 12px;
  height: 34px;
  font-size: var(--text-xs);
  font-weight: normal !important;
  font-family: inherit;
  line-height: 1;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  color: var(--text-primary);
  user-select: none;
  transition: background 0.15s cubic-bezier(0.25, 0, 0, 1);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  box-sizing: border-box;
}
.sd-actions > summary::-webkit-details-marker {
  display: none;
}
.sd-actions > summary::marker {
  content: "";
}
.sd-actions > summary::after {
  content: "▾";
  font-size: var(--text-xs);
  color: var(--text-secondary);
}
.sd-actions[open] > summary::after {
  content: "▴";
}
.sd-actions > summary:hover {
  background: var(--tint-slate);
}
.sd-actions[open] > summary {
  background: var(--tint-slate);
  border-color: var(--border-strong);
}
.sd-actions[open] > .sd-menu {
  display: flex;
}
.sd-actions.sd-flip-up[open] > .sd-menu {
  top: auto;
  bottom: calc(100% + 4px);
}
.sd-menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 20;
  flex-direction: column;
  min-width: 140px;
  padding: 4px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
}
.sd-menu .sd-btn {
  text-align: left;
  width: 100%;
  border: none;
  background: transparent;
  padding: 6px 10px;
  font-size: var(--text-sm);
  color: var(--text-primary);
  cursor: pointer;
  border-radius: var(--radius-xs);
}
.sd-menu .sd-btn:hover {
  background: var(--tint-slate);
}
.sd-menu .sd-btn.sd-del-btn {
  color: var(--text-primary);
}
.sd-menu .sd-btn.sd-del-btn:hover {
  background: var(--tint-red);
}
/* Standalone action button (e.g. Upload when no doc uploaded yet) —
   mirrors .sd-actions > summary so both row states look identical. */
.sd-action-btn {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  padding: 0 12px;
  height: 34px !important;
  font-size: var(--text-xs) !important;
  font-weight: normal !important;
  font-family: inherit;
  line-height: 1;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  color: var(--text-primary);
  transition: background 0.15s cubic-bezier(0.25, 0, 0, 1);
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
}
.sd-action-btn:hover {
  background: var(--tint-slate);
}

/* Source document intake: compact workbench row with drop support.
 * minmax(0,1fr) + min-width:0 keeps the grid inside stage_surface (no
 * horizontal bleed past the white box). */
.forge-source-intake {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  min-height: 64px;
  margin-top: 10px;
  padding: 10px 12px 10px 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px dashed color-mix(in srgb, var(--border) 78%, var(--text-secondary));
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--bg-card) 74%, var(--bg-page));
  color: var(--text-primary);
  overflow: hidden;
  transition:
    background 0.14s var(--ease-out-quart),
    border-color 0.14s var(--ease-out-quart),
    box-shadow 0.14s var(--ease-out-quart);
}
.forge-source-intake--standalone {
  margin-top: 12px;
}
.forge-source-intake--clickable {
  cursor: pointer;
}
.forge-source-intake--clickable:hover,
.forge-source-intake--clickable:focus-visible {
  border-color: var(--brand-blue);
  box-shadow: inset 3px 0 0 var(--brand-blue);
}
.forge-source-intake.is-dragover {
  background: color-mix(in srgb, var(--tint-blue) 44%, var(--bg-card));
  border-color: var(--brand-blue);
  box-shadow: inset 3px 0 0 var(--brand-blue);
}
.forge-source-intake__copy {
  min-width: 0;
  overflow: hidden;
}
.forge-source-intake__title {
  font-size: var(--text-sm);
  font-weight: var(--font-weight-display);
  color: var(--text-primary);
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.forge-source-intake__hint {
  margin-top: 2px;
  font-size: var(--text-xs);
  color: var(--text-secondary);
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.forge-source-intake .forge-btn {
  justify-self: end;
  min-width: 0;
}
.forge-upload-dialog-drop {
  margin-top: 4px;
  padding: 12px;
  gap: 10px;
  border: 1px dashed color-mix(in srgb, var(--border) 78%, var(--text-secondary));
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--bg-card) 74%, var(--bg-page));
}
.forge-upload-dialog-drop__copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}
.forge-upload-dialog-drop__title {
  font-size: var(--text-sm);
  font-weight: var(--font-weight-display);
  color: var(--text-primary);
  line-height: 1.35;
}
.forge-upload-dialog-drop__hint,
.forge-upload-dialog-drop__file {
  font-size: var(--text-xs);
  color: var(--text-secondary);
  line-height: 1.35;
}
.forge-upload-dialog-drop__uploader {
  width: 100%;
}
.forge-upload-dialog-drop__uploader.q-uploader,
.forge-upload-dialog-drop__uploader .q-uploader {
  width: 100%;
  min-height: 54px;
  max-height: 112px;
  border: 1px solid color-mix(in srgb, var(--border) 84%, transparent);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  box-shadow: none;
}
.forge-upload-dialog-drop__uploader.q-uploader .q-uploader__header,
.forge-upload-dialog-drop__uploader .q-uploader__header {
  min-height: 34px;
  background: transparent;
  color: var(--text-primary);
  border-bottom: 1px solid var(--border);
}
.forge-upload-dialog-drop__uploader.q-uploader .q-uploader__list,
.forge-upload-dialog-drop__uploader .q-uploader__list {
  min-height: 20px;
  max-height: 58px;
  background: transparent;
}
.forge-upload-dialog-drop__actions {
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

@media (max-width: 700px) {
  .forge-source-intake {
    grid-template-columns: minmax(0, 1fr);
  }
  .forge-source-intake .forge-btn {
    grid-column: 1 / -1;
    justify-self: start;
  }
  .forge-upload-dialog-drop__copy {
    grid-template-columns: minmax(0, 1fr);
  }
  .forge-upload-dialog-drop__actions {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* ===========================================================================
   Plan 65 Phase B — Source-document QA receipt
   The Sources library row is a <details> so click-to-expand reveals
   document-level receipts and source datapoints.
   =========================================================================== */
details.forge-source-card {
  display: block;
}
details.forge-source-card > summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(280px, 420px);
  align-items: center;
  gap: 18px;
}
details.forge-source-card > summary::-webkit-details-marker {
  display: none;
}
.forge-source-data-points-panel {
  margin-top: 10px;
}
.forge-source-data-points-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.forge-source-data-point {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid var(--border-light);
}
.forge-source-data-point__main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}
.forge-source-data-point__meta {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 6px;
  color: var(--text-muted);
  font-size: var(--text-xs);
  text-align: right;
  white-space: nowrap;
}
.forge-source-data-point__confidence {
  color: var(--text-secondary);
}
@media (max-width: 760px) {
  details.forge-source-card > summary {
    grid-template-columns: minmax(0, 1fr);
  }
  .forge-source-data-point {
    grid-template-columns: minmax(0, 1fr);
  }
  .forge-source-data-point__meta {
    justify-content: flex-start;
    text-align: left;
    white-space: normal;
  }
}
.forge-qa-receipt-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  flex-wrap: wrap;
}
.forge-qa-receipt-pill {
  /* Inherits .pill .pill-green / .pill-red palette; no overrides needed. */
  font-weight: 600;
  letter-spacing: 0.01em;
}
.forge-qa-receipt-delta {
  font-size: var(--text-xs);
  color: var(--text-muted);
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.forge-qa-receipt-expansion {
  grid-column: 1 / -1;
  padding: 14px 18px 16px;
  border-top: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  display: flex;
  flex-direction: column;
  gap: 14px;
  border-radius: 0 0 10px 10px;
  margin-top: 8px;
}
.forge-qa-receipt-id {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px 18px;
  font-size: var(--text-sm);
}
.forge-qa-receipt-id .kicker {
  display: block;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  margin-bottom: 2px;
}
.forge-qa-receipt-fields {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 1px dashed var(--border-subtle);
  padding-top: 12px;
}
.forge-qa-receipt-field {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(180px, 2fr) auto;
  gap: 12px;
  align-items: center;
  font-size: var(--text-sm);
}
.forge-qa-receipt-field-name {
  color: var(--text-muted);
  font-weight: 500;
}
.forge-qa-receipt-field-value {
  color: var(--text-primary);
  word-break: break-word;
}
.forge-qa-receipt-gates {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 1px dashed var(--border-subtle);
  padding-top: 12px;
}
.forge-qa-receipt-gate {
  display: grid;
  grid-template-columns: 22px minmax(140px, 1fr) minmax(200px, 3fr);
  gap: 10px;
  align-items: baseline;
  font-size: var(--text-sm);
  padding: 6px 8px;
  border-radius: var(--radius-sm);
}
.forge-qa-receipt-gate.is-passed {
  background: color-mix(in srgb, var(--status-success) 6%, transparent);
}
.forge-qa-receipt-gate.is-failed {
  background: color-mix(in srgb, var(--status-danger) 7%, transparent);
}
.forge-qa-receipt-gate-icon {
  font-weight: 700;
  text-align: center;
}
.forge-qa-receipt-gate.is-passed .forge-qa-receipt-gate-icon {
  color: var(--brand-green);
}
.forge-qa-receipt-gate.is-failed .forge-qa-receipt-gate-icon {
  color: var(--text-primary);
}
.forge-qa-receipt-gate-label {
  font-weight: 600;
  color: var(--text-primary);
}
.forge-qa-receipt-gate-note {
  color: var(--text-muted);
}
.forge-qa-receipt-provenance {
  font-size: var(--text-xs);
  color: var(--text-muted);
  border-top: 1px dashed var(--border-subtle);
  padding-top: 10px;
}
@media (max-width: 720px) {
  .forge-qa-receipt-field {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .forge-qa-receipt-gate {
    grid-template-columns: 22px 1fr;
  }
  .forge-qa-receipt-gate-note {
    grid-column: 2 / -1;
  }
}

/* ===========================================================================
   Plan 65 Phase D — Supplier-validate streamed overlay
   Mirrors the ripple overlay's frame/positioning conventions so the two
   set-pieces feel like siblings rather than two unrelated dialogs.
   The Identify -> Extract -> Gates -> Verdict sections stack vertically
   inside the card and animate in as the stream advances.
   =========================================================================== */
.forge-supplier-validate-host {
  position: relative;
  z-index: 1500;
}
.forge-supplier-validate-overlay {
  position: fixed;
  inset: 0;
  z-index: 1500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: ripple-overlay-in 200ms ease-out;
}
.forge-supplier-validate-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(var(--navy-rgb), 0.45);
  backdrop-filter: blur(2px);
  cursor: pointer;
}
.forge-supplier-validate-card {
  position: relative;
  width: min(720px, 100%);
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--bg-card);
  border-radius: var(--radius-xl);
  box-shadow: 0 28px 80px rgba(var(--navy-rgb), 0.32);
  padding: 20px 24px 20px;
  overflow-y: auto;
}
.forge-supplier-validate-head {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.forge-supplier-validate-head-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--brand-blue);
  font-weight: 600;
}
.forge-supplier-validate-head-eyebrow .material-icons {
  font-size: var(--text-base);
}
.forge-supplier-validate-head-titlebar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding-right: 36px;
}
.forge-supplier-validate-head-title {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.3;
}
.forge-supplier-validate-doc-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  background: var(--tint-blue, color-mix(in srgb, var(--brand-slate) 10%, transparent));
  color: var(--brand-blue);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
}
.forge-supplier-validate-head-meta {
  color: var(--text-muted);
  font-size: var(--text-sm);
}
.forge-supplier-validate-close {
  position: absolute;
  top: -4px;
  right: -6px;
  width: 32px;
  height: 32px;
  border-radius: var(--radius-pill);
  border: 0;
  background: transparent;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
}
.forge-supplier-validate-close:hover {
  background: rgba(var(--navy-rgb), 0.06);
}
.forge-supplier-validate-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--brand-slate) 8%, transparent);
  color: var(--brand-blue);
  font-size: var(--text-sm);
  align-self: flex-start;
}
.forge-supplier-validate-pulse {
  width: 8px;
  height: 8px;
  border-radius: var(--radius-pill);
  background: var(--brand-blue);
  animation: manager-attention-pulse 1.6s ease-in-out infinite;
}
.forge-supplier-validate-section-head {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: 6px;
}
.forge-supplier-validate-section-head .material-icons {
  font-size: var(--text-base);
}
.forge-supplier-validate-extract-list,
.forge-supplier-validate-gates-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.forge-supplier-validate-extract-item {
  display: grid;
  grid-template-columns: minmax(140px, 220px) 1fr 88px;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  background: rgba(var(--navy-rgb), 0.03);
  font-size: var(--text-sm);
}
.forge-supplier-validate-extract-name {
  font-family: var(--font-mono, ui-monospace, "SF Mono", monospace);
  font-size: var(--text-sm);
  color: var(--text-muted);
}
.forge-supplier-validate-extract-value {
  color: var(--text-primary);
  overflow-wrap: anywhere;
}
.forge-supplier-validate-extract-conf {
  display: flex;
  justify-content: flex-end;
}
.forge-supplier-validate-gate {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 10px;
  align-items: start;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  font-size: var(--text-sm);
}
.forge-supplier-validate-gate.is-passed {
  background: color-mix(in srgb, var(--status-success) 6%, transparent);
  border-color: color-mix(in srgb, var(--status-success) 18%, transparent);
}
.forge-supplier-validate-gate.is-failed {
  background: color-mix(in srgb, var(--status-danger) 7%, transparent);
  border-color: color-mix(in srgb, var(--status-danger) 20%, transparent);
}
.forge-supplier-validate-gate-icon {
  font-size: var(--text-md);
}
.forge-supplier-validate-gate.is-passed .forge-supplier-validate-gate-icon {
  color: var(--brand-green);
}
.forge-supplier-validate-gate.is-failed .forge-supplier-validate-gate-icon {
  color: var(--text-primary);
}
.forge-supplier-validate-gate-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.forge-supplier-validate-gate-label {
  font-weight: 600;
  color: var(--text-primary);
}
.forge-supplier-validate-gate-note {
  color: var(--text-muted);
}
.forge-supplier-validate-verdict {
  margin-top: 4px;
  padding: 12px 14px;
  border-radius: var(--radius-card);
  border: 1px solid transparent;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.forge-supplier-validate-verdict.is-recommend {
  background: color-mix(in srgb, var(--status-success) 8%, transparent);
  border-color: color-mix(in srgb, var(--status-success) 22%, transparent);
}
.forge-supplier-validate-verdict.is-reject {
  background: color-mix(in srgb, var(--status-danger) 8%, transparent);
  border-color: color-mix(in srgb, var(--status-danger) 22%, transparent);
}
.forge-supplier-validate-verdict-head {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: var(--text-base);
}
.forge-supplier-validate-verdict.is-recommend
  .forge-supplier-validate-verdict-head {
  color: var(--brand-green);
}
.forge-supplier-validate-verdict.is-reject
  .forge-supplier-validate-verdict-head {
  color: var(--text-primary);
}
.forge-supplier-validate-verdict-body {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-sm);
  line-height: 1.45;
}
.forge-supplier-validate-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 6px;
  border-top: 1px solid var(--border-subtle);
  padding-top: 12px;
}
.forge-supplier-validate-footer-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: var(--radius-pill);
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  text-decoration: none;
  font-weight: 600;
  font-size: var(--text-sm);
}
.forge-supplier-validate-footer-cta:hover {
  background: var(--button-primary-bg-hover);
}
.forge-supplier-validate-footer-secondary {
  border: 0;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  padding: 8px 12px;
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
}
.forge-supplier-validate-footer-secondary:hover {
  background: rgba(var(--navy-rgb), 0.06);
}
@media (max-width: 720px) {
  .forge-supplier-validate-extract-item {
    grid-template-columns: 1fr;
  }
  .forge-supplier-validate-extract-conf {
    justify-content: flex-start;
  }
}

/* ============================================================
   Watchlist tab — catalog picker (Plan 162)
   ============================================================ */

/* Scan button */
.watchlist-scan-action {
  margin-bottom: 12px;
}
/* Scope ▾ toggle pill */
.watchlist-scope-toggle {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 5px 12px;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background 0.12s,
    color 0.12s,
    border-color 0.12s;
}
.watchlist-scope-toggle:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}
.watchlist-scope-toggle--open {
  background: var(--bg-subtle);
  color: var(--text-primary);
  border-color: var(--border-strong);
}

/* Scope panel card */
.wl-scope-panel {
  margin-top: 10px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-left: 3px solid var(--brand-blue);
  border-radius: var(--radius-lg, 10px);
  overflow: hidden;
}

/* Static header — always shown when panel is open */
.wl-scope-header {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 16px 10px;
  border-bottom: 1px solid var(--border-subtle);
}
.wl-scope-eyebrow {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}
.wl-scope-hint {
  font-size: var(--text-sm);
  color: var(--text-secondary);
}

/* Controls area */
.wl-scope-controls {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Individual control rows */
.wl-scope-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.wl-scope-row:last-child {
  margin-bottom: 0;
}
.wl-scope-cat-select {
  min-width: 160px;
  max-width: 240px;
}

/* All / Pick buttons */
.wl-scope-pick-row {
  gap: 6px;
}
.wl-scope-pick-btn {
  padding: 3px 12px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-muted);
  font-size: var(--text-sm);
  font-weight: 500;
  cursor: pointer;
  transition:
    background 0.1s,
    color 0.1s,
    border-color 0.1s;
}
.wl-scope-pick-btn:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}
.wl-scope-pick-btn--active {
  background: var(--tint-blue);
  color: var(--brand-blue);
  border-color: var(--brand-blue);
  font-weight: 600;
}

/* Scrollable product list */
.wl-scope-picker {
  max-height: 180px;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 6px);
  margin-bottom: 12px;
  padding: 4px 0;
}
.wl-scope-picker-item {
  display: flex;
  align-items: center;
  padding: 5px 10px;
  cursor: pointer;
  font-size: var(--text-sm);
  color: var(--text-primary);
  user-select: none;
  transition: background 0.1s;
}
.wl-scope-picker-item:hover {
  background: var(--bg-hover);
}
.wl-scope-picker-item:active {
  background: var(--tint-blue);
}
.wl-scope-picker-item--checked {
  background: var(--tint-blue);
}

/* Toggle + sublabel stacked */
.wl-scope-toggle-row {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.wl-scope-toggle-hint {
  font-size: var(--text-xs);
  color: var(--text-muted);
  padding-left: 2px;
}

/* Estimate line — separator above, prominent text */
.wl-scope-estimate {
  display: block;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border-subtle);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-primary);
}

/* Catalog picker container */
.catalog-picker {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.catalog-picker--empty {
  padding: 24px 20px;
  color: var(--text-muted);
  font-size: var(--text-sm);
}

/* Individual catalog row */
.catalog-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border-subtle);
  transition: background 0.12s;
}
.catalog-row:last-child {
  border-bottom: 0;
}
.catalog-row:hover {
  background: var(--bg-hover);
}

.catalog-row--watching {
  border-left: 3px solid var(--brand-green);
  padding-left: 13px;
  background: color-mix(in srgb, var(--status-success) 6%, transparent);
}
.catalog-row--watching .catalog-code {
  background: color-mix(in srgb, var(--status-success) 12%, transparent);
  color: var(--brand-green-dark);
}
.catalog-row--coming-soon .catalog-name {
  color: var(--text-muted);
}
.catalog-row--coming-soon .catalog-code {
  opacity: 0.55;
}

.catalog-section-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 8px;
  background: var(--bg-page);
  border-bottom: 1px solid var(--border-subtle);
}
.catalog-section-label {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}
.catalog-section-count {
  display: inline-flex;
  min-width: 1.5rem;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 700;
  background: var(--border);
  color: var(--text-secondary);
}

/* Info wrapper (NiceGUI ui.html div) — stretches to fill the row */
.catalog-row-info {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  overflow: hidden;
}

/* ============================================================
   Shared regulation code chip — one class used across every surface
   that shows a regulation short code (status strip, product picker,
   watchlist rows, feed/proposal rows, roadmap, workstation, …).
   Visual treatment matches .catalog-code so the same regulation always
   looks the same everywhere. Use .reg-code-chip--unconfirmed for
   pending / unconfirmed matches.
   ============================================================ */
.reg-code-chip {
  display: inline-block;
  flex-shrink: 0;
  padding: 2px 6px;
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  background: var(--bg-subtle);
  border-radius: 4px;
  white-space: nowrap;
  vertical-align: middle;
}
.reg-code-chip--unconfirmed {
  color: var(--brand-amber-text);
  background: color-mix(in srgb, var(--status-warning) 10%, transparent);
}
.reg-code-chip--upcoming {
  color: var(--text-muted);
  background: transparent;
  border: 1px dashed var(--border-strong);
  padding: 1px 6px;
}
.reg-code-chip__upcoming-label {
  font-size: 0.7em;
  font-weight: 600;
  letter-spacing: 0.03em;
  opacity: 0.75;
  text-transform: none;
}

/* Short code prefix (e.g. "cpr") */
.catalog-code {
  flex-shrink: 0;
  min-width: 48px;
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  padding: 2px 6px;
  background: var(--bg-subtle);
  border-radius: var(--radius-xs);
}

/* Regulation full name */
.catalog-name {
  flex: 1;
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--text-primary);
  line-height: 1.35;
}

/* Status badge */
.catalog-badge {
  flex-shrink: 0;
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 600;
}
.catalog-badge--watching {
  background: color-mix(in srgb, var(--status-success) 12%, transparent);
  color: var(--brand-green);
}
.catalog-badge--idle {
  background: transparent;
  color: var(--text-muted);
}
.catalog-badge--coming-soon {
  background: color-mix(in srgb, var(--brand-slate) 10%, transparent);
  color: var(--text-muted);
  cursor: default;
}

/* Action column */
.catalog-actions {
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.catalog-toggle {
  padding: 4px 12px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  border-radius: var(--radius-pill);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  transition:
    background 0.12s,
    color 0.12s;
}
.catalog-toggle--add {
  border: 1px solid var(--button-primary-border);
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
}
.catalog-toggle--add:hover {
  background: var(--button-primary-bg-hover);
}
.catalog-toggle--remove {
  border: 1px solid var(--border-subtle);
  background: transparent;
  color: var(--text-muted);
}
.catalog-toggle--remove:hover {
  background: color-mix(in srgb, var(--status-danger) 8%, transparent);
  border-color: var(--text-primary);
  color: var(--text-primary);
}

/* Expandable catalog row (Plan 580) */
.catalog-row--collapsible {
  display: block;
}
.catalog-row--collapsible .catalog-row-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  user-select: none;
  transition: background 0.12s;
}
.catalog-row--collapsible .catalog-row-header:hover {
  background: var(--bg-hover);
}
.catalog-row--collapsible.catalog-row--expanded .catalog-row-header {
  background: var(--bg-subtle);
}
.catalog-row-chevron {
  flex-shrink: 0;
  font-size: 1rem;
  color: var(--text-muted);
  transition: transform 0.18s;
  display: inline-block;
  margin-left: 2px;
  transform: rotate(0deg);
}
.catalog-row--expanded .catalog-row-chevron {
  transform: rotate(90deg);
}
.catalog-row-detail {
  padding: 10px 16px 14px 40px;
  background: var(--bg-subtle);
  border-top: 1px solid var(--border-subtle);
  font-size: var(--text-sm, 0.875rem);
  color: var(--text-secondary);
}
.catalog-detail-title {
  font-weight: 600;
  color: var(--text-primary);
  margin: 0 0 4px;
  font-size: 0.875rem;
}
.catalog-detail-description {
  margin: 0 0 10px;
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
  line-height: 1.55;
}
.catalog-detail-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 4px 0;
}
.catalog-detail-label {
  font-size: var(--text-xs, 0.75rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  flex-shrink: 0;
  min-width: 110px;
}
.catalog-detail-label--section {
  display: block;
  margin: 10px 0 4px;
}
.catalog-detail-value {
  color: var(--text-secondary);
}
.catalog-detail-link {
  color: var(--brand-blue);
  text-decoration: none;
}
.catalog-detail-link:hover {
  text-decoration: underline;
}
.catalog-detail-obligations {
  margin: 0;
  padding: 0 0 0 14px;
  list-style: disc;
}
.catalog-detail-obligation {
  margin: 3px 0;
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.875rem);
}

/* Deadline chips (shared by catalog rows and legacy watchlist rows) */
.watchlist-chip {
  flex-shrink: 0;
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 600;
}
.watchlist-chip--red {
  background: color-mix(in srgb, var(--status-danger) 12%, transparent);
  color: var(--text-primary);
}
.watchlist-chip--amber {
  background: color-mix(in srgb, var(--status-warning) 12%, transparent);
  color: var(--text-primary);
}

/* ============================================================
   Watchlist tab — legacy watchlist rows (Plans 139+)
   ============================================================ */

.watchlist-tab {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Filter toggle */
.watchlist-filter-toggle {
  display: flex;
  gap: 6px;
  margin-bottom: 12px;
}
.watchlist-toggle-btn {
  padding: 4px 14px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--border-subtle);
  background: transparent;
  color: var(--text-muted);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s;
}
.watchlist-toggle-btn:hover {
  background: var(--bg-hover);
}
.watchlist-toggle-btn[data-active="true"],
.watchlist-toggle-btn--active {
  background: var(--surface-control-active);
  color: var(--text-primary);
  border-color: var(--border-control-active);
}
.watchlist-view-toggle {
  display: flex;
  gap: 4px;
  margin-bottom: 12px;
  background: var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 3px;
  width: fit-content;
}

/* Watchlist rows */
.watchlist-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border-subtle);
}
.watchlist-row:last-child {
  border-bottom: 0;
}
.watchlist-row--archived .watchlist-title {
  color: var(--text-muted);
  text-decoration: line-through;
}
.watchlist-title {
  flex: 1;
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--text-primary);
}
.watchlist-verbs {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.watchlist-verb {
  padding: 4px 10px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  border-radius: var(--radius-pill);
  border: 1px solid var(--border-subtle);
  background: transparent;
  color: var(--text-muted);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.12s;
}
.watchlist-verb:hover {
  background: var(--bg-hover);
}
.verb-remove:hover {
  border-color: var(--text-primary);
  color: var(--text-primary);
  background: color-mix(in srgb, var(--status-danger) 6%, transparent);
}
.verb-readd:hover {
  border-color: var(--button-primary-border);
  color: var(--button-primary-text);
  background: var(--button-primary-bg);
}

/* Empty state */
.watchlist-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: 24px 0;
}
.watchlist-empty-message {
  margin: 0;
  color: var(--text-muted);
  font-size: var(--text-sm);
}
.watchlist-suggest-cta {
  padding: 8px 16px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--button-primary-border);
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s;
}
.watchlist-suggest-cta:hover {
  background: var(--button-primary-bg-hover);
}

/* ============================================================
   Plan 177 — Proposals toolbar defer group
   ============================================================ */
.rm-toolbar-defer {
  display: flex;
  align-items: center;
  gap: 4px;
}

/* ============================================================
   Plan 180 — Proposals detail drawer
   ============================================================ */
.reg-drawer-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(var(--navy-rgb), 0.35);
  z-index: 1200;
}
.reg-drawer-backdrop.open {
  display: block;
}
.reg-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(480px, 95vw);
  background: var(--bg-card);
  box-shadow: -4px 0 24px rgba(var(--navy-rgb), 0.14);
  z-index: 1201;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.22s cubic-bezier(0.25, 0, 0, 1);
  overflow: hidden;
}
.reg-drawer.open {
  transform: translateX(0);
}
.reg-drawer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--border-subtle);
  flex-shrink: 0;
}
.reg-drawer-header-text {
  min-width: 0;
}
.reg-drawer-title {
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.35;
  word-break: break-word;
}
.reg-drawer-sub {
  font-size: var(--text-sm);
  color: var(--text-muted);
  margin-top: 2px;
}
.reg-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.reg-drawer-section {
  background: var(--bg-page);
  border-radius: var(--radius-md);
  padding: 12px 14px;
}
.reg-drawer-section-title {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  margin-bottom: 8px;
}
.reg-drawer-section-body {
  font-size: var(--text-sm);
  color: var(--text-secondary);
}
.reg-drawer-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  border-top: 1px solid var(--border-subtle);
  flex-shrink: 0;
}
/* Key-value rows inside drawer sections */
.kv-row {
  display: flex;
  gap: 8px;
  font-size: var(--text-sm);
  padding: 3px 0;
  border-bottom: 1px solid var(--border-subtle);
}
.kv-row:last-child {
  border-bottom: none;
}
.kv-key {
  font-weight: 600;
  color: var(--text-muted);
  min-width: 80px;
  flex-shrink: 0;
}

/* ── Proposals status tabs (Plan 237) ─────────────────────────────────────── */
.forge-proposals-status-tab {
  padding: 4px 14px;
  font-size: var(--text-sm);
  font-weight: 600;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  transition:
    background 0.15s,
    color 0.15s,
    border-color 0.15s;
}
.forge-proposals-status-tab:hover {
  background: var(--tint-slate);
  color: var(--text-primary);
}
.forge-proposals-status-tab.is-active {
  background: var(--surface-control-active);
  border-color: var(--border-control-active);
  color: var(--text-primary);
}

/* ── Tone utility classes (Plan 278) ─────────────────────────────────────────
 * Used by Python HTML builders to set semantic colors without embedding
 * hex literals. Prefer these over inline style="color:…" for all new code.
 */
.color-red {
  color: var(--text-primary);
}
.color-amber {
  color: var(--brand-amber-text);
}
.color-green {
  color: var(--brand-green);
}
.color-blue {
  color: var(--brand-blue);
}
.color-muted {
  color: var(--text-secondary);
}

/* ── Osperan error card (Plan 278) ──────────────────────────────────────────── */
.forge-error-card {
  padding: 16px 20px;
  border-radius: var(--radius-md);
  background: var(--tint-red);
  border-left: 3px solid var(--brand-red);
  color: var(--text-primary);
  font-size: var(--text-sm);
}
.forge-error-card .forge-error-title {
  font-weight: 700;
  margin-bottom: 4px;
}
.forge-error-card .forge-error-body {
  color: var(--text-secondary);
  font-size: var(--text-sm);
}

/* ── Summary card tokens (Plan 278 / header.py) ───────────────────────────── */
.forge-summary-card {
  background: var(--bg-card);
  color: var(--text-secondary);
  border-radius: var(--radius-md);
  padding: 12px 16px;
}

/* ── Bulk review modal lanes (Plan 285) ───────────────────────────────────── */
/* .forge-review-lane base is defined earlier; this --workflow variant adds
   the flex column layout used in the Plan 285 summary drawer. */
.forge-review-lane,
.forge-review-lane--workflow {
  flex: 1;
  min-width: 0;
  background: var(--bg-card);
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.forge-review-lane-header {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}
.forge-review-lane-title {
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--lane-fg, var(--text-primary));
}
.forge-review-lane-subtitle {
  font-size: var(--text-xs);
  color: var(--lane-fg, var(--text-secondary));
  opacity: 0.8;
  margin-bottom: 8px;
}
.forge-review-lane-count {
  background: var(--lane-color, var(--brand-blue));
  color: var(--color-white);
  border-radius: var(--radius-pill);
  padding: 2px 8px;
  font-size: var(--text-xs);
  font-weight: 700;
}
.forge-review-lane-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: var(--text-sm);
  padding: 4px 0;
  border-top: 1px solid var(--border-subtle);
}
.forge-review-lane-row:first-child {
  border-top: none;
}
.forge-review-lane-row-id {
  font-weight: 600;
  color: var(--lane-fg, var(--text-primary));
  flex: none;
}
.forge-review-lane-row-reason {
  color: var(--lane-fg, var(--text-secondary));
  opacity: 0.85;
  font-size: var(--text-xs);
  text-align: right;
}
.forge-review-empty {
  font-size: var(--text-sm);
  color: var(--text-muted);
  font-style: italic;
}

/* ── Banner variants (Plan 286) ────────────────────────────────────────────── */
/* Plan 803: deliberate 6px left-flush stripe replaces the 3px accent border.
 * The border-radius is removed on the left side so the stripe reads as a
 * structural element rather than a decorative accent.
 * Do not revert to border-left; see Plan 803 in TASKS.md. */
/* Plan 803: Banner redesign — icon-first treatment replaces the lazy
 * border-left accent stripe. Each variant now opens with a 16px solid
 * circle icon (provided by the icon slot class), removing the
 * asymmetric border-radius. The background tint alone carries the
 * color signal; the icon adds clear semantic intent. */
.forge-banner {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 12px 16px;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.forge-banner__icon {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-top: 1px;
  display: inline-block;
}
.forge-banner--info {
  background: var(--tint-info);
  border-color: var(--color-info-border);
  color: var(--text-primary);
}
.forge-banner--info .forge-banner__icon {
  background: var(--brand-blue);
  box-shadow: 0 0 0 3px var(--tint-info);
}
.forge-banner--warning {
  background: var(--tint-amber);
  border-color: var(--color-warning-border);
  color: var(--text-primary);
}
.forge-banner--warning .forge-banner__icon {
  background: var(--brand-amber-bright);
  box-shadow: 0 0 0 3px var(--color-warning-surface);
}
.forge-banner--spaced {
  margin-top: 8px;
}
.forge-banner--neutral {
  background: var(--tint-slate);
  border-color: var(--border);
  color: var(--text-secondary);
}
.forge-banner--neutral .forge-banner__icon {
  background: var(--text-muted);
  box-shadow: 0 0 0 3px var(--tint-slate);
}
.forge-banner--success {
  background: var(--tint-green);
  border-color: var(--border-green);
  color: var(--text-primary);
}
.forge-banner--success .forge-banner__icon {
  background: var(--brand-green);
  box-shadow: 0 0 0 3px var(--tint-green);
}
.forge-banner--danger {
  background: var(--tint-red);
  border-color: var(--border-danger);
  color: var(--text-primary);
}
.forge-banner--danger .forge-banner__icon {
  background: var(--brand-red);
  box-shadow: 0 0 0 3px var(--tint-red);
}
/* Plan 308 — slate/informational banner variant (EPD notice, neutral guidance). */
.forge-banner--slate {
  background: var(--tint-slate);
  border-color: var(--border);
  color: var(--text-primary);
}
.forge-banner--slate .forge-banner__icon {
  background: var(--slate-500);
  box-shadow: 0 0 0 3px var(--tint-slate);
}
/* Plan 957 — banner inner-element classes; eliminate inline style= attributes. */
.forge-banner__title {
  font-weight: 700;
  color: var(--text-primary);
}
.forge-banner__desc {
  color: var(--text-secondary);
  margin-top: 1px;
}
.forge-banner__material-icon--warning {
  color: var(--text-primary);
}
.forge-banner__material-icon--neutral {
  color: var(--text-muted);
}
/* Plan 957 — Settings page read-only hint box. */
.forge-settings-readonly-hint {
  padding: 18px 22px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: var(--bg-page);
  color: var(--text-muted);
  font-size: 0.85rem;
  max-width: 640px;
  margin-top: 8px;
}
/* Plan 314 — deadline urgency cell highlight. */
.forge-deadline-cell {
  white-space: nowrap;
  font-size: 0.8125rem;
  color: var(--text-secondary);
}
.forge-deadline--urgent {
  color: var(--text-primary);
  font-weight: 600;
}
/* Plan 313 — match confidence badge + reasons expander. */
.forge-match-cell {
  white-space: nowrap;
  font-size: 0.8125rem;
}
.forge-match-confidence {
  display: inline-block;
  padding: 0.125rem 0.375rem;
  border-radius: 0.25rem;
  font-size: 0.75rem;
  font-weight: 600;
  background: var(--surface-accent);
  color: var(--brand-blue);
}
.forge-match-confidence--unknown {
  background: var(--surface-muted);
  color: var(--text-secondary);
  font-weight: 400;
}
.forge-match-reasons {
  margin: 0.375rem 0 0;
  padding-left: 1.25rem;
  font-size: 0.75rem;
  color: var(--text-secondary);
  list-style: disc;
}
/* Plan 318 — summary-only scan quality warning badge. */
.forge-scan-quality-warn {
  display: inline-block;
  margin-left: 0.25rem;
  padding: 0.0625rem 0.3125rem;
  border-radius: 0.25rem;
  font-size: 0.6875rem;
  font-weight: 600;
  background: var(--surface-amber);
  color: var(--text-primary);
  white-space: nowrap;
}
/* Plan 68 — status_banner_html body + action control. The action is a real
 * button / link, never a button faked as an underlined text link. */
.forge-banner__body {
  flex: 1;
  min-width: 0;
  font-size: 0.875rem;
}
.forge-banner-action {
  flex-shrink: 0;
  background: none;
  border: 1px solid currentColor;
  border-radius: var(--radius-pill);
  color: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 4px 12px;
  cursor: pointer;
  text-decoration: none;
  line-height: 1.2;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
.forge-banner-action:hover {
  background: var(--text-primary);
  color: var(--color-white);
  border-color: var(--text-primary);
}

/* ── Plan 300 — Module Overview tab: activity feed + pending breakdown ────── */
/* Outer wrapper rendered by activity_feed_tab() in tab_bodies.py. */
.forge-module-overview {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 24px;
  padding: 16px 0;
}
.forge-module-overview-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 20px;
  box-shadow: var(--shadow-sm);
}
.forge-module-overview-section-header {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}

/* Activity feed rows: type 110px / product 1fr / regulation 100px / actor 80px / time 56px */
.forge-activity-feed {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
/* Modifier: empty state — pure selector target, inherits layout from parent. */
.forge-activity-feed--empty {
  opacity: 0.6;
}

.forge-activity-row {
  display: grid;
  grid-template-columns: 110px 1fr 90px 130px 56px;
  gap: 8px;
  align-items: center;
  padding: 5px 0;
  border-bottom: 1px solid var(--border-subtle, rgba(var(--navy-rgb), 0.06));
  font-size: 0.8125rem;
}
.forge-activity-type {
  font-weight: 600;
  text-transform: capitalize;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-activity-product {
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.forge-activity-regulation {
  color: var(--text-secondary);
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-activity-actor {
  color: var(--text-muted);
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-activity-time {
  color: var(--text-muted);
  font-size: 0.75rem;
  text-align: right;
  white-space: nowrap;
}
.forge-activity-empty-msg {
  padding: 12px 0;
  color: var(--text-muted);
  font-size: 0.875rem;
}

/* Pending breakdown buckets: direct fix for count/label run-together bug (Plan 300). */
.forge-pending-breakdown {
  display: flex;
  flex-direction: column;
  gap: 0;
}
/* Modifier — empty state; pure selector target, no extra styles needed. */
.forge-pending-breakdown--empty {
  opacity: 0.6;
}

.forge-pending-breakdown-header {
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
  margin-bottom: 8px;
}
.forge-pending-bucket {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 4px;
  border-bottom: 1px solid var(--border-subtle, rgba(var(--navy-rgb), 0.06));
  font-size: 0.875rem;
}
.forge-pending-bucket:hover {
  background: var(--tint-slate);
  border-radius: 4px;
}
.forge-pending-bucket-label {
  color: var(--text-primary);
  text-decoration: none;
}
.forge-pending-bucket-label:hover {
  text-decoration: underline;
}
.forge-pending-bucket-count {
  font-weight: 700;
  font-size: 1rem;
  min-width: 2ch;
  text-align: right;
}
/* Tone variants matching the kpi-tile tone vocabulary. */
.forge-pending-bucket-count--green {
  color: var(--brand-green);
}
.forge-pending-bucket-count--amber {
  color: var(--text-primary);
}
.forge-pending-bucket-count--red {
  color: var(--text-primary);
}
.forge-pending-bucket-count--slate {
  color: var(--text-secondary);
}
.forge-pending-empty-msg {
  padding: 12px 0;
  color: var(--text-muted);
  font-size: 0.875rem;
}

/* Queue table helpers used by tab_bodies.py (Plan 300 — extend scan scope). */
/* forge-module-queue-empty is the no-items paragraph class. */
.forge-module-queue-empty {
  color: var(--text-secondary);
  font-size: 0.875rem;
  text-align: center;
}
/* forge-module-queue-expansion-cell: expandable row detail cell. */
.forge-module-queue-expansion-cell {
  padding: 8px 16px;
  background: var(--surface-alt);
  font-size: 0.8125rem;
  color: var(--text-secondary);
}
/* Rows with data-href are keyboard-addressable navigation affordances. */
.forge-queue-table__row--clickable {
  cursor: pointer;
}
.forge-queue-table__row--clickable:focus-visible {
  outline: 2px solid var(--brand-ai);
  outline-offset: -2px;
}

/* Grouped queue wrapper and hooks emitted by the shared queue table renderer. */
.forge-queue-grouped {
  width: 100%;
  border-collapse: collapse;
}
.forge-queue-table__caret-cell {
  width: 32px;
  text-align: center;
  padding: 4px;
}
.forge-queue-table__caret {
  background: none;
  border: none;
  cursor: pointer;
  padding: 2px 6px;
  font-size: 0.75rem;
  color: var(--text-secondary);
  border-radius: var(--radius-sm);
  transition: background 0.1s;
}
.forge-queue-table__caret:hover {
  background: var(--tint-slate);
}
.forge-queue-table__caret::before {
  content: "▶";
  display: inline-block;
  font-size: 0.6rem;
  transition: transform 0.2s;
}
.forge-queue-table__caret.is-open::before {
  transform: rotate(90deg);
}
.forge-queue-table__group-header {
  font-weight: 600;
}
.forge-queue-table__group--expandable .forge-queue-table__caret {
  opacity: 1;
}
.forge-queue-table__group:last-child .forge-queue-table__group-header:last-child td,
.forge-queue-table__group:last-child .forge-queue-table__child:last-child td {
  border-bottom: none;
}
.forge-queue-table__child {
  background: var(--surface-alt);
}

/* forge-exec-queue: execution module queue wrapper; mirrors forge-module-queue. */
.forge-exec-queue {
  width: 100%;
}

/* forge-tab-anatomy: root mounting div for tab-anatomy assemblers (Plan 182);
   pure JS/Python hook, no visual rule needed. */
.forge-tab-anatomy {
  display: contents;
}
/* forge-tab-viz-body: scrollable body inside a tab viz panel. */
.forge-tab-viz-body {
  overflow: auto;
  max-height: 480px;
}

/* ── AI confidence bar (Plan 288) ────────────────────────────────────────── */
.forge-confidence-bar {
  display: inline-block;
  width: 64px;
  height: 4px;
  border-radius: var(--radius-pill);
  background: var(--tint-blue);
  position: relative;
  vertical-align: middle;
}
.forge-confidence-bar-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: var(--radius-pill);
  background: var(--brand-blue);
}

/* ── Toggle switch (Sources page) ────────────────────────────────────────── */
.forge-toggle {
  position: relative;
  display: inline-flex;
  width: 40px;
  height: 22px;
  flex-shrink: 0;
}
.forge-toggle input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}
.forge-toggle-track {
  position: absolute;
  inset: 0;
  background: var(--border-strong);
  border-radius: var(--radius-pill);
  cursor: pointer;
  transition: background 0.18s cubic-bezier(0.25, 0, 0, 1);
}
.forge-toggle input:checked + .forge-toggle-track {
  background: var(--brand-green);
}
.forge-toggle input:disabled + .forge-toggle-track {
  opacity: 0.45;
  cursor: not-allowed;
}
.forge-toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  background: var(--bg-card);
  border-radius: 50%;
  box-shadow: var(--shadow-sm);
  transition: transform 0.18s cubic-bezier(0.25, 0, 0, 1);
  pointer-events: none;
}
.forge-toggle input:checked ~ .forge-toggle-thumb {
  transform: translateX(18px);
}

/* ── Sources page — connector card (May 2026 redesign) ─────────────────────
 * Layout per card: top row (category pill + title + description on the left,
 * status chip pinned right), optional last-sync line, action row at bottom
 * with toggle + primary CTA. Built by _connector_card_html() in sources.py.
 * ─────────────────────────────────────────────────────────────────────────── */
.forge-connector-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px;
  background: var(--bg-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition:
    box-shadow var(--motion-base) var(--ease-out-quart),
    border-color var(--motion-base) var(--ease-out-quart);
}
.forge-connector-card:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-md);
}

.forge-conn-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.forge-conn-title-block {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1 1 auto;
}
.forge-conn-cat {
  align-self: flex-start;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  background: var(--tint-blue);
  color: var(--brand-blue);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.forge-conn-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.forge-conn-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.forge-conn-desc {
  font-size: 0.8125rem;
  color: var(--text-muted);
  line-height: 1.45;
}

/* Status chip — pinned to the right of the top row.
 * Variants: --live (active), --paused (disabled), --off (not_connected),
 * --registered (connecting), --error (failed). The toggle handler in
 * sources.py rewrites both className and innerHTML on state change. */
.forge-conn-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  padding: 4px 10px;
  border-radius: var(--radius-pill);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.forge-conn-chip .material-icons {
  font-size: 14px;
}
.forge-conn-chip--live {
  background: var(--tint-green);
  color: var(--brand-green-dark);
}
.forge-conn-chip--paused {
  background: var(--tint-amber);
  color: var(--brand-amber-text);
}
.forge-conn-chip--off {
  background: var(--tint-slate);
  color: var(--text-secondary);
}
.forge-conn-chip--registered {
  background: var(--tint-blue);
  color: var(--brand-blue);
}
.forge-conn-chip--error {
  background: var(--tint-red);
  color: var(--brand-red-dark);
}

.forge-conn-meta {
  font-size: 0.75rem;
  color: var(--text-muted);
}
.forge-conn-meta--error {
  color: var(--brand-red-dark);
}
.forge-conn-note {
  font-size: 0.72rem;
  color: var(--text-muted);
  line-height: 1.45;
}

.forge-conn-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 2px;
}

.forge-conn-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition:
    background var(--motion-fast) var(--ease-out-quart),
    color var(--motion-fast) var(--ease-out-quart),
    border-color var(--motion-fast) var(--ease-out-quart),
    opacity var(--motion-fast) var(--ease-out-quart);
}
.forge-conn-btn .material-icons {
  font-size: 15px;
}
.forge-conn-btn:disabled,
.forge-conn-btn[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
}
.forge-conn-btn--primary {
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  border-color: var(--button-primary-border);
}
.forge-conn-btn--primary:hover {
  background: var(--button-primary-bg-hover);
  border-color: var(--button-primary-bg-hover);
}
.forge-conn-btn--gmail {
  background: #ea4335;
  color: var(--color-white);
  border-color: #ea4335;
}
.forge-conn-btn--gmail:hover {
  opacity: 0.92;
}
.forge-conn-btn--outlook {
  background: #0072c6;
  color: var(--color-white);
  border-color: #0072c6;
}
.forge-conn-btn--outlook:hover {
  opacity: 0.92;
}
.forge-conn-btn--disabled {
  background: transparent;
  color: var(--text-muted);
  border-color: var(--border-strong);
  cursor: default;
}

/* ── Source-document Actions dropdown (.sd-actions / .sd-menu) ─────────────
 * The menu is HTML-rendered inside table cells. Without explicit
 * positioning it paints behind adjacent Quasar cards.
 * ─────────────────────────────────────────────────────────────────────────── */
details.sd-actions {
  position: relative;
  display: inline-block;
}
details.sd-actions > summary {
  list-style: none;
  cursor: pointer;
  padding: 3px 10px;
  font-size: var(--text-sm);
  font-weight: 600;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--bg-card);
  color: var(--text-primary);
  user-select: none;
  white-space: nowrap;
}
details.sd-actions > summary::-webkit-details-marker {
  display: none;
}
details.sd-actions > summary::after {
  content: " ▾";
  font-size: 0.7em;
  color: var(--text-muted);
}
.sd-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  min-width: 148px;
  z-index: 500;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  padding: 4px 0;
  display: flex;
  flex-direction: column;
}
.sd-menu .sd-btn {
  display: block;
  width: 100%;
  text-align: left;
  padding: 7px 14px;
  border: none;
  background: transparent;
  font: inherit;
  font-size: var(--text-sm);
  color: var(--text-primary);
  cursor: pointer;
  white-space: nowrap;
}
.sd-menu .sd-btn:hover {
  background: var(--tint-slate);
}
.sd-menu .sd-btn.sd-del-btn {
  color: var(--text-primary);
}
.sd-menu .sd-btn.sd-del-btn:hover {
  background: var(--tint-red);
}
/* JS adds this class when the menu would extend past the viewport bottom */
details.sd-actions.sd-flip-up .sd-menu {
  top: auto;
  bottom: calc(100% + 4px);
}

/* -------------------------------------------------------------------------
 * Plan 803 — .forge-banner component
 * Replaces the border-left accent pattern with icon-driven colour signalling.
 * The coloured icon (16px inline flex child) carries the semantic tone;
 * the tinted background reinforces it without a distracting stripe.
 * Usage: <div class="forge-banner forge-banner--info"><span class="forge-banner__icon material-icons">info</span> …</div>
 * ------------------------------------------------------------------------- */
.forge-banner {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 12px 16px;
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  line-height: 1.55;
}
.forge-banner__icon {
  font-size: 16px;
  flex-shrink: 0;
  margin-top: 1px;
  display: inline-flex;
}
.forge-banner--info {
  background: var(--tint-info);
  color: var(--text-primary);
}
.forge-banner--info .forge-banner__icon {
  color: var(--brand-info);
}
.forge-banner--warning {
  background: var(--tint-amber);
  color: var(--text-primary);
}
.forge-banner--warning .forge-banner__icon {
  color: var(--text-primary);
}
.forge-banner--neutral {
  background: var(--tint-slate);
  color: var(--text-secondary);
}
.forge-banner--neutral .forge-banner__icon {
  color: var(--text-secondary);
}
.forge-banner--error {
  background: var(--tint-red);
  color: var(--text-primary);
}
.forge-banner--error .forge-banner__icon {
  color: var(--brand-red-dark);
}
/* Compact variant — tighter padding for inline/inline-block contexts */
.forge-banner--compact {
  padding: 8px 12px;
}
/* AI-review gate banner — displayed when unreviewed AI fields block sign-off */
.forge-ai-review-gate {
  margin-bottom: 16px;
}

/* Plan 284: Fields tab toolbar — wraps search + filter chips */
.forge-fields-toolbar {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* Plan 284: "Review now →" CTA inside the sign-off banner */
.forge-banner-cta {
  margin-left: auto;
  flex-shrink: 0;
}

/* ===========================================================================
 * Product overview card — forge-product-overview-*
 * Header zone rendered by header.py; wraps the status banner, KPI strip,
 * apply-regulation button, and the obligations tab row slot.
 * =========================================================================== */
.forge-product-overview-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 20px 24px 16px;
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}
.forge-product-overview-headrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  min-height: 28px;
}
.forge-product-overview-heading {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--brand-blue);
}
.forge-product-overview-owner {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
/* Bottom slot that holds the obligations tab row */
.forge-product-overview-obligations {
  padding-top: 6px;
  border-top: 1px solid var(--border-subtle);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.forge-product-facts {
  width: 100%;
}
.forge-product-facts-editor {
  width: min(720px, calc(100vw - 32px));
  max-height: calc(100vh - 64px);
  overflow: auto;
  border-radius: 8px;
}
.forge-product-facts-list {
  display: grid;
  gap: 10px;
  margin: 0;
}
.forge-product-fact {
  display: grid;
  gap: 4px;
  align-items: baseline;
}
.forge-product-fact dt {
  color: var(--text-muted);
  font-size: 0.64rem;
  font-weight: 850;
  line-height: 1.2;
  text-transform: uppercase;
}
.forge-product-fact dd {
  min-width: 0;
  margin: 0;
  color: var(--text-primary);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.forge-product-facts-row {
  display: grid;
  grid-template-columns:
    minmax(190px, 1.3fr)
    minmax(160px, 1fr)
    minmax(180px, 1fr)
    minmax(110px, 0.6fr);
  gap: 16px;
  align-items: center;
  padding: 12px 14px;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-primary);
}
.forge-product-facts-row:first-child {
  border-top: 0;
}
.forge-product-facts-row--head {
  background: var(--bg-soft);
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
}
.forge-product-facts-row--summary {
  grid-template-columns: minmax(190px, 0.5fr) minmax(240px, 1.5fr);
}
.forge-product-facts-row--summary span:first-child {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
}
.forge-product-facts-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.forge-product-facts-row strong {
  display: block;
  font-size: var(--text-sm);
}
.forge-product-facts-row small {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: var(--text-xs);
}

.forge-product-workbench-stage {
  position: relative;
  padding: 16px;
  overflow: visible;
}

.forge-product-workbench-stage > div {
  width: 100%;
}

.forge-product-facts-overview {
  display: grid;
  gap: 14px;
  width: 100%;
}

.forge-product-facts-overview > .forge-section-header {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-subtle);
}

.forge-product-facts-overview-secondary {
  margin-top: 2px;
}

.forge-product-facts-groups {
  display: grid;
  grid-template-columns: minmax(280px, 1.25fr) minmax(220px, 0.85fr) minmax(180px, 0.7fr);
  gap: 22px;
  align-items: start;
}

.forge-product-fact-group {
  min-width: 0;
}

.forge-product-fact-group-title {
  margin: 0 0 10px;
  color: var(--text-secondary);
  font-size: 0.7rem;
  font-weight: 850;
  line-height: 1.25;
  text-transform: uppercase;
}

.forge-product-facts-empty,
.forge-product-characteristics-empty {
  display: grid;
  gap: 4px;
  padding: 12px 0;
  color: var(--text-secondary);
}

.forge-product-facts-empty strong,
.forge-product-characteristics-empty strong {
  color: var(--text-primary);
  font-size: 0.82rem;
  font-weight: 850;
}

.forge-product-facts-empty span,
.forge-product-characteristics-empty span {
  max-width: 520px;
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 650;
  line-height: 1.4;
}

.forge-product-characteristics-empty {
  padding: 14px 0 2px;
}

.forge-reg-ledger {
  display: grid;
  gap: 12px;
  width: 100%;
}

.forge-reg-ledger-head {
  display: flex;
  align-items: flex-start;
  padding-right: 150px;
}

.forge-reg-ledger-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.3fr);
  gap: 16px;
  align-items: start;
}

.forge-reg-ledger-main,
.forge-reg-ledger-rail,
.forge-overview-rail-section,
.forge-reg-candidate-list,
.forge-ledger-source-list {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.forge-reg-ledger-rail {
  position: sticky;
  top: 92px;
  gap: 10px;
  color: var(--text-secondary);
}

.forge-reg-ledger-section {
  min-width: 0;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
}

.forge-overview-rail-section {
  gap: 10px;
  border-color: var(--border-subtle);
  background: transparent;
  padding: 0 0 12px;
  border-width: 0 0 1px;
  border-radius: 0;
}

.forge-reg-ledger-section {
  overflow: hidden;
}

.forge-overview-empty-ledger {
  min-height: 148px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.forge-overview-empty-prompt {
  display: grid;
  justify-items: center;
  gap: 8px;
  max-width: 440px;
}

.forge-overview-empty-prompt strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 850;
}

.forge-overview-empty-prompt span {
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.4;
}

.forge-reg-ledger-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-subtle);
  background: transparent;
}

.forge-reg-ledger .forge-table tbody tr:first-child td,
.forge-product-facts-overview .forge-table tbody tr:first-child td {
  border-top: 0;
}

.forge-ledger-row td:first-child strong,
.forge-product-characteristics-table td:first-child strong,
.forge-overview-row-copy strong {
  display: block;
  color: var(--text-primary);
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.25;
}

.forge-ledger-row td:first-child span,
.forge-product-characteristics-table td:first-child small,
.forge-overview-row-copy span {
  display: block;
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1.35;
}

.forge-overview-status {
  max-width: 100%;
  white-space: normal;
}

.forge-overview-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.forge-overview-list-item {
  background: var(--bg-card);
}

.forge-ledger-action {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  color: var(--brand-blue);
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.15;
  text-decoration: none;
}

.forge-ledger-action:hover {
  text-decoration: underline;
}

.forge-ledger-muted {
  color: var(--text-muted);
  font-size: 0.7rem;
  font-weight: 800;
}

@media (max-width: 1120px) {
  .forge-reg-ledger-grid,
  .forge-product-facts-groups {
    grid-template-columns: 1fr;
  }

  .forge-reg-ledger-head {
    padding-right: 150px;
  }

  .forge-reg-ledger-rail {
    position: static;
  }
}

@media (max-width: 860px) {
  .forge-reg-ledger-grid,
  .forge-reg-ledger-head {
    padding-right: 0;
  }
}

@media (max-width: 760px) {
  .forge-product-facts-row,
  .forge-product-fact,
  .forge-overview-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .forge-product-facts-row--head {
    display: none;
  }
}

/* ===========================================================================
 * Product compliance graph — read-only ProductComplianceWorkspace projection
 * =========================================================================== */
.forge-product-overview-graph {
  overflow: hidden;
}
.forge-compliance-graph {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}
.forge-compliance-graph-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 2px 2px 4px;
  flex-wrap: wrap;
}
.forge-compliance-graph-eyebrow,
.forge-compliance-graph-kicker {
  color: var(--text-muted);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}
.forge-compliance-graph-title {
  color: var(--text-primary);
  font-size: var(--text-md);
  font-weight: 900;
  line-height: 1.25;
  margin-top: 3px;
}
.forge-compliance-graph-stats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.forge-compliance-graph-stats span {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  background: var(--bg-subtle);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  font-weight: 800;
  line-height: 1;
  padding: 7px 9px;
  white-space: nowrap;
}
.forge-compliance-graph-stats strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}
.forge-compliance-graph-root {
  display: flex;
  justify-content: center;
  padding: 0 0 8px;
  position: relative;
}
.forge-compliance-graph-root::after {
  content: "";
  position: absolute;
  bottom: -12px;
  left: 50%;
  width: 1px;
  height: 20px;
  background: var(--border);
}
.forge-compliance-graph-branches {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 18px;
  align-items: start;
  padding-top: 10px;
  position: relative;
}
.forge-compliance-graph-regulation,
.forge-compliance-graph-obligation {
  position: relative;
}
.forge-compliance-graph-regulation::before {
  content: "";
  position: absolute;
  top: -20px;
  left: 50%;
  width: 1px;
  height: 20px;
  background: var(--border);
}
.forge-compliance-graph-obligations,
.forge-compliance-graph-requirements {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.forge-compliance-graph-obligations {
  margin-top: 12px;
  padding: 0 0 0 18px;
  border-left: 2px solid var(--border-subtle);
}
.forge-compliance-graph-requirements {
  margin: 8px 0 0 18px;
  padding-left: 12px;
  border-left: 1px dashed var(--border);
}
.forge-compliance-graph-node,
.forge-compliance-graph-requirement {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  width: 100%;
  color: var(--text-primary);
  text-decoration: none;
  border: 1px solid var(--border);
  background: var(--bg-card);
  border-radius: 8px;
  box-shadow: var(--shadow-sm);
  transition: border-color var(--motion-fast) var(--ease-out-quart),
    box-shadow var(--motion-fast) var(--ease-out-quart),
    transform var(--motion-fast) var(--ease-out-quart);
}
.forge-compliance-graph-node {
  flex-direction: column;
  align-items: flex-start;
  padding: 12px 14px 13px;
}
.forge-compliance-graph-node--product {
  width: min(460px, 100%);
  border-color: color-mix(in srgb, var(--brand-blue) 44%, var(--border));
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-blue) 11%, var(--bg-card)),
    var(--bg-card)
  );
}
.forge-compliance-graph-node--regulation {
  border-color: color-mix(in srgb, var(--brand-green) 34%, var(--border));
  background: linear-gradient(180deg, color-mix(in srgb, var(--brand-green) 7%, var(--bg-card)), var(--bg-card));
}
.forge-compliance-graph-node--obligation {
  background: linear-gradient(180deg, color-mix(in srgb, var(--brand-amber) 6%, var(--bg-card)), var(--bg-card));
}
.forge-compliance-graph-node-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  margin-bottom: 4px;
}
.forge-compliance-graph-label {
  max-width: 100%;
  font-size: var(--text-sm);
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.forge-compliance-graph-meta {
  max-width: 100%;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-secondary);
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.forge-compliance-graph-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid var(--border-subtle);
  background: var(--tint-slate);
  color: var(--text-secondary);
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1;
  padding: 5px 7px;
  white-space: nowrap;
}
.forge-compliance-graph-chip--green {
  background: var(--tint-green);
  color: var(--brand-green);
}
.forge-compliance-graph-chip--amber {
  background: var(--tint-amber);
  color: var(--text-primary);
}
.forge-compliance-graph-chip--red {
  background: var(--tint-red);
  color: var(--text-primary);
}
.forge-compliance-graph-progress {
  width: 100%;
  height: 5px;
  margin-top: 10px;
  border-radius: 999px;
  background: var(--border-subtle);
  overflow: hidden;
}
.forge-compliance-graph-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--text-muted);
}
.forge-compliance-graph-progress--green span {
  background: var(--brand-green);
}
.forge-compliance-graph-progress--amber span {
  background: var(--brand-amber);
}
.forge-compliance-graph-progress--red span {
  background: var(--brand-red);
}
.forge-compliance-graph-requirement {
  padding: 8px 10px 8px 9px;
  font-size: var(--text-xs);
  line-height: 1.25;
  background: var(--bg-card);
}
.forge-compliance-graph-requirement span {
  min-width: 0;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.forge-compliance-graph-requirement i {
  display: block;
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 999px;
  background: var(--text-muted);
}
.forge-compliance-graph-requirement em {
  flex-shrink: 0;
  color: var(--text-secondary);
  font-style: normal;
  font-weight: 800;
}
.forge-compliance-graph-requirement--green i {
  background: var(--brand-green);
}
.forge-compliance-graph-requirement--amber i {
  background: var(--brand-amber);
}
.forge-compliance-graph-requirement--red i {
  background: var(--brand-red);
}
.forge-compliance-graph-requirement.is-selected {
  border-color: var(--brand-blue);
  background: color-mix(in srgb, var(--brand-blue) 8%, var(--bg-card));
}
.forge-compliance-graph-node:hover,
.forge-compliance-graph-requirement:hover {
  border-color: var(--brand-blue);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}
.forge-compliance-graph-empty,
.forge-compliance-graph-more {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.forge-compliance-graph-shared {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--border-subtle);
  padding-top: 14px;
}
.forge-compliance-graph-shared-title {
  color: var(--text-secondary);
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.forge-compliance-graph-shared-row {
  display: grid;
  grid-template-columns: minmax(120px, 0.5fr) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 9px 10px;
  background: var(--bg-subtle);
  font-size: var(--text-xs);
}
.forge-compliance-graph-shared-row strong,
.forge-compliance-graph-shared-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.forge-compliance-graph-shared-row span {
  color: var(--text-secondary);
  font-weight: 700;
}

.forge-path-summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-card);
  box-shadow: 0 8px 22px rgba(var(--navy-rgb), 0.04);
}

.forge-path-product {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.forge-path-product a {
  font-family: var(--font-display);
  font-size: 1.06rem;
  font-weight: 850;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.forge-path-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  color: var(--text-secondary);
  font-size: 0.74rem;
  font-weight: 760;
  line-height: 1.35;
}

.forge-path-score {
  display: grid;
  flex: 0 0 auto;
  gap: 3px;
  justify-items: end;
}

.forge-path-score strong {
  color: var(--text-primary);
  font-family: var(--font-display);
  font-size: 1.42rem;
  font-weight: 900;
  line-height: 1;
}

.forge-path-score span {
  color: var(--text-muted);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.forge-path-panel {
  display: grid;
  gap: 13px;
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: linear-gradient(180deg, var(--bg-card), color-mix(in srgb, var(--bg-page) 18%, var(--bg-card)));
  box-shadow: 0 10px 26px rgba(var(--navy-rgb), 0.05);
}

.forge-path-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.forge-path-panel-title {
  color: var(--text-muted);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.forge-path-stack {
  display: grid;
  gap: 12px;
}

.forge-path-chain {
  position: relative;
  display: grid;
  gap: 10px;
  padding-left: 24px;
}

.forge-path-chain::before {
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 9px;
  width: 1px;
  background: color-mix(in srgb, var(--border) 82%, transparent);
  content: "";
}

.forge-path-node {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 13px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  box-shadow: 0 5px 16px rgba(var(--navy-rgb), 0.035);
}

.forge-path-node::before {
  position: absolute;
  top: 50%;
  left: -20px;
  width: 9px;
  height: 9px;
  border: 2px solid var(--bg-card);
  border-radius: 999px;
  background: var(--text-muted);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--border) 82%, transparent);
  content: "";
}

.forge-path-node--regulation::before {
  background: var(--brand-green);
}

.forge-path-node--obligation::before {
  background: var(--brand-amber);
}

.forge-path-node--requirement::before {
  background: var(--text-muted);
}

.forge-path-node--green {
  border-color: color-mix(in srgb, var(--brand-green) 26%, var(--border));
  background: color-mix(in srgb, var(--tint-green) 28%, var(--bg-card));
}

.forge-path-node--amber {
  border-color: color-mix(in srgb, var(--brand-amber) 26%, var(--border));
  background: color-mix(in srgb, var(--tint-amber) 30%, var(--bg-card));
}

.forge-path-node--red {
  border-color: color-mix(in srgb, var(--brand-red) 32%, var(--border));
  background: color-mix(in srgb, var(--tint-red) 48%, var(--bg-card));
}

.forge-path-node--red::before {
  background: var(--brand-red);
}

.forge-path-kicker {
  color: var(--text-muted);
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.forge-path-label {
  margin-top: 3px;
  color: var(--text-primary);
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

.forge-path-sub {
  margin-top: 4px;
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 760;
  line-height: 1.35;
}

.forge-path-empty {
  padding: 14px;
  border: 1px dashed var(--border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-page) 54%, var(--bg-card));
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 760;
}

.forge-gap-detail-block {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-muted);
}

.forge-ai-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  background: var(--tint-slate);
  color: var(--text-secondary);
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.forge-ai-chip--green {
  background: var(--tint-green);
  color: var(--brand-green);
}

.forge-ai-chip--amber {
  background: var(--tint-amber);
  color: var(--text-primary);
}

.forge-ai-chip--red {
  background: var(--tint-red);
  color: var(--text-primary);
}

.forge-ai-progress {
  width: 100%;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--border-subtle);
}

.forge-ai-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--text-muted);
}

.forge-ai-progress--green span {
  background: var(--brand-green);
}

.forge-ai-progress--amber span {
  background: var(--brand-amber);
}

.forge-ai-progress--red span {
  background: var(--brand-red);
}

.source-doc-view-btn {
  white-space: nowrap;
}

.source-doc-review-chain {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--text-secondary);
  font-size: 0.72rem;
  line-height: 1.35;
}

.source-doc-review-chain-item {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
}

.source-doc-review-alias,
.source-doc-review-value,
.source-doc-target-link {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.source-doc-review-findings {
  display: grid;
  gap: 12px;
}

.source-doc-review-related-evidence {
  display: block;
  margin-top: 4px;
  color: var(--text-muted);
  font-size: var(--text-sm);
}

.source-doc-review-findings-card {
  display: grid;
  gap: 12px;
}

.source-doc-review-finding {
  scroll-margin-top: 96px;
}

@media (max-width: 760px) {
  .forge-path-summary,
  .forge-path-panel-head {
    display: grid;
  }

  .forge-path-score {
    justify-items: start;
  }

  .forge-path-node {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .forge-compliance-graph-head {
    flex-direction: column;
  }
  .forge-compliance-graph-stats {
    justify-content: flex-start;
  }
  .forge-compliance-graph-branches {
    grid-template-columns: 1fr;
  }
  .forge-compliance-graph-regulation::before {
    left: 20px;
  }
  .forge-compliance-graph-shared-row {
    grid-template-columns: 1fr;
  }
}

/* ===========================================================================
 * Obligation tab strip — forge-oblig-*
 * Rendered by obligations_row.py; one clickable pill-card per obligation.
 * Each tab sets --oblig-accent:var(--oblig-{kind}) inline so all colour
 * rules below can reference var(--oblig-accent) as a single control point.
 * =========================================================================== */

/* --- Outer flex row -------------------------------------------------------- */
.forge-oblig-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
  align-items: stretch;
}
.forge-oblig-tabs.is-overflow {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: thin;
  padding-bottom: 4px;
}
.forge-oblig-tabs.is-overflow::-webkit-scrollbar {
  height: 4px;
}
.forge-oblig-tabs.is-overflow::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: var(--radius-xs);
}

/* --- Individual tab pill --------------------------------------------------- */
.forge-oblig-tab {
  --oblig-accent: var(--oblig-slate);
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 14px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background: var(--bg-card);
  flex: 1 1 160px;
  min-width: 160px;
  position: relative;
  outline: none;
  transition:
    box-shadow 0.14s cubic-bezier(0.25, 0, 0, 1),
    border-color 0.14s cubic-bezier(0.25, 0, 0, 1),
    background 0.14s cubic-bezier(0.25, 0, 0, 1),
    transform 0.14s cubic-bezier(0.25, 0, 0, 1);
}

/* Focused (selected) tab — ring + tinted background */
.forge-oblig-tab.is-focused {
  border-color: var(--oblig-accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--oblig-accent) 22%, transparent);
  background: color-mix(in srgb, var(--oblig-accent) 5%, var(--bg-card));
}
/* "SELECTED" micro-badge — top-right corner; signals the active cert */
.forge-oblig-tab.is-focused::after {
  content: "SELECTED";
  position: absolute;
  top: 7px;
  right: 10px;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--oblig-accent);
  opacity: 0.75;
}

/* Unfocused interactive tab */
.forge-oblig-tab.is-clickable:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
  border-color: var(--border-strong);
}
.forge-oblig-tab.is-clickable:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}

/* Text layers inside each tab */
.forge-oblig-tab-label {
  font-size: var(--text-sm);
  font-weight: 800;
  color: var(--text-primary);
  line-height: 1.2;
}
.forge-oblig-tab-status {
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--oblig-accent);
  line-height: 1.25;
}
.forge-oblig-tab-reason {
  font-size: var(--text-xs);
  color: var(--text-secondary);
  line-height: 1.3;
}

/* Unverified regulation badge — amber pill rendered inside a tab */
.forge-oblig-unverified-badge {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 1px 7px;
  border-radius: var(--radius-pill);
  background: var(--tint-amber);
  color: var(--brand-amber-text);
  font-size: var(--text-xs);
  font-weight: 700;
  border: 1px solid color-mix(in srgb, var(--status-warning) 18%, transparent);
  white-space: nowrap;
}

/* Manual-override badge — blue pill */
.forge-oblig-manual-badge {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 1px 7px;
  border-radius: var(--radius-pill);
  background: var(--tint-info);
  color: var(--brand-blue);
  font-size: var(--text-xs);
  font-weight: 700;
  border: 1px solid var(--color-info-border);
  white-space: nowrap;
}

/* --- Inline Current / Upcoming divider ------------------------------------ */
.forge-oblig-divider {
  display: flex;
  align-self: center;
  align-items: center;
  gap: 6px;
  padding: 0 6px;
  flex-shrink: 0;
}
.forge-oblig-divider-label {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

/* --- Multi-regulation grouped layout -------------------------------------- */
.forge-oblig-grouped {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  width: 100%;
  align-items: flex-start;
}
.forge-oblig-reg-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 200px;
}
.forge-oblig-reg-header {
  display: flex;
  align-items: center;
  gap: 8px;
}
.forge-oblig-reg-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--brand-blue);
  white-space: nowrap;
}
.forge-oblig-reg-badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--brand-blue);
  flex-shrink: 0;
}
.forge-oblig-reg-upcoming-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: var(--radius-pill);
  background: var(--tint-slate);
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.forge-oblig-reg-rule {
  flex: 1;
  height: 1px;
  background: var(--border);
  min-width: 12px;
}
.forge-oblig-reg-pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* --- Active filter chip above the tabs ------------------------------------ */
.forge-oblig-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--radius-pill);
  background: var(--tint-info);
  border: 1px solid var(--color-info-border);
  font-size: var(--text-xs);
  cursor: pointer;
  transition: background 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.forge-oblig-filter-chip:hover {
  background: var(--bg-hover);
}
.forge-oblig-filter-eyebrow {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.forge-oblig-filter-label {
  color: var(--brand-blue);
  font-weight: 700;
}
.forge-oblig-filter-meta {
  color: var(--text-muted);
  font-weight: 600;
}
.forge-oblig-filter-clear {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 1px 8px;
  border-radius: var(--radius-pill);
  border: none;
  background: var(--button-secondary-bg-hover);
  color: var(--button-secondary-text-hover);
  font-size: var(--text-xs);
  font-weight: 700;
  cursor: pointer;
  line-height: 1.4;
  transition: background 0.12s cubic-bezier(0.25, 0, 0, 1);
}
.forge-oblig-filter-clear:hover {
  background: var(--button-secondary-bg-hover);
  color: var(--button-secondary-text-hover);
}

/* --- Reduced motion ------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .forge-oblig-tab {
    transition: none;
  }
  .forge-oblig-tab.is-clickable:hover {
    transform: none;
  }
}

/* ===========================================================================
 * Obligation panel cards — forge-oblig-panel-*
 * Rendered by obligations.py; card chrome (title + status pill) +
 * Pattern A (field-workflow) or Pattern B (doc-checklist) body.
 * =========================================================================== */
.forge-oblig-panel-chrome {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px 8px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border-subtle);
}
.forge-oblig-panel-selected {
  background: color-mix(in srgb, var(--brand-amber) 5%, var(--bg-card));
}

/* Title and status within chrome */
.forge-oblig-panel-title {
  font-size: var(--text-sm);
  font-weight: 800;
  color: var(--text-primary);
  margin-right: auto;
  letter-spacing: 0.02em;
}
.forge-oblig-panel-status {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 700;
  background: var(--tint-slate);
  color: var(--text-secondary);
  border: 1px solid var(--border);
  white-space: nowrap;
}
.forge-oblig-panel-status-amber {
  background: var(--tint-amber);
  color: var(--brand-amber-text);
  border-color: color-mix(in srgb, var(--status-warning) 18%, transparent);
}
.forge-oblig-panel-status-red {
  background: var(--tint-red);
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--status-danger) 18%, transparent);
}
.forge-oblig-panel-status-green {
  background: var(--tint-green);
  color: var(--brand-green-dark);
  border-color: color-mix(in srgb, var(--status-success) 20%, transparent);
}
.forge-oblig-panel-status-blue {
  background: var(--tint-info);
  color: var(--brand-blue);
  border-color: var(--color-info-border);
}
.forge-oblig-panel-status-slate {
  background: var(--tint-slate);
  color: var(--text-secondary);
  border-color: var(--border);
}

/* Pattern A / B card body */
.forge-oblig-panel-body {
  padding: 10px 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.forge-oblig-panel-progress {
  font-size: var(--text-xs);
  color: var(--text-secondary);
}
.forge-oblig-panel-gaps {
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--brand-amber-text);
}
.forge-oblig-panel-docs-count {
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.forge-oblig-panel-validity {
  font-size: var(--text-xs);
  color: var(--text-muted);
}
.forge-oblig-panel-missing-list {
  margin: 4px 0 0 0;
  padding: 0 0 0 14px;
  font-size: var(--text-xs);
  color: var(--text-secondary);
}
.forge-oblig-panel-missing-item {
  line-height: 1.5;
}

/* Empty / not-yet-effective card states */
.forge-oblig-panel-soft-empty {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: var(--radius-lg);
  border: 1px dashed var(--border-strong);
  background: var(--bg-card);
  color: var(--text-muted);
  font-size: var(--text-sm);
}
.forge-oblig-panel-not-yet-effective {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background: var(--bg-card);
  font-size: var(--text-sm);
  color: var(--text-primary);
}
.forge-oblig-panel-cta {
  font-size: var(--text-xs);
  color: var(--brand-blue);
  font-weight: 700;
  margin-left: auto;
}
.forge-oblig-panel-starts-label {
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-left: auto;
}

/* Pattern A / B modifier hooks on top of forge-oblig-panel-body.
   No visual difference today — classes exist so CSS coverage ratchet passes
   and per-pattern overrides can be added here without touching Python. */
.forge-oblig-panel-body-pattern-a {
  /* field-workflow — no extra rules yet */
}
.forge-oblig-panel-body-pattern-b {
  /* doc-checklist — no extra rules yet */
}

/* "Add voluntary obligation" trailing chip */
.forge-oblig-add-voluntary {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 10px;
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 600;
  cursor: pointer;
  border: 1px dashed var(--border);
  transition:
    border-color 0.12s ease,
    color 0.12s ease;
}
.forge-oblig-add-voluntary:hover {
  border-color: var(--border-strong);
  color: var(--text-secondary);
}

/* ======================================================================
 * Shared inline banners — forge-info-banner / forge-error-banner
 * Use for degraded-data notices, configuration warnings, and status alerts.
 * Never embed hex colors or non-token CSS variable names inline — use these classes.
 * ====================================================================== */
.forge-info-banner,
.forge-error-banner {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: 4px 0 12px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-card);
  font-size: var(--text-sm);
  color: var(--text-primary);
}
.forge-info-banner {
  border-left: 4px solid var(--brand-amber-bright);
}
.forge-error-banner {
  border-left: 4px solid var(--brand-red);
}
.forge-info-banner .forge-banner-icon,
.forge-error-banner .forge-banner-icon {
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 1px;
}
.forge-info-banner .forge-banner-icon {
  color: var(--text-primary);
}
.forge-error-banner .forge-banner-icon {
  color: var(--text-primary);
}

/* ======================================================================
 * Shared empty state — forge-empty-state
 * Returned by empty_state_html() in layout.py for use inside ui.html() chunks.
 * For live NiceGUI component trees use render_empty_state() from empty_state.py instead.
 * ====================================================================== */
.forge-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 48px 24px;
  gap: 8px;
  background: var(--bg-card);
  border: 1px dashed var(--border);
  border-radius: 12px;
}
.forge-empty-title {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--text-primary);
}
.forge-empty-hint {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  max-width: 420px;
}
.forge-empty-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 34px;
  margin-top: 8px;
  padding: 6px 14px;
  font-size: var(--text-sm);
  font-family: inherit;
  font-weight: var(--font-weight-display);
  line-height: 1.3;
  color: var(--button-primary-text);
  border: 1px solid var(--button-primary-border);
  border-radius: var(--radius-pill);
  background: var(--button-primary-bg);
  text-decoration: none;
  cursor: pointer;
  transition:
    background 0.14s var(--ease-out-quart),
    border-color 0.14s var(--ease-out-quart),
    color 0.14s var(--ease-out-quart),
    transform 0.14s var(--ease-out-quart);
}
.forge-empty-cta:hover {
  background: var(--button-primary-bg-hover);
}
/* Plan 73 — loading + error modes for empty_state_html. */
.forge-empty-state--error {
  border-style: solid;
  border-color: var(--text-primary);
  background: var(--tint-red);
}
.forge-empty-state--error .forge-empty-title {
  color: var(--brand-red-dark, var(--brand-red));
}
.forge-empty-spinner {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 3px solid var(--border);
  border-top-color: var(--brand-blue);
  animation: forge-empty-spin 0.8s linear infinite;
}
@keyframes forge-empty-spin {
  to {
    transform: rotate(360deg);
  }
}
.forge-empty-skeleton {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  max-width: 420px;
  margin-top: 8px;
}
.forge-empty-skeleton span {
  height: 12px;
  border-radius: var(--radius-sm);
  background: linear-gradient(
    90deg,
    var(--bg-soft) 0%,
    var(--tint-slate) 50%,
    var(--bg-soft) 100%
  );
  background-size: 200% 100%;
  animation: forge-empty-shimmer 1.4s ease-in-out infinite;
}
.forge-empty-skeleton span:nth-child(2) {
  width: 80%;
  align-self: center;
}
.forge-empty-skeleton span:nth-child(3) {
  width: 60%;
  align-self: center;
}
@keyframes forge-empty-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .forge-empty-spinner,
  .forge-empty-skeleton span {
    animation: none;
  }
}

/* ======================================================================
 * Corpus inventory strip — forge-corpus-*
 * Rendered by _corpus_strip_html() in
 * frontend/views/product_page/stages/sources.py
 * ====================================================================== */
.forge-corpus-strip {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-card);
  overflow: hidden;
}
.forge-corpus-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border-subtle);
  font-size: var(--text-sm);
}
.forge-corpus-row:last-child {
  border-bottom: none;
}
.forge-corpus-source-type {
  font-weight: 600;
  color: var(--text-primary);
  min-width: 80px;
}
.forge-corpus-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-secondary);
  min-width: 90px;
}
.forge-corpus-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.forge-corpus-time {
  color: var(--text-muted);
  margin-left: auto;
  font-size: var(--text-xs);
}

/* ===========================================================================
 * Plan 22 — Stage cards above the product page rail
 *
 * Three top-level workflow cards (01 Sources / 02 Requirements / 03 Tasks)
 * that switch the main pane between the corresponding stage bodies. Rail
 * navigation continues to live below the cards and is untouched.
 * =========================================================================== */

.forge-stage-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
}

.forge-stage-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  background: var(--bg-panel);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md, 8px);
  padding: 14px 16px;
  cursor: pointer;
  font: inherit;
  text-align: left;
  color: var(--text-primary);
  transition:
    border-color 120ms ease-out,
    box-shadow 120ms ease-out;
}

.forge-stage-card:hover {
  border-color: var(--brand-blue);
}

.forge-stage-card:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
}

.forge-stage-card--active {
  border-color: var(--brand-blue);
  box-shadow: inset 0 -3px 0 0 var(--brand-blue);
}

.forge-stage-card-index {
  font-size: var(--text-xs, 0.72rem);
  color: var(--text-muted);
  font-weight: 600;
  letter-spacing: 0.04em;
}

.forge-stage-card-label {
  font-size: var(--text-base, 0.95rem);
  font-weight: 700;
  color: var(--text-primary);
}

.forge-stage-card-sub {
  font-size: var(--text-xs, 0.78rem);
  color: var(--text-secondary);
}

/* Read-only chips listing the regulations applied to this product. */

.forge-reg-labels {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.forge-reg-label {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: var(--text-xs, 0.72rem);
  font-weight: 600;
  border: 1px solid var(--border-subtle);
}

/* Plan 2242 — scope-not-confirmed banner on product workspace (replaces per-product checklist). */

.forge-scope-banner > div:last-child {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.forge-scope-banner .forge-scope-banner__apply {
  align-self: flex-start;
}

.forge-banner__link {
  color: var(--brand-blue);
  font-weight: 600;
  text-decoration: none;
}

.forge-banner__link:hover {
  text-decoration: underline;
}

/* Plan 22 stage placeholders (replaced by Plans 23/24 stage bodies). */

.forge-stage-placeholder {
  padding: 32px;
  text-align: center;
  border: 1px dashed var(--border-subtle);
  border-radius: var(--radius-md, 8px);
  background: var(--bg-muted);
}

.forge-stage-placeholder-title {
  font-size: var(--text-lg, 1.1rem);
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 6px;
}

.forge-stage-placeholder-body {
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.85rem);
  max-width: 480px;
  margin: 0 auto;
}
/* ===========================================================================
 * Plan 23 - Requirements stage body
 *
 * Obligation table with regulation + status filters, plus a per-cert
 * generate-document section. Row tones flag urgency: red for missing,
 * amber for expired.
 * =========================================================================== */

.forge-req-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: flex-end;
  padding: 8px 0;
}

.forge-req-toolbar-control {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 200px;
}

.forge-req-toolbar-label {
  font-size: var(--text-xs, 0.72rem);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
}

.forge-req-toolbar-select {
  padding: 6px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm, 6px);
  background: var(--bg-panel);
  color: var(--text-primary);
  font-size: var(--text-sm, 0.85rem);
  cursor: pointer;
}

.forge-req-toolbar-select:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 1px;
}

.forge-req-row {
  display: grid;
  grid-template-columns:
    minmax(0, 2.2fr) minmax(0, 1.2fr) minmax(0, 0.9fr)
    minmax(0, 1.4fr);
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-top: 1px solid var(--border-subtle);
}

.forge-req-row:first-child {
  border-top: 0;
}

.forge-req-row--header {
  background: var(--bg-muted);
  font-size: var(--text-xs, 0.72rem);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
}

.forge-req-row--danger {
  background: var(--bg-danger-subtle);
}

.forge-req-row--warning {
  background: var(--bg-warning-subtle);
}

.forge-req-cell {
  font-size: var(--text-sm, 0.85rem);
  color: var(--text-primary);
  min-width: 0;
}

.forge-req-cell-title {
  font-weight: 600;
}

.forge-req-cell-basis {
  color: var(--text-secondary);
}

.forge-req-cell-cert {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, monospace);
  color: var(--text-secondary);
  font-weight: 600;
  text-transform: uppercase;
  font-size: var(--text-xs, 0.78rem);
}

.forge-req-cell-status {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.forge-req-status-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: var(--text-xs, 0.72rem);
  font-weight: 600;
  border: 1px solid transparent;
}

.forge-req-status-pill--verified {
  background: var(--bg-success-subtle);
  color: var(--brand-green-dark);
  border-color: var(--brand-green);
}

.forge-req-status-pill--missing {
  background: var(--bg-danger-subtle);
  color: var(--brand-red-dark);
  border-color: var(--text-primary);
}

.forge-req-status-pill--expired {
  background: var(--bg-warning-subtle);
  color: var(--brand-amber-dark);
  border-color: var(--text-primary);
}

.forge-req-status-pill--in-progress {
  background: var(--bg-info-subtle);
  color: var(--brand-blue-dark);
  border-color: var(--brand-blue);
}

.forge-req-expiry {
  font-size: var(--text-xs, 0.72rem);
  color: var(--text-muted);
}

.forge-req-empty {
  padding: 24px;
  text-align: center;
  color: var(--text-muted);
  background: var(--bg-muted);
  border: 1px dashed var(--border-subtle);
  border-radius: var(--radius-md, 8px);
}

/* Generate-documents section. */

.forge-req-generate {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md, 8px);
  background: var(--bg-panel);
}

.forge-req-generate-title {
  font-size: var(--text-base, 0.95rem);
  font-weight: 700;
  color: var(--text-primary);
}

.forge-req-generate-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) auto;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid var(--border-subtle);
}

.forge-req-generate-row:first-of-type {
  border-top: 0;
}

.forge-req-generate-label {
  font-weight: 700;
  font-size: var(--text-sm, 0.85rem);
  color: var(--text-primary);
  text-transform: uppercase;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, monospace);
}

.forge-req-generate-count {
  color: var(--text-secondary);
  font-size: var(--text-sm, 0.85rem);
}

.forge-req-generate-cta {
  padding: 6px 14px;
  border-radius: var(--radius-sm, 6px);
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  font-weight: 600;
  border: 0;
  cursor: pointer;
  font-size: var(--text-sm, 0.85rem);
}

.forge-req-generate-cta--ready {
  background: var(--button-primary-bg);
}

.forge-req-generate-cta:hover {
  background: var(--button-primary-bg-hover);
  filter: none;
}

.forge-req-generate-cta:focus-visible {
  outline: 2px solid var(--button-primary-bg);
  outline-offset: 2px;
}

.forge-req-generate-blocking {
  color: var(--brand-amber-dark);
  font-weight: 600;
  font-size: var(--text-sm, 0.85rem);
  text-decoration: underline;
}
/* ===========================================================================
 * Plan 24 - Tasks stage body
 *
 * Four-section split: Unassigned / Assigned / Waiting for signature / Done.
 * Each row carries a compliance_stage badge (Plan 21) so the operator can
 * see at a glance whether a task is Sources work or Requirements work.
 * =========================================================================== */

.forge-task-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 18px;
}

.forge-task-section-header {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 4px 0;
  border-bottom: 1px solid var(--border-subtle);
}

.forge-task-section-label {
  font-size: var(--text-sm, 0.85rem);
  font-weight: 700;
  color: var(--text-primary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.forge-task-section-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: var(--text-xs, 0.72rem);
  font-weight: 700;
}

.forge-task-section-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.forge-task-section-empty {
  padding: 12px 14px;
  color: var(--text-muted);
  font-size: var(--text-sm, 0.85rem);
  font-style: italic;
  background: var(--bg-muted);
  border: 1px dashed var(--border-subtle);
  border-radius: var(--radius-sm, 6px);
}

.forge-task-row {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1.3fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 14px;
  background: var(--bg-panel);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md, 8px);
}

.forge-task-row-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.forge-task-title {
  font-weight: 600;
  color: var(--text-primary);
  font-size: var(--text-sm, 0.9rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.forge-task-row-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text-secondary);
  font-size: var(--text-xs, 0.78rem);
  flex-wrap: wrap;
}

.forge-task-owner {
  font-weight: 600;
  color: var(--text-primary);
}

.forge-task-owner--unassigned {
  color: var(--text-muted);
  font-style: italic;
  font-weight: 500;
}

.forge-task-due {
  color: var(--text-muted);
}

.forge-task-status {
  color: var(--text-muted);
  text-transform: capitalize;
}

/* Compliance-stage badge (Plan 21 wire-up). */

.forge-task-stage-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: var(--text-xs, 0.72rem);
  font-weight: 600;
  border: 1px solid transparent;
  flex-shrink: 0;
}

.forge-task-stage-badge--sources {
  background: var(--bg-info-subtle);
  color: var(--brand-blue-dark);
  border-color: var(--brand-blue);
}

.forge-task-stage-badge--requirements {
  background: var(--bg-warning-subtle);
  color: var(--brand-amber-dark);
  border-color: var(--text-primary);
}

.forge-task-stage-badge--other {
  background: var(--bg-muted);
  color: var(--text-muted);
  border-color: var(--border-subtle);
}

/* Section-specific CTAs. */

.forge-task-cta {
  padding: 4px 10px;
  border-radius: var(--radius-sm, 6px);
  border: 1px solid var(--border-strong);
  background: var(--bg-panel);
  color: var(--text-primary);
  font-size: var(--text-xs, 0.78rem);
  font-weight: 600;
  cursor: pointer;
}

.forge-task-cta:hover {
  border-color: var(--button-primary-border);
  color: var(--button-primary-text);
  background: var(--button-primary-bg);
}

.forge-task-cta:focus-visible {
  outline: 2px solid var(--button-primary-bg);
  outline-offset: 2px;
}

.forge-task-cta--assign {
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  border-color: var(--button-primary-border);
}

.forge-task-cta--assign:hover {
  background: var(--button-primary-bg-hover);
  border-color: var(--button-primary-bg-hover);
  color: var(--button-primary-text);
  filter: none;
}

.forge-task-cta--resend {
  /* uses base styling */
}

.forge-task-cta--mark-signed {
  background: var(--brand-green);
  color: var(--text-on-brand);
  border-color: var(--brand-green);
}

.forge-task-cta--mark-signed:hover {
  color: var(--text-on-brand);
  filter: brightness(1.05);
}

.forge-task-signing-actions {
  display: flex;
  gap: 6px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sources / Gaps / Declare / Activity — 4-stage layout
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Stage nav (product workspace) ─────────────────────────────────────── */
/*
 * Plan 32 retired the bespoke 5-card stage-nav grid in favour of the
 * canonical .seg-tabs pattern (see layout/components
 * defaults above). Only two product-workspace-specific behaviours
 * remain as a thin modifier on the canonical bar:
 *
 *   1. Sticky to the top of the viewport so the bar stays in view as
 *      the operator scrolls long stage bodies.
 *   2. A subtle elevation shadow once the bar is actually stuck — the
 *      .is-stuck class is toggled by the IntersectionObserver in
 *      product_page/shell.py.
 */
.stage-nav-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  position: sticky;
  top: var(--forge-topbar-height, 56px);
  z-index: 10;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: transparent;
  transition: box-shadow 160ms ease-out;
}

.stage-nav-row.is-stuck {
  box-shadow: 0 4px 8px -4px rgba(var(--navy-rgb), 0.08);
}

/* Main stages fill the available width; meta (Activity / Settings)
 * stays on the same row, pinned to the RHS. */
.stage-nav-row > .stage-nav {
  width: auto;
  max-width: 100%;
  flex: 1 1 0;
  min-width: 0;
}

.stage-nav-row > .stage-nav > .seg-tab {
  flex: 0 0 auto;
}

.stage-nav-row .stage-nav-meta {
  margin: 0 0 0 auto;
  background: transparent;
  padding: 0;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  width: auto;
  max-width: 40%;
}

.stage-nav {
  position: static;
  z-index: auto;
  flex: 1 1 auto;
  background: transparent;
  padding: 0;
  transition: box-shadow 160ms ease-out;
}

.stage-nav.is-stuck {
  box-shadow: 0 4px 8px -4px rgba(var(--navy-rgb), 0.08);
}

/* ── Readiness stack (header zone) ─────────────────────────────────────── */
/*
 * Wraps the canonical kpi_tile + dot pills as a single right-side header
 * card. Plan 27 retired .forge-readiness-block / -row / -score / -label
 * in favour of kpi_tile_html(). The dot pills below the tile still use
 * .forge-readiness-dot--* pending Plan 28.
 */

.forge-readiness-stack {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 200px;
}

.forge-readiness-stack > .kpi-tile {
  width: 100%;
}

/*
 * Plan 28 retired the bespoke readiness dot variants in favour of
 * canonical badge_html() (green / blue / amber). The wrapper was
 * renamed .forge-readiness-pills to reflect its new content. Pills
 * inside are styled by .badge / .badge-{color} (see layout.css).
 */
.forge-readiness-pills {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}

/* ── Next-action callout (amber strip) ─────────────────────────────────── */

.forge-next-action {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  background: var(--tint-amber);
  border: 1px solid var(--border-amber);
  border-radius: var(--radius-md, 8px);
  font-size: var(--text-sm, 0.87rem);
  font-weight: 600;
  color: var(--text-amber);
  cursor: pointer;
  margin-top: 6px;
  transition: background 100ms ease-out;
}

.forge-next-action:hover {
  background: var(--tint-amber-hover);
}

/* ── Header zone (constrained reading width) ───────────────────────────── */

.forge-product-header-zone {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
}

.forge-owner-row {
  margin: 0;
  padding: 0;
}

/* ── Main stage content holder ─────────────────────────────────────────── */

.forge-product-main {
  transition: opacity 120ms ease-out;
}

.forge-product-main.is-swapping {
  opacity: 0;
}

/* ── Stage zero-state (no regulations applied) ─────────────────────────── */

.forge-stage-empty {
  max-width: 520px;
  margin: 40px auto;
  padding: 32px 28px;
  border-radius: var(--radius-md, 8px);
  border: 1px dashed var(--border-subtle);
  background: var(--bg-panel);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.forge-stage-empty-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--surface-control-selected);
  color: var(--accent-brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.forge-stage-empty-icon .material-icons {
  font-size: 28px;
}

.forge-stage-empty-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0;
}

.forge-stage-empty-body {
  font-size: var(--text-sm, 0.85rem);
  color: var(--text-secondary);
  line-height: 1.5;
  max-width: 420px;
}

/* ── Regulations bar (header zone) ──────────────────────────────────────── */
/*
 * Plan 29 retired the bespoke regulation-chip primitive (forge-reg-chip*)
 * in favour of canonical badge_html(..., dismiss_onclick=...). The outer
 * container was renamed forge-regulations-bar to drop the bespoke
 * literal entirely. The badges inside are styled by .badge / .badge-{color}
 * + .badge--dismissable / .badge-dismiss (see layout.css).
 */

/* Plan 282: compact inline container — no background, no full-bleed border */
.forge-regulations-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 4px 0;
}

/* forge-regulations-bar-label is no longer emitted (Plan 282) but the rule
   is kept so existing renders that haven't refreshed don't break visually. */
.forge-regulations-bar-label {
  font-size: var(--text-xs, 0.75rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  margin-right: 4px;
}

.forge-regulations-bar-chips {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.forge-regulations-bar-empty {
  font-size: var(--text-sm, 0.82rem);
  color: var(--text-muted);
  font-style: italic;
}

.forge-regulations-bar .forge-apply-reg-btn {
  margin-left: auto;
}

/* ── Declare stage cert cards ───────────────────────────────────────────── */

.forge-stage-item.forge-declare-obligation,
.forge-declare-cert-card {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin-bottom: 0;
}

.forge-standards-catalog-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 0 14px;
  margin: -4px 0 4px;
  color: var(--text-muted);
}

.forge-standards-catalog-main {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.forge-standards-catalog-title {
  color: var(--text-secondary);
  font-size: var(--text-xs, 0.75rem);
  font-weight: 700;
}

.forge-standards-catalog-pill {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid var(--border-subtle);
  background: var(--bg-panel);
  font-size: var(--text-xs, 0.72rem);
  font-weight: 700;
}

.forge-standards-catalog-pill--good {
  color: var(--brand-green);
  background: var(--tint-green);
  border-color: var(--border-green);
}

.forge-standards-catalog-pill--warn {
  color: var(--text-amber);
  background: var(--tint-amber);
  border-color: var(--border-amber);
}

.forge-standards-catalog-pill--bad {
  color: var(--text-danger);
  background: var(--tint-danger);
  border-color: var(--border-danger);
}

.forge-standards-catalog-meta {
  color: var(--text-muted);
  font-size: var(--text-xs, 0.75rem);
  line-height: 1.35;
  white-space: nowrap;
}

.forge-declare-next-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 12px;
  margin: 2px 0 14px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm, 6px);
  background: var(--bg-panel);
  box-shadow: inset 3px 0 0 var(--brand-primary);
}

.forge-declare-next-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 2px;
}

.forge-declare-next-title {
  color: var(--text-primary);
  font-size: var(--text-sm, 0.875rem);
  font-weight: 700;
  line-height: 1.3;
}

.forge-declare-next-detail {
  color: var(--text-secondary);
  font-size: var(--text-xs, 0.75rem);
  line-height: 1.35;
}

.forge-declare-next-state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  height: 28px;
  padding: 0 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  color: var(--text-secondary);
  background: var(--bg-panel);
  font-size: var(--text-xs, 0.75rem);
  font-weight: 700;
}

.forge-declare-cert-header {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding-bottom: 14px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--border-subtle);
}

.forge-declare-cert-label {
  font-size: var(--text-base, 0.95rem);
  font-weight: 700;
  color: var(--text-primary);
}

.forge-declare-reg-label {
  font-size: var(--text-xs, 0.75rem);
  color: var(--text-muted);
}

.forge-declare-cert-subtitle {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: -4px 0 10px;
}

/* Plan 291: harmonised standard sub-row in cert card header */
.forge-declare-hs-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--text-xs, 0.75rem);
  color: var(--text-secondary);
  margin: 2px 0 6px;
}

/* Plan 291: harmonised standard strip in Sources stage */
.forge-sources-hs-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  margin: 6px 0 4px;
  background: var(--bg-subtle);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  font-size: var(--text-sm, 0.875rem);
}

.forge-sources-hs-label {
  color: var(--text-muted);
  font-size: var(--text-xs, 0.75rem);
  white-space: nowrap;
}

.forge-sources-hs-ref {
  font-weight: 500;
  color: var(--text-primary);
}

.forge-declare-cert-obligation-title {
  font-size: var(--text-xs, 0.78rem);
  color: var(--text-secondary);
  line-height: 1.35;
  flex: 1 1 auto;
  min-width: 0;
}

.forge-declare-cert-deadline {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--bg-muted);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: var(--text-xs, 0.7rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
  flex: 0 0 auto;
}

.forge-declare-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: var(--text-xs, 0.72rem);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  margin-left: auto;
}

.forge-declare-pill--empty {
  background: var(--bg-muted);
  color: var(--text-muted);
  border: 1px solid var(--border-subtle);
}

.forge-declare-pill--needs-data {
  background: var(--tint-amber);
  color: var(--text-amber);
  border: 1px solid var(--border-amber);
}

.forge-declare-pill--ready {
  background: var(--tint-green);
  color: var(--status-success);
  border: 1px solid var(--border-green);
}

.forge-declare-pill--under-review {
  background: var(--color-info-surface);
  color: var(--brand-info);
  border: 1px solid var(--color-info-border);
}

.forge-declare-pill--published {
  background: var(--tint-green);
  color: var(--brand-green);
  border: 1px solid var(--border-green);
}

.forge-declare-pill--needs-recert {
  background: var(--tint-amber);
  color: var(--text-amber);
  border: 1px solid var(--border-amber);
}

.forge-declare-pill--na {
  background: var(--bg-muted);
  color: var(--text-muted);
  border: 1px solid var(--border-subtle);
}

/* Plan 898 — stale-cert sign guard modal card. */
.forge-stale-sign-guard {
  min-width: 320px;
  max-width: 480px;
}

/* Plan 902 — cert-pill row: one pill per obligation type (DoPC / DPP / EPD …) */
.cert-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: var(--text-xs, 0.75rem);
  font-weight: 600;
  line-height: 1.4;
}
.cert-pill--dopc {
  color: var(--brand-primary);
  background: var(--tint-primary);
}
.cert-pill--dop {
  color: var(--brand-primary);
  background: var(--tint-primary);
}
.cert-pill--epd {
  color: var(--brand-success);
  background: var(--tint-success);
}
.cert-pill--dpp {
  color: var(--text-primary);
  background: var(--tint-amber);
}
.cert-pill--ce {
  color: var(--brand-secondary);
  background: var(--tint-secondary);
}
.cert-pill--ppwr {
  color: var(--brand-info);
  background: var(--tint-info);
}
.cert-pill--cbam {
  color: var(--brand-danger);
  background: var(--tint-danger);
}
.cert-pill--fallback {
  color: var(--text-muted);
  background: var(--bg-muted);
}

/* ── Declare progress bar ───────────────────────────────────────────────── */

.forge-declare-progress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 10px;
}

.forge-declare-step {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 0;
  min-height: 28px;
  padding: 0 8px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm, 6px);
  background: var(--bg-subtle);
  color: var(--text-muted);
  font-size: var(--text-xs, 0.75rem);
  position: relative;
}

.forge-declare-step:not(:first-child)::before {
  content: none;
}

.forge-declare-step--done {
  color: var(--brand-green);
  background: var(--tint-green);
  border-color: var(--border-green);
}

.forge-declare-step--done .forge-declare-step-dot {
  background: var(--brand-green);
  border-color: var(--brand-green);
}

.forge-declare-step--active {
  color: var(--text-primary);
  background: var(--bg-panel);
  border-color: var(--text-primary);
  font-weight: 700;
}

.forge-declare-step--active .forge-declare-step-dot {
  border-color: var(--text-primary);
  background: var(--text-primary);
}

.forge-declare-step-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 2px solid var(--border-subtle);
  background: transparent;
  flex-shrink: 0;
}

.forge-declare-step-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Declare CTA row ────────────────────────────────────────────────────── */

.forge-declare-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 0;
}

.forge-declare-cta-body {
  font-size: var(--text-sm, 0.87rem);
  color: var(--text-secondary);
}

.forge-declare-goto-gaps {
  white-space: nowrap;
}

/* Plan 281 — harmonised standard CTA row inside Declare stage DoPC card */
.forge-declare-hs-cta {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  flex-wrap: wrap;
}

.forge-declare-hs-cta-label {
  font-size: var(--text-sm, 0.87rem);
  color: var(--text-muted);
  margin-right: auto;
}

.forge-declare-add-hs-btn,
.forge-declare-declare-std-btn {
  white-space: nowrap;
}

.forge-declaration-workspace {
  display: grid;
  grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
  align-items: stretch;
  gap: 24px;
  width: 100%;
}

.forge-declaration-work-lane,
.forge-declaration-document-lane {
  min-width: 0;
}

.forge-declaration-work-lane {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.forge-declaration-document-lane {
  align-self: stretch;
}

.forge-declaration-workspace.is-focused .forge-declaration-document-lane {
  outline: 2px solid color-mix(in srgb, var(--brand-blue) 24%, transparent);
  outline-offset: 2px;
  border-radius: var(--radius-md, 8px);
}

.forge-declaration-readiness-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.forge-declaration-readiness-row {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 26px;
}

.forge-declaration-readiness-text {
  color: var(--text-primary);
  font-size: var(--text-sm, 0.875rem);
  line-height: 1.35;
}

.forge-declaration-readiness-slot {
  justify-self: end;
  min-width: 0;
}

.forge-declaration-readiness-action {
  color: var(--brand-brown);
  font-size: var(--text-xs, 0.75rem);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.forge-declaration-readiness-action:hover {
  text-decoration: underline;
}

.forge-declaration-work-lane .forge-ai-action-cluster--inline {
  width: auto;
  justify-content: flex-start;
  gap: 10px;
}

.forge-declaration-empty-draft {
  min-height: 188px;
  height: 100%;
  border-style: solid;
  border-radius: var(--radius-md, 8px);
  background: var(--bg-subtle);
}

.forge-declare-standards-context {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
  margin: 0 0 12px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm, 6px);
  background: var(--bg-panel);
}

.forge-declare-context-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text-primary);
  font-size: var(--text-sm, 0.875rem);
  font-weight: 700;
}

.forge-declare-context-heading strong {
  min-width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--tint-amber);
  color: var(--text-amber);
  font-size: var(--text-xs, 0.75rem);
}

.forge-declare-standard-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 8px 0;
  border-top: 1px solid var(--border-subtle);
}

.forge-declare-standard-row--coverage {
  border-top: 0;
}

.forge-declare-standard-ref {
  color: var(--text-primary);
  font-size: var(--text-sm, 0.875rem);
  font-weight: 700;
  line-height: 1.35;
}

.forge-declare-standard-meta {
  color: var(--text-muted);
  font-size: var(--text-xs, 0.75rem);
  line-height: 1.35;
}

.forge-declare-standard-actions {
  min-height: 32px;
}

.forge-declare-coverage-expansion {
  border-top: 1px solid var(--border-subtle);
}

@media (max-width: 640px) {
  .forge-standards-catalog-status {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .forge-standards-catalog-meta {
    white-space: normal;
  }

  .forge-declare-next-action {
    grid-template-columns: minmax(0, 1fr);
  }

  .forge-declare-next-btn,
  .forge-declare-next-state {
    justify-self: start;
  }

  .forge-declare-progress {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .forge-declaration-workspace {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .forge-declaration-document-lane {
    position: static;
  }

  .forge-declaration-readiness-row {
    grid-template-columns: 10px minmax(0, 1fr);
  }

  .forge-declaration-readiness-slot {
    grid-column: 2;
    justify-self: start;
  }
}

/* ── Declare zero state ─────────────────────────────────────────────────── */

.forge-declare-zero-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 48px 24px;
  text-align: center;
}

.forge-declare-zero-icon {
  font-size: 2.5rem !important;
  color: var(--text-muted);
}

.forge-declare-zero-title {
  font-size: var(--text-base, 1rem);
  font-weight: 700;
  color: var(--text-primary);
}

.forge-declare-zero-body {
  font-size: var(--text-sm, 0.87rem);
  color: var(--text-secondary);
  max-width: 340px;
}

/* ── Settings drawer ────────────────────────────────────────────────────── */

.forge-settings-drawer {
  display: flex;
  flex-direction: column;
}

.forge-settings-drawer-header {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-subtle);
}

.forge-settings-drawer-body {
  padding: 0;
  overflow-y: auto;
  flex: 1;
}

.forge-settings-drawer-section {
  padding: 16px 20px;
}

.forge-settings-trigger {
  /* no extra styles needed — uses flat button base */
}

/* ── Page header zone ───────────────────────────────────────────────────── */

.forge-page-header-zone {
  /* The band lives inside page_root (capped at 1600px, centered in
       .forge-page), so margins alone cannot escape to .forge-content's
       full width on wide viewports. Instead we draw the background
       with a ::before pseudo-element that extends 100vw to each side;
       .forge-content has overflow-x: clip, so the bg is cleanly cut
       at the sidebar's right edge and the viewport's right edge.
       Negative top margin absorbs .forge-page's 24px top padding so
       the band sits flush against the topbar. Horizontal negative
       margins (-32px) escape .forge-page's gutter for narrow viewports
       where the pseudo-element would otherwise look narrow.
       Caveat: the floating Ask dock is fixed outside this page flow.

       WIDTH REQUIREMENT (Plan 86): this element must keep width:auto. The
       browser then resolves auto-width = parent_width - margin-left -
       margin-right = page_root_width + 64px, and the 32px horizontal padding
       brings content back to the page_root edges. Never add `w-full`
       (width:100%) to the NiceGUI element in render_page_header — it overrides
       auto and shifts content 64px left of the KPI/main content edges. */
  position: relative;
  background: var(--bg-page-header);
  margin: -24px -32px 4px -32px;
  padding: 24px 32px 8px;
  box-shadow:
    -100vmax 0 0 var(--bg-page-header),
    100vmax 0 0 var(--bg-page-header);
}
@container forge-page (max-width: 1100px) {
  .forge-page-header-zone {
    /* layout.css:1027 narrows forge-page padding to 16px 20px 40px */
    margin: -16px -20px 4px -20px;
    padding: 20px 20px 6px;
  }
}

.forge-page-eyebrow {
  font-size: 0.72rem;
  font-weight: 500;
  color: var(--text-muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

/* Plan 36 — banners slot. Hosts read-only banners, degraded-data
   callouts, empty-state notices, and any other status row that
   otherwise floats as a sibling between Zone 1 and Zone 2. */
.forge-page-banners {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}

.forge-page-banners:empty {
  display: none;
}

/* ── Interactive primitives (opt-in via class) ──────────────────────────────
   Inert utility classes. Add to any element that should feel pickup-able
   (.lift / .glow-hover), tactile on press (.press), row-hover-able (.row-hover),
   or have an animated underline on hover (.story-link). All transitions use
   the shared --motion-* / --ease-* tokens so the rhythm is consistent.
   Reduced-motion overrides live in the prefers-reduced-motion block in
   tokens.css. */
.lift,
.glow-hover {
  transition:
    background-color var(--motion-base) var(--ease-out-quart),
    border-color var(--motion-base) var(--ease-out-quart),
    box-shadow var(--motion-base) var(--ease-out-quart),
    transform var(--motion-base) var(--ease-out-quart);
}
.lift:hover,
.glow-hover:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
  border-color: var(--border-strong);
}
.lift:active,
.glow-hover:active {
  transform: translateY(0);
  box-shadow: var(--shadow-sm);
}

.press {
  transition:
    transform 150ms var(--ease-out-quart),
    box-shadow 150ms var(--ease-out-quart);
}
.press:active {
  transform: scale(0.985);
}

.row-hover {
  transition: background-color var(--motion-fast) var(--ease-out-quart);
}
.row-hover:hover {
  background-color: var(--bg-hover);
}

.story-link {
  position: relative;
  display: inline-block;
}
.story-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  height: 1px;
  width: 100%;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 240ms var(--ease-out-quart);
}
.story-link:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* ======================================================================
 * Inline chip-filter bar — `inline_filter_bar_html()` in layout.py
 * Replaces the LHS `.rm-facets` filter rail on top-level views.
 * Spec: docs/engineering/specs/2026-05-24-inline-chip-filter-bar.md
 * ====================================================================== */

.forge-fbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 0;
}

.forge-fbar-search {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 1 1 240px;
  max-width: 28rem;
  min-width: 0;
}
.forge-fbar-search-icon {
  position: absolute;
  left: 10px;
  color: var(--text-muted);
  font-size: 18px;
  pointer-events: none;
}
.forge-fbar-search-input {
  width: 100%;
  height: 34px;
  padding: 6px 10px 6px 32px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: 13px;
  box-sizing: border-box;
}
.forge-fbar-search-input::placeholder {
  color: var(--text-muted);
}
.forge-fbar-search-input:focus {
  outline: none;
  border-color: var(--brand-blue);
  box-shadow: var(--focus-ring);
}

.forge-fbar-chip-wrap,
.forge-fbar-more,
.forge-fbar-sort {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.forge-fbar-chip,
.forge-fbar-more-btn,
.forge-fbar-sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px dashed var(--border);
  background: transparent;
  color: var(--text-secondary);
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  line-height: 1;
  box-sizing: border-box;
  transition:
    background var(--motion-fast, 120ms) var(--ease-out-quart),
    border-color var(--motion-fast, 120ms) var(--ease-out-quart),
    color var(--motion-fast, 120ms) var(--ease-out-quart);
}
.forge-fbar-chip:hover,
.forge-fbar-more-btn:hover,
.forge-fbar-sort-btn:hover {
  background: var(--border-subtle);
  color: var(--text-primary);
}
.forge-fbar-chip:focus-visible,
.forge-fbar-more-btn:focus-visible,
.forge-fbar-sort-btn:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.forge-fbar-chip--add {
  /* dashed border + muted color signals "add a filter" */
}
.forge-fbar-chip--active {
  border-style: solid;
  border-color: var(--border-control-active);
  background: var(--surface-control-selected);
  color: var(--text-primary);
}
.forge-fbar-chip--active:hover {
  background: var(--surface-control-hover);
}
.forge-fbar-chip-label {
  white-space: nowrap;
  max-width: 22ch;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-fbar-chip-clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 2px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  opacity: 0.6;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  border-radius: 50%;
}
.forge-fbar-chip-clear:hover {
  opacity: 1;
  background: rgba(var(--navy-rgb), 0.06);
}

.forge-fbar-popover,
.forge-fbar-more-menu,
.forge-fbar-sort-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 60;
  min-width: 220px;
  max-width: 320px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  box-shadow: 0 8px 24px rgba(var(--navy-rgb), 0.08);
  padding: 6px;
  animation: fade-in var(--motion-fast, 120ms) var(--ease-out-quart);
}
.forge-fbar-popover[hidden],
.forge-fbar-more-menu[hidden],
.forge-fbar-sort-menu[hidden] {
  display: none;
}
.forge-fbar-popover-search {
  padding: 4px 4px 6px;
  border-bottom: 1px solid var(--border-subtle);
  margin-bottom: 4px;
}
.forge-fbar-popover-search-input {
  width: 100%;
  height: 28px;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-card);
  font-size: 12px;
  box-sizing: border-box;
}
.forge-fbar-popover-options {
  display: flex;
  flex-direction: column;
  max-height: 320px;
  overflow-y: auto;
}
.forge-fbar-popover-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-primary);
}
.forge-fbar-popover-option:hover {
  background: var(--border-subtle);
}
.forge-fbar-popover-option input[type="checkbox"] {
  margin: 0;
  accent-color: var(--brand-blue);
}
.forge-fbar-popover-option-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.5;
}
/* Per-option urgency dot palette — threaded via FacetOption.extra_class
 * (urg-high / urg-medium / urg-low) by view code that needs a colored
 * dot per value (compliance roadmap Priority chip, workstation Priority
 * chip). Mirrors the legacy `.rm-facet-option.urg-* .dot` rules. */
.forge-fbar-popover-option.urg-high .forge-fbar-popover-option-dot {
  background: var(--brand-red);
  opacity: 1;
}
.forge-fbar-popover-option.urg-medium .forge-fbar-popover-option-dot {
  background: var(--brand-amber-bright);
  opacity: 1;
}
.forge-fbar-popover-option.urg-low .forge-fbar-popover-option-dot {
  background: var(--brand-green);
  opacity: 1;
}
.forge-fbar-popover-option-label {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-fbar-popover-option-count {
  color: var(--text-muted);
  font-size: 11.5px;
  font-variant-numeric: tabular-nums;
}

.forge-fbar-more-menu {
  min-width: 200px;
}
.forge-fbar-more-entry {
  position: relative;
}
.forge-fbar-more-entry-btn {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 6px 8px;
  border: 0;
  background: transparent;
  border-radius: 6px;
  color: var(--text-primary);
  font-size: 13px;
  cursor: pointer;
  text-align: left;
}
.forge-fbar-more-entry-btn:hover {
  background: var(--border-subtle);
}
.forge-fbar-more-entry[data-fbar-active="1"] .forge-fbar-more-entry-btn {
  color: var(--brand-blue);
  font-weight: 600;
}
.forge-fbar-more-entry .forge-fbar-popover {
  /* Nested popovers anchor to the menu entry, not the menu itself. */
  left: calc(100% + 6px);
  top: 0;
}
.forge-fbar-more-caret,
.forge-fbar-sort-caret {
  font-size: 16px;
  color: var(--text-muted);
}
.forge-fbar-more-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  margin-left: 2px;
  padding: 0 5px;
  background: var(--brand-blue);
  color: var(--bg-card);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.forge-fbar-sort {
  align-items: stretch;
}
.forge-fbar-sort-btn {
  border-style: solid;
  border-color: var(--border);
  color: var(--text-primary);
}
.forge-fbar-sort-label {
  color: var(--text-muted);
  margin-right: 2px;
}
.forge-fbar-sort-value {
  font-weight: 600;
}
.forge-fbar-sort-menu {
  right: 0;
  left: auto;
}
.forge-fbar-sort-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
}
.forge-fbar-sort-option:hover {
  background: var(--border-subtle);
}
.forge-fbar-sort-option input[type="radio"] {
  accent-color: var(--brand-blue);
}

.forge-fbar-spacer {
  flex: 1 1 0;
  min-width: 0;
}

.forge-fbar-count {
  color: var(--text-muted);
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
}
.forge-fbar-count-value {
  color: var(--text-primary);
  font-weight: 600;
}

.forge-fbar-clear-all {
  border: 0;
  background: transparent;
  color: var(--text-muted);
  font-size: 12.5px;
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 4px;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 2px;
}
.forge-fbar-clear-all:hover {
  color: var(--text-primary);
  text-decoration-color: currentColor;
}
.forge-fbar-clear-all:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

@media (max-width: 1280px) {
  .forge-fbar-search {
    flex-basis: 100%;
    max-width: none;
  }
}

/* ======================================================================
 * Triage hint chips — slice 4 of generic document ingest pipeline.
 * Renders the labelled-for-UI subset of canonical source-document facts
 * inline on the unassigned-row in document_registry.
 * Per forge-product-integrity.mdc, AI-generated triage hints carry an
 * inline label with model + extracted_at + input_sha256.
 * ====================================================================== */
.forge-doc-hints {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
}

.forge-doc-hint__chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--brand-ai-tint);
  color: var(--brand-ai-hover);
  border: 1px solid var(--brand-ai);
  font-size: 11.5px;
  line-height: 1.4;
  white-space: nowrap;
  max-width: 320px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.forge-doc-hint__label {
  font-weight: 600;
  color: var(--brand-ai);
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.04em;
}

.forge-doc-hint__value {
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
}

.forge-doc-hints__ai-label {
  margin-left: 4px;
  font-size: 10.5px;
  color: var(--text-muted);
  font-style: italic;
}

/* ---------------------------------------------------------------------------
   Multi-obligation readiness — header breakdown + shared-identity block
   (product_page/header.py, stages/data.py)
--------------------------------------------------------------------------- */

.forge-readiness-breakdown {
  width: 100%;
  margin-top: 2px;
  font-size: 0.8rem;
}

.forge-readiness-summary {
  cursor: pointer;
  color: var(--text-secondary);
  font-weight: 600;
  list-style: none;
  padding: 2px 0;
  user-select: none;
}

.forge-readiness-summary::-webkit-details-marker {
  display: none;
}

.forge-readiness-summary::before {
  content: "\25B8";
  display: inline-block;
  margin-right: 6px;
  transition: transform 120ms ease-out;
  color: var(--text-muted);
}

.forge-readiness-breakdown[open] .forge-readiness-summary::before {
  transform: rotate(90deg);
}

.forge-readiness-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 6px;
}

.forge-readiness-row {
  display: grid;
  grid-template-columns: minmax(80px, 1fr) auto auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 4px 8px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
}

.forge-readiness-row-label {
  font-weight: 600;
  color: var(--text-primary);
}

.forge-readiness-row-score {
  font-variant-numeric: tabular-nums;
  color: var(--text-primary);
}

.forge-readiness-row-pill {
  color: var(--text-secondary);
  font-size: 0.74rem;
}

.forge-readiness-row-meta {
  color: var(--text-muted);
  font-size: 0.74rem;
  text-align: right;
}

/* Plan 280 — obligation toggle strip below the KPI 4-tile strip */
.forge-readiness-obligation-toggle {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px 0;
}

/* Plan 281 — breadcrumb back-link variant used in confirm stage */
.forge-back-link--breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8rem;
  color: var(--text-muted);
  text-decoration: none;
}

.forge-back-link--breadcrumb:hover {
  color: var(--text-body);
  text-decoration: underline;
}

.forge-shared-identity {
  width: 100%;
  border: 1px solid var(--border-subtle);
  border-radius: 12px;
  background: var(--bg-card);
  padding: 12px 16px;
  margin-bottom: 12px;
}

.forge-shared-identity-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.forge-shared-identity-hint {
  font-weight: 400;
  font-size: 0.78rem;
  color: var(--text-muted);
}

.forge-shared-identity-rows {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 6px 18px;
}

.forge-shared-identity-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.84rem;
}

.forge-shared-identity-label {
  color: var(--text-secondary);
  min-width: 110px;
}

.forge-shared-identity-value {
  color: var(--text-primary);
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Plan 128 — compact one-line evidence/provenance preview on a collapsed
   field row (e.g. "Filled from DoP · 0.94"). Full evidence shows on expand. */
.fields-task-provenance {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Single-tile readiness KPI strip in the product header (Zone 2). */
.forge-product-readiness-strip {
  width: 100%;
}

/* Plan 128 — collapsed Fields row provenance preview */
.fields-task-provenance {
  font-size: 0.76rem;
  color: var(--text-muted);
  margin-top: 2px;
  line-height: 1.35;
}

/* Plan 113 — single primary "Next" CTA beneath the readiness KPI. */
.forge-next-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  text-decoration: none;
  line-height: 1.2;
  transition:
    background 0.18s ease-out,
    color 0.18s ease-out,
    box-shadow 0.18s ease-out,
    transform 0.18s ease-out;
}

.forge-next-cta:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.forge-next-cta--primary {
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  box-shadow: var(--shadow-sm);
}

.forge-next-cta--primary:hover {
  background: var(--button-primary-bg-hover);
  transform: translateY(-1px);
}

.forge-next-cta--reissue {
  background: transparent;
  color: var(--brand-blue);
  padding: 6px 0;
  font-weight: 500;
}

.forge-next-cta--reissue:hover {
  color: var(--brand-blue-bright);
  text-decoration: underline;
}

.forge-next-cta-label {
  white-space: nowrap;
}

/* Plan 134 — module queue + overview matrix */
.forge-module-queue {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.forge-module-queue-row:last-child td,
.forge-module-queue-row:last-child th {
  border-bottom: none;
}

.forge-module-queue-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.84rem;
}

.forge-module-queue-actions-col {
  text-align: right;
  white-space: nowrap;
}

.settings-template-cell {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-template-cell > span {
  color: var(--text-muted);
  font-size: 0.78rem;
}

.settings-template-code {
  background: var(--bg-soft);
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  color: var(--text-primary);
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace);
  font-size: 0.82rem;
  padding: 2px 6px;
}

.settings-template-override-row {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md, 8px);
  padding: 10px 12px;
}

.settings-template-draft {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md, 8px);
}

/* Signing overview - workload digest, distinct from the actionable queue. */
.forge-signing-overview {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.forge-signing-overview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.forge-signing-overview-detail-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
  gap: 12px;
}

.forge-signing-overview-panel,
.forge-signing-overview-section {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  box-shadow: 0 1px 3px rgba(var(--navy-rgb), 0.04);
  min-width: 0;
}

.forge-signing-overview-panel {
  border-top: 3px solid var(--text-muted);
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
}

.forge-signing-overview-panel--blue {
  border-top-color: var(--brand-blue);
}

.forge-signing-overview-panel--amber {
  border-top-color: var(--text-primary);
}

.forge-signing-overview-panel--red {
  border-top-color: var(--text-primary);
}

.forge-signing-overview-panel-head,
.forge-signing-overview-breakdown-row,
.forge-signing-overview-age-row {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.forge-signing-overview-label,
.forge-signing-overview-section-header {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: uppercase;
}

.forge-signing-overview-count {
  color: var(--text-primary);
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
}

.forge-signing-overview-hint {
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.45;
  margin: 0;
}

.forge-signing-overview-list,
.forge-signing-overview-age-list,
.forge-signing-overview-breakdown {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
}

.forge-signing-overview-list {
  list-style: none;
}

.forge-signing-overview-item,
.forge-signing-overview-age-row,
.forge-signing-overview-breakdown-row {
  border-top: 1px solid var(--border-subtle);
  min-width: 0;
  padding-top: 8px;
}

.forge-signing-overview-item-main,
.forge-signing-overview-item-meta {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.forge-signing-overview-item-main {
  color: var(--text-primary);
  font-size: 0.9rem;
  font-weight: 600;
}

.forge-signing-overview-item-meta,
.forge-signing-overview-date,
.forge-signing-overview-item--empty {
  color: var(--text-muted);
  font-size: 0.8rem;
}

.forge-signing-overview-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
}

.forge-signing-overview-date,
.forge-signing-overview-breakdown-row strong {
  flex: 0 0 auto;
}

@media (max-width: 900px) {
  .forge-signing-overview-grid,
  .forge-signing-overview-detail-grid {
    grid-template-columns: 1fr;
  }
}
.forge-module-queue-expansion-row .forge-regulation-accordion {
  margin-bottom: 0;
  border-radius: 0;
  border-left: none;
  border-right: none;
  border-top: none;
}
.forge-module-queue-expansion-row .forge-regulation-accordion-summary {
  padding-left: 48px;
  background: var(--tint-slate);
  color: var(--text-secondary);
  font-weight: 400;
  font-size: 0.8125rem;
  border-left: 3px solid var(--border);
}
.forge-module-queue-expansion-row .forge-regulation-accordion-summary:hover {
  background: color-mix(in srgb, var(--tint-slate) 80%, var(--border));
}/* Monitoring interpretations — fixed columns {
  table-layout: fixed;
  width: 100%;
}
.forge-exec-head-row .forge-exec-product {
  font-weight: 600;
}
.forge-exec-select-col,
.forge-exec-caret-col {
  width: 28px;
  text-align: center;
}
.forge-exec-caret {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-muted);
  font-size: 0.9rem;
  line-height: 1;
  padding: 2px;
  transition: transform 0.12s ease;
}
.forge-exec-group.is-expanded .forge-exec-caret {
  transform: rotate(90deg);
}
.forge-exec-actions-col {
  text-align: right;
  white-space: nowrap;
}
.forge-exec-overflow-col {
  width: 32px;
  text-align: center;
}
.forge-exec-overflow {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-muted);
  font-size: 1rem;
  line-height: 1;
  padding: 2px 6px;
}
.forge-exec-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-primary);
}
.forge-exec-deadline--red {
  color: var(--text-primary);
  font-weight: 600;
}
.forge-exec-deadline--amber {
  color: var(--text-primary);
}
.forge-exec-deadline--green {
  color: var(--brand-green);
}
.forge-exec-deadline--slate {
  color: var(--text-muted);
}
.forge-exec-muted {
  color: var(--text-muted);
}
.forge-exec-unassigned {
  color: var(--text-muted);
  font-size: 0.84rem;
}
.forge-exec-action-cell {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
  width: 100%;
}
.forge-exec-overflow-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.forge-exec-field-source {
  margin-left: 8px;
}
.forge-exec-field-label {
  padding-left: 32px !important;
  color: var(--text-primary);
}
.forge-exec-field-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--radius-sm);
  font-size: 0.72rem;
  font-weight: 600;
}
.forge-exec-field-chip--red {
  background: var(--tint-red);
  color: var(--brand-red-dark);
}
.forge-exec-field-chip--amber {
  background: var(--tint-amber);
  color: var(--text-primary);
}
.forge-exec-field-chip--blue {
  background: var(--tint-info);
  color: var(--brand-blue);
}
.forge-exec-field-chip--green {
  background: var(--tint-green);
  color: var(--brand-green-dark);
}

.forge-module-matrix {
  width: 100%;
  overflow-x: auto;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  box-shadow: 0 1px 3px rgba(var(--navy-rgb), 0.04);
}

.forge-module-matrix-product {
  font-weight: 600;
  text-align: left;
  padding: 10px 16px;
}

.forge-module-cell {
  text-align: center;
  padding: 10px 8px;
  border-bottom: 1px solid var(--border-subtle);
}

.forge-module-cell span {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--text-muted);
}

/* Module-overview matrix dot tones (moved out of per-view <style> blocks). */
.forge-module-dot--green {
  background: var(--brand-green) !important;
}
.forge-module-dot--amber {
  background: var(--brand-amber-bright) !important;
}
.forge-module-dot--red {
  background: var(--brand-red) !important;
}
.forge-module-dot--blue {
  background: var(--brand-blue) !important;
}
.forge-module-dot--grey {
  background: var(--text-muted) !important;
}

/* Plan 117 — product deep-dive first-paint skeleton */
.forge-shell-skeleton {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.forge-shell-skeleton-header {
  height: 64px;
  border-radius: var(--radius-lg);
}

.forge-shell-skeleton-kpi {
  height: 96px;
  border-radius: var(--radius-card);
}

.forge-shell-skeleton-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 4px 0;
}

.forge-shell-skeleton-line {
  height: 20px;
  border-radius: var(--radius-sm);
}

.forge-shell-skeleton-line:nth-child(2) {
  width: 85%;
}

.forge-shell-skeleton-line:nth-child(3) {
  width: 60%;
}

.forge-skel-shimmer {
  background: linear-gradient(
    90deg,
    var(--tint-slate) 0%,
    var(--bg-card) 50%,
    var(--tint-slate) 100%
  );
  background-size: 200% 100%;
  animation: forge-skel-shimmer 1.4s ease-in-out infinite;
}

@keyframes forge-skel-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .forge-skel-shimmer {
    animation: none;
  }
  .forge-next-cta {
    transition: none;
  }
  .forge-next-cta--primary:hover {
    transform: none;
  }
}

/* ── Tab archetype markers ─────────────────────────────────────────────────
   These classes establish archetype identity on the root container of every
   tab body. They do not add layout on their own — the panel shells (forge-
   analysis-panel, forge-execution-panel, etc.) own their dimensions. They
   exist so CSS tooling, the ratchet, and future theming layers can target a
   specific archetype without reaching into individual view HTML.
   ────────────────────────────────────────────────────────────────────────── */

/* Queue — vertically stacked row list (review queues, sign-off queues) */
.forge-tab-queue {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 8px);
}

/* Matrix — structured grid / table surface (overview dashboards) */
.forge-tab-matrix {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
}

/* Feed — chronological scrolling stream (news, proposals) */
.forge-tab-feed {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 12px);
}

/* Catalog — card-based browseable collection (regulation watchlist) */
.forge-tab-catalog {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
}

/* Gallery — multi-column card grid (data connectors, regulatory feeds) */
.forge-tab-gallery {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
}

.forge-tab-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--space-4, 16px);
  width: 100%;
  min-width: 0;
}

/* Visualization — full-bleed canvas or D3 chart (ecosystem galaxy) */
.forge-tab-viz {
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: hidden;
}

/* confirm_requirements.py — proposed/confirmed requirement-row badges and the
   inline "AI proposal:" label. Pill chrome mirrors .catalog-badge tints. */
.forge-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
  background: color-mix(in srgb, var(--brand-slate) 10%, transparent);
  color: var(--text-secondary);
}
.forge-badge--green {
  background: color-mix(in srgb, var(--status-success) 12%, transparent);
  color: var(--brand-green);
}
.forge-badge--amber {
  background: color-mix(in srgb, var(--status-warning) 12%, transparent);
  color: var(--text-primary);
}
.forge-ai-label {
  font-weight: 600;
  color: var(--brand-ai);
}

/* Plan 382: Audit trail retention labels */
.forge-audit-trail {
  margin-top: 12px;
}

.forge-audit-trail--empty {
  color: var(--text-muted);
  font-size: 0.875rem;
  padding: 8px 0;
}

.forge-audit-event {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid var(--border-subtle);
  font-size: 0.875rem;
}

.forge-retention-label {
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-left: auto;
}

/* Plan 383: Supplier data request indicators */
/* Plan 885: Supplier picker row wrapper */
.forge-supplier-request-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.forge-request-from-supplier-btn {
  font-size: 0.8rem;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid var(--border-subtle);
  background: transparent;
  cursor: pointer;
  color: var(--text-secondary);
}

.forge-supplier-requested-indicator {
  font-size: 0.8rem;
  color: var(--text-muted);
  font-style: italic;
}
/* ============================================================
   Plan 913 — Shell-level obligation switcher
   Plan 1120 — Pills relocated to Zone 1 (banners slot).
   When inside .forge-page-banners, the pill row has a tighter
   top gap (4px) relative to the chips row above it.
   ============================================================ */
.forge-page-banners .obligation-switcher {
  margin-top: 4px;
  padding-top: 2px;
}

.obligation-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 6px 0 4px;
  align-items: center;
}

.obligation-switcher.is-dimmed {
  opacity: 0.38;
  pointer-events: none;
}

.obligation-switcher__pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 14px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 500;
  border: 1.5px solid var(--border-muted);
  background: var(--bg-card);
  color: var(--text-secondary);
  cursor: pointer;
  transition:
    background 0.12s,
    border-color 0.12s,
    color 0.12s;
  white-space: nowrap;
}

.obligation-switcher__pill:hover {
  border-color: var(--border-control-active);
  color: var(--text-primary);
}

.obligation-switcher__pill.is-active {
  background: var(--surface-control-active);
  border-color: var(--border-control-active);
  color: var(--text-primary);
  font-weight: 600;
  box-shadow: var(--shadow-sm);
}

/* ============================================================
   Plan 1121 — Regulation chip navigation button wrapper
   Wraps each badge_html chip in a clickable button that emits
   forge_regulation_chip_selected.  is-active highlights the
   chip whose directive_code matches the active regulation.
   is-dimmed suppresses interaction on obligation-agnostic stages.
   ============================================================ */
.forge-reg-chip-nav {
  display: inline-flex;
  align-items: center;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  border-radius: 999px;
  outline-offset: 2px;
}

.forge-reg-chip-nav:focus-visible {
  outline: 2px solid var(--accent-brand);
}

.forge-reg-chip-nav.is-active .badge {
  background: var(--surface-control-active);
  color: var(--text-primary);
  border-color: var(--border-control-active);
}

.forge-reg-chip-nav.is-dimmed {
  opacity: 0.38;
  pointer-events: none;
  cursor: default;
}

/* Queue checkbox column (Plan 1519) */
.forge-queue-checkbox {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--brand-blue);
  flex-shrink: 0;
}

/* Queue product cell — separated name / regulation / badge (Plan 1519) */
.forge-queue-product-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.forge-queue-product-name {
  font-weight: 500;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-queue-product-reg {
  font-size: 0.78rem;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-queue-status-badge {
  align-self: flex-start;
  margin-top: 2px;
}

/* Extraction evidence components (Plan 1502) */
.forge-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.4;
}
.forge-status-badge--green {
  background: var(--status-green-bg);
  color: var(--status-green-text);
}
.forge-status-badge--amber {
  background: var(--status-amber-bg);
  color: var(--status-amber-text);
}
.forge-status-badge--red {
  background: var(--status-red-bg);
  color: var(--status-red-text);
}
.forge-status-badge--neutral {
  background: var(--surface-secondary);
  color: var(--text-muted);
}
.forge-extraction-evidence-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  background: var(--surface-secondary);
  border-radius: 6px;
}
.forge-extraction-panel-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-secondary);
  margin: 0 0 4px;
}
.forge-extraction-field-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) 2fr auto;
  align-items: start;
  gap: 8px;
  padding: 4px 0;
  border-bottom: 1px solid var(--border-light);
}
.forge-extraction-label {
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--text-muted);
}
.forge-extraction-value {
  font-size: 0.85rem;
  color: var(--text-primary);
  word-break: break-word;
}
.forge-source-quote {
  grid-column: 1 / -1;
  margin: 2px 0 0;
  padding: 4px 8px;
  font-size: 0.75rem;
  color: var(--text-muted);
  border-left: 3px solid var(--border-accent);
  background: var(--surface-primary);
}

/* ── Plan 1565 — Portfolio deadline urgency banner (extracted from portfolio.py) */
.forge-deadline-urgency-banner {
  /* Extends .forge-banner.forge-banner--warning; display is toggled via JS dismiss. */
  display: var(--_urgency-display, block);
}

.forge-urgency-list {
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.forge-banner-dismiss {
  /* Extends .forge-banner-action; applies dismiss-specific styling. */
  margin-left: auto;
}

/* ── Plan 1565 — Team member row action buttons (extracted from team.py) */
.forge-row-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border: 1px solid var(--border-ui);
  border-radius: var(--radius-pill);
  background: var(--surface-primary);
  color: var(--text-primary);
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  transition: background 0.15s ease;
}

.forge-row-action:hover {
  background: var(--surface-hover);
}

.forge-row-action--ghost {
  background: transparent;
  border-color: transparent;
  color: var(--text-muted);
}

.forge-row-action--ghost:hover {
  background: var(--surface-hover);
  color: var(--text-primary);
}

/* Plan 2165: Document Registry queue table primitives */
.forge-doc-registry-tabs {
  margin: 0 0 14px 0;
}
.forge-seg-tab-link {
  text-decoration: none;
}
.forge-doc-queue-status-dot {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.forge-doc-queue-score-bar {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 80px;
}
.forge-doc-queue-score-track {
  flex: 1;
  height: 6px;
  background: var(--border);
  border-radius: 3px;
  overflow: hidden;
}
.forge-doc-queue-score-fill {
  height: 100%;
  display: block;
}
.forge-doc-queue-score-pct {
  font-size: 0.8rem;
  color: var(--text-secondary);
  width: 32px;
  text-align: right;
}
.forge-doc-queue-muted {
  color: var(--text-muted);
}
.forge-doc-queue-activity {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 150px;
}
.forge-doc-queue-activity-badge {
  width: max-content;
  max-width: 190px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-doc-queue-activity-date {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-top: 2px;
}
.forge-doc-queue-type-badge {
  font-size: 0.75rem;
  padding: 2px 8px;
}
.forge-doc-queue-src-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.forge-doc-queue-src-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
}
.forge-doc-queue-valid-until--expiring {
  color: var(--text-primary);
}
.forge-doc-queue-valid-until--expired {
  color: var(--text-primary);
}
.forge-fact-review-field-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
}
.forge-fact-review-field-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.875rem;
}

/* Monitoring tabs keep legacy URL aliases in view.py; mounted tab IDs are current IA. */

/* Plan 2165: fact-review detail reason list (status banner body) */
.fact-review-reason-list {
  margin: 8px 0 0 18px;
}
.forge-trust-chip {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
  text-transform: lowercase;
}
.forge-trust-chip--ok {
  background: var(--ok-soft);
  color: var(--ok-text);
}
.forge-trust-chip--warn {
  background: var(--warn-soft);
  color: var(--warn-text);
}
.forge-trust-chip--bad {
  background: var(--bad-soft);
  color: var(--bad-text);
}
.forge-confidence-chip {
  display: inline-block;
  margin-left: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
}
.forge-confidence-chip--ok {
  background: var(--ok-soft);
  color: var(--ok-text);
}
.forge-confidence-chip--warn {
  background: var(--warn-soft);
  color: var(--warn-text);
}
.forge-confidence-chip--bad {
  background: var(--bad-soft);
  color: var(--bad-text);
}
.forge-fact-review-confidence {
  margin: 0.5rem 0;
  margin-top: 8px;
}
.forge-review-packet {
  display: grid;
  gap: 16px;
  margin: 1rem 0 1.25rem;
  padding: 0;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  overflow: hidden;
  max-width: 100%;
}
.forge-review-workspace {
  width: 100%;
  max-width: min(72rem, 100%);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.forge-review-workspace-header {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.forge-review-workspace-meta {
  color: var(--text-muted);
}
.forge-review-workspace-secondary {
  margin-top: 0.5rem;
  padding: 0.75rem 1rem;
  border: 1px dashed var(--border-subtle);
  background: var(--surface-primary);
}
.forge-review-workspace-actions {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border-subtle);
}
.forge-review-decision-card,
.forge-review-change,
.forge-review-evidence,
.forge-review-packet-inspect {
  padding: 16px 18px;
}
.forge-review-decision-card {
  background: var(--surface-raised);
  border-bottom: 1px solid var(--border-subtle);
}
.forge-review-decision-copy {
  display: grid;
  gap: 10px;
  max-width: 840px;
}
.forge-review-decision-kicker {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}
.forge-review-decision-title,
.forge-review-section-title {
  margin: 0;
  color: var(--text-primary);
}
.forge-review-decision-title {
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1.25;
}
.forge-review-section-title {
  font-size: 0.95rem;
  font-weight: 800;
}
.forge-review-decision-card p,
.forge-review-evidence p {
  margin: 0;
}
.forge-review-meta-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.forge-review-meta-pill {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  padding: 2px 8px;
  color: var(--text-secondary);
  background: var(--surface-primary);
  font-size: 0.78rem;
  font-weight: 650;
}
.forge-review-effect {
  color: var(--text-primary);
}
.forge-review-boundary {
  color: var(--text-secondary);
}
.forge-review-change {
  display: grid;
  gap: 10px;
}
.forge-review-change-head,
.forge-review-change-row {
  display: grid;
  grid-template-columns: minmax(140px, 0.9fr) minmax(0, 1.2fr) minmax(0, 1.2fr) auto;
}
.forge-review-change-head > div,
.forge-review-change-cell {
  padding: 9px 10px;
  border-top: 1px solid var(--border-subtle);
  text-align: left;
}
.forge-review-change-head > div {
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
}
.forge-review-change-field {
  color: var(--text-primary);
  font-weight: 700;
}
.forge-review-change-state {
  display: inline-flex;
  border-radius: 999px;
  padding: 2px 8px;
  background: var(--surface-muted);
  color: var(--text-secondary);
  font-size: 0.75rem;
  font-weight: 700;
  white-space: nowrap;
}
.forge-review-evidence {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--border-subtle);
}
.forge-review-interpretation {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--border-subtle);
  background: var(--surface-primary);
}
.forge-review-interpretation-field {
  display: grid;
  gap: 6px;
  color: var(--text-secondary);
}
.forge-review-interpretation-field strong {
  color: var(--text-primary);
}
.forge-review-interpretation-field blockquote {
  margin: 0;
  padding: 8px 10px;
  border-left: 3px solid var(--border-strong);
  background: var(--surface-primary);
  color: var(--text-primary);
}
.forge-review-evidence-meta {
  color: var(--text-secondary);
}
.forge-review-quote {
  margin: 0;
  padding: 10px 12px;
  border-left: 3px solid var(--border-strong);
  background: var(--surface-primary);
  color: var(--text-primary);
}
.forge-review-warning {
  color: var(--bad-text);
  margin: 0;
}
.forge-review-evidence ul {
  margin: 0;
  padding-left: 18px;
  color: var(--text-secondary);
}
.forge-review-packet-inspect {
  color: var(--text-muted);
  font-size: 0.875rem;
  border-top: 1px solid var(--border-subtle);
}
.forge-review-packet-empty {
  color: var(--text-muted);
  margin: 0;
}
@media (max-width: 720px) {
  .forge-review-change-head,
  .forge-review-change-row {
    grid-template-columns: 1fr;
  }
}

/* Source-document review workspace */
.source-doc-section-title {
  color: var(--text-primary);
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.25;
}
.source-doc-classification-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  background: var(--bg-card);
}
.source-doc-classification-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 12px;
}
.source-doc-classification-title {
  color: var(--text-primary);
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.2;
}
.source-doc-classification-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(108px, 1fr));
  gap: 10px 16px;
}
.source-doc-classification-field {
  min-width: 0;
}
.source-doc-classification-label {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
}
.source-doc-classification-value {
  color: var(--text-primary);
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.source-doc-classification-actions {
  display: flex;
  justify-content: flex-end;
  min-width: max-content;
}
.source-doc-overview-card {
  margin-top: 10px;
}
.source-doc-bundle-link,
.source-doc-bundle-parts {
  display: grid;
  gap: 10px;
  margin-bottom: 16px;
}
.source-doc-bundle-link {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: 12px;
  background: var(--bg-card);
}
.source-doc-bundle-link-body {
  color: var(--text-secondary);
  font-size: 0.9rem;
  line-height: 1.35;
}
.source-doc-bundle-link-body a,
.source-doc-part-title {
  color: var(--accent);
  font-weight: 700;
  text-decoration: none;
}
.source-doc-bundle-link-body a:hover,
.source-doc-part-title:hover {
  text-decoration: underline;
}
.source-doc-part-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.source-doc-part-tab {
  display: grid;
  gap: 2px;
  min-width: 140px;
  max-width: 260px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  background: var(--bg-subtle);
  color: var(--text-secondary);
  text-decoration: none;
}
.source-doc-part-tab.is-active {
  border-color: var(--border-control-active);
  background: var(--bg-card);
  color: var(--text-primary);
}
.source-doc-part-tab__label {
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.source-doc-part-tab__meta {
  color: var(--text-muted);
  font-size: 0.78rem;
  line-height: 1.2;
}
.source-doc-bundle-overview-parts {
  display: grid;
  gap: 8px;
  margin-top: 16px;
}
.source-doc-bundle-overview-parts__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.source-doc-bundle-part-summary {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) max-content max-content max-content;
  gap: 12px;
  align-items: center;
  border-top: 1px solid var(--border-subtle);
  padding: 10px 0;
}
.source-doc-bundle-part-summary__title {
  color: var(--text-primary);
  font-weight: 700;
  text-decoration: none;
  overflow-wrap: anywhere;
}
.source-doc-bundle-part-summary__title:hover {
  text-decoration: underline;
}
.source-doc-bundle-part-summary__meta,
.source-doc-bundle-part-summary__state {
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.3;
}
.source-doc-bundle-part-summary__state {
  color: var(--text-primary);
  font-weight: 600;
}
@media (max-width: 760px) {
  .source-doc-bundle-part-summary {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}
.source-doc-part-card {
  display: grid;
  gap: 6px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: 12px;
  background: var(--bg-card);
}
.source-doc-part-meta,
.source-doc-part-state,
.source-doc-part-reasons {
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.source-doc-metadata-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
  align-items: start;
}
@media (min-width: 900px) {
  .source-doc-metadata-item:nth-child(2) {
    grid-column: span 2;
  }
}
.source-doc-metadata-item {
  min-width: 0;
}
.source-doc-metadata-label {
  color: var(--text-muted);
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}
.source-doc-metadata-value {
  margin-top: 3px;
  color: var(--text-primary);
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.source-doc-overview-context {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--border-subtle);
}
.source-doc-overview-context .source-doc-section-title {
  margin-bottom: 10px;
}
.source-doc-overview-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--border-subtle);
}
.source-doc-summary-tile {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  background: var(--bg-muted);
}
.source-doc-summary-value {
  color: var(--text-primary);
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1.1;
}
.source-doc-summary-label {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
}
.source-doc-review-queue {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.source-doc-review-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 32%);
  gap: 12px 16px;
  padding: 14px 0;
  border-top: 1px solid var(--border-subtle);
}
.source-doc-review-item:first-of-type {
  border-top: 0;
}
.source-doc-review-item:hover {
  background: color-mix(in srgb, var(--brand-blue) 7%, transparent);
}
.source-doc-review-item--selected {
  background: color-mix(in srgb, var(--brand-blue) 10%, transparent);
  box-shadow: inset 3px 0 0 var(--brand-blue);
}
.source-doc-review-item--pinned {
  background: color-mix(in srgb, var(--brand-blue) 13%, transparent);
  box-shadow: inset 3px 0 0 var(--brand-blue);
}
.source-doc-review-findings .source-doc-review-filters {
  position: sticky;
  top: 84px;
  z-index: 4;
  padding: 8px 0;
  background: var(--bg-card);
}
.source-doc-review-actions {
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 6px;
  white-space: nowrap;
}
.source-doc-review-part {
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 500;
}
.source-doc-review-quality-warning {
  color: var(--text-muted);
  display: block;
  font-size: 0.78rem;
  font-weight: 500;
  margin-top: 2px;
}
.source-doc-review-normalized {
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 500;
}
.source-doc-detail-preview--focused {
  border-radius: var(--radius-md);
  outline: 2px solid var(--brand-blue);
  outline-offset: 3px;
  transition: outline-color 0.18s ease, outline-offset 0.18s ease;
}
.source-doc-detail-grid {
  display: grid;
  /* Size the rail against page content (.forge-page is a size container),
     not viewport vw — sidebar + padding made viewport 980px collapse early. */
  grid-template-columns: minmax(0, 1fr) minmax(320px, 36%);
  gap: 16px;
  align-items: start;
  width: 100%;
}
.source-doc-detail-main {
  min-width: 0;
}
.source-doc-detail-preview {
  min-width: 0;
  position: sticky;
  top: 84px;
}
@container forge-page (max-width: 1100px) {
  .source-doc-detail-grid {
    grid-template-columns: minmax(0, 1fr) 320px;
  }
}
@container forge-page (max-width: 760px) {
  .source-doc-detail-grid {
    grid-template-columns: 1fr;
  }
  .source-doc-detail-preview {
    position: static;
  }
}
.source-doc-preview-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.source-doc-preview-title {
  color: var(--text-primary);
  font-weight: 700;
  line-height: 1.25;
}
.source-doc-hover-panel {
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  background: var(--bg-muted);
}
.source-doc-hover-title {
  color: var(--text-primary);
  font-weight: 700;
  line-height: 1.3;
}
.source-doc-hover-meta {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 0.86rem;
  line-height: 1.35;
}
.source-doc-hover-quote {
  margin: 8px 0 0;
  padding-left: 10px;
  border-left: 3px solid var(--brand-blue);
  color: var(--text-primary);
  font-size: 0.9rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.source-doc-pdf-viewer {
  position: relative;
  width: 100%;
  height: calc(100vh - 260px);
  min-height: 520px;
  overflow: auto;
  border: 1px solid var(--border-subtle);
  background: var(--bg-muted);
}
.source-doc-pdf-viewer__status {
  position: sticky;
  top: 0;
  z-index: 3;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  background: var(--bg-card);
  font-size: 0.84rem;
  line-height: 1.35;
}
.source-doc-pdf-viewer__status[data-state="error"],
.source-doc-pdf-viewer__status[data-state="fallback"] {
  color: var(--text-primary);
  background: var(--tint-red);
}
.source-doc-pdf-viewer__pages {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 14px;
}
.source-doc-pdf-page {
  --source-doc-pdf-page-width: 900px;
  --source-doc-pdf-page-aspect-ratio: 1 / 1.4142;

  position: relative;
  width: min(100%, var(--source-doc-pdf-page-width));
  aspect-ratio: var(--source-doc-pdf-page-aspect-ratio);
  max-width: 100%;
  overflow: hidden;
  background: var(--bg-card);
  box-shadow: 0 0 0 1px var(--border-subtle), var(--shadow-sm);
}
.source-doc-pdf-page--active {
  box-shadow: 0 0 0 2px var(--brand-blue), var(--shadow-md);
}
.source-doc-pdf-page__canvas,
.source-doc-pdf-page__text,
.source-doc-pdf-page__overlay {
  position: absolute;
  inset: 0;
}
.source-doc-pdf-page__canvas {
  width: 100%;
  height: 100%;
}
.source-doc-pdf-page__text {
  --scale-factor: 1;

  opacity: 0;
  color: transparent;
  pointer-events: none;
  user-select: text;
  /* pdf.js TextLayer positions use var(--scale-factor); viewer sets it per page. */
}
.source-doc-pdf-page__overlay {
  pointer-events: none;
}
.source-doc-pdf-highlight {
  position: absolute;
  min-width: 8px;
  min-height: 8px;
  border: 2px solid var(--brand-blue);
  background: color-mix(in srgb, var(--brand-blue) 22%, transparent);
  box-shadow: 0 0 0 1px var(--bg-card);
}
.source-doc-pdf-highlight--quote {
  border-color: var(--brand-ai);
  border-style: dashed;
  background: color-mix(in srgb, var(--brand-ai) 16%, transparent);
}
.source-doc-pdf-highlight--pinned {
  border-width: 3px;
}
.source-doc-locator-quality {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border: 1px solid var(--border-subtle);
  color: var(--text-primary);
  background: var(--bg-card);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
}
.source-doc-locator-quality[data-locator-quality="exact_span"] {
  border-color: var(--brand-blue);
  color: var(--brand-blue);
}
.source-doc-locator-quality[data-locator-quality="verified_quote_fallback"] {
  border-color: var(--brand-ai);
  color: var(--brand-ai);
}
.source-doc-processing-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.source-doc-processing-action-hint {
  color: var(--text-muted);
  font-size: 0.84rem;
  line-height: 1.35;
}
.source-doc-processing-outcome {
  display: grid;
  gap: 10px;
}
.source-doc-processing-outcome__title {
  font-size: 1rem;
}
.source-doc-processing-outcome p {
  margin: 0;
  color: var(--text-primary);
  font-size: 0.9rem;
  line-height: 1.4;
}
.source-doc-processing-technical,
.source-doc-processing-observation-outcomes,
.source-doc-processing-observation-critic {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--border-subtle);
}
.source-doc-processing-technical summary,
.source-doc-processing-observation-outcomes summary,
.source-doc-processing-observation-critic summary {
  cursor: pointer;
  color: var(--text-primary);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.3;
}
.source-doc-extracted-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.source-doc-audit-shell {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.source-doc-audit-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 14px;
}
.source-doc-audit-header__meta {
  color: var(--text-muted);
  font-size: 0.84rem;
  line-height: 1.35;
}
.source-doc-audit-toolbar {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  padding: 12px;
  border: 1px solid var(--border-subtle);
  background: var(--bg-muted);
}
.source-doc-audit-summary {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 8px;
  align-content: center;
  min-width: 0;
}
.source-doc-audit-summary__count {
  grid-row: span 2;
  color: var(--text-primary);
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1;
}
.source-doc-audit-summary__label {
  color: var(--text-primary);
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.2;
}
.source-doc-audit-summary__meta {
  color: var(--text-muted);
  font-size: 0.78rem;
  line-height: 1.25;
}
.source-doc-audit-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr)) minmax(150px, 1.4fr) auto;
  gap: 8px;
  align-items: end;
}
.source-doc-audit-filter {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 4px;
}
.source-doc-audit-filter span {
  color: var(--text-muted);
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
}
.source-doc-audit-filter select,
.source-doc-audit-filter input {
  width: 100%;
  min-height: 34px;
  padding: 6px 8px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  background: var(--bg-card);
  font: inherit;
  font-size: 0.84rem;
}
.source-doc-audit-timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.source-doc-audit-event {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  padding: 12px 0;
  border-top: 1px solid var(--border-subtle);
}
.source-doc-audit-event:first-of-type {
  border-top: 0;
}
.source-doc-audit-event__marker {
  width: 10px;
  height: 10px;
  margin-top: 5px;
  border: 2px solid var(--brand-blue);
  border-radius: 999px;
  background: var(--bg-card);
}
.source-doc-audit-event__topline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.source-doc-audit-event__kind {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  background: var(--bg-muted);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
}
.source-doc-audit-event__title {
  color: var(--text-primary);
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.3;
}
.source-doc-audit-event__detail {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 0.86rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.source-doc-audit-event__meta {
  margin-top: 5px;
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.3;
}
.source-doc-audit-empty {
  padding: 14px 0;
  color: var(--text-muted);
  font-size: 0.86rem;
}
@media (max-width: 1180px) {
  .source-doc-audit-toolbar,
  .source-doc-audit-filters {
    grid-template-columns: 1fr;
  }
}
.source-doc-review-main {
  display: grid;
  grid-template-columns: minmax(150px, 0.75fr) minmax(180px, 1fr);
  gap: 12px;
  min-width: 0;
}
.source-doc-review-label {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
}
.source-doc-review-title {
  color: var(--text-primary);
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.35;
}
.source-doc-review-observed {
  color: var(--text-primary);
  font-size: 0.94rem;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.source-doc-review-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  grid-column: 1 / -1;
}
.source-doc-pill {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  background: var(--bg-muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
}
.source-doc-pill--review {
  color: var(--brand-blue);
  background: color-mix(in srgb, var(--brand-blue) 12%, transparent);
  border-color: color-mix(in srgb, var(--brand-blue) 28%, var(--border-subtle));
}
.source-doc-pill--confidence {
  color: var(--text-primary);
  background: var(--bg-card);
}
.source-doc-pill--danger {
  color: var(--text-primary);
  background: var(--tint-red);
  border-color: color-mix(in srgb, var(--brand-red) 35%, var(--border-subtle));
}
.source-doc-review-evidence {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.source-doc-evidence {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.source-doc-evidence-page {
  color: var(--brand-blue);
  font-size: 0.82rem;
  font-weight: 700;
}
.source-doc-evidence-page--muted,
.source-doc-evidence-empty,
.source-doc-review-empty,
.source-doc-review-rationale {
  color: var(--text-muted);
}
.source-doc-evidence-quote {
  display: -webkit-box;
  max-width: 100%;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: var(--text-primary);
  font-size: 0.88rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.source-doc-evidence-empty {
  font-size: 0.86rem;
}
.source-doc-review-rationale {
  font-size: 0.82rem;
  line-height: 1.35;
}
.source-doc-conflict-note {
  padding: 8px 10px;
  border-left: 3px solid var(--brand-red);
  color: var(--text-primary);
  background: var(--tint-red);
  font-size: 0.84rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.source-doc-review-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  grid-column: 1 / -1;
}
.source-doc-review-empty {
  font-size: 0.84rem;
}
.source-doc-review-part {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 0.78rem;
  line-height: 1.3;
}
.source-doc-review-conflict-values {
  display: grid;
  gap: 10px;
}
.source-doc-review-conflict-value {
  min-width: 0;
}
.source-doc-review-conflict-meta,
.source-doc-review-conflict-quote,
.source-doc-review-quote,
.source-doc-review-normalized {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 0.8rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.source-doc-summary-hero,
.source-doc-summary-banner {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
  padding: 12px 14px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  background: var(--bg-muted);
}
.source-doc-summary-hero {
  gap: 12px;
  padding: 16px;
  background: color-mix(in srgb, var(--bg-card) 92%, var(--brand-ai));
}
.source-doc-summary-hero__top {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.source-doc-summary-hero__eyebrow {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}
.source-doc-summary-hero__headline,
.source-doc-summary-banner__headline {
  color: var(--text-primary);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.35;
}
.source-doc-summary-hero__copy {
  margin: 0;
  max-width: 78ch;
  color: var(--text-primary);
  font-size: 0.94rem;
  line-height: 1.45;
}
.source-doc-summary-hero__meta,
.source-doc-summary-banner__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  color: var(--text-muted);
  font-size: 0.82rem;
  line-height: 1.35;
}
.source-doc-summary-blockers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.source-doc-summary-blockers li {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill, 999px);
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 6px 10px;
}
.source-doc-summary-decisions,
.source-doc-summary-found {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}
.source-doc-summary-decision {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
}
.source-doc-summary-decision__field,
.source-doc-summary-found__list {
  color: var(--text-primary);
  font-weight: 600;
}
.source-doc-summary-decision__values,
.source-doc-summary-decision__ask,
.source-doc-summary-found__list {
  color: var(--text-secondary);
  font-size: 0.86rem;
  line-height: 1.4;
}
.source-doc-summary-found__list {
  margin: 0;
  padding-left: 1.1rem;
  font-weight: 400;
}
.source-doc-review-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 4px 0 12px;
}
.source-doc-review-filter {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill, 999px);
  background: var(--bg-card);
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 6px 10px;
}
.source-doc-review-filter.is-active {
  border-color: var(--brand-blue);
  color: var(--text-primary);
  background: color-mix(in srgb, var(--brand-blue) 10%, var(--bg-card));
}
.source-doc-review-readiness {
  margin-bottom: 12px;
  padding: 10px 12px;
  border-left: 3px solid var(--brand-amber, var(--brand-blue));
  background: var(--bg-muted);
  color: var(--text-primary);
  font-size: 0.86rem;
  line-height: 1.4;
}
.source-doc-scoped-facts,
.source-doc-consistency-findings {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--border-subtle);
}
.source-doc-scope-card,
.source-doc-finding-card {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  background: var(--bg-muted);
}
.source-doc-scope-card--review {
  border-color: color-mix(in srgb, var(--brand-amber) 32%, var(--border-subtle));
  background: var(--warn-soft);
}
.source-doc-scope-card__field,
.source-doc-finding-card__type {
  color: var(--text-primary);
  font-size: 0.92rem;
  font-weight: 750;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.source-doc-scope-card__meta,
.source-doc-finding-card__severity {
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.3;
}
.source-doc-scope-card__rationale,
.source-doc-scope-card__fields,
.source-doc-finding-card__values,
.source-doc-finding-card__parts,
.source-doc-finding-card__evidence,
.source-doc-finding-card__decision {
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.source-doc-finding-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 2px;
}
.source-doc-authority-review {
  display: grid;
  gap: 12px;
}
.source-doc-interpretation-review,
.source-doc-interpretation-review-card {
  display: grid;
  gap: 12px;
}
.source-doc-interpretation-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  background: var(--bg-muted);
}
.source-doc-interpretation-edit {
  display: grid;
  gap: 6px;
  color: var(--text-secondary);
  font-size: 0.84rem;
}
.source-doc-interpretation-error {
  color: var(--text-primary);
  overflow-wrap: anywhere;
}
.source-doc-interpretation-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.source-doc-authority-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
}
.source-doc-authority-card__topline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.source-doc-authority-card__title {
  color: var(--text-primary);
  font-size: 0.95rem;
  font-weight: 700;
}
.source-doc-authority-card__claim,
.source-doc-authority-evidence {
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.source-doc-authority-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.source-doc-authority-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
}
.source-doc-authority-grid div {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--surface-muted);
}
.source-doc-authority-grid span {
  display: block;
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
}
.source-doc-authority-grid strong {
  display: block;
  margin-top: 3px;
  color: var(--text-primary);
  font-size: 0.84rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}
@media (max-width: 1100px) {
  .source-doc-review-item,
  .source-doc-review-main {
    grid-template-columns: 1fr;
  }
  .source-doc-review-actions {
    justify-content: flex-start;
  }
}
@media (max-width: 640px) {
  .source-doc-classification-strip {
    align-items: stretch;
    grid-template-columns: 1fr;
  }
  .source-doc-classification-fields,
  .source-doc-metadata-grid {
    grid-template-columns: 1fr;
  }
  .source-doc-classification-actions {
    justify-content: flex-start;
  }
}

/* Source-document Ask Osperan answer body: keep model Markdown chat-sized. */
.source-doc-ask-answer {
  color: var(--text-primary);
  font-size: 0.9rem;
  line-height: 1.55;
}

.source-doc-ask-answer h1,
.source-doc-ask-answer h2,
.source-doc-ask-answer h3,
.source-doc-ask-answer h4,
.source-doc-ask-answer h5,
.source-doc-ask-answer h6 {
  margin: 0.65rem 0 0.35rem;
  color: var(--text-primary);
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.25;
}

.source-doc-ask-answer p {
  margin: 0 0 0.55rem;
}

.source-doc-ask-answer ul,
.source-doc-ask-answer ol {
  margin: 0.35rem 0 0.55rem 1.1rem;
  padding-left: 0.8rem;
}

/* Product Requirements stage — obligation fulfillment workbench. */
.forge-requirements-workbenches {
  display: grid;
  gap: 6px;
  margin: 2px 0 18px;
}

.forge-requirements-context-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: 0.82rem;
}

.forge-requirements-context-row span {
  white-space: nowrap;
}

.forge-requirements-context-row strong {
  color: var(--text-primary);
  font-weight: 750;
}

.forge-requirements-section {
  display: grid;
  gap: 10px;
  margin-top: 24px;
}

.forge-requirements-section-toggle {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 6px;
  align-items: start;
  cursor: pointer;
}

.forge-requirements-section-toggle:focus-visible {
  outline: 2px solid var(--brand-blue);
  outline-offset: 3px;
  border-radius: 6px;
}

.forge-requirements-section-chevron {
  color: var(--text-muted);
  font-size: 20px;
  line-height: 1;
  margin-top: 2px;
}

.forge-requirements-section .forge-section-header {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-subtle);
}

.forge-requirements-alias strong {
  display: block;
  color: var(--text-primary);
  font-size: 0.95rem;
  line-height: 1.25;
}

.forge-requirements-list {
  display: grid;
  gap: 8px;
}

.forge-requirements-native-surface {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.forge-requirements-row {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-surface);
}

.forge-requirements-row-main {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) minmax(132px, max-content);
  gap: 18px;
  align-items: start;
}

.forge-requirements-rationale {
  color: var(--text-primary);
  font-size: 0.84rem;
  line-height: 1.4;
}

.forge-requirements-rationale-note {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 0.76rem;
  line-height: 1.35;
}

.forge-requirements-filters {
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 10px 0 14px;
  min-width: 0;
}

.forge-requirements-obligation-toggle,
.forge-data-scope-toggle {
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 10px 0 8px;
  min-width: 0;
}

.forge-requirements-decision-support {
  display: grid;
  gap: 10px 20px;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  margin-top: 0;
  color: var(--text-secondary);
  font-size: 0.83rem;
  line-height: 1.45;
}

.forge-requirements-decision-line {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.forge-requirements-decision-line--wide {
  grid-column: 1 / -1;
}

.forge-requirements-decision-line strong,
.forge-requirements-history-summary strong,
.forge-requirements-decision-support > div > strong {
  display: block;
  margin-bottom: 2px;
  color: var(--text-muted);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0;
}

.forge-requirements-decision-line span {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text-primary);
}

.forge-requirements-target-bindings {
  display: grid;
  gap: 5px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.forge-requirements-target-bindings li {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  align-items: center;
  min-width: 0;
}

.forge-requirements-target-label {
  color: var(--text-primary);
  font-weight: 650;
}

.forge-requirements-target-ref,
.forge-requirements-target-role {
  color: var(--text-muted);
  font-size: 0.74rem;
}

.forge-requirements-target-role {
  padding: 1px 6px;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  background: var(--bg-subtle);
}

.forge-requirements-stale {
  margin-top: 6px;
}

.forge-requirements-confidence {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.forge-requirements-pill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  color: var(--text-secondary);
  background: var(--bg-subtle);
}

.forge-requirements-uncertainties,
.forge-requirements-certainty {
  display: grid;
  gap: 3px;
  margin: 0;
  padding-left: 16px;
  color: var(--text-secondary);
}

.forge-requirements-history-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  color: var(--text-secondary);
  font-size: 0.8rem;
  line-height: 1.35;
}

.forge-requirements-decision-warning {
  max-width: 280px;
  margin-top: 4px;
  color: var(--warning-text, var(--text-muted));
  font-size: 0.74rem;
  line-height: 1.3;
  text-align: right;
}

.forge-requirements-tags,
.forge-requirements-review {
  min-width: 0;
}

.forge-requirements-tags,
.forge-requirements-actions,
.forge-requirements-attestation-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}

.forge-requirements-actions {
  justify-content: flex-end;
  min-width: 142px;
}

.forge-requirements-actions .forge-btn {
  min-height: 30px;
  padding-inline: 12px;
}

.forge-requirements-actions--locked {
  display: grid;
  grid-template-columns: repeat(2, max-content);
  justify-content: end;
}

.forge-requirements-actions--locked .forge-btn {
  opacity: 0.52;
  cursor: not-allowed;
}

.forge-requirements-lock-hint {
  grid-column: 1 / -1;
  color: var(--text-muted);
  font-size: 0.72rem;
  line-height: 1.3;
  text-align: right;
}

.forge-requirements-review-state {
  display: inline-flex;
  align-items: center;
}

.forge-requirements-assignee,
.forge-requirements-blocks-sign {
  display: grid;
  gap: 4px;
  justify-items: start;
  min-width: 0;
  color: var(--text-secondary);
  font-size: 0.82rem;
}

.forge-requirements-assignee strong {
  color: var(--text-primary);
  font-size: 0.84rem;
  font-weight: 700;
}

.forge-requirements-detail {
  color: var(--text-secondary);
  font-size: 0.8rem;
  line-height: 1.45;
}

.forge-requirements-detail summary {
  cursor: pointer;
  color: var(--text-muted);
  font-weight: 650;
}

.forge-requirements-detail[open] {
  padding-top: 8px;
  border-top: 1px solid var(--border-subtle);
}

.forge-requirements-source-citations {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-left: 4px;
}

.forge-requirements-source-citations span {
  padding: 2px 6px;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  color: var(--text-muted);
  background: var(--bg-subtle);
}

.forge-requirements-document-impact {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border-subtle);
}

.forge-requirements-document-impact-row {
  display: grid;
  gap: 2px;
}

.forge-requirements-document-impact-row strong {
  color: var(--text-primary);
}

.forge-requirements-document-impact-row span {
  color: var(--text-muted);
}

.forge-requirements-empty {
  padding: 16px 0;
  color: var(--text-muted);
  font-size: 0.86rem;
}

.forge-requirements-validation {
  display: grid;
  gap: 10px;
  margin: 0 0 14px;
}

.forge-requirements-validation-panel {
  display: grid;
  gap: 8px;
}

.forge-requirements-validation-findings {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.4;
}

.forge-error-details {
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: 0.8rem;
  line-height: 1.45;
}

.forge-error-details summary {
  cursor: pointer;
  color: var(--text-muted);
  font-weight: 650;
}

.forge-error-details code {
  display: block;
  margin-top: 6px;
  padding: 8px;
  overflow-wrap: anywhere;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  background: var(--bg-subtle);
  color: var(--text-primary);
  font-size: 0.76rem;
}

@media (max-width: 900px) {
  .forge-requirements-table-header {
    display: none;
  }

  .forge-requirements-row-main {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .forge-requirements-actions {
    justify-content: flex-start;
  }

  .forge-requirements-actions--locked {
    justify-content: start;
  }

  .forge-requirements-decision-support {
    grid-template-columns: 1fr;
  }

  .forge-requirements-decision-warning {
    max-width: none;
    text-align: left;
  }

  .forge-requirements-lock-hint {
    text-align: left;
  }

}

.scope-decision-brief {
  margin-top: 12px;
  color: var(--text-primary);
}

.scope-decision-review {
  margin-top: 12px;
  color: var(--text-primary);
}

.scope-decision-review__authority {
  margin-bottom: 4px;
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 700;
}

.scope-decision-review__basis,
.scope-decision-review__body,
.scope-decision-review__human-decision {
  margin: 0 0 6px;
  color: var(--text-secondary);
  font-size: 0.86rem;
  line-height: 1.45;
}

.scope-decision-review__summary {
  display: grid;
  gap: 0 18px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin: 10px 0 12px;
}

.scope-decision-review__summary-item {
  border-top: 1px solid var(--border);
  padding: 8px 0;
}

.scope-decision-review__summary-label {
  margin: 0 0 4px;
  color: var(--text-primary);
  font-size: 0.78rem;
  font-weight: 800;
}

.scope-decision-review__summary-item p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.4;
}

.scope-decision-brief__heading {
  margin: 0 0 8px;
  font-size: 0.86rem;
  font-weight: 800;
}

.scope-decision-brief__lead,
.scope-decision-brief__body {
  margin: 0 0 8px;
  color: var(--text-secondary);
  font-size: 0.88rem;
  line-height: 1.55;
}

.scope-decision-brief__lead {
  color: var(--text-primary);
  font-weight: 650;
}

.scope-source-chip {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  margin-left: 4px;
  padding: 1px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  background: var(--bg-soft);
  color: var(--text-secondary);
  font-size: 0.74rem;
  font-weight: 650;
  vertical-align: baseline;
}

.scope-decision-brief__section {
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: 0.84rem;
}

.scope-decision-brief__section summary {
  cursor: pointer;
  color: var(--text-primary);
  font-weight: 750;
}

.scope-decision-brief__list {
  margin: 6px 0 0 18px;
  padding: 0;
  line-height: 1.5;
}

.scope-decision-brief__list li {
  margin: 6px 0;
}

.scope-decision-brief__trace {
  display: grid;
  grid-template-columns: minmax(120px, max-content) 1fr;
  gap: 4px 12px;
  margin: 8px 0 0;
}

.scope-decision-brief__trace dt {
  color: var(--text-muted);
  font-weight: 700;
}

.scope-decision-brief__trace dd {
  margin: 0;
}

@media (max-width: 900px) {
  .forge-requirements-context-row {
    align-items: flex-start;
  }
}

/* Plan 2546 — Data/Fields gap detail and disclosure typography */
.forge-gap-narrative {
  font-size: 0.78rem;
  color: var(--text-muted);
  background: var(--bg-subtle);
  border-radius: 6px;
  padding: 5px 9px;
  margin-top: 4px;
  line-height: 1.4;
}
.forge-gap-detail-section {
  margin-top: 12px;
  border-top: 1px solid var(--border-subtle);
  padding-top: 10px;
}
.forge-gap-detail-section--compact {
  margin-top: 10px;
  padding-top: 8px;
}
.forge-gap-detail-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.forge-gap-detail-label--spaced {
  margin-bottom: 8px;
}
.forge-gap-detail-label--candidates {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.forge-gap-detail-label--amber {
  color: var(--brand-amber-text);
  letter-spacing: 0.04em;
}
.forge-gap-detail-label--blue {
  color: var(--brand-blue-dark);
  letter-spacing: 0.04em;
}
.forge-gap-detail-body {
  font-size: 0.78rem;
  color: var(--text-muted);
}
.forge-gap-detail-body--error {
  font-size: 0.78rem;
  color: var(--text-primary);
}
.forge-gap-detail-body--success {
  font-size: 0.78rem;
  color: var(--brand-green);
  padding: 2px 0;
}
.forge-gap-detail-body--fail {
  font-size: 0.78rem;
  color: var(--text-primary);
  padding: 2px 0;
  line-height: 1.4;
}
.forge-gap-detail-remedy {
  font-size: 0.72rem;
  color: var(--text-muted);
}
.forge-gap-detail-meta {
  font-size: 0.7rem;
  color: var(--text-muted);
  margin-top: 4px;
}
.forge-gap-conflict-panel {
  margin-top: 10px;
  border: 1px solid var(--brand-amber);
  border-radius: 6px;
  padding: 10px 12px;
}
.forge-gap-conflict-source {
  background: var(--bg-card);
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  padding: 8px 10px;
  gap: 4px;
}
.forge-gap-conflict-src-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-muted);
}
.forge-gap-conflict-src-value {
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--text-primary);
  word-break: break-word;
}
.forge-gap-conflict-src-conf {
  font-size: 0.7rem;
  color: var(--text-muted);
}
.forge-gap-ai-card {
  background: linear-gradient(180deg, var(--tint-violet) 0%, var(--tint-violet) 100%);
  border: 1px solid var(--brand-ai-light);
  border-radius: 8px;
  padding: 10px 12px;
  margin-top: 10px;
}
.forge-gap-verify-card {
  background: linear-gradient(180deg, var(--tint-amber) 0%, var(--tint-amber) 100%);
  border: 1px solid var(--brand-amber);
  border-radius: 8px;
  padding: 10px 12px;
  margin-top: 10px;
}
.forge-gap-suggested-value {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--brand-blue-dark);
  margin-top: 4px;
  word-break: break-word;
}
.forge-gap-source-label {
  font-size: 0.75rem;
  margin-top: 4px;
}
.forge-gap-source-label--blue {
  color: var(--brand-blue-dark);
}
.forge-gap-source-label--amber {
  color: var(--brand-amber-text);
}
.forge-gap-accepted-value {
  font-size: 0.82rem;
  background: var(--bg-subtle);
  border-radius: 6px;
  padding: 6px 10px;
  margin-bottom: 8px;
}
.forge-gap-accepted-meta {
  color: var(--text-muted);
  font-size: 0.73rem;
}
.forge-gap-activity-row {
  display: flex;
  gap: 6px;
  align-items: flex-start;
  padding: 4px 0;
  font-size: 0.78rem;
  border-bottom: 1px solid var(--border-subtle);
}
.forge-gap-activity-row--settled {
  border-bottom: 2px solid var(--tint-green);
  margin-bottom: 4px;
  padding: 4px 0 6px;
}
.forge-gap-activity-icon {
  flex-shrink: 0;
  font-size: 0.85rem;
}
.forge-gap-activity-ts {
  color: var(--text-muted);
  font-size: 0.72rem;
}
.forge-gap-activity-strong {
  font-weight: 600;
}
.forge-gap-activity-settled {
  font-weight: 700;
  color: var(--brand-green-dark);
}
.forge-gap-candidate-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 0.78rem;
  padding: 3px 0;
  border-bottom: 1px solid var(--border-subtle);
}
.forge-gap-candidate-status {
  min-width: 72px;
  font-weight: 600;
}
.forge-gap-candidate-value {
  flex: 1;
  word-break: break-word;
}
.forge-gap-candidate-meta {
  color: var(--text-muted);
  white-space: nowrap;
}
.forge-gap-skeleton {
  height: 18px;
  border-radius: 4px;
  background: linear-gradient(
    90deg,
    var(--tint-slate) 0%,
    var(--border) 50%,
    var(--tint-slate) 100%
  );
  background-size: 200% 100%;
  margin-bottom: 6px;
  animation: skeletonPulse 1.5s linear infinite;
}
.forge-gap-qa-thinking {
  font-size: 0.78rem;
  color: var(--text-muted);
  padding: 6px 0;
}
.forge-gap-qa-suggestion {
  border-color: var(--border-subtle);
  color: var(--text-secondary);
  font-size: 0.72rem;
}
.supplier-picker {
  font-size: 0.74rem;
  max-width: 180px;
}
.forge-supplier-requested-indicator {
  font-size: 0.74rem;
  color: var(--color-success);
}
.forge-voluntary-disclosure-header {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
}
.forge-voluntary-disclosure-label {
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--text-primary);
}
.forge-voluntary-disclosure-value {
  font-size: 0.85rem;
  color: var(--text-secondary);
  white-space: pre-wrap;
}
.forge-voluntary-disclosure-empty {
  font-size: 0.8rem;
  color: var(--text-muted);
  font-style: italic;
}
.forge-voluntary-disclosure-quote {
  font-size: 0.78rem;
  color: var(--text-muted);
  font-style: italic;
  margin-top: 2px;
}
.forge-voluntary-disclosure-section {
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--border-subtle);
}
.forge-source-stale-banner {
  background: var(--tint-amber-hover);
  border: 1px solid var(--brand-amber-bright);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 0.82rem;
  line-height: 1.5;
  color: var(--brand-amber-text);
  margin-bottom: 8px;
}
.forge-source-stale-banner strong {
  font-weight: 700;
}
.forge-source-stale-banner__detail {
  margin-top: 4px;
}
.forge-observed-panel-intro {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin: 0 0 8px;
}
.forge-observed-panel-review-link {
  font-size: 0.8rem;
  margin: 8px 0 0;
}
.forge-field-chip-sm {
  font-size: 0.72rem;
}
.forge-field-banner-icon {
  font-size: 18px;
}
.forge-field-banner-icon--amber {
  color: var(--text-primary);
}
.forge-field-banner-icon--muted {
  color: var(--text-muted);
  user-select: none;
}
.forge-field-activity-row {
  display: flex;
  gap: 6px;
  align-items: flex-start;
  padding: 5px 0;
  font-size: 0.78rem;
  border-bottom: 1px solid var(--border-subtle);
}
.forge-field-activity-icon {
  flex-shrink: 0;
  font-size: 1rem;
  color: var(--text-muted);
}
.forge-voluntary-disclosure-footer {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--border-subtle);
  font-size: 0.8rem;
  color: var(--text-muted);
}
.forge-voluntary-disclosure-footer a {
  color: var(--accent-blue);
  text-decoration: none;
}
.forge-fields-export-link {
  color: var(--text-secondary);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.78rem;
}
.forge-fields-diff-empty {
  font-size: 0.82rem;
  color: var(--text-muted);
}
.forge-fields-diff-summary {
  font-size: 0.78rem;
  color: var(--text-secondary);
}
.forge-fields-diff-row {
  font-size: 0.78rem;
  color: var(--text-primary);
}
.forge-fields-diff-more {
  font-size: 0.75rem;
  color: var(--text-muted);
}
.forge-fields-empty-filter {
  padding: 32px 0;
  text-align: center;
  color: var(--text-muted);
  font-size: 0.85rem;
}
.forge-harmonized-warning-icon {
  font-size: 1rem;
  color: var(--text-primary);
  vertical-align: middle;
}

/* Plan 2547 — Activity, Scope rationale, Settings export cards */
.forge-activity-event-meta {
  font-size: 0.75rem;
  color: var(--text-muted);
  min-width: 140px;
  white-space: nowrap;
}
.forge-activity-event-title {
  font-size: 0.88rem;
  color: var(--text-primary);
}
.forge-activity-event-detail {
  font-size: 0.78rem;
  color: var(--text-muted);
}
.forge-applicability-label {
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}
.forge-applicability-meta {
  font-size: 0.85rem;
  color: var(--text-secondary);
}
.forge-applicability-rationale-list {
  margin: 0;
  padding-left: 18px;
  font-size: 0.85rem;
  color: var(--text-secondary);
}
.forge-applicability-snippet {
  font-size: 0.85rem;
  color: var(--text-secondary);
  margin-top: 6px;
  padding: 8px 10px;
  border-radius: 6px;
  background: var(--bg-soft);
}
.forge-applicability-footnote {
  font-size: 0.78rem;
  color: var(--text-muted);
  margin-top: 2px;
}
.forge-settings-export-card {
  margin-top: 14px;
  padding: 10px 14px;
  background: var(--bg-page);
  border: 1px solid var(--border);
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.forge-settings-export-copy {
  flex: 1;
}
.forge-settings-export-title {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-primary);
}
.forge-settings-export-sub {
  font-size: 0.73rem;
  color: var(--text-muted);
}
.forge-settings-export-link {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-primary);
  background: var(--bg-soft);
  border-radius: 6px;
  padding: 4px 12px;
  text-decoration: none;
  white-space: nowrap;
}
.forge-stub-banner {
  margin-top: 8px;
  flex-direction: column;
  gap: 8px;
}
.forge-stub-banner__row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.forge-stub-banner__title {
  font-weight: 700;
  color: var(--text-primary);
}
.forge-stub-banner__body {
  color: var(--text-secondary);
  line-height: 1.45;
}
.forge-stub-banner__link {
  font-size: 0.82rem;
  color: var(--brand-blue);
  text-decoration: none;
  font-weight: 600;
}
.forge-scope-banner__actions {
  margin-top: 8px;
}
.forge-scope-regulation-eyebrow {
  font-size: 0.72rem;
  font-weight: 800;
  color: var(--text-muted);
}
.forge-scope-regulation-title {
  font-size: 1rem;
  font-weight: 750;
  color: var(--text-primary);
}
.forge-scope-regulation-meta {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 0.82rem;
  color: var(--text-secondary);
}
.forge-scope-workbench {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  gap: 16px;
}
.forge-scope-workbench__detail,
.forge-scope-navigation {
  min-width: 0;
  width: 100%;
}
.forge-scope-navigation__mobile { display: none; width: 100%; }
.forge-scope-navigator {
  position: sticky;
  top: 12px;
  max-height: min(72vh, 760px);
  width: 100%;
  overflow: auto;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
}
.forge-scope-navigator__title,
.forge-scope-detail-section-title {
  color: var(--text-primary);
  font-size: 0.9rem;
  font-weight: 760;
}
.forge-scope-navigator__section { gap: 6px; }
.forge-scope-navigator__entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: 4px 8px;
}
.forge-scope-navigator__attention {
  color: var(--text-primary);
  font-size: 0.74rem;
  grid-column: 1 / -1;
  padding-left: 4px;
}
.forge-scope-navigator__section-title {
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 760;
  text-transform: uppercase;
}
.forge-scope-navigator__option {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text-primary);
  justify-content: flex-start;
  overflow: hidden;
  padding: 6px 8px;
  white-space: normal;
  text-align: left;
}
.q-btn.forge-scope-navigator__option {
  border-radius: 8px;
}
.forge-scope-navigator__option .q-btn__content {
  justify-content: flex-start;
  overflow-wrap: anywhere;
  text-align: left;
}
.forge-scope-navigator__option--selected {
  border-color: var(--border);
  background: var(--bg-soft);
  font-weight: 700;
}
.forge-scope-navigator__option:focus-visible {
  box-shadow: var(--focus-ring);
}
.forge-scope-navigator__status,
.forge-scope-regulation-status {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 4px 8px;
  white-space: nowrap;
}
.forge-scope-navigator__status--applied,
.forge-scope-regulation-status--applied {
  border-color: color-mix(in srgb, var(--brand-green) 36%, var(--border));
  color: var(--brand-green);
}
.forge-scope-navigator__status--blocked,
.forge-scope-regulation-status--review {
  border-color: color-mix(in srgb, var(--brand-amber) 48%, var(--border));
  color: var(--text-primary);
}
.forge-scope-navigator__status--history,
.forge-scope-navigator__status--deferred,
.forge-scope-regulation-status--history,
.forge-scope-regulation-status--deferred {
  color: var(--text-muted);
}
.forge-scope-regulation-heading { flex-wrap: wrap; }
.forge-scope-regulation-topline { flex-wrap: wrap; }
.forge-scope-regulation-topline > .q-column { flex: 1 1 420px; min-width: 0; }
.forge-scope-regulation-topline > .q-row.scope-row-rhs-actions { flex: 0 1 auto; }
.forge-scope-regulation-detail {
  min-width: 0;
  width: 100%;
  gap: 12px;
}
.scope-row-rhs-actions {
  flex: 0 0 auto;
  min-width: max-content;
}
.scope-decision-explainer-trigger {
  flex: 0 0 auto;
  align-self: center;
  width: auto;
  max-width: max-content;
  white-space: nowrap;
}
.scope-decision-explainer-inline {
  border-top: 1px solid var(--border);
  margin-top: 10px;
  padding-top: 10px;
}
.scope-decision-explainer {
  gap: 10px;
}
.scope-decision-explainer__label {
  color: var(--text-secondary);
  font-size: 0.82rem;
  font-weight: 750;
}
.scope-decision-explainer__prompts {
  flex-wrap: wrap;
}
.scope-decision-explainer__ask-row {
  max-width: 760px;
}
.scope-decision-explainer__input {
  flex: 1 1 420px;
  min-width: 0;
}
.scope-decision-explainer__empty {
  color: var(--text-secondary);
  font-size: 0.88rem;
}
.scope-decision-explainer__result {
  display: grid;
  gap: 10px;
  color: var(--text-primary);
  font-size: 0.9rem;
}
.scope-decision-explainer__section-title {
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 800;
  margin-bottom: 4px;
  text-transform: uppercase;
}
.scope-decision-explainer__boundary,
.scope-decision-explainer__run {
  color: var(--text-secondary);
  font-size: 0.82rem;
}
.forge-scope-decision-board {
  margin-top: 10px;
  border-left: 3px solid var(--brand-amber);
  display: grid;
  gap: 10px;
  padding: 2px 0 2px 14px;
}
.forge-scope-decision-board__status {
  color: var(--text-secondary);
  font-size: 0.82rem;
  font-weight: 750;
}
.forge-scope-decision-board__section {
  display: grid;
  gap: 4px;
}
.forge-scope-decision-board__label {
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 700;
}
.forge-scope-decision-board__decision {
  color: var(--text-primary);
  font-size: 1rem;
  font-weight: 760;
}
.forge-scope-decision-board__note {
  color: var(--text-secondary);
  margin: 0;
  max-width: 72ch;
}
.forge-scope-decision-board__attention {
  display: grid;
  gap: 5px;
}
.forge-scope-decision-board__attention-row {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(120px, max-content) minmax(0, 1fr);
}
.forge-scope-decision-board__attention-row span {
  color: var(--text-primary);
  font-weight: 650;
}
.forge-scope-decision-board__attention-row p {
  color: var(--text-secondary);
  margin: 0;
}
.forge-scope-regulation-details {
  margin-top: var(--space-3);
}
.forge-scope-regulation-details__summary {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  color: var(--text-secondary);
  font-size: 0.82rem;
  font-weight: 700;
}
.forge-scope-regulation-details__summary:hover {
  color: var(--text-primary);
}
.forge-scope-regulation-details__label {
  color: var(--text-primary);
}
.forge-scope-regulation-details__meta {
  font-weight: 500;
  color: var(--text-muted);
}
.scope-review-card {
  width: 100%;
  margin-top: var(--space-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
}
.scope-review-card > summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: var(--space-3);
  align-items: start;
  padding: 12px 14px;
}
.scope-review-card > summary::-webkit-details-marker {
  display: none;
}
.scope-review-card[open] > summary {
  border-bottom: 1px solid var(--border);
}
.scope-review-card__main {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.scope-review-card__title {
  color: var(--text-primary);
  font-size: 0.96rem;
  font-weight: 760;
}
.scope-review-card__line {
  color: var(--text-secondary);
  font-size: 0.86rem;
  line-height: 1.42;
  max-width: 78ch;
}
.scope-review-card__meta {
  color: var(--text-muted);
  font-size: 0.8rem;
  line-height: 1.35;
}
.scope-review-card__status {
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text-secondary);
  font-size: 0.76rem;
  font-weight: 750;
  line-height: 1;
  padding: 6px 9px;
  white-space: nowrap;
}
.scope-review-card__detail {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 18px;
  padding: 12px 14px 14px;
}
.scope-review-card__detail section {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.scope-review-card__detail h4 {
  color: var(--text-primary);
  font-size: 0.8rem;
  font-weight: 800;
  margin: 0;
}
.scope-review-card__detail p,
.scope-review-card__detail ul {
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.45;
  margin: 0;
}
.scope-review-card__detail ul {
  padding-left: 18px;
}
.scope-review-card__uncertainty {
  display: grid;
  gap: 8px;
}
.scope-review-card__issue-group {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.scope-review-card--regulation .scope-review-card__detail {
  grid-template-columns: minmax(0, 1fr);
}
.scope-review-card__investigation-details {
  border-top: 1px solid var(--border-subtle);
  padding-top: 10px;
}
.scope-review-card__investigation-details > summary {
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 700;
}
.scope-review-card__investigation-details[open] > summary { margin-bottom: 10px; }
.forge-stage-header-actions-live,
.scope-obligation-row__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: 0;
}
.scope-obligation-row__actions {
  flex: 0 0 auto;
  max-width: 100%;
}
.scope-obligation-row__actions .forge-btn {
  min-width: 72px;
  white-space: nowrap;
}
.forge-scope-obligations-heading {
  margin-top: 0;
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--text-primary);
}
.forge-scope-obligation-decision-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.forge-scope-obligations-toolbar {
  margin-top: 14px;
}
.forge-scope-obligation-decision-body {
  display: grid;
  gap: 8px;
}
.forge-scope-obligation-decision-row {
  margin-top: 0;
}
.forge-scope-obligation-decision-main {
  min-width: 0;
}
.forge-scope-obligation-decision-main p {
  color: var(--text-secondary);
  margin: 4px 0 0;
  max-width: 72ch;
}
.forge-scope-obligation-decision-state {
  color: var(--text-secondary);
  font-weight: 700;
  white-space: nowrap;
}
.forge-scope-obligation-decision-actions {
  margin-top: 8px;
  gap: 6px;
}
.forge-scope-obligation-decision-actions__label {
  color: var(--text-secondary);
  font-size: 0.8rem;
  font-weight: 700;
}
.forge-scope-obligation-row-decision {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 124px;
}
.forge-scope-obligation-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.forge-scope-obligation-row-actions--empty {
  color: var(--text-muted);
  font-size: 0.76rem;
}
.forge-scope-obligation-row-action {
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-primary);
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
  padding: 5px 7px;
  white-space: nowrap;
}
.forge-dialog-surface {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: min(420px, calc(100vw - 32px));
  padding: 16px;
}
.forge-reporting-generate-action {
  white-space: nowrap;
}
@media (max-width: 960px) {
  .forge-scope-workbench { grid-template-columns: minmax(0, 1fr); }
  .forge-scope-navigator { display: none; }
  .forge-scope-navigation__mobile { display: block; }
}
@media (max-width: 720px) {
  .forge-scope-regulation-heading { align-items: flex-start; }
  .forge-scope-regulation-detail > .q-row { flex-wrap: wrap; }
  .forge-scope-decision-board__attention-row,
  .scope-review-card > summary,
  .scope-review-card__detail {
    grid-template-columns: minmax(0, 1fr);
  }
  .scope-review-card__status {
    justify-self: start;
  }
  .scope-row-rhs-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
    min-width: 0;
  }
}

.scope-investigation-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin-top: var(--space-3);
}
.scope-investigation-stack__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.scope-investigation-stack__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.scope-investigation-stack__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary);
}
.scope-investigation-stack__meta,
.scope-investigation-stack__authority {
  font-size: 0.82rem;
  color: var(--text-secondary);
  line-height: 1.45;
}
.scope-investigation-panel {
  padding: var(--space-3);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
}
.scope-investigation-panel__title {
  margin: 0 0 var(--space-2);
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--text-primary);
}
.scope-investigation-panel__lead,
.scope-investigation-panel__status,
.scope-investigation-panel__meta {
  margin: 0 0 var(--space-2);
  font-size: 0.82rem;
  color: var(--text-secondary);
  line-height: 1.45;
}
.scope-investigation-panel__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  color: var(--text-secondary);
}
.scope-investigation-criteria {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}
.scope-investigation-trace {
  margin: var(--space-2) 0 var(--space-3);
  font-size: 0.82rem;
  color: var(--text-secondary);
}
.scope-investigation-trace__heading {
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: var(--space-1);
}

/* Plan 2716 — product-stage UI contract drain */
.forge-expand-icon {
  font-size: 16px;
  color: var(--text-muted);
}
.forge-perf-editor-hint {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin: 4px 0 8px;
}
.forge-banner-detail {
  margin-top: 4px;
  font-size: 0.82rem;
}
.forge-presign-readiness {
  margin-bottom: 12px;
}
.forge-presign-heading {
  font-size: 0.82rem;
  font-weight: 700;
  margin-bottom: 6px;
}
.forge-source-icon-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  line-height: 1;
  color: var(--text-secondary);
}
.forge-source-delete-btn.forge-source-icon-btn {
  color: var(--text-primary);
  margin-left: 2px;
}

.forge-ps-hint {
  font-size: 0.82rem;
  color: var(--text-secondary);
  margin-top: 4px;
}
.forge-ps-hint--muted {
  font-size: 0.78rem;
  color: var(--text-muted);
  margin-top: 6px;
}
.forge-ps-review-cols {
  display: flex;
  gap: 12px;
  padding: 10px 0 6px;
  border-bottom: 1px solid var(--border-cool);
  margin-top: 6px;
}
.forge-ps-review-col {
  font-size: 0.68rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.forge-ps-review-col--field {
  width: 230px;
  flex: none;
}
.forge-ps-review-col--data {
  width: 80px;
  flex: none;
}
.forge-ps-review-col--review {
  width: 100px;
  flex: none;
}
.forge-ps-review-col--value {
  flex: auto;
}
.forge-ps-field-name {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--text-primary);
}
.forge-ps-field-sub {
  font-size: 0.68rem;
  color: var(--text-muted);
  margin-top: 1px;
}
.forge-ps-field-value {
  font-size: 0.85rem;
  color: var(--text-primary);
  word-break: break-word;
}
.forge-ps-validation {
  font-size: 0.76rem;
  font-weight: 700;
  margin-top: 2px;
}

.forge-ps-drawer-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-ps-drawer-sub {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin-top: 2px;
}
.forge-btn.forge-ps-drawer-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: var(--text-muted);
  border-radius: 4px;
  flex-shrink: 0;
  font-size: 1.2rem;
  min-height: 0;
  box-shadow: none;
}
.forge-ps-draft-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  cursor: pointer;
  border-radius: 6px;
  font-size: 0.8rem;
  text-decoration: none;
}
.forge-ps-draft-btn--primary {
  background: var(--button-primary-bg);
  color: var(--button-primary-text);
  border: none;
  font-weight: 600;
}
.forge-ps-draft-btn--secondary {
  border: 1px solid var(--border);
  color: var(--text-primary);
  background: var(--bg-card);
}
.forge-ps-draft-fallback {
  padding: 10px 20px;
  font-size: 0.78rem;
}
.forge-ps-draft-dl-hint {
  padding: 8px 20px;
  font-size: 0.75rem;
  color: var(--text-muted);
  border-top: 1px solid var(--border);
  background: var(--bg-card);
}
.forge-ps-stale-banner {
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 0.82rem;
  line-height: 1.5;
  background: var(--tint-amber);
  border: 1px solid var(--brand-amber);
  color: var(--brand-amber-text);
}
.forge-ps-stale-regen {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 5px;
  font-weight: 600;
  font-size: 0.8rem;
  text-decoration: none;
}

.forge-ps-card {
  margin-top: 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  padding: 10px 12px;
  background: var(--bg-subtle);
}
.forge-ps-card--qa {
  gap: 8px;
}
.forge-ps-kicker {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.forge-ps-source {
  font-size: 0.75rem;
  color: var(--text-secondary);
}
.forge-ps-snippet {
  font-size: 0.78rem;
  color: var(--text-primary);
  font-style: italic;
  margin-top: 4px;
  line-height: 1.4;
}
.forge-ps-confidence {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-top: 4px;
}
.forge-ps-empty {
  font-size: 0.78rem;
  color: var(--text-muted);
}

.forge-ps-suggestion-card {
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 10px 12px;
  margin-bottom: 8px;
}
.forge-ps-suggestion-pct {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--brand-blue);
}
.forge-ps-owner-select {
  min-width: 260px;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 10px;
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: 0.85rem;
}
.forge-btn.forge-reg-chip-nav {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  min-height: 0;
  box-shadow: none;
  border-radius: 999px;
}

.forge-ps-banner-icon {
  font-size: 1.25rem;
}
.forge-ps-banner-body {
  margin-top: 6px;
  font-size: 0.88rem;
  color: var(--text-primary);
}
.forge-ps-banner-meta {
  margin-top: 8px;
  font-size: 0.8rem;
  color: var(--text-secondary);
}
.forge-ps-banner-since {
  color: var(--text-secondary);
  font-size: 0.78rem;
  margin-left: 8px;
}
.forge-ps-banner-expected {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin-top: 4px;
}
.forge-ps-banner-affects {
  font-size: 0.78rem;
  color: var(--text-secondary);
  margin-top: 2px;
}
.forge-ps-banner-note {
  margin-top: 6px;
  font-size: 0.82rem;
  color: var(--text-secondary);
}
.forge-ps-matched-chip {
  font-size: 0.62rem;
  padding: 1px 5px;
  vertical-align: middle;
  margin-left: 5px;
}
.forge-ps-docs {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
.forge-ps-docs tbody tr {
  border-bottom: 1px solid var(--tint-slate);
}
.forge-ps-docs__type {
  font-weight: 600;
  white-space: nowrap;
}
.forge-ps-docs__name {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.forge-ps-docs__date {
  color: var(--text-secondary);
  white-space: nowrap;
}
.forge-ps-docs__actions {
  white-space: nowrap;
}
.forge-ps-docs__actions-row {
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
}
.forge-ps-docs__missing {
  color: var(--text-muted);
  font-style: italic;
}
.forge-ps-meta-item__value {
  font-weight: 600;
  color: var(--text-primary);
  margin-top: 2px;
}
.forge-ps-docs--env {
  font-size: 0.88rem;
}
.forge-work-surface-empty--compact {
  margin: 0;
}
.forge-ps-col-info {
  cursor: help;
  font-size: 0.85em;
  color: var(--text-muted);
}
.forge-ps-empty-card {
  padding: 14px;
  color: var(--text-secondary);
  font-size: 0.85rem;
  font-style: italic;
}
.forge-ps-annex-empty {
  padding: 10px 16px;
  color: var(--text-muted);
  font-style: italic;
  font-size: 0.85rem;
}
.forge-ps-annex-entry {
  padding: 10px 16px;
  border-top: 1px dashed var(--border-cool);
  display: grid;
  grid-template-columns: 2fr 1.5fr 1.5fr 1fr 0.8fr;
  gap: 8px;
  font-size: 0.82rem;
  align-items: start;
}
.forge-ps-annex-label {
  color: var(--text-muted);
  font-size: 0.7rem;
  text-transform: uppercase;
  display: block;
}
.forge-ps-annex-ref {
  color: var(--text-primary);
  font-family: monospace;
  font-size: 0.75rem;
}
.forge-ps-annex-badge {
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
}
.forge-ps-annex-intro {
  padding: 12px 16px;
  font-size: 0.78rem;
  color: var(--text-secondary);
  background: var(--tint-slate);
  border-bottom: 1px solid var(--border);
}
.forge-ps-missing-copy {
  font-size: 0.88rem;
  color: var(--text-secondary);
}
.forge-ps-env-meta {
  font-size: 0.82rem;
  color: var(--text-secondary);
}
.forge-ps-env-unit {
  font-size: 0.72rem;
}
.forge-ps-meta-item {
  font-size: 0.8rem;
}
.forge-ps-meta-label {
  font-size: 0.7rem;
  color: var(--text-muted);
  text-transform: uppercase;
}
.forge-ps-meta-card-label {
  font-size: 0.75rem;
  color: var(--text-muted);
  text-transform: uppercase;
}
.forge-ps-meta-card-status {
  font-size: 0.75rem;
  color: var(--text-secondary);
  font-style: italic;
}
.forge-ps-ripple {
  font-size: 0.82rem;
}
.forge-ps-ripple-icon {
  font-size: 14px;
  vertical-align: -2px;
  margin-right: 4px;
}
.forge-ps-th {
  padding: 8px 14px;
  text-align: left;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
  background: var(--tint-slate);
  border-bottom: 1px solid var(--border);
}
.forge-ps-td {
  padding: 8px 14px;
  font-size: 0.84rem;
  color: var(--text-primary);
  border-bottom: 1px solid var(--border);
}
.forge-ps-perf-empty {
  font-size: 0.88rem;
  color: var(--text-muted);
}
.forge-ps-retention {
  font-size: 0.74rem;
  color: var(--text-muted);
}
.forge-ps-audit-field {
  font-size: 0.84rem;
  color: var(--text-primary);
}
.forge-ps-audit-type {
  font-size: 0.78rem;
  color: var(--text-secondary);
}
.forge-ps-audit-meta {
  font-size: 0.78rem;
  color: var(--text-muted);
}
.forge-ps-audit-empty {
  padding: 1rem;
  color: var(--text-muted);
  font-size: 0.86rem;
}

.forge-ps-ai-pill {
  font-size: 0.72rem;
  font-weight: 700;
}
.forge-ps-ai-link {
  font-size: 0.74rem;
  color: var(--brand-blue);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.forge-ps-deadline {
  color: var(--text-secondary);
  font-size: 0.82rem;
  white-space: nowrap;
}
.forge-ps-priority-rationale {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 0.74rem;
  line-height: 1.25;
}
.forge-btn.forge-ps-sort-btn {
  all: unset;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.forge-ps-sort-arrow {
  font-size: 0.72rem;
}
.forge-ps-bulk-select,
.forge-ps-row-select {
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-primary);
  background: var(--bg-card);
}
.forge-ps-bulk-select {
  font-size: 0.8rem;
}
.forge-ps-row-select {
  width: 100%;
  min-width: 140px;
  max-width: 200px;
  border-radius: 8px;
  padding: 5px 8px;
  font-size: 0.76rem;
}
.forge-ps-fact {
  font-size: 0.78rem;
}
.forge-ps-progress-fill {
  height: 6px;
  border-radius: 4px;
}
.forge-ps-dpp-caption {
  font-size: 0.72rem;
  color: var(--text-secondary);
  margin-top: 2px;
}
.forge-btn.forge-product-delete-btn {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-primary);
  padding: 4px;
  border-radius: 4px;
  min-height: 0;
  box-shadow: none;
}
.forge-product-delete-btn .material-icons {
  font-size: 16px;
}
.forge-product-delete-btn--table .material-icons {
  font-size: 18px;
}
.forge-ps-phr-pill {
  background: var(--tint-amber);
  color: var(--brand-amber-text);
  border-radius: 10px;
  padding: 1px 7px;
  font-size: 0.68rem;
  font-weight: 700;
  white-space: nowrap;
  margin-left: 4px;
}
.forge-ps-reg-line {
  font-size: 0.78rem;
  margin-top: 4px;
}
.forge-ps-unassigned-hint {
  margin-top: 6px;
  font-size: 0.78rem;
  color: var(--text-muted);
}
.forge-ps-product-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  min-width: 260px;
  flex: 1;
  max-width: 380px;
  position: relative;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.15s ease;
  cursor: pointer;
}
.forge-ps-card-title {
  font-weight: 700;
  color: var(--text-primary);
  font-size: 0.95rem;
  text-decoration: none;
  min-width: 0;
}
.forge-ps-card-sku,
.forge-ps-row-sku {
  font-size: 0.74rem;
  color: var(--text-muted);
}
.forge-ps-row-sku {
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 320px;
}
.forge-ps-card-owner {
  font-size: 0.74rem;
  color: var(--text-secondary);
  margin-top: 4px;
}
.forge-ps-row-owner {
  font-size: 0.82rem;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.forge-ps-skeleton-row {
  height: 14px;
  border-radius: 4px;
  background: var(--tint-slate);
  margin-bottom: 10px;
  animation: skeletonPulse 1.4s ease-in-out infinite;
}

.forge-ps-diff-empty,
.forge-ps-diff-none {
  font-size: 0.82rem;
  color: var(--text-muted);
}
.forge-ps-diff-empty {
  padding: 8px 0;
}
.forge-ps-diff-meta {
  font-size: 0.78rem;
  color: var(--text-secondary);
  margin-top: 4px;
}
.forge-ps-diff-td {
  padding: 6px 10px;
  font-size: 0.78rem;
}
.forge-ps-diff-th {
  padding: 6px 10px;
  text-align: left;
  font-size: 0.72rem;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.forge-ps-diff-more {
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-top: 4px;
}

.forge-ps-ai-warn {
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 0.82rem;
  line-height: 1.5;
}
.forge-ps-dialog-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--text-primary);
  margin-bottom: 8px;
}
.forge-ps-dialog-title--lg {
  font-size: 1rem;
}
.forge-ps-dialog-body {
  font-size: 0.85rem;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-bottom: 10px;
}
.forge-ps-excluded-pill {
  border-radius: 8px;
  padding: 1px 7px;
  font-size: 0.72rem;
  font-weight: 600;
  margin-left: 8px;
  white-space: nowrap;
}
.forge-ps-secondary {
  font-size: 0.85rem;
  color: var(--text-secondary);
}
.forge-ps-na-warn {
  font-size: 0.85rem;
  border-radius: 6px;
  padding: 8px 10px;
  margin-bottom: 10px;
}
.forge-ps-audit-stat {
  border-radius: 10px;
  padding: 14px 18px;
}
.forge-ps-audit-stat-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.forge-ps-audit-stat-value {
  font-size: 1.6rem;
  font-weight: 700;
  margin: 4px 0 2px;
}
.forge-ps-audit-stat-sub {
  font-size: 0.78rem;
  opacity: 0.8;
}

.forge-ps-export-link {
  flex: none;
  white-space: nowrap;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--button-primary-text);
  text-decoration: none;
  padding: 4px 10px;
  border: 1px solid var(--button-primary-border);
  background: var(--button-primary-bg);
  border-radius: 6px;
}
.forge-ps-status-title {
  font-size: 1rem;
  font-weight: 700;
}
.forge-ps-muted {
  font-size: 0.85rem;
  color: var(--text-muted);
}
.forge-ps-blocker,
.forge-ps-conformity,
.forge-ps-esign-card,
.forge-ps-issued-card {
  border-radius: 8px;
  padding: 12px 14px;
  gap: 8px;
  margin-bottom: 12px;
}
.forge-ps-esign-card,
.forge-ps-issued-card {
  padding: 10px 14px;
  margin-bottom: 8px;
}
.forge-ps-blocker-title,
.forge-ps-conformity-title {
  font-size: 0.85rem;
  font-weight: 700;
}
.forge-ps-blocker-body,
.forge-ps-conformity-body {
  font-size: 0.82rem;
  line-height: 1.5;
}
.forge-ps-checklist-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 6px;
}
.forge-ps-checklist {
  font-size: 0.82rem;
}
.forge-ps-sign-hint {
  font-size: 0.82rem;
  color: var(--text-secondary);
  margin: 8px 0 4px;
}
.forge-ps-esign-kicker,
.forge-ps-issued-kicker {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 2px;
}
.forge-ps-esign-body,
.forge-ps-issued-body {
  font-size: 0.85rem;
  color: var(--text-primary);
}
.forge-ps-issued-meta {
  font-size: 0.82rem;
  color: var(--text-muted);
  margin-top: 2px;
}
.forge-ps-history-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text-primary);
}
.forge-ps-history-row {
  font-size: 0.82rem;
  color: var(--text-primary);
  padding: 4px 0;
  border-bottom: 1px dashed var(--border-subtle);
}

.forge-ps-reissue-copy {
  font-size: 0.85rem;
  color: var(--text-primary);
}
.forge-ps-version-num {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary);
  min-width: 60px;
}
.forge-ps-version-meta {
  font-size: 0.82rem;
  color: var(--text-muted);
}
.forge-ps-version-pill {
  font-size: 0.72rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
}
.forge-ps-version-when {
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-left: auto;
}
.forge-ps-version-gaps {
  font-size: 0.75rem;
  color: var(--text-muted);
}

.forge-btn.obligation-switcher__pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 14px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 500;
  border: 1.5px solid var(--border-muted);
  background: var(--bg-card);
  color: var(--text-secondary);
  min-height: 0;
  box-shadow: none;
}
.forge-btn.obligation-switcher__pill.is-active {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
  color: var(--color-white);
  font-weight: 600;
}

.forge-ps-inbox-body {
  font-size: 0.875rem;
  color: var(--text-primary);
  line-height: 1.6;
}
.forge-ps-inbox-kicker {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.forge-ps-inbox-quote {
  margin-top: 4px;
  font-size: 0.8125rem;
  color: var(--text-secondary);
  font-style: italic;
}
.forge-ps-inbox-li {
  margin-bottom: 5px;
  font-size: 0.875rem;
  line-height: 1.5;
}
.forge-ps-inbox-empty {
  margin-bottom: 12px;
  font-size: 0.875rem;
  color: var(--text-secondary);
}
.forge-ps-inbox-warn {
  margin-bottom: 12px;
  padding: 8px 10px;
  background: color-mix(in srgb, var(--tint-amber) 40%, var(--bg-card));
  border-left: 3px solid var(--brand-amber);
  border-radius: 4px;
}
.forge-ps-inbox-warn--muted {
  background: color-mix(in srgb, var(--tint-slate) 30%, var(--bg-card));
  border-left-color: var(--text-muted);
}
.forge-ps-inbox-warn-body {
  font-size: 0.8125rem;
  color: var(--text-primary);
}
.forge-ps-inbox-warn--muted .forge-ps-inbox-warn-body {
  color: var(--text-secondary);
}
.forge-ps-scan-result {
  position: relative;
  overflow: hidden;
  margin: 0 0 12px;
  padding: 14px 16px 14px 18px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  box-shadow: 0 1px 2px rgba(var(--navy-rgb), 0.04);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.forge-ps-scan-accent {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
}
.forge-ps-scan-result[data-tone="green"] .forge-ps-scan-accent {
  background: var(--brand-green);
}
.forge-ps-scan-result[data-tone="amber"] .forge-ps-scan-accent {
  background: var(--brand-amber);
}
.forge-ps-scan-result[data-tone="slate"] .forge-ps-scan-accent {
  background: var(--text-muted);
}
.forge-ps-scan-message {
  margin-top: 5px;
  color: var(--text-secondary);
  font-size: 0.9rem;
  line-height: 1.45;
}
.forge-ps-scan-metric {
  min-width: 112px;
  padding: 8px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-muted);
}
.forge-ps-scan-metric-value {
  font-size: 1.15rem;
  line-height: 1.1;
  font-weight: 750;
  color: var(--text-primary);
}
.forge-ps-scan-result[data-tone="green"] .forge-ps-scan-metric-value {
  color: var(--brand-green);
}
.forge-ps-scan-result[data-tone="amber"] .forge-ps-scan-metric-value {
  color: var(--text-primary);
}
.forge-ps-scan-metric-label {
  margin-top: 4px;
  font-size: 0.72rem;
  color: var(--text-secondary);
}
.forge-ps-scan-dismiss .material-icons {
  font-size: 15px;
  line-height: 1;
}
.forge-ps-scan-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.ra-shell-scope-note {
  color: var(--text-muted);
  font-size: 0.74rem;
  line-height: 1.35;
}

.ra-result {
  display: grid;
  gap: 10px;
  width: 100%;
  overflow: hidden;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--border-subtle);
  border-left: 3px solid var(--brand-ai);
  border-radius: 8px;
  background: var(--bg-card);
  color: var(--text-primary);
}

.ra-eyebrow,
.ra-result-trust-row,
.ra-scope-strip,
.ra-actions,
.ra-feedback {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}

.ra-eyebrow {
  color: var(--brand-ai);
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.ra-eyebrow .material-icons {
  font-size: 15px;
}

.ra-question {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-muted);
}

.ra-question span,
.ra-result-section__title,
.ra-scope-chip__label {
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
}

.ra-question strong,
.ra-direct-answer,
.ra-answer-block p,
.ra-answer-item span,
.ra-authority-ref__reason,
.ra-citation p,
.ra-limitations li {
  overflow-wrap: anywhere;
}

.ra-direct-answer {
  margin: 0;
  color: var(--text-primary);
  font-size: 0.9rem;
  line-height: 1.48;
}

.ra-evidence-chip,
.ra-intent-chip,
.ra-audit-chip,
.ra-scope-chip {
  max-width: 100%;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  padding: 3px 8px;
  background: var(--bg-page);
  color: var(--text-secondary);
  font-size: 0.72rem;
  line-height: 1.25;
}

.ra-evidence-chip--ok {
  border-color: color-mix(in srgb, var(--brand-green) 32%, var(--border-subtle));
  color: var(--brand-green);
}

.ra-evidence-chip--review {
  border-color: color-mix(in srgb, var(--brand-amber) 38%, var(--border-subtle));
  color: var(--text-primary);
}

.ra-evidence-chip--blocked {
  border-color: color-mix(in srgb, var(--warning) 34%, var(--border-subtle));
  color: var(--warning);
}

.ra-scope-chip {
  display: inline-flex;
  gap: 5px;
  border-radius: 6px;
}

.ra-scope-chip__value {
  color: var(--text-secondary);
}

.ra-answer-blocks,
.ra-answer-block,
.ra-answer-items,
.ra-result-section,
.ra-authority-list {
  display: grid;
  gap: 8px;
}

.ra-answer-block h4,
.ra-answer-block p {
  margin: 0;
}

.ra-answer-block h4 {
  color: var(--text-secondary);
  font-size: 0.82rem;
}

.ra-answer-item,
.ra-authority-ref {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-page);
}

.ra-answer-item strong,
.ra-authority-ref strong {
  color: var(--text-primary);
  font-size: 0.82rem;
}

.ra-answer-item span,
.ra-authority-ref,
.ra-citation,
.ra-limitations {
  color: var(--text-secondary);
  font-size: 0.78rem;
  line-height: 1.38;
}

.ra-answer-block--document_interpretation p,
.ra-answer-block--clear_blockers .ra-answer-item,
.ra-answer-block--key_evidence .ra-answer-item strong {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ra-answer-block--clear_blockers .ra-answer-item {
  border-left: 3px solid var(--warning);
}

@media (max-width: 720px) {
  .ra-answer-block--document_interpretation p,
  .ra-answer-block--clear_blockers .ra-answer-item span,
  .ra-answer-block--key_evidence .ra-answer-item strong {
    font-size: 0.82rem;
  }
}

.ra-authority-ref__head {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}

.ra-authority-ref--excluded {
  opacity: 0.76;
}

.ra-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-page);
  color: var(--text-primary);
  font-size: 0.78rem;
  font-weight: 700;
  text-decoration: none;
}

.ra-action[disabled],
.ra-action[aria-disabled="true"] {
  color: var(--text-muted);
  cursor: not-allowed;
}

.ra-limitations ul {
  margin: 0;
  padding-left: 18px;
}

.ra-feedback {
  padding-top: 8px;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-muted);
  font-size: 0.74rem;
}

.ra-feedback button {
  width: 28px;
  height: 28px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-page);
  color: var(--text-secondary);
  font-family: "Material Icons";
  font-size: 16px;
}.forge-exec-work-type,
.forge-sources-hs-detail,
.forge-reg-ledger-section--candidates,
.forge-help-text,
.forge-declare-release-panel,
.forge-declare-release-title,
.forge-declare-release-subtitle {
  min-width: 0;
}

.forge-help-text {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

.forge-declare-release-panel {
  display: grid;
  gap: 10px;
}

.forge-declare-release-title {
  color: var(--text-primary);
  font-weight: 800;
}

.forge-declare-release-title {
  font-size: 1rem;
}

.forge-declare-release-subtitle {
  color: var(--text-primary);
  font-size: 0.84rem;
  font-weight: 800;
}

.forge-sources-hs-detail {
  color: var(--text-muted);
}.forge-empty-diagnostics,
.settings-template-empty,
.source-doc-profile-match,
.source-doc-profile-match__label,
.source-doc-profile-match__title,
.source-doc-profile-match__meta,
.source-doc-review-target,
.source-doc-review-target__label,
.source-doc-review-target__detail {
  min-width: 0;
}

.forge-empty-diagnostics {
  margin-top: 8px;
}

.source-doc-profile-match,
.source-doc-review-target {
  display: grid;
  gap: 4px;
}

.source-doc-profile-match__label,
.source-doc-review-target__label {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.source-doc-profile-match__title {
  color: var(--text-primary);
  font-weight: 800;
}

.source-doc-profile-match__meta,
.source-doc-review-target__detail {
  color: var(--text-secondary);
  font-size: 0.78rem;
}

.forge-workbench-readiness {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px 18px;
  align-items: center;
  width: 100%;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-left-width: 4px;
  border-radius: 8px;
  background: var(--bg-card);
  color: var(--text-primary);
  min-width: 0;
  max-width: 100%;
}

.forge-workbench-readiness * {
  min-width: 0;
}

.forge-workbench-readiness--amber {
  border-left-color: var(--warning);
}

.forge-workbench-readiness--red {
  border-left-color: var(--danger);
}

.forge-workbench-readiness--green {
  border-left-color: var(--success);
}

.forge-workbench-readiness__main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.forge-workbench-readiness__track {
  display: flex;
  grid-column: 1 / -1;
  gap: 12px;
  align-items: start;
  justify-content: space-between;
  min-width: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border-subtle);
}

.forge-workbench-readiness__track-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.forge-workbench-readiness__track-label {
  color: var(--text-primary);
  font-size: 1.02rem;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.forge-workbench-readiness__track-note {
  color: var(--text-secondary);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.forge-workbench-readiness__track-status {
  flex: 0 0 auto;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: 0.75rem;
  font-weight: 800;
}

.forge-workbench-readiness__kicker,
.forge-workbench-readiness__scope {
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.forge-workbench-readiness__label {
  overflow-wrap: anywhere;
  font-size: 1rem;
}

.forge-workbench-readiness__action {
  justify-self: end;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-page);
  color: var(--text-primary);
  font-size: 0.82rem;
  font-weight: 800;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.forge-workbench-readiness__blockers {
  display: grid;
  grid-column: 1 / -1;
  gap: 6px;
}

.forge-workbench-readiness__progress {
  display: grid;
  grid-column: 1 / -1;
  gap: 6px;
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 800;
}

.forge-workbench-readiness__progress-track {
  display: block;
  width: 100%;
  height: 6px;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  background: var(--bg-muted);
  appearance: none;
}

.forge-workbench-readiness__progress-track::-webkit-progress-bar {
  border-radius: inherit;
  background: var(--bg-muted);
}

.forge-workbench-readiness__progress-track::-webkit-progress-value {
  border-radius: inherit;
  background: var(--brand-blue);
}

.forge-workbench-readiness__progress-track::-moz-progress-bar {
  border-radius: inherit;
  background: var(--brand-blue);
}

.forge-workbench-readiness--red .forge-workbench-readiness__progress-track::-webkit-progress-value {
  background: var(--danger);
}

.forge-workbench-readiness--red .forge-workbench-readiness__progress-track::-moz-progress-bar {
  background: var(--danger);
}

.forge-workbench-readiness--amber .forge-workbench-readiness__progress-track::-webkit-progress-value {
  background: var(--warning);
}

.forge-workbench-readiness--amber .forge-workbench-readiness__progress-track::-moz-progress-bar {
  background: var(--warning);
}

.forge-workbench-readiness--green .forge-workbench-readiness__progress-track::-webkit-progress-value {
  background: var(--success);
}

.forge-workbench-readiness--green .forge-workbench-readiness__progress-track::-moz-progress-bar {
  background: var(--success);
}

.forge-workbench-readiness__track-toggle {
  grid-column: 1 / -1;
  padding-top: 2px;
}

.forge-workbench-readiness__blocker {
  display: grid;
  grid-template-columns: minmax(120px, 0.28fr) minmax(0, 1fr);
  gap: 10px;
  align-items: baseline;
  padding-top: 6px;
  border-top: 1px solid var(--border-subtle);
}

.forge-workbench-readiness__blocker span {
  color: var(--text-primary);
  font-size: 0.78rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.forge-workbench-readiness__blocker small {
  color: var(--text-secondary);
  font-size: 0.78rem;
  overflow-wrap: anywhere;
}

.monitoring-source-scan {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-card);
  color: var(--text-primary);
}

.monitoring-source-scan {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.monitoring-source-scan-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.48fr);
  gap: 12px;
  align-items: start;
}

.monitoring-source-scan-head > div,
.monitoring-source-scan-head p {
  min-width: 0;
}

.monitoring-source-scan-head > div {
  display: grid;
  gap: 3px;
}

.monitoring-source-scan-eyebrow {
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.monitoring-source-scan-head strong {
  color: var(--text-primary);
  overflow-wrap: anywhere;
}

.monitoring-source-scan-head span,
.monitoring-source-scan-head p {
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}

.monitoring-source-scan-head p {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
}

.monitoring-source-scan-details {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--border-subtle);
  padding-top: 10px;
}

.monitoring-source-scan-details summary {
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 650;
}

.monitoring-source-scan-details[open] summary {
  color: var(--text-primary);
}

.monitoring-source-scan-counts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.monitoring-source-scan-counts span {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-page);
  color: var(--text-secondary);
  font-size: 0.78rem;
}

.monitoring-source-scan-counts strong {
  color: var(--text-primary);
  font-size: 0.95rem;
}

.monitoring-source-intake {
  display: grid;
  gap: 6px;
}

.monitoring-source-intake-title {
  color: var(--text-primary);
  font-size: var(--text-sm, 0.875rem);
  font-weight: 700;
}

.monitoring-source-intake-table th {
  color: var(--text-muted);
  font-size: var(--text-xs, 0.75rem);
  font-weight: 750;
  text-transform: uppercase;
}

.monitoring-source-intake-table td:first-child {
  color: var(--text-primary);
  font-weight: 650;
}

.monitoring-source-intake-more td {
  color: var(--text-muted);
  font-weight: 650;
}

.monitoring-source-scan-empty {
  width: 100%;
}

.monitoring-impact-matrix-cell {
  display: flex;
  flex-direction: column;
  gap: var(--space-1, 4px);
  align-items: flex-start;
  min-width: 9rem;
  text-align: left;
}

.monitoring-impact-matrix-cell__coverage,
.monitoring-impact-matrix-cell__change {
  font-size: var(--text-xs, 0.75rem);
  line-height: 1.35;
}

.monitoring-impact-matrix__legend {
  color: var(--text-muted);
  margin: 0 0 var(--space-3, 12px);
}

@media (max-width: 720px) {
  .forge-workbench-readiness {
    grid-template-columns: 1fr;
  }

  .forge-workbench-readiness__track {
    display: grid;
  }

  .forge-workbench-readiness__action {
    justify-self: stretch;
  }

  .forge-workbench-readiness__blocker {
    grid-template-columns: 1fr;
  }

  .monitoring-source-scan-head,
  .monitoring-source-scan-counts {
    grid-template-columns: 1fr;
  }
}

/* Temporary Product Dossier prototype. */
.forge-work-surface-full-page {
  min-height: 100vh;
  width: 100%;
  box-sizing: border-box;
  background: var(--bg-page);
  color: var(--text-primary);
  padding: 18px 28px 32px;
}

.forge-work-surface-full-topbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  max-width: 1760px;
  margin: 0 auto 18px;
}

.forge-work-surface-full-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 220px;
}

.forge-work-surface-full-brand strong,
.forge-work-surface-full-brand small {
  display: block;
}

.forge-work-surface-full-brand strong {
  font-size: var(--text-md);
  line-height: 1.2;
}

.forge-work-surface-full-brand small {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}

.forge-work-surface-full-nav {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}

.forge-work-surface-full-nav span {
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: 850;
  padding: 9px 12px;
}

.forge-work-surface-full-nav span:hover {
  border-color: var(--border-subtle);
  background: var(--bg-card);
}

.forge-work-surface-full-nav span.is-active {
  border-color: var(--border);
  background: var(--bg-card);
  color: var(--text-primary);
  box-shadow: var(--shadow-sm);
}

.forge-work-surface-full-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  max-width: 1760px;
  margin: 0 auto 14px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 22px 24px;
}

.forge-work-surface-full-hero--compact {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 16px 20px;
}

.forge-work-surface-full-hero h1 {
  margin: 4px 0 0;
  color: var(--text-primary);
  font-size: 1.85rem;
  line-height: 1.15;
  letter-spacing: 0;
}

.forge-work-surface-full-hero p {
  max-width: 760px;
  margin: 8px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-md);
  line-height: 1.45;
}

.forge-work-surface-full-status {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  min-width: 150px;
}

.forge-work-surface-full-status strong {
  color: var(--text-primary);
  font-size: 1.2rem;
  line-height: 1;
}

.forge-work-surface-full-status span {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
}

.forge-work-surface-full-lanes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  max-width: 1760px;
  margin: 0 auto 14px;
}

.forge-work-surface-obligation-context {
  display: grid;
  grid-template-columns: minmax(260px, 1.4fr) repeat(4, minmax(0, 1fr));
  gap: 1px;
  max-width: 1760px;
  margin: 0 auto 14px;
  overflow: hidden;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--border-subtle);
}

.forge-work-surface-obligation-context > div {
  display: grid;
  gap: 4px;
  background: var(--bg-card);
  padding: 12px 14px;
}

.forge-work-surface-obligation-context span {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 850;
  text-transform: uppercase;
}

.forge-work-surface-obligation-context strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.forge-work-surface-obligation-primary strong {
  font-size: var(--text-md);
}

.forge-work-surface-full-lanes div {
  display: grid;
  gap: 4px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 12px 14px;
}

.forge-work-surface-full-lanes span {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 850;
  text-transform: uppercase;
}

.forge-work-surface-full-lanes strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.forge-work-surface-full-lanes small {
  color: var(--text-secondary);
  font-size: var(--text-xs);
  line-height: 1.35;
}

.forge-work-surface-hierarchy {
  display: grid;
  grid-template-columns: minmax(180px, 0.55fr) minmax(0, 1.45fr);
  gap: 12px;
  min-width: 0;
  max-width: 1760px;
  margin: 0 auto 12px;
}

.forge-work-surface-shared-inputs-label {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 850;
  letter-spacing: 0.04em;
  margin: 0 0 6px;
  text-transform: uppercase;
}

.forge-work-surface-hierarchy-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 10px;
}

.forge-work-surface-hierarchy-group--main {
  background: var(--surface-control-selected);
}

.forge-work-surface-hierarchy-label {
  display: flex;
  align-items: center;
  width: 100%;
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.forge-work-surface-hierarchy-tab {
  display: grid;
  gap: 2px;
  min-width: 132px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: 850;
  padding: 9px 10px;
}

.forge-work-surface-hierarchy-tab--active {
  border-color: var(--border-control-active);
  background: var(--bg-card);
  box-shadow: var(--shadow-sm);
}

.forge-work-surface-hierarchy-tab strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.forge-work-surface-hierarchy-tab small {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 750;
  line-height: 1.25;
}

.forge-work-surface-workstation-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 20px;
  align-items: start;
  max-width: 1760px;
  margin: 0 auto 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 18px 20px;
}

.forge-work-surface-workstation-title {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.forge-work-surface-workstation-title h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 1.35rem;
  line-height: 1.2;
  letter-spacing: 0;
}

.forge-work-surface-workstation-title p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.4;
}

.forge-work-surface-workstation-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.forge-work-surface-release-strip {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid var(--border-subtle);
  padding-top: 12px;
}

.forge-work-surface-release-strip span {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill);
  background: var(--bg-page);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  font-weight: 800;
  padding: 5px 9px;
}

.forge-work-surface-release-strip strong {
  color: var(--text-primary);
}

.forge-work-surface-full-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  max-width: 1760px;
  margin: 0 auto;
}

.forge-work-surface-template {
  width: 100%;
  max-width: 920px;
  min-height: 1120px;
  justify-self: center;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.forge-work-surface-template-head {
  display: grid;
  gap: 10px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-page);
  padding: 30px 34px 24px;
}

.forge-work-surface-template-mark {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.forge-work-surface-template-head h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 1.55rem;
  line-height: 1.2;
  letter-spacing: 0;
}

.forge-work-surface-template-context {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.forge-work-surface-template-context span {
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  font-weight: 800;
  padding: 4px 8px;
}

.forge-work-surface-template-section {
  display: grid;
  gap: 14px;
  padding: 26px 34px;
}

.forge-work-surface-template-section + .forge-work-surface-template-section {
  border-top: 1px solid var(--border-subtle);
}

.forge-work-surface-template-section h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 1rem;
  letter-spacing: 0;
}

.forge-work-surface-template-section p {
  max-width: 72ch;
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.65;
}

.forge-work-surface-template-gap {
  border: 1px solid var(--border-amber);
  border-radius: 8px;
  background: var(--tint-amber);
  padding: 10px 12px;
}

.forge-work-surface-template-fields {
  display: grid;
  gap: 8px;
  margin: 0;
}

.forge-work-surface-template-field {
  display: grid;
  grid-template-columns: minmax(120px, 0.75fr) minmax(180px, 1fr) minmax(140px, 0.9fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
  padding: 10px 12px;
}

.forge-work-surface-template-field,
.forge-work-surface-template-section[data-detail-target] {
  outline: none;
  transition:
    border-color var(--motion-fast),
    background var(--motion-fast),
    box-shadow var(--motion-fast);
}

.forge-work-surface-template-field:hover,
.forge-work-surface-template-field:focus-visible,
.forge-work-surface-template-section[data-detail-target]:hover,
.forge-work-surface-template-section[data-detail-target]:focus-visible {
  border-color: var(--border-control-active);
  background: var(--bg-card);
  box-shadow: inset 3px 0 0 var(--accent-attention);
}

.forge-work-surface-template-field dt,
.forge-work-surface-template-field small {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
}

.forge-work-surface-template-field dd {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 850;
}

.forge-work-surface-template-section--sign {
  grid-template-columns: 1fr 1fr;
}

.forge-work-surface-template-section--sign h3 {
  grid-column: 1 / -1;
}

.forge-work-surface-signature-line {
  display: grid;
  gap: 18px;
  border-top: 1px solid var(--border);
  padding-top: 8px;
}

.forge-work-surface-signature-line span {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
}

.forge-work-surface-signature-line strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.forge-work-surface-full-workspace .forge-work-surface-map,
.forge-work-surface-full-workspace .forge-work-surface-evidence {
  position: sticky;
  top: 16px;
}

.forge-work-surface-prototype {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.forge-work-surface-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
  padding: 16px;
}

.forge-work-surface-eyebrow,
.forge-work-surface-document-eyebrow,
.forge-work-surface-panel-kicker {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.forge-work-surface-hero h1,
.forge-work-surface-document-banner h2,
.forge-work-surface-panel-top h3,
.forge-work-surface-document-section h3 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: 0;
}

.forge-work-surface-hero h1 {
  margin-top: 4px;
  font-size: 1.35rem;
}

.forge-work-surface-hero p,
.forge-work-surface-document-banner p,
.forge-work-surface-panel-top p,
.forge-work-surface-document-section p {
  margin: 4px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.45;
}

.forge-work-surface-readiness {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  min-width: 110px;
}

.forge-work-surface-readiness strong {
  color: var(--text-primary);
  font-size: 1.6rem;
  line-height: 1;
}

.forge-work-surface-readiness span {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 700;
}

.forge-work-surface-flow,
.forge-work-surface-summary {
  display: grid;
  gap: 8px;
}

.forge-work-surface-flow {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.forge-work-surface-flow span {
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: 800;
  padding: 10px 12px;
  text-align: center;
}

.forge-work-surface-flow span.is-active {
  border-color: var(--border-control-active);
  background: var(--surface-control-selected);
  color: var(--text-primary);
}

.forge-work-surface-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.forge-work-surface-summary div {
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
  padding: 12px;
}

.forge-work-surface-summary strong {
  display: block;
  color: var(--text-primary);
  font-size: 1.1rem;
}

.forge-work-surface-summary span {
  color: var(--text-secondary);
  font-size: var(--text-sm);
}

.forge-work-surface-layout {
  display: grid;
  grid-template-columns: minmax(180px, 0.7fr) minmax(420px, 1.85fr) minmax(240px, 0.85fr);
  gap: 14px;
  align-items: start;
  min-width: 0;
}

.forge-work-surface-document-workspace {
  display: grid;
  grid-template-columns: minmax(560px, 1fr) minmax(260px, 0.32fr);
  gap: 14px;
  align-items: start;
  min-width: 0;
}

.forge-work-surface-map,
.forge-work-surface-document,
.forge-work-surface-evidence {
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
  min-width: 0;
}

.forge-work-surface-map {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 10px;
}

.forge-work-surface-map-group {
  display: grid;
  gap: 6px;
}

.forge-work-surface-map-group-title {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 850;
  letter-spacing: 0.04em;
  padding: 2px 4px;
  text-transform: uppercase;
}

.forge-work-surface-map-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  padding: 10px;
  text-align: left;
}

.forge-work-surface-map-item:hover,
.forge-work-surface-map-item--selected {
  border-color: var(--border);
  background: var(--bg-card);
}

.forge-work-surface-map-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.forge-work-surface-map-label {
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 800;
}

.forge-work-surface-map-detail {
  color: var(--text-muted);
  font-size: var(--text-xs);
  line-height: 1.35;
}

.forge-work-surface-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  background: var(--bg-card);
  color: var(--text-secondary);
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1.1;
  min-height: 22px;
  padding: 3px 8px;
  white-space: nowrap;
}

.forge-work-surface-pill--green {
  border-color: var(--border-green);
  background: var(--tint-green);
}

.forge-work-surface-pill--amber {
  border-color: var(--border-amber);
  background: var(--tint-amber);
}

.forge-work-surface-pill--red {
  border-color: var(--border-danger);
  background: var(--tint-red);
}

.forge-work-surface-document {
  overflow: hidden;
}

.forge-work-surface-document-banner {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-card);
  padding: 18px;
}

.forge-work-surface-document-status {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-content: flex-start;
  justify-content: flex-end;
}

.forge-work-surface-document-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px;
}

.forge-work-surface-document-section + .forge-work-surface-document-section {
  border-top: 1px solid var(--border-subtle);
}

.forge-work-surface-fact-row {
  display: grid;
  grid-template-columns: minmax(82px, 0.65fr) minmax(120px, 1fr) minmax(116px, 0.95fr) minmax(86px, auto);
  gap: 8px;
  align-items: center;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 10px;
}

.forge-work-surface-fact-state {
  justify-self: end;
  min-width: max-content;
}

.forge-work-surface-fact-label,
.forge-work-surface-fact-source {
  display: grid;
  gap: 2px;
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 700;
}

.forge-work-surface-fact-source small {
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 750;
  line-height: 1.2;
}

.forge-work-surface-fact-value {
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 800;
}

.forge-work-surface-fact-value--missing {
  color: var(--text-primary);
}

.forge-work-surface-blocker,
.forge-work-surface-evidence-item {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--tint-amber);
  color: var(--text-primary);
  font-size: var(--text-sm);
  padding: 10px;
}

.forge-work-surface-evidence-item--red {
  border-color: var(--border-danger);
  background: var(--tint-red);
}

.forge-work-surface-icon {
  flex: none;
  font-size: 18px;
}

.forge-work-surface-evidence {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px;
}

.forge-work-surface-details {
  min-height: 0;
  opacity: 0.74;
}

.forge-work-surface-full-workspace:has([data-detail-target]:hover) .forge-work-surface-details,
.forge-work-surface-full-workspace:has([data-detail-target]:focus-visible) .forge-work-surface-details,
.forge-work-surface-full-workspace.is-detail-active .forge-work-surface-details,
.forge-work-surface-full-workspace[data-pinned-detail] .forge-work-surface-details {
  opacity: 1;
}

.forge-work-surface-panel-top h3 {
  margin-top: 4px;
  font-size: 1rem;
}

.forge-work-surface-detail-card {
  display: none;
  flex-direction: column;
  gap: 16px;
}

.forge-work-surface-detail-card--default {
  display: flex;
}

.forge-work-surface-detail-placeholder {
  display: grid;
  gap: 4px;
  border: 1px dashed var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  color: var(--text-secondary);
  padding: 12px;
}

.forge-work-surface-detail-placeholder strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.forge-work-surface-detail-placeholder span {
  font-size: var(--text-xs);
  line-height: 1.35;
}

.forge-work-surface-full-workspace:has([data-detail-target]:hover) .forge-work-surface-detail-card,
.forge-work-surface-full-workspace:has([data-detail-target]:focus-visible) .forge-work-surface-detail-card,
.forge-work-surface-full-workspace:has([data-detail-target]:focus-within) .forge-work-surface-detail-card,
.forge-work-surface-full-workspace.is-detail-active .forge-work-surface-detail-card,
.forge-work-surface-full-workspace[data-pinned-detail] .forge-work-surface-detail-card {
  display: none;
}

.forge-work-surface-full-workspace:has([data-detail-target="product"]:hover) .forge-work-surface-detail-card--product,
.forge-work-surface-full-workspace:has([data-detail-target="product"]:focus-visible) .forge-work-surface-detail-card--product,
.forge-work-surface-full-workspace:has([data-detail-target="product"]:focus-within) .forge-work-surface-detail-card--product,
.forge-work-surface-full-workspace:has([data-detail-target="model"]:hover) .forge-work-surface-detail-card--model,
.forge-work-surface-full-workspace:has([data-detail-target="model"]:focus-visible) .forge-work-surface-detail-card--model,
.forge-work-surface-full-workspace:has([data-detail-target="model"]:focus-within) .forge-work-surface-detail-card--model,
.forge-work-surface-full-workspace:has([data-detail-target="serial-range"]:hover) .forge-work-surface-detail-card--serial-range,
.forge-work-surface-full-workspace:has([data-detail-target="serial-range"]:focus-visible) .forge-work-surface-detail-card--serial-range,
.forge-work-surface-full-workspace:has([data-detail-target="serial-range"]:focus-within) .forge-work-surface-detail-card--serial-range,
.forge-work-surface-full-workspace:has([data-detail-target="manufacturer"]:hover) .forge-work-surface-detail-card--manufacturer,
.forge-work-surface-full-workspace:has([data-detail-target="manufacturer"]:focus-visible) .forge-work-surface-detail-card--manufacturer,
.forge-work-surface-full-workspace:has([data-detail-target="manufacturer"]:focus-within) .forge-work-surface-detail-card--manufacturer,
.forge-work-surface-full-workspace:has([data-detail-target="address"]:hover) .forge-work-surface-detail-card--address,
.forge-work-surface-full-workspace:has([data-detail-target="address"]:focus-visible) .forge-work-surface-detail-card--address,
.forge-work-surface-full-workspace:has([data-detail-target="address"]:focus-within) .forge-work-surface-detail-card--address,
.forge-work-surface-full-workspace:has([data-detail-target="declaration-statement"]:hover) .forge-work-surface-detail-card--declaration-statement,
.forge-work-surface-full-workspace:has([data-detail-target="declaration-statement"]:focus-visible) .forge-work-surface-detail-card--declaration-statement,
.forge-work-surface-full-workspace:has([data-detail-target="declaration-statement"]:focus-within) .forge-work-surface-detail-card--declaration-statement,
.forge-work-surface-full-workspace .forge-work-surface-detail-card.is-active {
  display: flex;
}

.forge-work-surface-detail-topline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
  align-items: center;
  border-bottom: 1px solid var(--border-subtle);
  padding-bottom: 12px;
}

.forge-work-surface-detail-topline span {
  grid-column: 1 / -1;
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.forge-work-surface-detail-topline strong {
  color: var(--text-primary);
  font-size: 1.05rem;
  line-height: 1.2;
}

.forge-work-surface-scope-link {
  color: var(--brand-info);
  font-weight: 750;
  text-decoration: underline;
}

.forge-work-surface-requirement-review {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 10px;
}

.forge-work-surface-evidence-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.forge-work-surface-resolver {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 10px;
}

.forge-work-surface-choice-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  padding: 8px;
}

.forge-work-surface-choice-row--selected {
  border-color: var(--border-control-active);
  background: var(--surface-control-selected);
}

.forge-data-table tbody tr.is-selected {
  border-color: var(--border-control-active);
  background: var(--surface-control-selected);
}

.forge-work-surface-fact-row.is-selected {
  border-color: var(--border-control-active);
  background: var(--surface-control-selected);
}

.forge-work-surface-choice-row strong {
  color: var(--text-primary);
  font-size: var(--text-xs);
  text-align: right;
}

.forge-work-surface-obligation-card {
  display: grid;
  gap: 4px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--tint-blue);
  padding: 10px;
}

.forge-work-surface-obligation-card strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.forge-work-surface-obligation-card span {
  color: var(--text-secondary);
  font-size: var(--text-xs);
  line-height: 1.35;
}

.forge-work-surface-evidence-label {
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.forge-work-surface-route-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: var(--text-sm);
  padding: 8px 0;
}

.forge-work-surface-route-row strong {
  color: var(--text-primary);
  font-size: var(--text-xs);
}

.forge-work-surface-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.forge-work-surface-ai-actions {
  display: grid;
  gap: 8px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-card);
  padding: 10px;
}

.forge-work-surface-action-row {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}

.forge-work-surface-action-row small {
  max-width: 24ch;
  color: var(--text-muted);
  font-size: var(--text-xs);
  line-height: 1.25;
}

@media (max-width: 1100px) {
  .forge-work-surface-full-workspace,
  .forge-work-surface-layout,
  .forge-work-surface-hierarchy,
  .forge-work-surface-document-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .forge-work-surface-workstation-head {
    grid-template-columns: 1fr;
  }

  .forge-work-surface-workstation-actions {
    justify-content: flex-start;
  }

  .forge-work-surface-full-workspace .forge-work-surface-map,
  .forge-work-surface-full-workspace .forge-work-surface-evidence {
    position: static;
  }

  .forge-work-surface-details {
    min-height: 0;
  }

  .forge-work-surface-full-lanes,
  .forge-work-surface-obligation-context,
  .forge-work-surface-map {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 700px) {
  .forge-work-surface-prototype,
  .forge-work-surface-obligation-context,
  .forge-work-surface-summary,
  .forge-work-surface-layout,
  .forge-work-surface-document,
  .forge-work-surface-evidence {
    max-width: 100%;
    min-width: 0;
  }

  .forge-work-surface-hierarchy-tab {
    min-width: 0;
    width: 100%;
  }

  .forge-work-surface-fact-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .forge-work-surface-fact-state {
    justify-self: start;
  }

  .forge-work-surface-map-item,
  .forge-work-surface-document-banner,
  .forge-work-surface-route-row,
  .forge-work-surface-choice-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .forge-work-surface-pill {
    white-space: normal;
  }
}

@media (max-width: 720px) {
  .forge-work-surface-full-page {
    padding: 12px;
  }

  .forge-work-surface-full-topbar,
  .forge-work-surface-full-hero {
    grid-template-columns: 1fr;
  }

  .forge-work-surface-full-nav {
    justify-content: flex-start;
    overflow-x: auto;
  }

  .forge-work-surface-full-status {
    align-items: flex-start;
  }

  .forge-work-surface-full-lanes,
  .forge-work-surface-obligation-context,
  .forge-work-surface-choice-row,
  .forge-work-surface-template-field,
  .forge-work-surface-template-section--sign,
  .forge-work-surface-hero,
  .forge-work-surface-document-banner {
    display: grid;
    grid-template-columns: 1fr;
  }

  .forge-work-surface-readiness {
    align-items: flex-start;
  }

  .forge-work-surface-flow,
  .forge-work-surface-summary,
  .forge-work-surface-map,
  .forge-work-surface-fact-row {
    grid-template-columns: 1fr;
  }
}
.assessment-rationale {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
  margin: 8px 0 12px;
  background: var(--color-white);
}

.assessment-rationale__meta {
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 4px;
}

.assessment-rationale__recommendation {
  font-size: 15px;
  line-height: 1.3;
  margin: 0 0 6px;
  font-weight: 700;
}

.assessment-rationale__summary {
  margin: 0 0 8px;
}

.assessment-rationale__top-answer {
  color: var(--text-primary);
  font-weight: 650;
  margin: 0 0 6px;
}

.assessment-rationale__answer {
  color: var(--text-primary);
  margin: 8px 0 0;
}

.assessment-rationale__coverage {
  margin: 10px 0 6px;
}

.assessment-rationale__section + .assessment-rationale__section {
  margin-top: 12px;
}

.assessment-rationale__empty {
  color: var(--text-secondary);
  margin: 4px 0 0;
}

.assessment-rationale__coverage-grid {
  border: 1px solid var(--border);
  border-radius: 8px;
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(120px, max-content) minmax(72px, max-content);
  overflow: hidden;
}

.assessment-rationale__coverage-grid > * {
  border-top: 1px solid var(--border);
  padding: 6px 8px;
}

.assessment-rationale__coverage-grid > :nth-child(-n + 3) {
  border-top: 0;
}

.assessment-rationale__coverage-head {
  background: var(--surface-muted);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
}

.assessment-rationale__coverage-row {
  display: contents;
}

.assessment-rationale__coverage-criterion {
  color: var(--text-primary);
  font-weight: 600;
}

.assessment-rationale__point {
  border-top: 1px solid var(--border);
  padding: 8px 0;
}

.assessment-rationale__point summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.assessment-rationale__point-title {
  flex: 1;
  font-weight: 600;
}

.assessment-rationale__point-result,
.assessment-rationale__point-badge {
  color: var(--text-muted);
  font-size: 12px;
}

.assessment-rationale__basis h6,
.assessment-rationale__blockers h6 {
  font-size: 12px;
  margin: 8px 0 4px;
}

.assessment-rationale__basis ul,
.assessment-rationale__blockers ul {
  margin: 0;
  padding-left: 18px;
}

.assessment-rationale__effect {
  color: var(--text-muted);
  margin: 8px 0 0;
}

.assessment-rationale__details,
.assessment-rationale__technical {
  border-top: 1px solid var(--border);
  margin-top: 4px;
  padding-top: 8px;
}

.assessment-rationale__details > summary,
.assessment-rationale__technical > summary {
  color: var(--text-muted);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}

.assessment-rationale__technical dl {
  display: grid;
  gap: 4px 10px;
  grid-template-columns: minmax(120px, max-content) 1fr;
  margin: 8px 0 0;
}

.assessment-rationale__technical dt {
  color: var(--text-muted);
  font-weight: 600;
}

.assessment-rationale__technical dd {
  margin: 0;
}

@media (max-width: 720px) {
  .assessment-rationale__coverage-grid {
    grid-template-columns: minmax(0, 1fr) minmax(80px, max-content) minmax(64px, max-content);
  }
}

/* Plan 3559: AgentOps dashboard chrome moved out of a per-view <style> block. */
.agentops-shell {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.agentops-toolbar {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 0.85rem;
  color: var(--text-secondary);
}
.agentops-toolbar select {
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  padding: 5px 8px;
  margin-left: 6px;
  background: var(--surface-primary);
  color: var(--text-primary);
}
.agentops-agent {
  font-weight: 700;
  color: var(--text-primary);
}
.agentops-sub {
  color: var(--text-secondary);
  font-size: 0.78rem;
  margin-top: 2px;
}
.agentops-chip {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 0.76rem;
  font-weight: 650;
  background: var(--tint-slate);
  color: var(--text-secondary);
  white-space: nowrap;
}
.agentops-chip--green {
  background: var(--status-green-bg);
  color: var(--status-green-text);
}
.agentops-chip--amber {
  background: var(--status-amber-bg);
  color: var(--status-amber-text);
}
.agentops-chip--red {
  background: var(--status-red-bg);
  color: var(--status-red-text);
}
.agentops-metric {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Plan 3559: Monitoring impact regulation name, previously inline. */
.impact-reg-name {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 0.86rem;
}

/* Plan 3576 — command palette mount root (was inline display:none) */
.forge-cmdk-root {
  display: none;
}

.monitoring-authority-draft-actions {
  width: 100%;
}

.monitoring-authority-draft-actions__row {
  align-items: center;
  gap: 8px;
}

.monitoring-authority-draft-actions__name,
.forge-activity-event-actor,
.settings-track-row__source-note {
  color: var(--text-secondary);
}

.forge-activity-event-time {
  color: var(--text-muted);
  font-size: 0.84rem;
}

.forge-activity-load-more,
.settings-track-draft {
  margin-top: 8px;
}

.forge-dyn-color { color: var(--forge-dyn-fg); }
.forge-dyn-bg { background: var(--forge-dyn-fill); }
.forge-dyn-border-color { border-color: var(--forge-dyn-stroke); }
.top-risks-evt-trend { font-size: 0.9rem; font-weight: 700; }
.cat-card-trend { display: inline-flex; font-size: 0.72rem; font-weight: 700; border-radius: 4px; padding: 1px 6px; }
.category-heatmap-tile__name { color: var(--forge-dyn-fg); font-size: 0.78rem; font-weight: 700; }
.stage-kpi-strip { --forge-dyn-columns: 1; display: grid; grid-template-columns: repeat(var(--forge-dyn-columns), minmax(0, 1fr)); margin: 0; }
.forge-conn-galaxy-legend-item { display: flex; align-items: center; gap: 5px; font-size: 0.72rem; }
.forge-conn-galaxy-marker { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.forge-conn-galaxy-marker--active { background: var(--brand-green); }
.forge-conn-galaxy-marker--inactive { background: var(--brand-amber); }
.forge-conn-galaxy-marker--disconnected { background: var(--border-subtle); border: 1px solid var(--text-muted); }
.forge-invite-form {
  width: min(100%, 35rem);
  margin: var(--space-8) auto 0;
  padding: 0 var(--space-4);
  gap: var(--space-4);
}

/* Plan 3796 extracted visual styles */




























































































































































































/* Plan 3796: owned selectors for feature semantic classes */
.forge-data-table__cell { vertical-align: top; }
.forge-table-selection__cell { padding: 10px 8px 10px 12px; text-align: left; width: 42px; }
.forge-status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--forge-dyn-fill); }
.forge-conn-note { font-size: 0.75rem; color: var(--forge-dyn-fg); }
.forge-conn-note--sm { font-size: 0.72rem; color: var(--forge-dyn-fg); }
.forge-eco-panel-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-muted);
  font-size: 1.1rem;
  line-height: 1;
  padding: 4px 6px;
}
.forge-eco-product-link {
  display: block;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-subtle);
  margin-bottom: 6px;
  text-decoration: none;
  color: var(--text-primary);
  font-size: 0.8rem;
}
.forge-portfolio-review-link {
  display: flex;
  align-items: center;
  padding: 10px 16px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--brand-blue);
  text-decoration: none;
  white-space: nowrap;
  border-left: 1px solid var(--border);
}
.forge-impact-matrix-th {
  text-align: center;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
  padding: 8px;
  background: var(--tint-slate);
  border-bottom: 1px solid var(--border-cool);
}
.forge-impact-matrix-th--reg { text-align: left; padding: 8px 12px; }
.impact-matrix-col-name { font-weight: 700; color: var(--text-primary); text-transform: none; font-size: 0.82rem; letter-spacing: normal; }
.forge-ps-draft-fallback { color: var(--brand-amber-text); background: var(--tint-amber); border-bottom: 1px solid var(--brand-amber-bright); }
.forge-ps-banner-card { padding: 14px 18px; margin: 10px 0 6px 0; border-left: 4px solid var(--text-secondary); background: var(--tint-slate); }
.forge-status-cell { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.forge-regulation-open-link {
  border: 1px solid var(--brand-blue);
  border-radius: 6px;
  padding: 8px 12px;
  color: var(--brand-blue);
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.forge-ps-env-meta-row { padding: 16px 20px; border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 32px; }
.forge-galaxy-fallback { color: var(--text-muted); text-align: center; padding: 80px 20px; font-size: 0.875rem; }
.progress-bar .fill { height: 6px; }
.forge-eco-products-link {
  display: block;
  margin-top: 12px;
  text-align: center;
  font-size: 0.8rem;
  color: var(--accent);
  text-decoration: none;
  padding: 8px;
}
.forge-activity-event-name { font-weight: 650; color: var(--text-primary); }
.forge-ai-review-cta { display: inline-flex; }
.forge-back-link { color: var(--text-secondary); text-decoration: none; }
.forge-badge--slate { background: var(--surface-muted); color: var(--text-secondary); }
.forge-callout { border: 1px solid var(--border-subtle); border-radius: var(--radius-md); padding: 12px 14px; }
.forge-callout--warning { border-color: var(--text-primary); background: var(--tint-amber); }
.forge-cert-settings { display: grid; gap: 12px; }
.forge-chip { display: inline-flex; align-items: center; border-radius: 999px; padding: 2px 8px; font-size: 0.75rem; }
.forge-chip--info { background: var(--tint-blue); color: var(--text-primary); }
.forge-col-info { color: var(--text-secondary); }
.forge-conn-intake-link { color: var(--brand-blue); text-decoration: none; }
.forge-conn-note--error { color: var(--text-primary); }
.forge-declare-step-area { display: grid; gap: 12px; }
.forge-disclaimer-banner { color: var(--text-secondary); }
.forge-exec-bulk-bar { display: flex; align-items: center; gap: 8px; }
.forge-exec-deadline { color: var(--text-muted); font-size: 0.82rem; }
.forge-exec-fill { background: var(--brand-blue); }
.forge-exec-matrix-cell { text-align: center; }
.forge-exec-overflow-action { display: block; width: 100%; }
.forge-exec-overflow-menu { position: relative; }
.forge-extraction-validation { display: grid; gap: 8px; }
.forge-field-row-chevron { color: var(--text-muted); }
.forge-inbox-action { display: inline-flex; }
.forge-module-dot { width: 8px; height: 8px; border-radius: 50%; }
.forge-module-matrix-corner { color: var(--text-muted); }
.forge-pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 2px 8px; }
.forge-preconditions-eyebrow { font-size: 0.72rem; text-transform: uppercase; color: var(--text-muted); font-weight: 800; }
.forge-preconditions-filled-conf { color: var(--text-muted); }
.forge-preconditions-filled-item { display: grid; gap: 2px; }
.forge-preconditions-filled-list { display: grid; gap: 8px; }
.forge-preconditions-filled-name { font-weight: 650; }
.forge-preconditions-filled-section { display: grid; gap: 8px; }
.forge-preconditions-filled-source { color: var(--text-secondary); }
.forge-preconditions-filled-value { color: var(--text-primary); }
.forge-preconditions-footer { display: flex; gap: 8px; }
.forge-preconditions-footer-secondary { color: var(--text-secondary); }
.forge-preconditions-footer-summary { color: var(--text-secondary); }
.forge-preconditions-head { display: flex; justify-content: space-between; gap: 12px; }
.forge-preconditions-head-title { margin: 0; font-size: 1.1rem; color: var(--text-primary); }
.forge-preconditions-head-titlebar { display: flex; align-items: center; gap: 8px; }
.forge-preconditions-held-icon { color: var(--brand-amber-text); }
.forge-preconditions-held-item { display: grid; gap: 2px; }
.forge-preconditions-held-list { display: grid; gap: 8px; }
.forge-preconditions-held-name { font-weight: 650; }
.forge-preconditions-held-reason { color: var(--text-secondary); }
.forge-preconditions-held-section { display: grid; gap: 8px; }
.forge-preconditions-held-text { color: var(--text-secondary); }
.forge-preconditions-overlay { display: grid; gap: 16px; }
.forge-preconditions-pulse { animation: fade-in var(--motion-slow) both; }
.forge-preconditions-ring { display: grid; place-items: center; }
.forge-preconditions-ring-label { font-size: 0.78rem; color: var(--text-muted); }
.forge-preconditions-ring-svg { width: 72px; height: 72px; }
.forge-preconditions-section-head { font-size: 0.78rem; text-transform: uppercase; color: var(--text-muted); font-weight: 800; }
.forge-preconditions-status { color: var(--text-secondary); }
.forge-presign-blockers { display: grid; gap: 8px; }
.forge-presign-metrics { display: grid; gap: 8px; }
.forge-presign-summary { display: grid; gap: 8px; }
.forge-presign-why { color: var(--text-secondary); }
.forge-product-picker-bulk-bar { display: flex; align-items: center; gap: 8px; }
.forge-product-readiness-kpi { display: grid; gap: 4px; }
.forge-product-settings-surface { display: grid; gap: 12px; }
.forge-ps-inbox-meta { color: var(--text-muted); font-size: 0.82rem; }
.forge-ps-stale-regen--warning { color: var(--brand-amber-text); }
.forge-queue-progress { display: flex; align-items: center; gap: 8px; }
.forge-regulatory-classification-needed { display: grid; gap: 8px; }
.forge-regulatory-classification-option { display: flex; gap: 8px; }
.forge-requirement-blocker-list { display: grid; gap: 8px; }
.forge-requirement-declare-gate { display: grid; gap: 8px; }
.forge-scope-driver-reason { color: var(--text-secondary); }
.forge-scope-human-decision { display: grid; gap: 8px; }
.forge-scope-human-decision--pending { border-color: var(--text-primary); }
.forge-signing-queue { display: grid; gap: 8px; }
.forge-since-item--change { border-left: 3px solid var(--brand-blue); }
.forge-since-item--reg { border-left: 3px solid var(--brand-amber-bright); }
.forge-source-identity-assign-btn { display: inline-flex; }
.forge-source-identity-reassign { display: inline-flex; }
.forge-source-slot--identity-conflict { border-color: var(--text-primary); }
.forge-source-slot__badge { display: inline-flex; }
.forge-source-slot__badge--warning { background: var(--tint-amber); }
.forge-source-slot__icon { color: var(--text-muted); }
.forge-source-slot__label { color: var(--text-secondary); }
.forge-source-slot__link { color: var(--brand-blue); text-decoration: none; }
.forge-source-summary { color: var(--text-secondary); }
.forge-supplier-validate-extract { display: grid; gap: 8px; }
.forge-supplier-validate-gates { display: grid; gap: 8px; }
.forge-tab-overview { display: grid; gap: 12px; }
.monitoring-authority-row-action { display: inline-flex; }
.monitoring-interpretations-section { display: grid; gap: 8px; }
.regulation-cb { display: inline-flex; }
.regulation-library-stage-tabs { display: flex; gap: 8px; }
.regulation-option { display: flex; gap: 8px; align-items: flex-start; }
.regulation-option__check { margin-top: 2px; }
.regulation-option__desc { color: var(--text-secondary); }
.regulation-option__label { font-weight: 650; }
.settings-track-row__diagnostics { display: flex; gap: 8px; flex-wrap: wrap; }
.settings-track-row__diagnostics-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.source-doc-audit-event__body { color: var(--text-secondary); }
.source-doc-audit-filter--search { min-width: 220px; }
.source-doc-audit-tab { display: grid; gap: 12px; }
.source-doc-authority-actors { color: var(--text-secondary); }
.source-doc-bundle-review-actions { display: flex; gap: 8px; }
.source-doc-fact-row { display: grid; gap: 4px; }
.source-doc-overview-card--bundle { border-color: var(--border); }
.source-doc-review-name { font-weight: 650; }
.source-doc-understanding-summary { color: var(--text-secondary); }




/* Plan 3796 split-line styles */

/* Readable component styles migrated from the retired visual hash classes. */
.forge-ui-align-center-p-2rem { text-align:center; padding:2rem; }
.forge-ui-bg-bg-card-border-1px-solid-border-radius-10px-p-16px-20px { background:var(--bg-card); border:1px solid var(--border); border-radius:10px; padding:16px 20px; }
.forge-ui-bg-bg-card-border-1px-solid-border-radius-10px-p-18px-20px-display-flex { background:var(--bg-card); border:1px solid var(--border); border-radius:10px; padding:18px 20px; display:flex; }
.forge-ui-bg-none-border-none-text-brand-red-p-4px { background:none; border:none; color:var(--text-primary); padding:4px; }
.forge-ui-bg-text-muted { background:var(--text-muted); }
.forge-ui-bg-tint-amber-text-brand-amber-text-p-1px-7px-weight-700 { background:var(--tint-amber); color:var(--brand-amber-text); padding:1px 7px; font-weight:700; }
.forge-ui-bg-tint-blue-border-1-5px-solid-brand-blue { background:var(--tint-blue); border:1.5px solid var(--brand-blue); }
.forge-ui-bg-tint-green-border-1-5px-solid-brand-green { background:var(--tint-green); border:1.5px solid var(--brand-green); }
.forge-ui-bg-tint-red-border-1px-solid-brand-red { background:var(--tint-red); border:1px solid var(--brand-red); }
.forge-ui-bg-tint-slate { background:var(--tint-slate); }
.forge-ui-border-1px-solid-border-p-5px-8px-bg-bg-card-text-text-primary { border:1px solid var(--border); padding:5px 8px; background:var(--bg-card); color:var(--text-primary); }
.forge-ui-border-1px-solid-border-subtle-radius-6px-p-10px-12px-bg-bg-card { border:1px solid var(--border-subtle); border-radius:6px; padding:10px 12px; background:var(--bg-card); }
.forge-ui-border-1px-solid-border-subtle-radius-6px-p-10px-12px-bg-bg-card-text-text-primary { border:1px solid var(--border-subtle); border-radius:6px; padding:10px 12px; background:var(--bg-card); color:var(--text-primary); }
.forge-ui-border-1px-solid-border-subtle-radius-6px-p-10px-bg-bg-surface { border:1px solid var(--border-subtle); border-radius:6px; padding:10px; background:var(--bg-surface); }
.forge-ui-border-1px-solid-border-subtle-radius-6px-p-12px-14px-bg-bg-surface-font-0-88rem-text-text-secondary { border:1px solid var(--border-subtle); border-radius:6px; padding:12px 14px; background:var(--bg-surface); font-size:0.88rem; color:var(--text-secondary); }
.forge-ui-border-1px-solid-border-subtle-radius-6px-p-12px-bg-bg-card { border:1px solid var(--border-subtle); border-radius:6px; padding:12px; background:var(--bg-card); }
.forge-ui-border-1px-solid-border-subtle-radius-999px-p-3px-9px-bg-bg-surface-font-0-76rem-text-text-secondary { border:1px solid var(--border-subtle); border-radius:999px; padding:3px 9px; background:var(--bg-surface); font-size:0.76rem; color:var(--text-secondary); }
.forge-ui-border-1px-solid-border-subtle-radius-999px-p-3px-9px-bg-bg-surface-font-0-78rem { border:1px solid var(--border-subtle); border-radius:999px; padding:3px 9px; background:var(--bg-surface); font-size:0.78rem; }
.forge-ui-border-color-border-subtle-bg-surface-muted { border-color:var(--border-subtle); background:var(--surface-muted); }
.forge-ui-border-color-brand-amber-bright-bg-tint-amber-text-brand-amber-text { border-color:var(--text-primary); background:var(--tint-amber); color:var(--brand-amber-text); }
.forge-ui-border-forge-dyn-border { border: var(--forge-dyn-border); }
.forge-ui-border-none-bg-bg-card { border:none; background:var(--bg-card); }
.forge-ui-border-top-1px-solid-border { border-top:1px solid var(--border); }
.forge-ui-border-top-1px-solid-border-subtle-p-16px-0-display-grid { border-top:1px solid var(--border-subtle); padding:16px 0; display:grid; }
.forge-ui-display-block { display:block; }
.forge-ui-display-flex { display:flex; }
.forge-ui-display-flex-font-0-65rem-text-text-secondary { display:flex; font-size:0.65rem; color:var(--text-secondary); }
.forge-ui-display-flex-font-0-78rem { display:flex; font-size:0.78rem; }
.forge-ui-display-flex-font-0-78rem-text-text-muted { display:flex; font-size:0.78rem; color:var(--text-muted); }
.forge-ui-display-flex-m-0-p-6px-0 { display:flex; margin:0; padding:6px 0; }
.forge-ui-display-flex-mb-12px { display:flex; margin-bottom:12px; }
.forge-ui-display-flex-mt-4px { display:flex; margin-top:4px; }
.forge-ui-display-flex-p-8px-0 { display:flex; padding:8px 0; }
.forge-ui-display-grid { display:grid; }
.forge-ui-display-grid-columns-repeat-auto-fill-minmax-150px-1fr { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
.forge-ui-display-grid-columns-repeat-auto-fit-minmax-170px-1fr { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); }
.forge-ui-display-grid-columns-repeat-auto-fit-minmax-180px-1fr { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.forge-ui-display-grid-columns-repeat-auto-fit-minmax-200px-1fr-mt-12px { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); margin-top:12px; }
.forge-ui-display-grid-mt-18px { display:grid; margin-top:18px; }
.forge-ui-display-inline-block-bg-text-muted-radius-1px { display:inline-block; background:var(--text-muted); border-radius:1px; }
.forge-ui-display-inline-block-font-0-68rem-weight-700-text-text-secondary-bg-bg-page-border-1px-solid-border-radius-999px-p-1px-7px { display:inline-block; font-size:0.68rem; font-weight:700; color:var(--text-secondary); background:var(--bg-page); border:1px solid var(--border); border-radius:999px; padding:1px 7px; }
.forge-ui-display-inline-block-font-0-72rem-text-text-secondary-bg-bg-page-border-1px-solid-border-radius-999px-p-2px-8px-m-0-4px-4px-0 { display:inline-block; font-size:0.72rem; color:var(--text-secondary); background:var(--bg-page); border:1px solid var(--border); border-radius:999px; padding:2px 8px; margin:0 4px 4px 0; }
.forge-ui-display-inline-block-mr-6px-mb-6px { display:inline-block; margin-right:6px; margin-bottom:6px; }
.forge-ui-display-inline-flex { display:inline-flex; }
.forge-ui-display-inline-flex-font-0-82rem-text-text-secondary { display:inline-flex; font-size:0.82rem; color:var(--text-secondary); }
.forge-ui-display-inline-flex-p-6px-10px-border-1px-solid-border-radius-999px-bg-bg-card-font-0-82rem { display:inline-flex; padding:6px 10px; border:1px solid var(--border); border-radius:999px; background:var(--bg-card); font-size:0.82rem; }
.forge-ui-display-inline-flex-radius-6px-bg-bg-page-border-1px-solid-border-font-0-78rem-weight-700-text-text-secondary { display:inline-flex; border-radius:6px; background:var(--bg-page); border:1px solid var(--border); font-size:0.78rem; font-weight:700; color:var(--text-secondary); }
.forge-ui-display-none { display:none; }
.forge-ui-font-0-68rem-text-text-muted { font-size:0.68rem; color:var(--text-muted); }
.forge-ui-font-0-72rem-text-brand-ai-weight-700 { font-size:0.72rem; color:var(--brand-ai); font-weight:700; }
.forge-ui-font-0-72rem-text-text-muted { font-size:0.72rem; color:var(--text-muted); }
.forge-ui-font-0-72rem-text-text-muted-mt-6px { font-size:0.72rem; color:var(--text-muted); margin-top:6px; }
.forge-ui-font-0-72rem-text-text-muted-weight-500 { font-size:0.72rem; color:var(--text-muted); font-weight:500; }
.forge-ui-font-0-72rem-text-text-muted-weight-700 { font-size:0.72rem; color:var(--text-muted); font-weight:700; }
.forge-ui-font-0-72rem-text-text-muted-weight-800 { font-size:0.72rem; color:var(--text-muted); font-weight:800; }
.forge-ui-font-0-72rem-text-text-secondary-weight-700 { font-size:0.72rem; color:var(--text-secondary); font-weight:700; }
.forge-ui-font-0-72rem-weight-700-text-brand-blue-mb-6px { font-size:0.72rem; font-weight:700; color:var(--brand-blue); margin-bottom:6px; }
.forge-ui-font-0-74rem-text-text-muted { font-size:0.74rem; color:var(--text-muted); }
.forge-ui-font-0-75rem-text-text-muted-m-6px-0 { font-size:0.75rem; color:var(--text-muted); margin:6px 0; }
.forge-ui-font-0-75rem-weight-600-text-brand-blue { font-size:0.75rem; font-weight:600; color:var(--brand-blue); }
.forge-ui-font-0-76rem-text-text-muted-mt-2px { font-size:0.76rem; color:var(--text-muted); margin-top:2px; }
.forge-ui-font-0-78rem-text-text-muted-mb-14px { font-size:0.78rem; color:var(--text-muted); margin-bottom:14px; }
.forge-ui-font-0-78rem-text-text-muted-weight-700 { font-size:0.78rem; color:var(--text-muted); font-weight:700; }
.forge-ui-font-0-78rem-text-text-muted-weight-800 { font-size:0.78rem; color:var(--text-muted); font-weight:800; }
.forge-ui-font-0-78rem-weight-800-text-text-secondary { font-size:0.78rem; font-weight:800; color:var(--text-secondary); }
.forge-ui-font-0-8125rem-text-text-primary { font-size:0.8125rem; color:var(--text-primary); }
.forge-ui-font-0-82rem-text-text-primary-m-0-0-8px { font-size:0.82rem; color:var(--text-primary); margin:0 0 8px; }
.forge-ui-font-0-82rem-text-text-secondary-mt-6px { font-size:0.82rem; color:var(--text-secondary); margin-top:6px; }
.forge-ui-font-0-84rem-text-text-muted { font-size:0.84rem; color:var(--text-muted); }
.forge-ui-font-0-84rem-text-text-primary-m-0-0-8px { font-size:0.84rem; color:var(--text-primary); margin:0 0 8px; }
.forge-ui-font-0-84rem-text-text-primary-m-18px-0-8px { font-size:0.84rem; color:var(--text-primary); margin:18px 0 8px; }
.forge-ui-font-0-84rem-text-text-secondary { font-size:0.84rem; color:var(--text-secondary); }
.forge-ui-font-0-85rem { font-size:0.85rem; }
.forge-ui-font-0-85rem-text-text-secondary-m-2px-0-12px-0-p-8px-12px-radius-8px-bg-bg-page-border-1px-solid-border { font-size:0.85rem; color:var(--text-secondary); margin:2px 0 12px 0; padding:8px 12px; border-radius:8px; background:var(--bg-page); border:1px solid var(--border); }
.forge-ui-font-0-85rem-text-text-secondary-mb-8px { font-size:0.85rem; color:var(--text-secondary); margin-bottom:8px; }
.forge-ui-font-0-88rem-text-text-primary { font-size:0.88rem; color:var(--text-primary); }
.forge-ui-font-0-88rem-text-text-primary-weight-600 { font-size:0.88rem; color:var(--text-primary); font-weight:600; }
.forge-ui-font-0-88rem-text-text-secondary { font-size:0.88rem; color:var(--text-secondary); }
.forge-ui-font-0-88rem-text-text-secondary-mb-12px { font-size:0.88rem; color:var(--text-secondary); margin-bottom:12px; }
.forge-ui-font-0-92rem-text-text-secondary { font-size:0.92rem; color:var(--text-secondary); }
.forge-ui-font-0-92rem-text-text-secondary-m-0 { font-size:0.92rem; color:var(--text-secondary); margin:0; }
.forge-ui-font-0-92rem-weight-600-text-text-primary { font-size:0.92rem; font-weight:600; color:var(--text-primary); }
.forge-ui-font-0-9375rem-weight-600-text-text-primary { font-size:0.9375rem; font-weight:600; color:var(--text-primary); }
.forge-ui-font-0-94rem-text-text-secondary { font-size:0.94rem; color:var(--text-secondary); }
.forge-ui-font-0-95rem-text-text-primary-weight-600 { font-size:0.95rem; color:var(--text-primary); font-weight:600; }
.forge-ui-font-0-9rem-text-text-primary { font-size:0.9rem; color:var(--text-primary); }
.forge-ui-font-1-18rem-m-2px-0-0-text-text-primary { font-size:1.18rem; margin:2px 0 0; color:var(--text-primary); }
.forge-ui-font-1-25rem-weight-850-text-text-primary { font-size:1.25rem; font-weight:850; color:var(--text-primary); }
.forge-ui-font-18px-mt-1px { font-size:18px; margin-top:1px; }
.forge-ui-font-18px-text-text-muted { font-size:18px; color:var(--text-muted); }
.forge-ui-font-1rem-weight-700-text-text-primary-mb-8px { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.forge-ui-font-family-monospace { font-family:monospace; }
.forge-ui-font-family-monospace-weight-600-text-text-primary { font-family:monospace; font-weight:600; color:var(--text-primary); }
.forge-ui-font-text-xs-text-text-secondary-mb-8px { font-size:var(--text-xs); color:var(--text-secondary); margin-bottom:8px; }
.forge-ui-m-0-0-12px-0 { margin:0 0 12px 0; }
.forge-ui-m-0-0-12px-0-display-flex { margin:0 0 12px 0; display:flex; }
.forge-ui-m-0-0-16px-p-12px-14px-border-1px-solid-border-subtle-radius-8px-bg-bg-surface-display-flex { margin:0 0 16px; padding:12px 14px; border:1px solid var(--border-subtle); border-radius:8px; background:var(--bg-surface); display:flex; }
.forge-ui-m-0-p-0 { margin:0; padding:0; }
.forge-ui-m-0-pl-18px-text-text-secondary { margin:0; padding-left:18px; color:var(--text-secondary); }
.forge-ui-m-0-pl-18px-text-text-secondary-font-0-84rem { margin:0; padding-left:18px; color:var(--text-secondary); font-size:0.84rem; }
.forge-ui-m-0-pl-20px { margin:0; padding-left:20px; }
.forge-ui-m-4px-0-0-0-p-0 { margin:4px 0 0 0; padding:0; }
.forge-ui-m-4px-0-0-18px-p-0 { margin:4px 0 0 18px; padding:0; }
.forge-ui-m-6px-0-0-16px-p-0 { margin:6px 0 0 16px; padding:0; }
.forge-ui-m-8px-0-0-font-0-75rem { margin:8px 0 0; font-size:0.75rem; }
.forge-ui-mb-12px { margin-bottom:12px; }
.forge-ui-mb-12px-pb-10px-border-bottom-1px-solid-border { margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.forge-ui-mb-4px { margin-bottom:4px; }
.forge-ui-mb-8px { margin-bottom:8px; }
.forge-ui-ml-8px { margin-left:8px; }
.forge-ui-mt-10px { margin-top:10px; }
.forge-ui-mt-16px-font-0-84rem { margin-top:16px; font-size:0.84rem; }
.forge-ui-mt-2px { margin-top:2px; }
.forge-ui-mt-4px { margin-top:4px; }
.forge-ui-mt-6px { margin-top:6px; }
.forge-ui-mt-6px-display-flex { margin-top:6px; display:flex; }
.forge-ui-mt-6px-font-family-monospace { margin-top:6px; font-family:monospace; }
.forge-ui-mt-6px-text-text-muted { margin-top:6px; color:var(--text-muted); }
.forge-ui-mt-8px { margin-top:8px; }
.forge-ui-p-0 { padding:0; }
.forge-ui-p-10px-12px { padding:10px 12px; }
.forge-ui-p-10px-20px-font-0-78rem-text-text-secondary-bg-tint-slate { padding:10px 20px; font-size:0.78rem; color:var(--text-secondary); background:var(--tint-slate); }
.forge-ui-p-12px-14px { padding:12px 14px; }
.forge-ui-p-12px-14px-border-1px-solid-border-subtle-radius-8px-bg-surface-muted { padding:12px 14px; border:1px solid var(--border-subtle); border-radius:8px; background:var(--surface-muted); }
.forge-ui-p-12px-16px-display-flex { padding:12px 16px; display:flex; }
.forge-ui-p-12px-20px-display-flex-bg-bg-page { padding:12px 20px; display:flex; background:var(--bg-page); }
.forge-ui-p-14px-16px-border-1px-solid-border-mb-12px { padding:14px 16px; border:1px solid var(--border); margin-bottom:12px; }
.forge-ui-p-14px-18px-m-10px-0-6px-0 { padding:14px 18px; margin:10px 0 6px 0; }
.forge-ui-p-16px-20px-border-bottom-1px-solid-border { padding:16px 20px; border-bottom:1px solid var(--border); }
.forge-ui-p-16px-text-text-secondary { padding:16px; color:var(--text-secondary); }
.forge-ui-p-18px-16px { padding:18px 16px; }
.forge-ui-p-18px-16px-text-text-muted-font-0-875rem { padding:18px 16px; color:var(--text-muted); font-size:0.875rem; }
.forge-ui-p-20px { padding:20px; }
.forge-ui-p-4px-8px-border-1px-solid-border-text-text-primary-bg-bg-card { padding:4px 8px; border:1px solid var(--border); color:var(--text-primary); background:var(--bg-card); }
.forge-ui-pt-8px-border-top-1px-solid-border { padding-top:8px; border-top:1px solid var(--border); }
.forge-ui-radius-4px-bg-bg-page { border-radius:4px; background:var(--bg-page); }
.forge-ui-text-brand-amber { color:var(--text-primary); }
.forge-ui-text-brand-amber-bright { color:var(--text-primary); }
.forge-ui-text-brand-amber-text { color:var(--brand-amber-text); }
.forge-ui-text-brand-blue { color:var(--brand-blue); }
.forge-ui-text-brand-blue-font-0-82rem-weight-700 { color:var(--brand-blue); font-size:0.82rem; font-weight:700; }
.forge-ui-text-brand-blue-weight-600 { color:var(--brand-blue); font-weight:600; }
.forge-ui-text-brand-blue-weight-700 { color:var(--brand-blue); font-weight:700; }
.forge-ui-text-brand-green { color:var(--brand-green); }
.forge-ui-text-brand-green-bg-tint-green-border-1px-solid-brand-green { color:var(--brand-green); background:var(--tint-green); border:1px solid var(--brand-green); }
.forge-ui-text-brand-green-dark { color:var(--brand-green-dark); }
.forge-ui-text-brand-info-mr-6px { color:var(--brand-info); margin-right:6px; }
.forge-ui-text-brand-red { color:var(--text-primary); }
.forge-ui-text-brand-red-dark { color:var(--brand-red-dark); }
.forge-ui-text-inherit { color:inherit; }
.forge-ui-text-inherit-display-block-p-10px-12px-radius-8px { color:inherit; display:block; padding:10px 12px; border-radius:8px; }
.forge-ui-text-text-muted { color:var(--text-muted); }
.forge-ui-text-text-muted-font-0-76rem { color:var(--text-muted); font-size:0.76rem; }
.forge-ui-text-text-muted-font-0-82rem { color:var(--text-muted); font-size:0.82rem; }
.forge-ui-text-text-muted-font-0-82rem-weight-700 { color:var(--text-muted); font-size:0.82rem; font-weight:700; }
.forge-ui-text-text-muted-mt-4px { color:var(--text-muted); margin-top:4px; }
.forge-ui-text-text-primary { color:var(--text-primary); }
.forge-ui-text-text-primary-weight-850-font-1rem { color:var(--text-primary); font-weight:850; font-size:1rem; }
.forge-ui-text-text-secondary { color: var(--text-secondary); }
.forge-ui-text-text-secondary { color:var(--text-secondary); }
.forge-ui-text-text-secondary-bg-bg-page-border-1px-solid-border { color:var(--text-secondary); background:var(--bg-page); border:1px solid var(--border); }
.forge-ui-text-text-secondary-font-0-82rem { color:var(--text-secondary); font-size:0.82rem; }
.forge-ui-text-text-secondary-mt-1px { color:var(--text-secondary); margin-top:1px; }
.forge-ui-text-text-secondary-mt-2px { color:var(--text-secondary); margin-top:2px; }
.forge-ui-text-text-secondary-mt-4px { color:var(--text-secondary); margin-top:4px; }
.forge-ui-weight-500-text-text-primary { font-weight:500; color:var(--text-primary); }
.forge-ui-weight-600 { font-weight:600; }
.forge-ui-weight-600-text-text-primary { font-weight:600; color:var(--text-primary); }
.forge-ui-weight-600-text-text-primary-mb-4px { font-weight:600; color:var(--text-primary); margin-bottom:4px; }
.forge-ui-weight-700 { font-weight:700; }
.forge-ui-weight-700-text-brand-amber { font-weight:700; color:var(--text-primary); }
.forge-ui-weight-700-text-text-primary { font-weight:700; color:var(--text-primary); }
/* Manager dashboard revenue timeline and weekly activity drawer. */
.forge-revenue-timeline {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: var(--surface-primary);
}
.forge-revenue-timeline__eyebrow,
.forge-week-activity__heading {
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.forge-revenue-timeline__rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.forge-revenue-timeline__row {
  display: grid;
  grid-template-columns: 4px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 6px 0;
  border: 0;
  background: transparent;
  color: var(--text-primary);
  text-align: left;
  cursor: pointer;
}
.forge-revenue-timeline__swatch {
  align-self: stretch;
  min-height: 18px;
  border-radius: 4px;
  background: var(--forge-dyn-fill);
}
.forge-revenue-timeline__label,
.forge-revenue-timeline__amount,
.forge-revenue-timeline__total-label,
.forge-revenue-timeline__total-amount {
  font-size: 0.8rem;
}
.forge-revenue-timeline__amount,
.forge-revenue-timeline__total-amount {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.forge-revenue-timeline__total {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-top: 9px;
  border-top: 1px solid var(--border-subtle);
}
.forge-revenue-timeline__total-label {
  color: var(--text-secondary);
}
.forge-revenue-timeline--empty .forge-revenue-timeline__empty {
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.45;
}
.forge-week-activity {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 12px 16px;
}
.forge-week-activity__section {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.forge-week-activity__list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.forge-week-activity__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  color: var(--text-primary);
  font-size: 0.84rem;
}
.forge-week-activity__row-title {
  min-width: 0;
}
.forge-week-activity__row-meta {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: 0.76rem;
}
.forge-week-activity__log-link {
  align-self: flex-start;
  color: var(--brand-blue);
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
}
.forge-week-activity__log-link:hover {
  text-decoration: underline;
}
.forge-revenue-timeline__row:hover { background: var(--bg-page); }
.forge-revenue-timeline__row:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

.forge-review-interpretation {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--bg-page);
}
.forge-review-interpretation > p,
.forge-review-interpretation-field {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.5;
}
.forge-review-interpretation-field strong {
  display: block;
  margin-bottom: 4px;
  color: var(--text-primary);
}
.forge-review-interpretation-field blockquote {
  margin: 4px 0 0;
  padding-left: 10px;
  border-left: 2px solid var(--border-subtle);
}
.forge-source-review-details {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.5;
}
.forge-source-review-details > summary {
  color: var(--text-primary);
  cursor: pointer;
  font-weight: 600;
}
.forge-source-review-details[open] > summary {
  margin-bottom: 8px;
}
.forge-source-review-details ul {
  margin: 8px 0;
  padding-left: 20px;
}
