/* KEV collections (watch.js). Layered on /tools/app.css; light theme only.
   Shared by /tools/patch-today/ and its two entry pages. */
.kc { display: grid; gap: 14px; min-width: 0; }
.kc > * { min-width: 0; }
.kc [hidden] { display: none !important; }
.kc-nw { white-space: nowrap; }

/* Collection picker and view tabs share the ax-seg look. */
.kc-pick, .kc-tabs { display: grid; width: 100%; box-sizing: border-box; }
.kc-pick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kc-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); scroll-margin-top: 120px; }
.kc-pick button, .kc-tabs button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; text-align: center; line-height: 1.25; }
.kc-pick button svg, .kc-tabs button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.kc-tabs button { white-space: nowrap; word-break: keep-all; }
.kc-tabs button[aria-selected="true"] { background: #fff; color: var(--ax-ink); box-shadow: 0 1px 2px rgba(15,23,42,.12), inset 0 -2px 0 var(--ax-accent); }
.kc-pick button:focus-visible, .kc-tabs button:focus-visible, .kc-sort:focus-visible { outline: 3px solid rgba(4,120,87,.35); outline-offset: 2px; }
@media (max-width: 560px) {
  .kc-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kc-pick button { flex-direction: column; gap: 4px; padding: 8px 6px; font-size: 13px; }
}

/* Filters beside the patch-first box. */
.kc-top { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: start; }
@media (min-width: 900px) { .kc-top { grid-template-columns: minmax(0, 1fr) minmax(250px, 300px); } }
.kc-panel { display: grid; gap: 12px; scroll-margin-top: 120px; }
.kc-selects { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .kc-selects { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.kc-chipsrow { display: grid; gap: 8px; }
.kc-chipsrow > b { font-family: var(--ax-mono); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ax-dim); }
.kc-chipsrow .ax-chip { white-space: nowrap; }
.kc-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.kc-foot p { margin: 0; font-family: var(--ax-mono); font-size: 12px; font-weight: 700; color: var(--ax-muted); }
.kc-acts { display: flex; flex-wrap: wrap; gap: 8px; }

.kc-aside { display: grid; gap: 10px; background: #fff; border: 2px solid var(--ax-line); border-radius: 16px; padding: 16px; min-width: 0; }
.kc-lab { font-family: var(--ax-mono); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #344054; }
.kc-big { font-family: var(--ax-display); font-size: 40px; font-weight: 800; line-height: 1; color: var(--ax-bad-text); letter-spacing: -.02em; }
.kc-big small { font-family: var(--ax-mono); font-size: 12.5px; font-weight: 700; color: var(--ax-dim); margin-left: 8px; letter-spacing: 0; }
.kc-aside p { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--ax-muted); }
.kc-aside ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.kc-aside li button, .kc-first button { font: inherit; font-family: var(--ax-mono); font-weight: 800; color: var(--ax-accent); background: none; border: 0; padding: 4px 0; min-height: 32px; cursor: pointer; text-align: left; }
.kc-aside li button { font-size: 12.5px; }
.kc-aside li button span { font-family: var(--ax-display); font-weight: 600; color: var(--ax-muted); margin-left: 6px; }
.kc-first ol { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.55; display: grid; gap: 4px; }
.kc-first button { text-decoration: underline; min-height: 28px; }
.kc-first .ax-card-icon { color: var(--ax-bad); background: var(--ax-bad-bg); border-color: var(--ax-bad-line); }
.kc-tabpanel { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-width: 0; }
.kc-tabpanel > * { min-width: 0; }

/* Tables: fixed columns, scrolling sideways in their wrapper, pinned subject column. */
.kc-tbl { --ax-table-min: 0px; }
.kc-tbl table { table-layout: fixed; }
.kc-tbl tr.row { cursor: pointer; }
.kc-tbl tr.row:focus-visible td { outline: 2px solid rgba(4,120,87,.45); outline-offset: -2px; }
.kc-sort { all: unset; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; }
.kc-sort::after { content: "\2195"; color: var(--ax-dim); font-weight: 400; }
th[aria-sort="ascending"] .kc-sort::after { content: "\2191"; color: var(--ax-accent); }
th[aria-sort="descending"] .kc-sort::after { content: "\2193"; color: var(--ax-accent); }
.c-subj { width: 320px; } .c-fam { width: 170px; } .c-date { width: 112px; } .c-due { width: 118px; } .c-epss { width: 150px; } .c-prio { width: 104px; } .c-rans { width: 96px; }
.c-vend { width: 240px; } .c-cnt { width: 200px; } .c-n { width: 120px; }
@media (max-width: 640px) { .c-subj { width: 178px; } .c-vend { width: 160px; } .c-fam { width: 150px; } }
.kc-caret { display: inline-block; width: 14px; color: var(--ax-dim); font-size: 10px; transition: transform .15s; }
tr.row.is-hl .kc-caret { transform: rotate(90deg); color: var(--ax-accent); }
.kc-cve { display: inline-block; padding: 4px 0; font-family: var(--ax-mono); font-size: 13px; font-weight: 800; color: var(--ax-accent); text-decoration: none; white-space: nowrap; }
.kc-cve:hover { text-decoration: underline; }
.kc-sub { display: block; color: var(--ax-dim); font-size: 11.5px; font-weight: 500; margin-top: 2px; line-height: 1.45; font-variant-numeric: tabular-nums; }
.kc-name { display: block; font-size: 12.5px; font-weight: 500; color: var(--ax-text); margin-top: 4px; }
.kc-strong { font-family: var(--ax-display); font-weight: 700; }
.kc-muted { color: var(--ax-dim); }
.kc-up { color: var(--ax-bad-text); font-weight: 800; }
.kc-dn { color: var(--ax-ok-text); font-weight: 800; }
.kc-tbl .ax-chip { white-space: nowrap; }
.kc-chip--mid { color: #a16207; background: #fefce8; border-color: #fde68a; }
.kc-bar { position: relative; height: 20px; min-width: 84px; background: #eef2f5; border-radius: 7px; overflow: hidden; }
.kc-bar > span { position: absolute; inset: 0 auto 0 0; background: linear-gradient(90deg, var(--ax-accent-2), var(--ax-accent)); border-radius: 7px 0 0 7px; }
.kc-bar.spike > span { background: linear-gradient(90deg, #f43f5e, #be123c); }
.kc-bar > b { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-family: var(--ax-mono); font-size: 10.5px; font-weight: 800; color: var(--ax-ink); font-variant-numeric: tabular-nums; background: rgba(255,255,255,.85); border-radius: 4px; padding: 0 3px; }

/* Detail row: not pinned; its content stays inside the visible part of the scroll box. */
.ax-table-wrap tbody tr.kc-det td, .ax-table-wrap tbody tr.kc-det td:first-child { position: static; box-shadow: none; padding: 0; font-weight: 400; background: #f8fafc; color: var(--ax-text); }
.ax-table-wrap tbody tr.kc-det:hover td { background: #f8fafc; }
.kc-detail { position: sticky; left: 0; box-sizing: border-box; width: var(--wrapw, 100%); max-width: 100%; padding: 14px 16px 16px; display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 14px 22px; font-size: 13px; text-align: left; }
@media (max-width: 760px) { .kc-detail { grid-template-columns: minmax(0, 1fr); } }
.kc-detail h5 { margin: 0 0 4px; font-family: var(--ax-mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .1em; color: #344054; font-weight: 800; }
.kc-detail p { margin: 0 0 12px; line-height: 1.6; overflow-wrap: break-word; }
.kc-detail ul { margin: 0 0 12px; padding-left: 16px; }
.kc-detail li { margin-bottom: 4px; overflow-wrap: break-word; }
.kc-detail a { color: var(--ax-accent); font-weight: 600; }
.kc-detail dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 5px 12px; margin: 0 0 12px; }
.kc-detail dt { color: var(--ax-dim); word-break: keep-all; }
.kc-detail dd { margin: 0; font-variant-numeric: tabular-nums; overflow-wrap: break-word; }
.kc-spark { display: block; width: 100%; max-width: 260px; height: 44px; margin-bottom: 12px; }

/* Year chart. */
.kc-years { display: grid; gap: 8px; background: #fff; border: 2px solid var(--ax-line); border-radius: 14px; padding: 16px; }
.kc-yr { display: grid; grid-template-columns: 46px minmax(0, 1fr) 112px; gap: 10px; align-items: center; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.kc-track { display: flex; height: 22px; background: #eef2f5; border-radius: 6px; overflow: hidden; }
.kc-track .rs { background: #be123c; }
.kc-track .ot { background: var(--ax-accent-2); }
.kc-yr .n { white-space: nowrap; text-align: right; color: var(--ax-muted); font-family: var(--ax-mono); font-size: 11.5px; }
.kc-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--ax-muted); margin: 10px 0 0; }
.kc-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
@media (max-width: 520px) { .kc-yr { grid-template-columns: 40px minmax(0, 1fr) 106px; gap: 8px; } }

.kc-meta { margin: 0; font-family: var(--ax-mono); font-size: 11.5px; line-height: 1.55; color: var(--ax-dim); }
