/* Release Matrix, popovers, legend and the App Detail drawer. Colours come only from theme variables (app.css). */

#view:has(> .matrix) { display: flex; flex-direction: column; }
.matrix { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: var(--space-3); }

#view .matrix > .page-head { margin: 0; }
.matrix-notices:empty { display: none; }

/* attention strip */
.attention { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); padding: 0.45rem 0.75rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--elev-1); }
.attention-head { display: flex; align-items: center; gap: 0.25rem; }
#view .attention-title { margin: 0; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.attention-none { margin: 0; color: var(--muted); font-size: 0.85rem; }
.chips { display: flex; flex-wrap: wrap; flex: 1 1 0; gap: 0.35rem; min-width: 0; }
.chip .sev-icon { width: 0.75rem; height: 0.75rem; }
.chip { display: inline-flex; align-items: center; gap: 0.35rem; }
.chip, .toggle {
  padding: 0.18rem 0.65rem; border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface);
  color: var(--text); font-size: 0.8rem; cursor: pointer;
}
.chip[aria-pressed="true"] { background: var(--fill-gradient); border-color: transparent; color: var(--on-fill); font-weight: 700; }
.toggle { display: inline-flex; align-items: center; gap: 0.35rem; }
.toggle[aria-pressed="true"] { background: var(--hover); border-color: var(--brand); color: var(--text); font-weight: 600; }
.toggle[aria-pressed="false"] { color: var(--muted); text-decoration: line-through; text-decoration-thickness: 1px; }
.chip-clear { height: 1.6rem; min-width: 1.6rem; margin-left: auto; }
.btn-link { border: 0; background: none; padding: 0; color: var(--accent); text-decoration: underline; cursor: pointer; font: inherit; font-size: 0.85rem; }
.btn-link:hover:not(:disabled) { background: none; border: 0; }

/* toolbar */
.filter-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-3); }
.filter-clear { flex: none; }
.filter-clear[aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; }
.toolbar-group { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.search-box { position: relative; display: inline-flex; align-items: center; }
.search { width: 18rem; max-width: 100%; padding: 0.38rem 2rem 0.38rem 2rem; font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-pill); }
.search:focus-visible { outline-offset: 0; border-color: var(--brand); }
.search-lead { position: absolute; left: 0.6rem; width: 1rem; height: 1rem; color: var(--muted); pointer-events: none; }
.search-clear { position: absolute; right: 0.2rem; height: 1.6rem; min-width: 1.6rem; padding: 0; }
.search-list { position: absolute; z-index: 50; top: calc(100% + 6px); left: 0; width: max(100%, 24rem); max-width: 90vw; max-height: 22rem; overflow: auto; margin: 0; padding: 0.3rem; list-style: none; background: var(--overlay); border: 1px solid var(--overlay-border); border-radius: var(--radius); box-shadow: var(--elev-2); }
.search-option { display: flex; align-items: center; gap: 0.6rem; padding: 0.4rem 0.55rem; border-radius: 8px; cursor: pointer; }
.search-option.is-active, .search-option:hover { background: var(--hover); }
.search-option-icon { display: inline-flex; width: 1.6rem; flex: none; justify-content: center; margin-left: 0.25rem; }
.search-option-name { font-weight: 600; }
.search-option-scope { margin-left: auto; color: var(--muted); font-size: 0.75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-empty { padding: 0.4rem 0.55rem; color: var(--muted); font-size: 0.8rem; }

.tool-toggle { height: 2rem; }
.toggle-group { display: inline-flex; align-items: center; gap: 0.25rem; }
.toggle-sev { width: 2rem; height: 2rem; padding: 0; justify-content: center; }
.toggle-sev .sev-icon { width: 0.95rem; height: 0.95rem; }
.toolbar-label { color: var(--muted); font-size: 0.8rem; margin-right: 0.15rem; }
.density-control { display: inline-flex; align-items: center; gap: 0.45rem; color: var(--muted); }
.legend-button { color: var(--muted); }

/* sliding switch */
.switch { display: inline-flex; padding: 0; border: 0; background: none; border-radius: var(--radius-pill); }
.switch:hover:not(:disabled) { background: none; border: 0; }
.switch-track { position: relative; display: block; width: 2.3rem; height: 1.3rem; border: 1px solid var(--muted); border-radius: var(--radius-pill); background: var(--bg); transition: background-color 0.15s, border-color 0.15s; }
.switch-thumb { position: absolute; top: 2px; left: 2px; width: calc(1.3rem - 6px); height: calc(1.3rem - 6px); border-radius: 50%; background: var(--muted); transition: transform 0.15s, background-color 0.15s; }
.switch[aria-checked="true"] .switch-track { background: var(--fill-gradient); border-color: transparent; }
.switch[aria-checked="true"] .switch-thumb { transform: translateX(1rem); background: var(--on-fill); }

/* severity: always icon + text, colour is an extra cue */
.badges { display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem; margin: 0.35rem 0 0; padding: 0; list-style: none; }
.status { display: flex; align-items: center; gap: 0.3rem; padding: 0.08rem 0.45rem; border-radius: 6px; background: color-mix(in srgb, currentColor 11%, transparent); font-size: 0.78rem; line-height: 1.35; }
.sev-icon { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 0.85rem; height: 0.85rem; }
.sev-icon svg { display: block; width: 100%; height: 100%; }
.sev-error { color: var(--sev-error); }
.sev-warn { color: var(--sev-warn); }
.sev-info { color: var(--sev-info); }
.status.sev-error { font-weight: 700; }
.status.sev-warn { font-weight: 600; }

/* grid */
.grid-wrap { position: relative; flex: 1; min-height: min(24rem, 60vh); overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--elev-1); transition: opacity 0.15s; }
.grid-wrap.is-refreshing { opacity: 0.6; }
.grid { border-collapse: separate; border-spacing: 0; width: 100%; }
.grid th, .grid td { padding: 0.55rem 0.8rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); background: var(--surface); }
.grid tbody tr:last-child th, .grid tbody tr:last-child td { border-bottom: 0; }
.grid td { min-width: 9.5rem; }
.grid thead th { position: sticky; top: 0; z-index: 3; font-size: 0.72rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid var(--border); background: var(--surface); }
.grid tbody th.app-cell { position: sticky; left: 0; z-index: 2; min-width: 11rem; border-right: 1px solid var(--border); font-weight: 400; }
.grid thead th.corner { left: 0; z-index: 4; border-right: 1px solid var(--border); }
.grid tbody tr:hover th, .grid tbody tr:hover td { background: var(--hover); }
.grid td:focus-visible, .grid th:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; border-radius: 0; }
.grid td { cursor: pointer; }
.col-label { font-weight: 700; }
.col-state { color: var(--sev-error); font-weight: 700; font-size: 0.75rem; text-transform: none; letter-spacing: 0; }
.col-repo, .cell-repo { border-left: 1px solid var(--border); }

.app-name-line { display: flex; align-items: center; gap: 0.5rem; }
.app-name { font-weight: 700; }
.app-scope { color: var(--muted); font-size: 0.72rem; }
.app-cell .app-scope { padding-left: 2.25rem; }
.density-compact .app-cell .app-scope { padding-left: 0; }
.version { font-size: 1rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.version.none { font-weight: 400; color: var(--muted); }
.sub { margin-top: 0.1rem; max-width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 0.72rem; }
td[data-state="unreachable"] { background-image: repeating-linear-gradient(135deg, transparent 0 6px, var(--hatch) 6px 7px); }

.density-compact .grid th, .density-compact .grid td { padding: 0.2rem 0.55rem; }
.density-compact .sub, .density-compact .app-scope { display: none; }
.density-compact .badges { flex-direction: row; flex-wrap: wrap; gap: 0.15rem 0.35rem; margin-top: 0; }
.density-compact .status { padding: 0 0.35rem; }

/* skeleton */
.skeleton { display: grid; gap: 0.6rem; padding: 0.75rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.skeleton-row { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 1rem; }
.skeleton-bar { height: 1.1rem; border-radius: 6px; background: var(--border); }
.skeleton-head .skeleton-bar { height: 0.9rem; }
@media (prefers-reduced-motion: no-preference) {
  .skeleton-bar { animation: shimmer 1.2s ease-in-out infinite alternate; }
  @keyframes shimmer { from { opacity: 0.35; } to { opacity: 0.9; } }
}

/* source-control icon: only its size and spacing are here; the drawings and their colours are in sync-icon-set.js */
.sync-icon { display: inline-flex; flex: none; width: var(--icon-md); height: var(--icon-md); color: var(--text); vertical-align: middle; }
.sync-icon svg { width: 100%; height: 100%; overflow: visible; }
.search-option .sync-icon { width: var(--icon-sm); height: var(--icon-sm); }
.sync-key-item .sync-icon { width: var(--icon-lg); height: var(--icon-lg); }
.sync-key-item { display: flex; align-items: center; gap: 0.6rem; margin: 0.3rem 0; }
.sync-key { margin-bottom: 0.8rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--border); }

/* popovers */
.popover {
  position: fixed; inset: auto; margin: 0; padding: 0.75rem 1rem; width: max-content; max-width: min(28rem, calc(100vw - 16px));
  max-height: 70vh; overflow: auto; background: var(--surface); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--elev-2);
}
.popover:focus { outline: none; }
.popover-wide { max-width: min(54rem, calc(100vw - 16px)); }
.popover-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 0.5rem; }
.popover-title { margin: 0; font-size: 1rem; }
.popover-close, .drawer-close { height: 1.9rem; min-width: 1.9rem; padding: 0 0.4rem; }
.facts { display: grid; grid-template-columns: max-content 1fr; gap: 0.25rem 0.9rem; margin: 0 0 0.5rem; }
.facts dt { color: var(--muted); }
.facts dd { margin: 0; overflow-wrap: anywhere; }
.fact-lines { margin: 0; padding-left: 1rem; }
.popover-entry { margin-top: 0.6rem; padding-top: 0.5rem; border-top: 1px solid var(--border); }
.popover-entry .badges { margin-top: 0; }
.entry-meaning { margin: 0.2rem 0; color: var(--muted); font-size: 0.85rem; }
.entry-detail { margin: 0.2rem 0; font-size: 0.85rem; }
.legend-table { border-collapse: collapse; }
.legend-table th, .legend-table td { padding: 0.4rem 0.6rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); font-size: 0.85rem; }
.legend-title { display: block; }
.legend-table td:first-child { min-width: 17rem; }

/* App Detail drawer */
dialog.drawer {
  position: fixed; z-index: 30; inset: 0 0 0 auto; margin: 0; padding: 0; width: min(44rem, 100vw); height: 100vh; max-height: none;
  border: 0; border-left: 1px solid var(--border); background: var(--surface); color: var(--text); box-shadow: var(--elev-2);
}
dialog.drawer[open] { display: flex; flex-direction: column; }
@media (prefers-reduced-motion: no-preference) {
  dialog.drawer[open] { animation: drawer-in 0.18s ease-out; }
  @keyframes drawer-in { from { transform: translateX(2rem); opacity: 0; } to { transform: none; opacity: 1; } }
}
.drawer-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.8rem 1.25rem; border-bottom: 1px solid var(--border); }
.drawer-title { margin: 0; font-size: 1.2rem; }
.drawer-title:focus { outline: none; }
.drawer-body { flex: 1; min-height: 0; overflow: auto; padding: 0.5rem 1.25rem 1.25rem; }
.drawer-footer { border-top: 1px solid var(--border); background: var(--surface); }

.detail-header { padding: 0.5rem 0 0.25rem; }
.detail-sub { margin: 0.2rem 0; color: var(--muted); font-size: 0.85rem; }
.detail-links { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; margin: 0.5rem 0; }
.detail-link, .action-link { color: var(--accent); font: inherit; font-size: 0.9rem; }
.action-link { padding: 0; border: 0; background: none; text-decoration: underline; cursor: not-allowed; color: var(--muted); }
.detail-section { margin-top: 1.1rem; padding-top: 0.75rem; border-top: 1px solid var(--border); }
.detail-heading { margin: 0 0 0.5rem; font-size: 1rem; }
.detail-subheading { margin: 0.9rem 0 0.3rem; font-size: 0.9rem; }
.plain-list { margin: 0; padding: 0; list-style: none; }
.plain-list li + li { margin-top: 0.25rem; }
.commit-list li { overflow-wrap: anywhere; font-size: 0.9rem; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.85em; }
.pending-group { margin: 0.35rem 0; padding: 0.35rem 0.6rem; border: 1px solid var(--border); border-radius: var(--radius); }
.pending-group summary { cursor: pointer; font-weight: 600; }
.pending-group ul { margin-top: 0.35rem; font-size: 0.9rem; }
.sync-line { display: inline-flex; align-items: center; gap: 0.4rem; }

.table-scroll { position: relative; overflow-x: auto; }
.table-scroll:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.detail-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.detail-table th, .detail-table td { padding: 0.4rem 0.6rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); }
.detail-table thead th { font-size: 0.7rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); }
.detail-table tbody th { font-weight: 600; overflow-wrap: anywhere; }
.detail-table tbody tr:hover > * { background: var(--hover); }
.detail-table .badges { margin-top: 0; }

.indicator { margin: 0.2rem 0; font-weight: 700; }
.indicator-inferred { color: var(--sev-warn); }
.indicator-exact { color: var(--text); }
.release + .release { margin-top: 0.75rem; }
.release-meta { color: var(--muted); font-size: 0.85rem; }
.release-notes { margin: 0.25rem 0 0; padding-left: 0.75rem; border-left: 3px solid var(--border); font-size: 0.9rem; }

.notes { margin: 1rem 0 0; padding: 0.6rem 0.8rem; border: 1px solid var(--border); border-radius: var(--radius); }
.notes legend { padding: 0 0.4rem; font-weight: 600; }
.notes-field { margin-right: 0.8rem; }
.notes select { font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 0.2rem 0.4rem; }
.btn[aria-disabled="true"] { cursor: not-allowed; color: var(--muted); }
.notes-details { margin-top: 0.4rem; }
.notes-details summary { cursor: pointer; }
.notes-preview { width: 100%; margin-top: 0.4rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.8rem; color: var(--text); background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 0.5rem; }

.actions-bar { padding: 0.6rem 1.25rem 0.75rem; }
.actions-row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.action { padding: 0.35rem 0.8rem; border: 1px dashed var(--muted); border-radius: 8px; background: var(--surface); color: var(--muted); font: inherit; font-size: 0.9rem; cursor: not-allowed; }
.action-reason { min-height: 2.6em; margin: 0.5rem 0 0; color: var(--muted); font-size: 0.85rem; }

/* source control (Phase 7.8) */
.src-icon { display: inline-flex; flex: none; width: 14px; height: 14px; vertical-align: -2px; color: var(--muted); }
.src-icon svg { width: 100%; height: 100%; }
.src-chip { display: inline-block; padding: 0 0.35rem; border: 1px solid var(--border); border-radius: 4px; color: var(--muted); font-size: 0.72rem; line-height: 1.3; }
.cell .sub { display: flex; align-items: center; gap: 0.35rem; }
.cell .sub-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.cell .sub .src-icon, .cell .sub .src-chip { flex: none; }
.src-line .src-icon { margin-right: 0.15rem; }
.src-cell { display: inline-flex; align-items: center; gap: 0.5rem; }

/* app icons: the logo from ServiceNow, or the generic Igloo app icon */
.app-icon { display: inline-flex; flex: none; align-items: center; justify-content: center; border-radius: 8px; color: var(--muted); overflow: hidden; }
.app-icon-sm { width: 1.25rem; height: 1.25rem; border-radius: 5px; }
.app-icon-md { width: 1.75rem; height: 1.75rem; }
.app-icon-lg { width: 2.5rem; height: 2.5rem; border-radius: 10px; }
.app-icon .icon { width: 100%; height: 100%; }
.app-icon.has-image { background: #fff; box-shadow: inset 0 0 0 1px var(--border); }
.app-icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.density-compact .app-icon-md { width: 1.25rem; height: 1.25rem; border-radius: 5px; }
.detail-title-row { display: flex; align-items: center; gap: 0.75rem; }
.detail-title-row .detail-sub { margin: 0; }
.app-title-cell { display: inline-flex; align-items: center; gap: 0.55rem; }
.app-name-line .sync-icon { margin-left: 0.15rem; }
.filter-note { padding: 0.1rem 0.55rem; border-radius: var(--radius-pill); background: var(--hover); color: var(--text); font-size: 0.75rem; font-weight: 600; }

.app-changed { white-space: nowrap; }

/* The toolbar stays one row on wide screens (search and filters). "Showing n of m", compact rows and export live in the table
   frame below it, where the description can wrap but never gets clipped. */
@media (min-width: 70rem) {
  .filter-row { flex-wrap: nowrap; align-items: center; }
  .toolbar-group:first-child { flex: 1 1 0; min-width: 0; flex-wrap: nowrap; }
}

/* Igloo Pro marker on the write actions of the free edition */
.pro-badge { display: inline-block; margin-left: 0.1rem; padding: 0 0.4rem; border: 1px solid currentColor; border-radius: var(--radius-pill); font-size: 0.65rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; vertical-align: 1px; }

/* App picker (Releases): a select-style field that opens the same list as the Pipeline search */
.app-picker { position: relative; display: inline-flex; align-items: center; }
.app-picker-input { width: 17rem; max-width: 100%; padding: 0.38rem 2rem 0.38rem 0.7rem; font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-pill); text-overflow: ellipsis; cursor: pointer; }
.app-picker.has-icon .app-picker-input { padding-left: 2.3rem; }
.app-picker-input:focus-visible { outline-offset: 0; border-color: var(--brand); }
.app-picker-lead { position: absolute; left: 0.55rem; display: inline-flex; pointer-events: none; }
.app-picker-chevron { position: absolute; right: 0.6rem; width: 1rem; height: 1rem; color: var(--muted); cursor: pointer; }
.app-picker-all .search-option-name { margin-left: 0.15rem; }
.search-option[aria-selected="true"] .search-option-name::after { content: " ✓"; color: var(--accent); }

/* "All apps" stays fixed at the top of the picker list while the apps scroll underneath */
.app-picker-list { padding-top: 0; scroll-padding-top: 2.75rem; }
.app-picker-list .app-picker-all { position: sticky; top: 0; z-index: 1; margin: 0 0 0.25rem; padding: 0.6rem 0.55rem 0.5rem; border-radius: 8px 8px 0 0; border-bottom: 1px solid var(--overlay-border); background: var(--overlay); }
.app-picker-list .app-picker-all:hover, .app-picker-list .app-picker-all.is-active { background: linear-gradient(var(--hover), var(--hover)), var(--overlay); }

/* Source filter dropdown (Pipeline) */
.source-menu { position: relative; display: inline-flex; }
.source-button { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.36rem 0.7rem; border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface); color: var(--text); font: inherit; font-size: 0.85rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
.source-button:hover { border-color: var(--muted); }
.source-button[aria-expanded="true"] { border-color: var(--brand); }
.source-chevron { width: 0.9rem; height: 0.9rem; color: var(--muted); }
.source-panel { position: absolute; z-index: 60; top: calc(100% + 4px); left: 0; min-width: 17rem; padding: 0.35rem; background: var(--overlay); border: 1px solid var(--overlay-border); border-radius: var(--radius); box-shadow: var(--elev-2); }
.source-panel[hidden] { display: none; }
.source-row { display: flex; align-items: center; gap: 0.5rem; padding: 0.15rem 0.3rem; border-radius: 8px; }
.source-row:hover { background: var(--hover); }
.source-label { display: flex; flex: 1; align-items: center; gap: 0.5rem; padding: 0.25rem 0.2rem; cursor: pointer; }
.source-name { flex: 1; font-weight: 600; }
.source-count { color: var(--muted); font-variant-numeric: tabular-nums; }
.source-only { font-size: 0.8rem; }
.source-all { display: block; margin: 0.25rem 0.5rem 0.2rem; font-size: 0.85rem; }

/* The shared table frame (Phase 9.33): description left, tools right, the table inside under a divider. */
.table-frame { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--elev-1); min-width: 0; }
.table-frame-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.75rem; padding: 0.4rem 1rem; }
.table-frame-left { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; min-width: 0; color: var(--muted); font-size: 0.8rem; }
.table-frame-right { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.9rem; margin-left: auto; }
.table-frame-body { border-top: 1px solid var(--border); border-radius: 0 0 var(--radius-lg) var(--radius-lg); min-width: 0; }
.table-frame-body > .state { margin: 0.8rem 1rem; }
.table-frame-body .table-scroll, .table-frame-body .grid-wrap { border: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); background: none; box-shadow: none; }
.view-releases .table-frame-body .table-scroll { border: 0; background: none; box-shadow: none; }
.matrix > .table-frame { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.matrix > .table-frame > .table-frame-body { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.matrix > .table-frame .grid-wrap { flex: 1; }
.view-activity .table-frame { margin-bottom: var(--space-4); }
.view-activity .table-frame-body > .activity-list { padding: 0 1rem; }
.view-releases .table-frame { margin-bottom: var(--space-4); }