/* Supplementary styles for the static DeNovoVHH-DB mirror.
   Loads after the app's style.css; palette matches the app (teal #0e7c86, navy). */
:root{--teal:#0e7c86;--navy:#12314c;--ink:#1a2733;--muted:#5b6b7a;--line:#e4e9ee;--bg:#f6f8fa}
.menu.static{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.menu.static a{display:block;padding:8px 14px;color:#eaf2f4;text-decoration:none;border-radius:8px;font-weight:600}
.menu.static a.active,.menu.static a:hover{background:rgba(255,255,255,.14)}
.hero{padding:34px 0 20px}.hero.tight{padding:22px 0 8px}
.hero h1{font-size:30px;margin:0 0 10px;color:var(--navy)}
.lede{max-width:70ch;color:var(--muted);font-size:16px;line-height:1.55;margin:0 0 16px}
.lede em{color:var(--teal);font-style:normal;font-weight:600}
.btn{display:inline-block;background:var(--teal);color:#fff;padding:11px 18px;border-radius:9px;text-decoration:none;font-weight:700}
.btn:hover{background:#0b626b}
.stat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:8px 0 22px}
.stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 12px;text-align:center}
.stat .v{font-size:24px;font-weight:800;color:var(--teal)}.stat .k{font-size:12px;color:var(--muted);margin-top:4px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin:0 0 16px}
.card h2{font-size:17px;margin:0 0 12px;color:var(--navy)}
table.mini{width:100%;border-collapse:collapse;font-size:14px}
table.mini td,table.mini th{padding:7px 6px;border-bottom:1px solid var(--line);text-align:left}
table.mini .num{text-align:right;font-variant-numeric:tabular-nums}
table.mini.cov th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.03em}
.note{color:var(--muted);font-size:13px;line-height:1.5;margin:12px 0 0}
.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:8px 0 14px}
.controls input[type=search]{flex:1;min-width:260px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;font-size:15px}
.controls select{padding:10px;border:1px solid var(--line);border-radius:9px}
.controls .chk{font-size:14px;color:var(--ink);display:flex;align-items:center;gap:5px}
.count{color:var(--muted);font-size:13px;margin-left:auto}
#tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:#fff}
table.browse{width:100%;border-collapse:collapse;font-size:14px}
table.browse th{background:#f0f4f6;color:var(--navy);text-align:left;padding:10px;position:sticky;top:0;font-size:12px;text-transform:uppercase;letter-spacing:.03em}
table.browse td{padding:9px 10px;border-bottom:1px solid var(--line)}
table.browse tbody tr:hover,table.browse tr.r:hover{background:#f2fafb;cursor:pointer}
table.browse tr.r:hover td{background:#f2fafb}
.badge{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:700}
.q-High{background:#0e7c86;color:#fff}.q-Moderate{background:#d9e8ea;color:#0b626b}
.q-Low{background:#eef1f3;color:#6b7a88}.q-Unresolved{background:#f3e9e9;color:#9a6b6b}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;word-break:break-all}
.pager{display:flex;gap:6px;justify-content:center;align-items:center;margin:16px 0;flex-wrap:wrap}
.pager button{padding:7px 12px;border:1px solid var(--line);background:#fff;border-radius:8px;cursor:pointer}
.pager button.on{background:var(--teal);color:#fff;border-color:var(--teal)}
.pager button:disabled{opacity:.4;cursor:default}
.nr{color:#9aa7b2;font-style:italic}
.overlay{display:none;position:fixed;inset:0;background:rgba(10,20,30,.55);z-index:50;padding:24px;overflow:auto}
.overlay.on{display:block}
.modal{max-width:900px;margin:0 auto;background:#fff;border-radius:14px;padding:24px 28px;position:relative}
.close{position:absolute;top:14px;right:16px;border:none;background:#eef1f3;border-radius:8px;width:34px;height:34px;font-size:16px;cursor:pointer}
.det h2{font-size:22px;color:var(--navy);margin:0 0 4px}
.det .sub{color:var(--muted);margin:0 0 14px}
.det section{border-top:1px solid var(--line);padding:14px 0}
.det h3{font-size:14px;text-transform:uppercase;letter-spacing:.04em;color:var(--teal);margin:0 0 8px}
.kv{display:grid;grid-template-columns:180px 1fr;gap:6px 14px;font-size:14px}
.kv div.k{color:var(--muted)}
.flag{display:inline-block;background:#eef6f7;color:#0b626b;border:1px solid #cfe6e9;border-radius:6px;padding:1px 7px;margin:2px 3px 0 0;font-size:12px}
.pill-exp{background:#0e7c86;color:#fff;padding:1px 8px;border-radius:6px;font-size:11px;font-weight:700}
.pill-pred{background:#b8860b;color:#fff;padding:1px 8px;border-radius:6px;font-size:11px;font-weight:700}
.maintainer{display:flex;gap:14px;align-items:center}.maintainer img{width:84px;height:84px;border-radius:10px;object-fit:cover}
.dl{margin:0;padding-left:18px;line-height:1.9}
@media(max-width:820px){.stat-grid{grid-template-columns:repeat(3,1fr)}.two-col{grid-template-columns:1fr}.kv{grid-template-columns:130px 1fr}}