.vuln-page { max-width: 1100px; }
.vuln-head { margin-bottom: 2rem; }
.vuln-intro { color: var(--text-dim); max-width: 62ch; }

.vuln-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    margin: 0 0 1.25rem;
}
.vuln-field { display: flex; flex-direction: column; gap: .4rem; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--text-dim); }
.vuln-field-grow { flex: 1 1 260px; }
.vuln-field select,
.vuln-field input {
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: .65rem .8rem;
    font: inherit;
    text-transform: none;
    letter-spacing: normal;
    min-width: 190px;
}
.vuln-field input { width: 100%; }
.vuln-field select:focus-visible,
.vuln-field input:focus-visible,
#vw-refresh:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.vuln-status { color: var(--text-dim); font-size: .95rem; margin: 0 0 1rem; min-height: 1.4em; }

.vuln-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.vuln-table { width: 100%; border-collapse: collapse; font-size: .925rem; }
.vuln-table th {
    text-align: left;
    font-size: .72rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-dim);
    padding: .85rem 1rem;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}
.vuln-table td { padding: .85rem 1rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.vuln-table tbody tr:last-child td { border-bottom: 0; }
.vuln-table tbody tr:hover { background: rgba(255, 255, 255, .02); }
.vuln-cve { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--accent); text-decoration: none; white-space: nowrap; }
.vuln-cve:hover { color: var(--accent-hover); text-decoration: underline; }
.vuln-score { white-space: nowrap; font-variant-numeric: tabular-nums; }
.vuln-date { white-space: nowrap; color: var(--text-dim); }
.vuln-desc { min-width: 320px; }

.vuln-badge {
    display: inline-block;
    padding: .18rem .5rem;
    border-radius: 999px;
    font-size: .7rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    border: 1px solid currentColor;
}
.vuln-critical { color: #ff5c5c; }
.vuln-high { color: #ffa64d; }

.vuln-note { color: var(--text-dim); font-size: .875rem; margin-top: 1.25rem; max-width: 70ch; }

@media (max-width: 640px) {
    .vuln-desc { min-width: 220px; }
    .vuln-field, .vuln-field select, .vuln-field input { width: 100%; min-width: 0; }
    #vw-refresh { width: 100%; }
}
