/* Sovereign, batch 3: build and ship.

   The screens of Sign a release (ssg-), Check cloud and container config
   (svc-cfg-), Dependencies and SBOM (svb-), Track vulnerabilities (svu-),
   Container image SBOM (sim-), Find secrets in a repository (sss-) and
   Release record (srg-).

   Linked once, from sovereign-suite.html, after sovereign-app.css and
   before pro.css; the Console does not load it. Every rule here names a
   class of this batch's own services, which each carry a prefix of their
   own, or an id on one of their screens; the shell's classes (sv-, svs-,
   svt-), and anything services of two batches both wear, are in
   sovereign-app.css. How the batches divide the Suite: the head of
   pro-code/sovereign-services.js. */

/* ---------------------------------------------------------- Sign a release */

.ssg-box { margin-top: 14px; }
.ssg-box[hidden] { display: none; }
.ssg-box > .svs-actions:first-child { margin-top: 0; align-items: center; }
.ssg-pass { margin-top: 12px; }
.ssg-cmd { margin: 8px 0 10px; padding: 9px 11px; border-radius: 8px; background: var(--paper-inset); font: 12px/1.5 var(--font-mono); color: var(--ink); white-space: pre-wrap; overflow-wrap: anywhere; }

/* --------------------------------------------------- Track vulnerabilities */

/* A grid item's minimum is its content's: without this the register's
   table would widen the page instead of scrolling in its own box. */
.svu > .svs-main { min-width: 0; }
.svu-h { margin: 0 0 12px; font-size: 15px; font-weight: 650; }
.svu-h:focus { outline: none; }
.svu-sum[hidden], .svu-prev[hidden], .svu-edit[hidden], .svu-reg[hidden], .svu-io[hidden], .svu-cond[hidden] { display: none; }
.svu-in, .svu-prev, .svu-reg, .svu-edit { padding: 22px 0; border-top: 1px solid var(--sv-line); }
.svu-in .svs-actions { margin-top: 12px; }
/* The summary: five figures, the ones that can be listed are buttons. */
.svu-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 10px; margin-bottom: 14px; }
.svu-tile { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 12px 14px; border: 1px solid var(--sv-line); border-radius: 10px; background: var(--paper-raised); color: var(--ink); font: inherit; text-align: left; }
button.svu-tile { cursor: pointer; }
button.svu-tile:hover { border-color: var(--rule-strong); }
button.svu-tile:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.svu-tile b { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.15; }
.svu-tile span { font-size: 12.5px; font-weight: 600; color: var(--ink-soft); }
.svu-tile small { font-size: 11.5px; line-height: 1.4; color: var(--ink-faint); }
.svu-tile.svu-bad { border-color: var(--danger); }
.svu-tile.svu-bad b { color: var(--danger); }
.svu-tile.svu-warn { border-color: var(--warn); }
.svu-attn { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.svu-attn .svs-tag { border: 0; font: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer; }
.svu-tag-warn { background: var(--warn-soft); color: var(--ink); }
/* Fix first: the few to fix before the rest, each with its reasons. */
.svu-first { padding: 22px 0; border-top: 1px solid var(--sv-line); }
.svu-first[hidden] { display: none; }
.svu-first-sub { margin: -6px 0 12px; }
.svu-ff { list-style: none; margin: 0; padding: 0; counter-reset: svu-ff; border-top: 1px solid var(--sv-line); }
.svu-ff-row { counter-increment: svu-ff; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 6px 12px; align-items: start; padding: 12px 0; border-bottom: 1px solid var(--sv-line); }
.svu-ff-row::before { content: counter(svu-ff); font: 600 var(--text-xs)/1.5 var(--font-mono); color: var(--ink-faint); font-variant-numeric: tabular-nums; }
.svu-ff-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.svu-ff-body > b { font-size: var(--text-sm); font-weight: 600; overflow-wrap: anywhere; }
.svu-ff-body > small { font-size: var(--text-2xs); color: var(--ink-faint); overflow-wrap: anywhere; }
.svu-ff-why { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: var(--text-xs); line-height: 1.45; color: var(--ink-soft); }
.svu-ff-why li { padding-left: 12px; position: relative; overflow-wrap: anywhere; }
.svu-ff-why li::before { content: ""; position: absolute; left: 0; top: .6em; width: 5px; height: 1px; background: var(--rule-strong); }
.svu-ff-why li[data-why="kev"], .svu-ff-why li[data-why="alert"] { color: var(--danger); }
.svu-ff-fix { margin: 4px 0 0; font-size: var(--text-xs); line-height: 1.45; overflow-wrap: anywhere; }
.svu-ff-fix span { display: block; font: 600 var(--text-2xs)/1.6 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-faint); }
.svu-ff-row .svs-actions { margin: 0; justify-content: flex-end; }
.svu-first > .svs-hint .sv-btn { margin-left: 4px; vertical-align: baseline; }
.svu-ff-how { margin-top: 12px; }
.svu-ff-how ol { margin: 6px 0; padding-left: 20px; }
@media (max-width: 640px) {
  .svu-ff-row { grid-template-columns: 22px minmax(0, 1fr); }
  .svu-ff-row .svs-actions { grid-column: 2; justify-content: flex-start; }
}
/* Open findings by week: one series, in the accent, the latest bar in ink. */
.svu-trend { margin: 0; padding: 12px 14px 8px; border: 1px solid var(--sv-line); border-radius: 10px; background: var(--paper-raised); }
.svu-trend figcaption { font-size: 12px; font-weight: 600; color: var(--ink-soft); }
.svu-trend svg { display: block; width: 100%; height: 150px; overflow: visible; }
.svu-trend path { fill: var(--accent); }
.svu-bar-now path { fill: var(--ink); }
.svu-hit { fill: transparent; }
.svu-bar:hover .svu-hit { fill: var(--sv-hover); }
.svu-base { stroke: var(--rule-strong); stroke-width: 1; vector-effect: non-scaling-stroke; }
.svu-val { font-size: 12px; font-weight: 650; fill: var(--ink); }
.svu-axis { font-size: 11px; fill: var(--ink-faint); }
/* The register. */
.svu-reghead { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.svu-reghead .svs-hint { margin: 0; }
.svu-sample { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 12px; padding: 8px 12px; border-radius: 8px; background: var(--accent-soft); font-size: 13px; }
.svu-filters { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.svu-q { grid-column: 1 / -1; }
.svu-empty { margin: 0; padding: 16px; border: 1px dashed var(--rule-strong); border-radius: 10px; font-size: 13.5px; line-height: 1.55; color: var(--ink-soft); }
.svu-empty p { margin: 0; }
.svu-empty b { color: var(--ink); }
.svu-scroll { overflow-x: auto; border: 1px solid var(--sv-line); border-radius: 10px; background: var(--paper-raised); }
.svu-scroll:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.svu-table th, .svu-table td { padding: 8px 10px; }
.svu-table th:first-child, .svu-table td:first-child { padding-left: 12px; }
.svu-table tbody tr:last-child td { border-bottom: 0; }
.svu-sort { padding: 0; border: 0; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; }
.svu-sort:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.svu-cell-title { min-width: 150px; }
.svu-asset { display: block; margin-top: 2px; font-size: 12px; color: var(--ink-soft); overflow-wrap: anywhere; }
.svu-cell-title small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--ink-faint); overflow-wrap: anywhere; }
.svu-open { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--ink); text-align: left; cursor: pointer; }
.svu-open:hover { text-decoration: underline; }
.svu-open:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.svu-none { color: var(--ink-faint); }
.svu-flags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.svu-flags .svs-tag { white-space: normal; line-height: 1.3; }
.svu-flags:empty { display: none; }
.svu-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.svu-date small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--ink-faint); }
/* Severity carries its name as well as its colour. */
.svu-sev { display: inline-flex; align-items: baseline; gap: 5px; padding: 2px 7px; border-radius: 999px; font-size: 11.5px; font-weight: 700; white-space: nowrap; background: var(--paper-inset); color: var(--ink); }
.svu-sev small { font-weight: 600; font-variant-numeric: tabular-nums; opacity: .8; }
.svu-s-critical { background: var(--danger); color: var(--on-danger); }
.svu-s-high { background: var(--danger-soft); }
.svu-s-medium { background: var(--warn-soft); }
.svu-s-low { background: var(--accent-soft); }
/* The editor. */
.svu-edithead { margin-bottom: 12px; }
.svu-flagline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -4px 0 14px; }
.svu-form > .svs-field, .svu-cond > .svs-field { margin-bottom: 12px; }
.svu-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.svu-sub { margin: 22px 0 10px; font-size: 11px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-faint); }
.svu-form .svs-hint:empty { display: none; }
.svu-form .svs-hint { margin: -4px 0 12px; }
.svu-form .svs-hint .sv-btn { margin-left: 6px; }
.svu-calc { margin-bottom: 10px; border: 1px solid var(--sv-line); border-radius: 10px; background: var(--paper-raised); }
.svu-calc summary { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 44px; padding: 0 14px; cursor: pointer; font-size: 13.5px; font-weight: 600; }
.svu-calc summary b { font-size: 12.5px; font-weight: 650; color: var(--ink-faint); }
.svu-calc summary b.svu-score { padding: 2px 8px; border-radius: 999px; color: var(--ink); }
.svu-calc summary b.svu-s-critical { color: var(--on-danger); }
.svu-calcbody { padding: 0 14px 14px; }
.svu-calcbody .svs-hint { margin: 6px 0 10px; }
.svu-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; margin-bottom: 12px; }
.svu-metric { min-width: 0; margin: 0; padding: 0; border: 0; }
.svu-metric legend { margin-bottom: 6px; padding: 0; font-size: 12px; font-weight: 600; color: var(--ink-soft); }
.svu-metric legend code { font-family: var(--font-mono); font-size: 11px; color: var(--ink-faint); }
.svu-metric > div { display: flex; flex-wrap: wrap; gap: 6px; }
.svu-hist { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--sv-line); }
.svu-hist li { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 2px 12px; padding: 8px 0; border-bottom: 1px solid var(--sv-line); font-size: 12.5px; line-height: 1.45; }
.svu-hist time { color: var(--ink-faint); font-variant-numeric: tabular-nums; }
.svu-hist span { grid-column: 2; color: var(--ink-soft); overflow-wrap: anywhere; }
/* The import preview and its column matcher. */
.svu-map { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 12px; margin-bottom: 14px; }
.svu-prev .svw-opt { margin: 0 0 14px; }
.svu-prev .svw-group li span { min-width: 0; overflow-wrap: anywhere; }
.svu-sla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.svu-days { display: flex; align-items: center; gap: 6px; }
.svu-days small { font-size: 12px; color: var(--ink-faint); }
.svu-io { margin-top: 8px; padding-top: 18px; border-top: 1px solid var(--sv-line); }
.svs-side .svs-summary .svs-field + h3, .svu-sla + .svs-small + h3 { margin-top: 16px; }
@media (max-width: 860px) {
  .svu-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svu-map { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .svu-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svu-two, .svu-metrics, .svu-map { grid-template-columns: 1fr; }
  .svu-hist li { grid-template-columns: 1fr; }
  .svu-hist span { grid-column: 1; }
  .svu-open { min-height: 32px; }
  /* On a phone each finding is a card, its fields labelled, sorted from
     the select above rather than the column headings. */
  .svu-scroll { overflow: visible; border: 0; border-radius: 0; background: none; }
  .svu-table, .svu-table tbody { display: block; min-width: 0; }
  .svu-table thead { display: none; }
  .svu-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; margin-bottom: 10px; padding: 12px 14px; border: 1px solid var(--sv-line); border-radius: 10px; background: var(--paper-raised); }
  .svu-table td, .svu-table td:first-child { display: block; min-width: 0; padding: 0; border: 0; }
  .svu-table td:nth-child(-n+2) { grid-column: 1 / -1; }
  .svu-table td:nth-child(5) { grid-column: 1 / -1; }
  .svu-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 1px; font-size: 10.5px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); }
  .svu-cell-title { min-width: 0; }
  .svu-date { white-space: normal; }
}

/* --------------------------------------------------- Dependencies and SBOM */

/* Each part of the inventory under its own rule; the package table, which
   scrolls inside its own box with its header held in view, so a lockfile
   of thousands never widens or stretches the page; small labels for a
   licence's class and the policy's answer; and the box round the one step
   that uses the network, set apart so it cannot be taken for the rest. */
.svb-note { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 16px; padding: 10px 14px; border-radius: 10px; background: var(--accent-soft); font-size: 13px; line-height: 1.5; }
.svb-note svg { flex: none; width: 16px; height: 16px; margin-top: 2px; color: var(--accent-strong); }
.svb-fnote { flex-basis: 100%; margin: 2px 0 0; font-size: 12px; line-height: 1.5; color: var(--ink-soft); }
.svb-sect { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--sv-line); }
.svb-sect > h2 { margin: 0 0 6px; font-size: 16px; font-weight: 650; letter-spacing: -0.005em; }
.svb-sub { margin: 0 0 14px; font-size: 13px; line-height: 1.55; color: var(--ink-soft); max-width: 70ch; }
.svb-tools { display: flex; flex-wrap: wrap; gap: 10px 12px; margin-bottom: 12px; }
.svb-tools .svs-field { flex: 1 1 150px; min-width: 0; }
.svb-tools .svb-q { flex: 3 1 220px; }
/* Width 0 with a full minimum: the box fills its column but lends the
   column none of the table's width, so a one-column layout stays narrow. */
.svb-scroll, .svb-pre { width: 0; min-width: 100%; box-sizing: border-box; }
.svb-scroll { max-height: 480px; overflow: auto; border: 1px solid var(--sv-line); border-radius: 10px; background: var(--paper-raised); overscroll-behavior: contain; }
.svb-scroll:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.svb-table { width: 100%; min-width: 640px; table-layout: fixed; border-collapse: collapse; font-size: 12.5px; }
.svb-table th:nth-child(2) { width: 84px; }
.svb-table th:nth-child(3) { width: 96px; }
.svb-table th:nth-child(4) { width: 108px; }
.svb-table th:nth-child(5) { width: 136px; }
.svb-table th:nth-child(6) { width: 100px; }
.svb-table th { position: sticky; top: 0; z-index: 1; padding: 0; background: var(--paper-raised); box-shadow: inset 0 -1px 0 var(--sv-line); text-align: left; white-space: nowrap; }
.svb-table th button { display: flex; align-items: center; gap: 4px; width: 100%; padding: 9px 10px; border: 0; background: none; font: inherit; font-size: 11px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); text-align: left; cursor: pointer; }
.svb-table th button:hover, .svb-table th[aria-sort] button { color: var(--ink); }
.svb-table th button:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.svb-table th[aria-sort="ascending"] button::after { content: "\2191"; }
.svb-table th[aria-sort="descending"] button::after { content: "\2193"; }
.svb-table td { padding: 8px 10px; border-top: 1px solid var(--sv-line); vertical-align: top; color: var(--ink-soft); overflow-wrap: anywhere; }
.svb-table tbody tr:first-child td { border-top: 0; }
.svb-table td:first-child { color: var(--ink); font-weight: 600; }
.svb-table td small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--ink-faint); }
.svb-table td code { display: block; margin-top: 2px; font-family: var(--font-mono); font-size: 11px; font-weight: 400; color: var(--ink-faint); overflow-wrap: anywhere; }
.svb-lab { display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 650; line-height: 1.6; white-space: nowrap; background: var(--paper-inset); color: var(--ink-soft); }
.svb-ok { background: var(--good-soft); color: var(--ink); }
.svb-warn { background: var(--warn-soft); color: var(--ink); }
.svb-bad { background: var(--danger-soft); color: var(--ink); }
.svb-lics .syd-what span { overflow-wrap: anywhere; }
.svb-lics .svb-pol { flex: none; width: 210px; }
.svb-lics .svb-denied .syd-what b { color: var(--danger); }
.svb-inline { margin: 0; }
.svb-classes .sfd-kind { margin: 14px 0 0; }
.svb-classpol { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.svb-classpol .svs-label { margin: 0; }
.svb-classpol .svs-input { width: auto; }
.svb-net { margin-top: 36px; padding: 20px 22px 22px; border: 1px dashed var(--rule-strong); border-radius: 12px; background: var(--paper-inset); }
.svb-flag { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 12px; font-size: 12.5px; font-weight: 650; color: var(--warn); }
.svb-flag svg { flex: none; width: 15px; height: 15px; margin-top: 1px; }
.svb-sent { margin: 0 0 12px; padding-left: 18px; font-size: 13px; line-height: 1.6; color: var(--ink-soft); max-width: 72ch; }
.svb-sent b { color: var(--ink); }
.svb-pre { max-height: 260px; overflow: auto; white-space: pre; overflow-wrap: normal; }
.svb-net .svw-verdict { margin-top: 18px; }
.svb-vtext { margin: 0 0 12px; font-size: 13px; line-height: 1.55; color: var(--ink-soft); max-width: 70ch; white-space: pre-line; overflow-wrap: anywhere; }
.svb-last { margin-top: 24px; }
@media (max-width: 640px) {
  .svb-net { padding: 16px 14px 18px; }
  .svb-lics .svb-pol { flex: 1 1 100%; }
  .svb-table { min-width: 760px; }
  .svb-table th button { min-height: 44px; }
}

/* ---------------------------------------- Check cloud and container config */

/* The findings reuse the certificate inventory's rows (.sci-*) and the
   filter chips of SOC 2; what is new is the severity word, the body of a
   finding, the source lines with their numbers, and the accept form. The
   per-file table and the source lines scroll inside their own boxes, and
   the column holding them may shrink below their width, so a long line
   never widens the page. */
.svc-cfg > .svs-main { min-width: 0; }
.svc-cfg-unread { margin: 14px 0 0; }
.svc-cfg-unread > div { flex: 1; min-width: 0; }
.svc-cfg-scroll { margin-top: 8px; overflow-x: auto; }
.svc-cfg-scroll .sfd-table td:first-child { min-width: 180px; }
.sfd-table .svc-cfg-n { text-align: right; font-variant-numeric: tabular-nums; }
.sfd-table .svc-cfg-on { color: var(--ink); font-weight: 700; }
.svc-cfg-fnote { display: block; margin-top: 2px; font-size: 11.5px; color: var(--warn); }
.svc-cfg-filter { margin: 22px 0 4px; }
.svc-cfg-count { margin-left: 6px; font-size: inherit; font-weight: 600; font-variant-numeric: tabular-nums; opacity: .7; }
.svc-cfg-sev { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); }
.svc-cfg-critical, .svc-cfg-high { color: var(--danger); }
.svc-cfg-medium { color: var(--warn); }
.svc-cfg-accepted .svc-cfg-sev, .svc-cfg-accepted .sci-name b { color: var(--ink-faint); }
.svc-cfg-body { padding: 0 0 16px 90px; }
.svc-cfg-body > p { margin: 0 0 10px; font-size: 13.5px; line-height: 1.55; max-width: 72ch; overflow-wrap: anywhere; }
.svc-cfg-body > p code { font-family: var(--font-mono); font-size: 12px; }
.svc-cfg-detail { font-weight: 600; }
.svc-cfg-h { margin: 0 0 4px; font-size: 11px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); }
.svc-cfg-code { margin: 0 0 12px; border: 1px solid var(--sv-line); border-radius: 8px; background: var(--paper-inset); overflow-x: auto; }
.svc-cfg-code pre { display: inline-block; min-width: 100%; box-sizing: border-box; margin: 0; padding: 8px 0; font: 12px/1.65 var(--font-mono); color: var(--ink-soft); }
.svc-cfg-ln { display: block; padding-right: 14px; white-space: pre; }
.svc-cfg-ln i { display: inline-block; min-width: 3ch; margin-right: 14px; padding-left: 12px; text-align: right; font-style: normal; color: var(--ink-faint); -webkit-user-select: none; user-select: none; }
.svc-cfg-hit { background: var(--warn-soft); color: var(--ink); }
.svc-cfg-accept { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 10px; }
.svc-cfg-accept .svs-field { flex: 1 1 240px; min-width: 0; }
.svc-cfg-accept > .svs-hint { flex: 1 1 240px; margin: 0; overflow-wrap: anywhere; }
.svc-cfg-none { padding: 14px 0; font-size: 13px; color: var(--ink-faint); }
.svc-cfg-next { margin: 14px 0 0; }
.svc-cfg-next .svs-hint { flex-basis: 100%; margin: 2px 0 0; }
@media (max-width: 640px) {
  .svc-cfg-body { padding-left: 0; }
  .svc-cfg-accept .sv-btn { min-height: 44px; }
}

/* ------------------------------------------ Vulnerabilities: the additions */

/* The scanners' save commands, the two public lists (KEV and EPSS) with
   what each last held, the VEX export, and a supplier's VEX read in: each
   is its own part of the page, and each says where its facts came from. */
.svu-recipes { margin-top: var(--space-3); }
.svu-recipe { display: grid; gap: var(--space-2); margin: var(--space-2) 0 0; }
.svu-recipe > div { display: grid; grid-template-columns: minmax(0, 11em) minmax(0, 1fr); gap: var(--space-1) var(--space-3); align-items: baseline; }
.svu-recipe dt { font-size: var(--text-xs); font-weight: 600; color: var(--ink); }
.svu-recipe dd { margin: 0; min-width: 0; }
.svu-recipe code { display: block; padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); background: var(--paper-inset); font-family: var(--font-mono); font-size: var(--text-2xs); color: var(--ink-soft); overflow-wrap: anywhere; }
.svu-intel, .svu-vexin { padding: var(--space-5) 0; border-top: 1px solid var(--sv-line); }
.svu-intel:empty, .svu-vexin[hidden] { display: none; }
.svu-lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin-bottom: var(--space-3); }
.svu-listcard { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; padding: var(--space-3) var(--space-4); border: 1px solid var(--sv-line); border-radius: var(--radius-md); background: var(--paper-raised); font-size: var(--text-xs); line-height: 1.5; color: var(--ink-soft); }
.svu-listcard b { font-size: var(--text-sm); font-weight: 650; color: var(--ink); }
.svu-listcard span { overflow-wrap: anywhere; }
.svu-listcard .svs-actions { margin-top: var(--space-2); }
.svu-intelline { margin: calc(-1 * var(--space-1)) 0 var(--space-3); }
.svu-vex { margin-top: var(--space-4); }
.svu-vexlist { list-style: none; margin: 0 0 var(--space-3); padding: 0; border-top: 1px solid var(--sv-line); }
.svu-vexlist li { padding: var(--space-2) 0; border-bottom: 1px solid var(--sv-line); }
.svu-vexlist .svw-opt { margin: 0; }
.svu-vexlist b { display: block; font-weight: 600; overflow-wrap: anywhere; }
.svu-vexlist small { display: block; margin-top: 2px; font-size: var(--text-2xs); color: var(--ink-faint); overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .svu-lists { grid-template-columns: 1fr; }
  .svu-recipe > div { grid-template-columns: 1fr; }
}

/* ----------------------------------------------- Dependencies: the additions */

/* The red flags reuse the groups of the website check (.svw-group); the
   notices sit under a smaller heading in the Save section. */
.svb-sect[hidden] { display: none; }
.svb-flags li span { min-width: 0; overflow-wrap: anywhere; }
.svb-h3 { margin: var(--space-5) 0 var(--space-1); font-size: var(--text-sm); font-weight: 650; }

/* ---------------------------------------- Cloud and container: the additions */

/* Your own rules: the list of them with a remove button each, and the form
   that adds one; and the comparison with a saved SARIF file. */
.svc-cfg-own { margin-top: var(--space-4); }
.svc-cfg-rules { list-style: none; margin: var(--space-2) 0 var(--space-3); padding: 0; border-top: 1px solid var(--sv-line); }
.svc-cfg-rules li { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-3); padding: var(--space-2) 0; border-bottom: 1px solid var(--sv-line); }
.svc-cfg-rules li > div { min-width: 0; }
.svc-cfg-rules b { display: block; font-size: var(--text-xs); font-weight: 600; overflow-wrap: anywhere; }
.svc-cfg-rules small { display: block; margin-top: 2px; font-size: var(--text-2xs); color: var(--ink-faint); overflow-wrap: anywhere; }
.svc-cfg-rules code { font-family: var(--font-mono); }
.svc-cfg-ruleform { display: grid; gap: var(--space-3); margin-top: var(--space-3); }
.svc-cfg-ruleform .svs-actions { margin-top: 0; }
.svc-cfg-diff { margin: var(--space-4) 0 0; padding: var(--space-3) var(--space-4); border: 1px solid var(--sv-line); border-radius: var(--radius-md); background: var(--paper-raised); }
.svc-cfg-diff h3 { margin: 0 0 var(--space-1); font-size: var(--text-sm); font-weight: 650; }
.svc-cfg-diff .svw-group { margin-top: var(--space-3); }

/* ---------------------------------------------------------- Container image */

/* The image's packages use the SBOM screen's table (.svb-scroll); the one
   class of its own lets the table stand a little lower on a long image. */
.sim-scroll { margin-top: var(--space-2); }

/* ------------------------------------------ Find secrets in a repository */

/* Rows of the certificate inventory (.sci-*), with the severity word in
   the first column, the places each secret was seen, and the decision. */
.sss-sev { font-size: var(--text-2xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); }
.sss-high { color: var(--danger); }
.sss-medium { color: var(--warn); }
.sss-done .sss-sev, .sss-done .sci-name b { color: var(--ink-faint); }
.sss-count { margin-left: var(--space-1); font-size: inherit; font-weight: 600; font-variant-numeric: tabular-nums; opacity: .7; }
.sss-body { padding: 0 0 var(--space-4) calc(76px + var(--space-3)); }
.sss-body > p { margin: 0 0 var(--space-2); font-size: var(--text-xs); line-height: 1.55; max-width: 72ch; overflow-wrap: anywhere; }
.sss-body code { font-family: var(--font-mono); font-size: var(--text-2xs); }
.sss-places { margin: 0 0 var(--space-3); padding-left: var(--space-4); font-size: var(--text-2xs); line-height: 1.6; color: var(--ink-soft); }
.sss-places code { overflow-wrap: anywhere; }
.sss-decide { display: grid; gap: var(--space-2); max-width: 60ch; }
.sss-decide .svs-actions { margin-top: 0; }
.sss-none { padding: var(--space-3) 0; font-size: var(--text-xs); color: var(--ink-faint); }
@media (max-width: 640px) {
  .sss-body { padding-left: 0; }
  .sss-decide .sv-btn { min-height: 44px; }
}

/* ---------------------------------------------------------- Release record */

/* Two drop boxes side by side; each check as a row whose left edge says
   passed, failed or noted, with the word as well as the colour; and the
   records of earlier releases under their own rule. */
.srg-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.srg-checks { list-style: none; display: grid; gap: var(--space-2); margin: var(--space-3) 0; padding: 0; }
.srg-checks li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--space-3); padding: var(--space-2) var(--space-3); border: 1px solid var(--sv-line); border-left-width: 3px; border-radius: var(--radius-md); background: var(--paper-raised); }
.srg-checks b { font-size: var(--text-xs); font-weight: 650; }
.srg-checks small { grid-column: 1 / -1; font-size: var(--text-2xs); line-height: 1.5; color: var(--ink-soft); overflow-wrap: anywhere; }
.srg-lv { font-size: var(--text-2xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); }
.srg-pass { border-left-color: var(--good); }
.srg-fail { border-left-color: var(--danger); }
.srg-fail .srg-lv { color: var(--danger); }
.srg-warn { border-left-color: var(--warn); }
.srg-warn .srg-lv { color: var(--warn); }
.srg-history { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--sv-line); }
.srg-h { margin: 0 0 var(--space-2); font-size: var(--text-md); font-weight: 650; }
@media (max-width: 640px) {
  .srg-two { grid-template-columns: 1fr; }
}
