/* ARC Scientometric Dashboard — design language aligned to the ARC HTA dashboard
   (navy + teal + gold on cool blue-grey; Georgia serif titles, Arial body). */
:root{
  --c-bg:#F7F8FB; --c-surface:#ffffff; --c-border:#E4E8F0; --c-border-soft:#EEF1F7;
  --c-text:#0B2447; --c-muted:#5A6E8C;
  --c-navy:#0B2447; --c-navy-deep:#061633; --c-blue:#19376D;
  /* --c-accent = primary emphasis (links, active, big numbers). Navy-blue, on-brand with HTA. */
  --c-accent:#19376D; --c-accent2:#19376D; --c-accent-soft:#E8EEF7;
  --c-teal:#0E8388; --c-teal-soft:#D6EEEF;
  --c-gold:#B8860B; --c-gold-bright:#D4A017; --c-gold-soft:#FAEDC4;
  --c-coral:#C13B3B; --c-coral-soft:#FBE3E3;
  --c-ice:#E8EEF7;
  --c-com:#C13B3B; --c-mat:#B8860B; --c-ncd:#0E8388; --c-inj:#576CBC;
  --ff-sans:Arial,Helvetica,sans-serif; --ff-serif:Georgia,"Times New Roman",serif;
  --fs-xs:.78rem; --fs-sm:.88rem; --fs-base:1rem; --fs-md:1.15rem; --fs-lg:1.4rem; --fs-xl:2rem; --fs-xxl:2.6rem;
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-5:1.5rem; --s-6:2rem; --s-7:3rem;
  --r-sm:4px; --r-md:6px; --r-lg:10px; --rad:6px; --max-w:1280px;
  --shadow-1:0 1px 2px rgba(11,36,71,.04),0 1px 3px rgba(11,36,71,.06);
  --shadow-2:0 4px 12px rgba(11,36,71,.07),0 1px 4px rgba(11,36,71,.05);
  --shadow-3:0 12px 32px rgba(11,36,71,.10),0 2px 8px rgba(11,36,71,.05);
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--ff-sans);font-size:var(--fs-base);line-height:1.55;color:var(--c-text);background:var(--c-bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--ff-serif);line-height:1.2;color:var(--c-navy);margin:0 0 .4em;font-weight:500}
a{color:var(--c-accent);text-decoration:none} a:hover{text-decoration:underline}
.container{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-5)}
.muted{color:var(--c-muted)}

/* utility bar (navy) — ARC HTA signature */
.util-bar{background:var(--c-navy-deep);color:#dbe4f3}
.util-inner{max-width:var(--max-w);margin:0 auto;padding:.4em var(--s-5);display:flex;align-items:center;gap:var(--s-4);font-size:.72rem;flex-wrap:wrap}
.util-brand{font-weight:700;letter-spacing:.16em;color:#fff}
.util-tag{color:#9fb2d4;letter-spacing:.04em}

/* header (white, sticky) */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--c-border);box-shadow:var(--shadow-1)}
.nav-inner{max-width:var(--max-w);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding:var(--s-3) var(--s-5);flex-wrap:wrap}
.nav-brand{display:flex;align-items:center}
.brand-mark{display:inline-flex;align-items:center;justify-content:center;height:42px;width:42px;border-radius:var(--r-md);background:#fff;padding:3px;box-shadow:var(--shadow-1);margin-right:12px}
.brand-mark img{width:100%;height:100%;object-fit:contain}
.nav-brand-text{display:flex;flex-direction:column;line-height:1.2;font-weight:700;font-family:var(--ff-serif);color:var(--c-navy)}
.nav-brand-text small{font-weight:400;color:var(--c-muted);font-size:var(--fs-xs);font-family:var(--ff-sans)}
.nav-links{display:flex;align-items:center;gap:var(--s-1);flex-wrap:wrap}
.nav-link{padding:var(--s-2) var(--s-3);border-radius:var(--r-sm);font-size:var(--fs-sm);color:var(--c-text);white-space:nowrap;border-bottom:2px solid transparent;transition:color .12s,background .12s}
.nav-link:hover{background:var(--c-ice);text-decoration:none;color:var(--c-blue)}
.nav-link.active{background:transparent;color:var(--c-navy);font-weight:700;border-bottom-color:var(--c-gold)}

/* hero */
.hero{padding:var(--s-7) 0 var(--s-6);border-bottom:1px solid var(--c-border)}
.hero h1{font-size:var(--fs-xxl);max-width:18ch}
.hero .lede{font-size:var(--fs-md);color:#33312c;max-width:62ch;margin-top:var(--s-3)}
.hero .eyebrow{text-transform:uppercase;letter-spacing:.15em;font-size:var(--fs-xs);color:var(--c-gold);font-weight:700;font-family:var(--ff-sans)}

/* kpi — left-border accent + hover lift (HTA stat-tile pattern) */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:var(--s-4);margin:var(--s-5) 0}
.kpi{background:var(--c-surface);border:1px solid var(--c-border);border-left:3px solid var(--c-blue);border-radius:var(--r-md);padding:var(--s-4);box-shadow:var(--shadow-1);transition:transform .15s,box-shadow .15s}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}
.kpi:nth-child(3n+2){border-left-color:var(--c-teal)} .kpi:nth-child(3n){border-left-color:var(--c-gold)}
.kpi .val{font-family:var(--ff-serif);font-size:var(--fs-xl);color:var(--c-navy);line-height:1}
.kpi .lab{font-size:var(--fs-xs);color:var(--c-muted);margin-top:var(--s-2);text-transform:uppercase;letter-spacing:.04em;font-weight:600}

/* sections + panels */
.section{padding:var(--s-6) 0}
.section-head{margin-bottom:var(--s-4)}
.section-head h2{font-size:var(--fs-xl)}
.section-head p{color:var(--c-muted);max-width:70ch;margin:0}
.panel{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--shadow-1);margin-bottom:var(--s-5)}
.panel h3{font-size:var(--fs-md)}
.panel .sub{font-size:var(--fs-sm);color:var(--c-muted);margin:-.2em 0 var(--s-4)}
.cap{font-size:var(--fs-sm);font-weight:600;color:#33312c;margin-bottom:6px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5)}
@media(max-width:880px){.grid-2{grid-template-columns:1fr}}

/* table */
.tbl-wrap{overflow-x:auto}
table.dt{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
table.dt th,table.dt td{padding:var(--s-2) var(--s-3);text-align:left;border-bottom:1px solid var(--c-border-soft);white-space:nowrap}
table.dt th{font-family:var(--ff-sans);font-weight:700;color:var(--c-muted);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em;cursor:pointer;user-select:none}
table.dt th:hover{color:var(--c-accent)}
table.dt tbody tr:hover{background:#EEF2F9}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.bar-cell{position:relative}
.bar-cell .bar{position:absolute;left:0;top:0;bottom:0;background:var(--c-accent-soft);z-index:0;border-radius:2px}
.bar-cell span{position:relative;z-index:1}

/* tags */
.tag{display:inline-block;padding:1px 8px;border-radius:999px;font-size:var(--fs-xs);font-weight:700}
.tag.Communicable{background:#fae3df;color:#922} .tag.NCD{background:#dcf0f0;color:#0a5b63}
.tag.Maternal\/Neonatal\/Nutrition{background:#fbe7d4;color:#9a5316} .tag.Injuries{background:#e8e2f3;color:#5b3f8c}

/* controls */
.controls{display:flex;gap:var(--s-3);align-items:center;flex-wrap:wrap;margin-bottom:var(--s-4)}
.controls label{font-size:var(--fs-sm);color:var(--c-muted)}
select,button.btn{font-family:var(--ff-sans);font-size:var(--fs-sm);padding:var(--s-2) var(--s-3);border:1px solid var(--c-border);border-radius:var(--r-sm);background:#fff;cursor:pointer}
button.btn:hover{border-color:var(--c-accent)}

/* map + network */
.viz-wrap{position:relative;width:100%}
#map svg,#net svg{width:100%;height:auto;display:block}
.prov{stroke:#fff;stroke-width:.5;cursor:pointer;transition:opacity .1s}
.prov:hover{opacity:.78;stroke:#333;stroke-width:1.2}
.node{cursor:pointer;stroke:#fff;stroke-width:.6}
.edge{stroke:#d9d9d9}
.netlabel{font-family:var(--ff-sans);font-size:9px;fill:#333;pointer-events:none}
.legend-row{display:flex;gap:var(--s-4);flex-wrap:wrap;font-size:var(--fs-xs);color:var(--c-muted);margin-top:var(--s-2)}
.legend-row i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.tooltip{position:fixed;pointer-events:none;background:#1a1a1a;color:#fff;padding:6px 10px;border-radius:6px;font-size:var(--fs-xs);line-height:1.4;box-shadow:var(--shadow-2);opacity:0;transition:opacity .08s;z-index:100;max-width:240px}
.chart-box{position:relative;height:340px}
.axis path,.axis line{stroke:#e6e9ee} .axis text{fill:#8a8a82;font-size:10px}
.slab{paint-order:stroke;stroke:#F7F8FB;stroke-width:3.2px;stroke-linejoin:round}
.slab:hover{fill:var(--c-accent)}

/* in-page sub-nav (merged Landscape page) */
.subnav{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:var(--s-4) 0 0}
.subnav span{color:var(--c-muted);font-size:var(--fs-sm)}
.subnav button{font-family:var(--ff-sans);font-size:var(--fs-sm);padding:5px 14px;border:1px solid var(--c-border);border-radius:999px;background:#fff;cursor:pointer;color:var(--c-text)}
.subnav button:hover{border-color:var(--c-accent);color:var(--c-accent)}

/* disease drill-down (GBD hierarchy) */
.crumb{font-size:var(--fs-sm);color:var(--c-muted);margin-bottom:var(--s-4)}
.crumb a{color:var(--c-accent)} .crumb .sep{margin:0 .4em;color:var(--c-border)}
.dbars{display:flex;flex-direction:column;gap:6px}
.dbar{display:grid;grid-template-columns:minmax(130px,30%) 1fr minmax(96px,auto);align-items:center;gap:var(--s-3);
  background:none;border:1px solid transparent;border-radius:var(--r-sm);padding:7px var(--s-3);cursor:pointer;text-align:left;font:inherit;width:100%}
.dbar:hover{background:#EEF2F9;border-color:var(--c-border)}
.dbar-lab{font-size:var(--fs-sm);font-weight:600;color:var(--c-text)}
.dbar-lab em{font-weight:400;color:var(--c-muted);font-style:normal;font-size:var(--fs-xs)}
.dbar-track{position:relative;height:16px;background:#f0eee9;border-radius:3px;overflow:hidden}
.dbar-fill{position:absolute;left:0;top:0;bottom:0;border-radius:3px;min-width:2px}
.dbar-val{font-size:var(--fs-sm);color:var(--c-muted);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.mstrip{display:flex;flex-wrap:wrap;gap:var(--s-5);background:#F1F4F9;border:1px solid var(--c-border-soft);border-radius:var(--r-md);padding:var(--s-3) var(--s-4);margin-bottom:var(--s-4)}
.mstrip div{display:flex;flex-direction:column}
.mstrip b{font-family:var(--ff-serif);font-size:var(--fs-md);color:var(--c-accent);line-height:1.1}
.mstrip span{font-size:var(--fs-xs);color:var(--c-muted)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:var(--s-3)}
.chip{font:inherit;font-size:var(--fs-xs);padding:4px 10px;border:1px solid var(--c-border);border-radius:999px;background:#fff;cursor:pointer;color:var(--c-text)}
.chip:hover{border-color:var(--c-accent)} .chip.on{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}
.art-scroll{max-height:640px;overflow-y:auto;overflow-x:auto}
table.dt.art{table-layout:fixed;width:100%}
table.dt.art td{white-space:normal;vertical-align:top}
table.dt.art th:nth-child(1),table.dt.art td.ti{width:36%}
table.dt.art th:nth-child(2),table.dt.art td.au{width:22%}
table.dt.art th:nth-child(3),table.dt.art td.jo{width:20%}
table.dt.art th:nth-child(n+4),table.dt.art td.num{width:7.3%}
table.dt.art td.ti{font-weight:600} table.dt.art td.ti a{color:var(--c-text)} table.dt.art td.ti a:hover{color:var(--c-accent)}
table.dt.art td.au{color:var(--c-muted);font-size:var(--fs-xs)}
table.dt.art td.jo{color:var(--c-muted);font-size:var(--fs-xs);font-style:italic}
.ptag{display:inline-block;background:#fae3df;color:#a23;border-radius:999px;padding:0 7px;font-size:10px;font-weight:700;white-space:nowrap}
.ptag.semi{background:#fbf0cf;color:#8a6d10}
table.dt.art tr.par{background:#FCEFEF}
table.dt.art tr.semipar{background:#FEF9E7}
.scope-tag{display:inline-block;font-size:var(--fs-xs);font-weight:700;padding:1px 9px;border-radius:999px;background:var(--c-accent);color:#fff;vertical-align:middle}
.scope-tag.overall{background:#e8e6e0;color:#6b6962}
table.dt.hm td{font-variant-numeric:tabular-nums}
table.dt.hm .hm-g{font-weight:400;color:var(--c-muted);font-size:9px}
table.dt.hm .hm-name{cursor:pointer;font-weight:600;white-space:normal;min-width:150px}
table.dt.hm tr[data-i]{cursor:pointer}
table.dt.hm tr[data-i]:hover .hm-name{color:var(--c-accent)}

/* findings list */
.findings{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--s-3)}
.finding{background:var(--c-surface);border:1px solid var(--c-border);border-left:3px solid var(--c-accent);border-radius:var(--r-md);padding:var(--s-4)}
.finding b{font-family:var(--ff-serif);font-size:var(--fs-md);color:var(--c-accent)}

/* gaps */
.gap-card{border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--s-4);margin-bottom:var(--s-3);background:#fff}
.gap-card h4{font-size:var(--fs-base);margin-bottom:.3em} .gap-card h4 .n{color:var(--c-accent)}
.gap-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);align-items:start;margin-bottom:var(--s-3)}
.gap-grid .gap-card.wide{grid-column:1 / -1}   /* full row, for gaps with bigger embedded visualisations */
@media(max-width:760px){
  .gap-grid{grid-template-columns:1fr}
  /* Tighter card padding + chart height on phones */
  .gap-card.wide{padding:var(--s-4)}
  .gap-card .chart-box.mini{height:280px;margin:.4em -.3em}
  /* CVD/TB callout mm-row stack vertical instead of side-by-side */
  .callout .mm{flex-direction:column;gap:var(--s-3)}
  .callout .mm-row{min-width:0}
  /* Exec summary already responsive, leave */
  /* PNPK ranked table: hide less-essential columns, leave Title / Year / Total / Domestic / % */
  .panel .dt th:nth-child(6),.panel .dt td:nth-child(6),
  .panel .dt th:nth-child(7),.panel .dt td:nth-child(7),
  .panel .dt th:nth-child(8),.panel .dt td:nth-child(8){display:none}
  /* Heatmap: smaller font + horizontal scroll */
  .dt.hm{font-size:.78rem}
  .dt.hm tbody td{padding:.35em .4em}
  /* Headlines & exec summary smaller */
  .hero h1{font-size:1.7rem}
  .exec-summary .exec-num{font-size:1.75rem}
  /* Two-col KPI grids inside Gap 11 stack to one column */
  .gap-card .kpi-grid{grid-template-columns:1fr 1fr !important}
}
.gap-grid .gap-card{margin-bottom:0;height:100%}
.gviz{margin:.55em 0 .6em}
/* Embedded chart-boxes inside gap cards, taller so labels and dots are legible at full-width */
.gap-card .chart-box.mini{height:340px;margin:.5em 0 .6em}
.gap-card.wide{padding:var(--s-5)}
.gap-card.wide h4{font-size:var(--fs-md);margin-bottom:.45em}
/* Gap heatmap column headers, keep the label & the "Gap N" tag on separate lines without forcing the column too wide */
.dt.hm thead th{vertical-align:bottom;padding-top:.6em;padding-bottom:.5em}
.dt.hm thead th .hm-g{display:block;font-size:.65rem;color:var(--c-muted);font-weight:600;letter-spacing:.06em;margin-top:.2em;text-transform:uppercase}
.dt.hm tbody td{padding:.45em .55em}
.dt.hm tbody td.hm-name{font-weight:600;font-size:.85rem}
.dt.hm tbody tr:hover td{filter:brightness(0.97)}
.meter{display:grid;grid-template-columns:minmax(120px,38%) 1fr auto;gap:10px;align-items:center;margin:5px 0}
.meter-lab{color:var(--c-muted);font-size:var(--fs-xs)}
.meter-track{position:relative;height:13px;background:#f0eee9;border-radius:3px;overflow:hidden}
.meter-track>.meter-fill{position:absolute;top:0;bottom:0;left:0;border-radius:3px}
.meter-val{font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--fs-sm);white-space:nowrap}
.gnote{font-size:var(--fs-sm);color:var(--c-muted);margin:7px 0 3px;display:flex;align-items:baseline;gap:4px}
.gbig{font-family:var(--ff-serif);font-size:1.5rem;color:var(--c-accent);line-height:1}
.gap-find{font-size:.92rem;color:#2a2a28;margin:.3em 0 .35em;line-height:1.5}
.gap-why{font-size:.84rem;color:var(--c-muted);margin:0;line-height:1.5} .gap-why b{color:#5a5852;font-weight:700}
.statusrows{display:flex;flex-direction:column;gap:5px}
.srow{display:grid;grid-template-columns:12px minmax(130px,34%) 1fr;gap:9px;align-items:center;font-size:var(--fs-sm)}
.sdot{width:9px;height:9px;border-radius:50%}
.sdot.ok{background:#1b9e9e} .sdot.part{background:#e6843c} .sdot.no{background:#c0392b}
.slab{font-weight:600;font-size:var(--fs-xs)} .stext{color:var(--c-muted);font-size:var(--fs-xs)}
.layer-head{font-family:var(--ff-sans);text-transform:uppercase;letter-spacing:.08em;font-size:var(--fs-xs);color:var(--c-muted);font-weight:700;margin:var(--s-5) 0 var(--s-2)}

/* footer + loading */
.site-footer{border-top:1px solid var(--c-border);margin-top:var(--s-7);background:#fff}
.footer-inner{max-width:var(--max-w);margin:0 auto;padding:var(--s-5);display:flex;justify-content:space-between;gap:var(--s-4);flex-wrap:wrap;font-size:var(--fs-sm)}
/* tab/view transition */
.view-enter{animation:viewIn .18s ease}
@keyframes viewIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* sign-in (ARC) button in the utility bar */
.util-auth{margin-left:auto;background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;border-radius:5px;padding:3px 11px;font-size:.78rem;cursor:pointer;font-weight:600}
.util-auth:hover{background:rgba(255,255,255,.14)}
.util-auth.on{border-color:var(--c-teal,#0E8388);background:var(--c-teal,#0E8388)}
/* sign-in modal */
.signin-modal{position:fixed;inset:0;background:rgba(11,36,71,.45);display:flex;align-items:center;justify-content:center;z-index:200}
.signin-card{background:#fff;border-radius:10px;padding:26px 28px;max-width:380px;width:92%;box-shadow:0 18px 50px rgba(11,36,71,.3);position:relative}
.signin-card h3{margin:0 0 6px}
.signin-x{position:absolute;top:10px;right:12px;border:none;background:none;font-size:1.4rem;cursor:pointer;color:#888;line-height:1}
.signin-btn{display:block;width:100%;margin-top:10px;padding:10px 14px;border:1px solid var(--c-border,#e2e0db);border-radius:6px;background:#fff;cursor:pointer;font-weight:600;font-size:.92rem}
.signin-btn:hover{background:#f3f1ec}
.signin-btn.arc{background:var(--c-navy,#0B2447);color:#fff;border-color:var(--c-navy,#0B2447)}
.signin-email{display:flex;gap:6px;margin-top:10px}
.signin-email input{flex:1;padding:9px 11px;border:1px solid var(--c-border,#e2e0db);border-radius:6px;font-size:.9rem}
.signin-email .signin-btn{margin-top:0;width:auto;white-space:nowrap}
/* drill gate (public, no shard) */
.dp-gate{padding:var(--s-6);text-align:center;color:var(--c-muted)}
.dp-gate button{margin-top:10px}
@media(prefers-reduced-motion:reduce){.view-enter{animation:none}}
/* corpus badge on each analysis heading: ABOUT vs BY */
.corpus-badge{display:inline-block;font-size:.6rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:3px 9px;border-radius:999px;vertical-align:middle;margin-left:10px;position:relative;top:-2px}
.corpus-badge.about{background:#e3f0ef;color:#0E8388}
.corpus-badge.by{background:#f3ecd6;color:#8a6d10}
.corpus-badge.both{background:#eceff5;color:#19376D}
.loading{padding:var(--s-7);text-align:center;color:var(--c-muted)}
.loading::before{content:"";display:block;width:30px;height:30px;margin:0 auto 12px;border:3px solid #e4e2dd;border-top-color:var(--c-teal,#0E8388);border-radius:50%;animation:arc-spin .8s linear infinite}
@keyframes arc-spin{to{transform:rotate(360deg)}}
/* skeleton shimmer for chart/viz boxes while their data loads */
.chart-box:empty::after,.viz-wrap:empty::after{content:"";position:absolute;inset:0;border-radius:6px;
  background:linear-gradient(90deg,#f3f1ec 25%,#e9e7e1 37%,#f3f1ec 63%);background-size:400% 100%;animation:arc-shimmer 1.4s ease infinite}
.chart-box,.viz-wrap{position:relative}
@keyframes arc-shimmer{0%{background-position:100% 0}100%{background-position:0 0}}
.note{font-size:var(--fs-xs);color:var(--c-muted);margin-top:var(--s-3)}

/* PRISMA flow */
.prisma{display:flex;flex-direction:column;gap:6px;margin:var(--s-4) 0}
.pr-row{display:grid;grid-template-columns:1fr minmax(240px,440px) 1fr;align-items:center;gap:var(--s-3)}
.pr-box{grid-column:2;background:var(--c-surface);border:1px solid var(--c-border);border-left:3px solid var(--c-teal);border-radius:var(--r-md);padding:var(--s-3) var(--s-4);box-shadow:var(--shadow-1);font-size:var(--fs-sm);color:#33312c}
.pr-box b{display:block;font-family:var(--ff-serif);font-size:var(--fs-lg);color:var(--c-text);margin-top:2px}
.pr-incl{border-left-color:var(--c-accent)} .pr-incl b{color:var(--c-accent)}
.pr-ex{grid-column:3;justify-self:start;align-self:center;background:#fbf6e9;border:1px solid #ecdca6;border-radius:var(--r-md);padding:var(--s-2) var(--s-3);font-size:var(--fs-xs);color:#6b5a1f;max-width:290px}
.pr-ex b{display:block;font-family:var(--ff-serif);font-size:var(--fs-md);margin-top:2px;color:#6b5a1f}
.pr-ex span{color:#8a7a3f}
.pr-arrow{text-align:center;color:var(--c-muted);font-size:1.1rem;line-height:1}
.pr-phase{font-family:var(--ff-sans);text-transform:uppercase;letter-spacing:.12em;font-size:var(--fs-xs);font-weight:700;color:var(--c-accent);text-align:center;margin-top:var(--s-2)}
@media(max-width:760px){.pr-row{grid-template-columns:1fr}.pr-box,.pr-ex{grid-column:1;max-width:100%;justify-self:stretch}}
.caveat{background:#fbf6e9;border:1px solid #ecdca6;border-radius:var(--r-md);padding:var(--s-3) var(--s-4);font-size:var(--fs-sm);color:#6b5a1f;margin:var(--s-4) 0}

/* Universal right-side drill panel, slide-in drawer that lists papers for any clicked category */
/* The drill is a SIDE PANEL, not a modal. The scrim must never block the page — the dashboard's
   "click any bar/cell/row to open/update the panel" design needs the content to stay interactive.
   (Was pointer-events:auto at z90 > nav, which swallowed every click while a panel was open.) */
.drill-backdrop{position:fixed;inset:0;background:rgba(20,18,14,.12);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:90}
.drill-backdrop.open{opacity:1}
/* When the panel is open on a wide screen, dock the whole page into the space left of it so no
   chart, bar or nav link hides behind the panel and every "click to drill" target stays reachable. */
@media(min-width:1180px){
  body.drill-open .nav, body.drill-open #app{margin-right:min(720px,92vw);transition:margin-right .26s cubic-bezier(.2,.7,.2,1)}
}
.nav, #app{transition:margin-right .26s cubic-bezier(.2,.7,.2,1)}
.drill-panel{position:fixed;top:0;right:0;height:100vh;width:min(720px,92vw);background:#fff;box-shadow:-12px 0 32px rgba(20,18,14,.18);border-left:1px solid var(--c-border);transform:translateX(105%);transition:transform .26s cubic-bezier(.2,.7,.2,1);z-index:100;display:flex;flex-direction:column}
.drill-panel.open{transform:translateX(0)}
.dp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s-3);padding:var(--s-4) var(--s-5) var(--s-3);border-bottom:1px solid var(--c-border);background:var(--c-surface)}
.dp-title h3{font-family:var(--ff-serif);font-size:var(--fs-lg);margin:0 0 .25em;color:var(--c-text);line-height:1.25}
.dp-title .sub{font-size:var(--fs-xs);color:var(--c-muted);margin:0;line-height:1.4}
.dp-close{background:none;border:1px solid var(--c-border);border-radius:50%;width:32px;height:32px;font-size:1.4rem;line-height:1;color:var(--c-muted);cursor:pointer;flex-shrink:0;transition:all .15s}
.dp-close:hover{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}
.dp-chips{padding:var(--s-3) var(--s-5) 0;display:flex;flex-wrap:wrap;gap:.4em}
.dp-chips:empty{padding:0}
.dp-body{flex:1;overflow-y:auto;padding:var(--s-3) var(--s-5) var(--s-5)}
.dp-body .dt{font-size:var(--fs-xs)}
.dp-body .dt th{position:sticky;top:0;background:#fff;z-index:2;border-bottom:2px solid var(--c-border)}
.dp-body .dt td.ti a{color:var(--c-text)} .dp-body .dt td.ti a:hover{color:var(--c-accent)}
.dp-body .dt tr.par{background:#FCEFEF}
.dp-body .dt tr.semipar{background:#FEF9E7}
.dp-body .dt tr.row-collapsed.semipar:hover{background:#f7eecb}
/* Per-paper detail expansion in drill panel */
.dp-body .dt tr.row-collapsed{cursor:pointer;transition:background .15s ease}
.dp-body .dt tr.row-collapsed:hover{background:#EEF2F9}
.dp-body .dt tr.row-collapsed:hover.par{background:#fbf1e1}
.dp-body .dt tr.row-expanded{background:#eef2f2!important;font-weight:500}
.dp-body .dt .ti-expand{display:inline-block;color:var(--c-accent);font-size:.85em;margin-right:.25em;user-select:none;width:1em}
.dp-body .dt tr.detail-row td{padding:0!important;border-bottom:2px solid var(--c-accent);background:#F7F8FB}
.paper-detail{padding:var(--s-4) var(--s-5)}
.paper-detail.loading{padding:var(--s-5);text-align:center;color:var(--c-muted)}
.paper-detail .pd-head{margin-bottom:var(--s-3);padding-bottom:var(--s-3);border-bottom:1px solid var(--c-border)}
.paper-detail .pd-title{font-family:var(--ff-serif);font-size:var(--fs-md);color:var(--c-text);font-weight:600;line-height:1.3;margin-bottom:.3em}
.paper-detail .pd-meta{font-size:var(--fs-xs);color:var(--c-muted)}
.paper-detail .pd-meta a{color:var(--c-accent2);text-decoration:none}
.paper-detail .pd-meta a:hover{text-decoration:underline}
.paper-detail .pd-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);margin-bottom:var(--s-3)}
.paper-detail h5{font-family:var(--ff-sans);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--c-muted);font-weight:700;margin:var(--s-3) 0 .5em}
.paper-detail h5:first-child{margin-top:0}
.paper-detail .pd-pills{display:flex;flex-wrap:wrap;gap:.4em;font-size:var(--fs-xs);line-height:1.5}
.paper-detail .pd-pill{background:white;border:1px solid var(--c-border);border-radius:14px;padding:.25em .75em;color:#333;white-space:nowrap}
.paper-detail .pd-pill b{color:#666;font-weight:600;margin-right:.25em}
.paper-detail .pd-pill.accent{background:#fef6e9;border-color:#ecdca6;color:var(--c-accent)}
.paper-detail .pd-pill.accent b{color:var(--c-accent)}
.paper-detail .pd-pill.ok{background:#e9f4ec;border-color:#9ecfa9;color:#1c6c2e}
.paper-detail .pd-pill.ok b{color:#1c6c2e}
.paper-detail .pd-pill.warn{background:#fbe9e3;border-color:#e9a591;color:var(--c-accent)}
.paper-detail .pd-pill.warn b{color:var(--c-accent)}
.paper-detail .pd-pill.muted{color:var(--c-muted);font-style:italic}
.paper-detail .pd-authors{margin-bottom:var(--s-3)}
.paper-detail .pd-authors .pd-au{column-gap:var(--s-5)}
@media(min-width:620px){.paper-detail .pd-authors .pd-au{columns:2}}
.paper-detail .pd-au{list-style:none;padding:0;margin:0;font-size:var(--fs-xs);color:#333}
.paper-detail .pd-au li{break-inside:avoid}
.paper-detail .pd-au li{padding:.4em 0;border-bottom:1px dashed #e6e6e3;line-height:1.45}
.paper-detail .pd-au li:last-child{border-bottom:none}
.paper-detail .pd-au .muted{font-size:.85em;color:var(--c-muted)}
.paper-detail .pd-abstract{margin-top:var(--s-3);padding-top:var(--s-3);border-top:1px solid var(--c-border)}
.paper-detail .pd-abstract p{font-size:var(--fs-xs);line-height:1.5;color:#444;font-family:Georgia,serif;margin:0}
@media(max-width:760px){.paper-detail .pd-grid{grid-template-columns:1fr}}
.dp-empty{padding:var(--s-5);text-align:center;color:var(--c-muted);font-size:var(--fs-sm)}
@media(max-width:760px){.drill-panel{width:100vw;height:88vh;top:auto;bottom:0;border-radius:14px 14px 0 0;border-left:none;border-top:1px solid var(--c-border);transform:translateY(105%)}.drill-panel.open{transform:translateY(0)}}
/* clickable-bar affordance, any bar wrapped in .clickable shows pointer + subtle hover */
.dt tr.click,.dt td.click,.dbar.click{cursor:pointer;transition:background .12s}
.dt tr.click:hover{background:#EEF2F9} .dt td.click:hover{background:#E3EAF5}
/* Executive summary, three big findings, sits between the hero and the KPI strip */
.exec-summary{background:#fff;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--s-5) var(--s-5) var(--s-4);margin:var(--s-4) 0;box-shadow:var(--shadow-1)}
.exec-summary h4{font-family:var(--ff-serif);font-size:var(--fs-md);margin:0 0 var(--s-3);color:var(--c-accent);letter-spacing:.01em}
.exec-summary .exec-row{display:grid;grid-template-columns:160px 1fr;gap:var(--s-4);align-items:center;padding:var(--s-3) 0;border-top:1px solid var(--c-border)}
.exec-summary .exec-row:first-of-type{border-top:none;padding-top:0}
.exec-summary .exec-num{font-family:var(--ff-serif);font-size:2.5rem;font-weight:600;color:var(--c-teal);line-height:1;text-align:right}
.exec-summary .exec-num.warn{color:var(--c-coral)}
.exec-summary .exec-num small{display:block;font-size:.7rem;color:var(--c-muted);font-weight:400;margin-top:.2em;font-family:var(--ff-sans);letter-spacing:.04em;text-transform:uppercase}
.exec-summary .exec-text{font-size:var(--fs-sm);line-height:1.55;color:#33312c}
.exec-summary .exec-text b{font-family:var(--ff-serif);color:var(--c-text)}
@media(max-width:760px){.exec-summary .exec-row{grid-template-columns:1fr;gap:var(--s-2);padding:var(--s-3) 0}.exec-summary .exec-num{text-align:left;font-size:2rem}}
/* CVD/TB callout, research-to-burden mismatch box */
.callout{background:linear-gradient(90deg,#fcefe9 0%,#FCEFEF 100%);border:1px solid #e9c4b3;border-left:4px solid var(--c-accent);border-radius:var(--r-md);padding:var(--s-4) var(--s-5);margin:var(--s-4) 0;font-size:var(--fs-sm);color:#5a2818}
.callout h4{font-family:var(--ff-serif);margin:0 0 .35em;font-size:var(--fs-md);color:var(--c-accent)}
.callout .mm{display:flex;gap:var(--s-5);flex-wrap:wrap;margin-top:var(--s-3)}
.callout .mm-row{flex:1;min-width:180px}
.callout .mm-row b{display:block;font-family:var(--ff-serif);font-size:1.05rem;color:var(--c-text);margin-bottom:.1em}
.callout .mm-row span{font-size:var(--fs-xs);color:#7a3818}

/* === Multi-axis classification panel (T0-T4, SDG, Sackett, HRCS HC) === */
.panel-grid{display:grid;gap:var(--s-5);margin-top:var(--s-3)}
.panel-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mx-card{background:#fff;border:1px solid var(--c-border);border-radius:var(--rad);padding:var(--s-4)}
.mx-card h3{font-family:var(--ff-serif);font-size:var(--fs-md);margin:0 0 .25em;color:var(--c-text)}
.mx-card .mx-sub{color:var(--c-muted);font-size:var(--fs-xs);margin-bottom:var(--s-3);line-height:1.45}
.mx-card .chart-wrap{height:280px;position:relative}
.mx-card .pill.warn{background:#f7e4e0;color:#9c2415;border:1px solid #e2a99e;padding:.05em .35em;border-radius:3px;vertical-align:middle;margin-left:.3em;letter-spacing:.04em;text-transform:uppercase}
.mx-card .muted{color:var(--c-muted)}
@media(max-width:760px){
  .panel-grid-2{grid-template-columns:1fr}
  .mx-card .chart-wrap{height:240px}
}

/* === Emergent themes panel === */
#etPanel .et-wrap{margin-top:var(--s-3)}
#etPanel .et-wrap .chart-wrap{background:#fff;border:1px solid var(--c-border);border-radius:var(--rad);padding:.6em}


/* === Browse papers (public, wrapped) === */
.bp-controls{display:flex;gap:.6em;flex-wrap:wrap;margin:1em 0}
.bp-in,.bp-sel{font-family:inherit;font-size:.85rem;padding:.45em .6em;border:1px solid var(--c-border);border-radius:var(--r-md);background:#fff;color:var(--c-text)}
.bp-in{min-width:240px;flex:1}
.bp-info{font-size:.82rem;color:var(--c-muted);margin:.4em 0 .8em;font-style:italic}
/* fixed layout + wrapping so long titles do not overflow */
table.dt.bp-table{table-layout:fixed;width:100%}
table.dt.bp-table th,table.dt.bp-table td{white-space:normal;vertical-align:top;word-break:break-word;overflow-wrap:anywhere}
table.dt.bp-table th:nth-child(1),table.dt.bp-table td.bp-title{width:34%}
table.dt.bp-table th:nth-child(2),table.dt.bp-table td.bp-j{width:16%}
table.dt.bp-table th:nth-child(3),table.dt.bp-table td:nth-child(3){width:6%}
table.dt.bp-table th:nth-child(4),table.dt.bp-table td:nth-child(4){width:6%}
table.dt.bp-table th:nth-child(5),table.dt.bp-table td:nth-child(5){width:6%}
table.dt.bp-table th:nth-child(6),table.dt.bp-table td:nth-child(6){width:14%}
table.dt.bp-table th:nth-child(7),table.dt.bp-table td.bp-th{width:18%}
.bp-row{cursor:pointer}
.bp-row:hover{background:#EEF2F9}
.bp-title{font-weight:500;line-height:1.35}
.bp-j{color:var(--c-muted);font-size:.8rem;line-height:1.3}
.bp-th{font-size:.8rem;color:#3a5b8c}
.bp-tag{display:inline-block;font-size:.7rem;background:var(--c-ice);color:var(--c-blue);padding:.1em .5em;border-radius:var(--r-sm);font-weight:600;letter-spacing:.02em}
@media(max-width:760px){table.dt.bp-table th:nth-child(2),table.dt.bp-table td.bp-j{display:none}table.dt.bp-table th:nth-child(1),table.dt.bp-table td.bp-title{width:46%}}

/* === Paper detail panel, enhanced === */
.paper-detail .pd-flags{display:flex;flex-wrap:wrap;gap:.4em;margin:.7em 0}
.paper-detail .pd-flag{font-size:.72rem;padding:.25em .65em;border-radius:14px;background:#eef0ee;color:#444;border:1px solid #dfe1de}
.paper-detail .pd-flag.ok{background:#e9f4ec;border-color:#9ecfa9;color:#1c6c2e}
.paper-detail .pd-flag.warn{background:#fbe9e3;border-color:#e9a591;color:#b03a1f}
.paper-detail .pd-flag.semi{background:#fbf3d6;border-color:#e6d28a;color:#8a6d10}
.paper-detail .pd-stats{display:flex;gap:1.4em;margin:.9em 0 1.1em;padding:.7em 0;border-top:1px solid var(--c-border);border-bottom:1px solid var(--c-border)}
.paper-detail .pd-stat{display:flex;flex-direction:column;align-items:flex-start}
.paper-detail .pd-stat-n{font-family:var(--ff-serif);font-size:1.35rem;font-weight:600;color:var(--c-text);line-height:1}
.paper-detail .pd-stat.good .pd-stat-n{color:#1c6c2e}
.paper-detail .pd-stat-l{font-size:.68rem;color:var(--c-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:.2em}
.paper-detail .pd-h{font-family:var(--ff-sans);font-size:.74rem;font-weight:700;color:var(--c-muted);text-transform:uppercase;letter-spacing:.06em;margin:1.1em 0 .5em}
.paper-detail .pd-h-note{font-weight:400;text-transform:none;letter-spacing:0;color:#b03a1f;font-style:italic}
.paper-detail .pd-themes{display:flex;flex-wrap:wrap;gap:.4em;margin-bottom:.4em}
.paper-detail .pd-theme{font-size:.8rem;background:#fbeceb;color:#9c2415;border:1px solid #e6b3ac;border-radius:14px;padding:.3em .8em;font-weight:500}
.paper-detail .pd-abstract{margin:1.1em 0;padding:1em 1.2em;background:#F4F6FA;border-left:3px solid var(--c-accent);border-radius:var(--r-md)}
.paper-detail .pd-abstract p{font-size:.92rem;line-height:1.6;color:#333;font-family:Georgia,serif;margin:0}
.paper-detail .pd-au-c{color:var(--c-accent);font-weight:700}

/* === Eleven-gap framework (overview) === */
#gapFramework{margin-top:var(--s-4)}
.gap-fw-grid{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:var(--s-4);margin-top:var(--s-3)}
.gap-fw-col ol{margin:.4em 0 0 1.1em;padding:0;font-size:.86rem;line-height:1.5;color:#333}
.gap-fw-col li{margin-bottom:.3em}
.gap-fw-h{font-family:var(--ff-serif);font-size:1.02rem;font-weight:600;padding-bottom:.3em;border-bottom:2px solid;color:var(--c-text)}
.gap-fw-h span{display:block;font-family:var(--ff-sans);font-size:.74rem;font-weight:400;color:var(--c-muted);font-style:italic;margin-top:.15em}
.gap-fw-h.agenda{border-color:#3d85c6}
.gap-fw-h.production{border-color:#c0392b}
.gap-fw-h.util{border-color:#1b9e9e}
@media(max-width:820px){.gap-fw-grid{grid-template-columns:1fr}}

/* === Research characteristics view === */
#chHost .panel{margin-bottom:var(--s-4)}
#chHost .panel h2{font-family:var(--ff-serif);font-size:1.2rem;color:var(--c-accent);border-bottom:1px solid var(--c-border);padding-bottom:.25em;margin-bottom:.3em}
.ch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4);margin-top:var(--s-3)}
.ch-card{background:#fff;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--s-3)}
.ch-card h3{font-family:var(--ff-serif);font-size:1rem;margin-bottom:.2em;color:var(--c-text)}
.ch-card .ch-sub{font-size:.78rem;color:var(--c-muted);margin-bottom:.5em;line-height:1.4;min-height:2.4em}
.ch-loading{padding:2em;text-align:center;color:var(--c-muted)}
@media(max-width:900px){.ch-grid{grid-template-columns:1fr}}

/* ---- 11-gap legend (top of Gaps view) ---- */
.gap-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3) var(--s-5);margin-top:var(--s-2)}
.gl-item{display:flex;gap:var(--s-3);align-items:flex-start;padding:.55em 0;border-top:1px solid var(--c-border-soft)}
.gl-item:nth-child(1),.gl-item:nth-child(2){border-top:none}
.gl-n{flex:none;width:1.7em;height:1.7em;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.82rem;color:#fff}
.gl-agenda .gl-n{background:#2b6cb0}.gl-prod .gl-n{background:var(--c-accent)}.gl-util .gl-n{background:var(--c-teal)}
.gl-item b{font-size:.94rem}
.gl-layer{display:inline-block;font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700;padding:.1em .5em;border-radius:10px;vertical-align:middle;margin-left:.3em}
.gl-agenda .gl-layer{background:#e1ecf7;color:#2b6cb0}.gl-prod .gl-layer{background:var(--c-accent-soft);color:var(--c-accent)}.gl-util .gl-layer{background:#d6eff2;color:var(--c-teal)}
.gl-d{font-size:.82rem;color:var(--c-muted);line-height:1.4}
@media(max-width:760px){.gap-legend{grid-template-columns:1fr}.gl-item:nth-child(2){border-top:1px solid var(--c-border-soft)}}

/* ---- classification axes cards (Landscape) ---- */
.axes-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4);margin:var(--s-4) 0}
.axis-card{background:#fff;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--s-4);display:flex;flex-direction:column;box-shadow:var(--shadow-1)}
.axis-card.axis-primary{border-color:var(--c-accent);background:#fff9f7;box-shadow:0 2px 10px rgba(177,61,42,.1)}
.axis-h{display:flex;align-items:center;gap:.4em;margin-bottom:.4em;flex-wrap:wrap}
.axis-h b{font-size:1rem}
.axis-star{color:var(--c-accent);font-size:1.05rem}
.axis-badge{margin-left:auto;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--c-muted);background:var(--c-bg);border:1px solid var(--c-border);padding:.12em .5em;border-radius:10px}
.axis-card p{font-size:.85rem;color:#333;line-height:1.5;margin:0 0 .7em}
.axis-link{font-size:.82rem;font-weight:600;margin-top:auto}
@media(max-width:900px){.axes-grid{grid-template-columns:1fr}}

/* ---- research domain (4-pillar) ---- */
.dom-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-3);margin-top:var(--s-2)}
.dom-card{background:#fff;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--s-3);box-shadow:var(--shadow-1)}
.dom-h{display:flex;align-items:baseline;justify-content:space-between;gap:.4em}
.dom-h b{font-size:.95rem;line-height:1.2}
.dom-pct{font-family:var(--ff-serif);font-size:1.35rem;font-weight:700}
.dom-sub{font-size:.72rem;color:var(--c-muted);line-height:1.4;margin-top:.35em}
.dom-subgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-4);margin-top:var(--s-2)}
.dom-subh{font-family:var(--ff-serif);font-weight:700;font-size:.9rem;border-bottom:2px solid var(--c-border-soft);padding-bottom:.2em;margin-bottom:.4em}
.dom-subrow{display:grid;grid-template-columns:1fr 70px 42px;align-items:center;gap:.5em;width:100%;background:none;border:none;border-radius:var(--r-sm);padding:.35em .4em;cursor:pointer;text-align:left;font:inherit}
.dom-subrow:hover{background:#EEF2F9}
.dsr-lab{font-size:.8rem;color:var(--c-text);line-height:1.25}
.dsr-bar{height:8px;background:#f0eee9;border-radius:3px;overflow:hidden}
.dsr-bar i{display:block;height:100%}
.dsr-n{font-size:.78rem;color:var(--c-muted);text-align:right;font-variant-numeric:tabular-nums}
.dom-xc-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5em;margin-top:var(--s-3);padding-top:var(--s-3);border-top:1px dashed var(--c-border)}
.dom-xc-lab{font-size:.82rem;font-weight:700;color:var(--c-muted)}
.dom-xc-chip{font-size:.8rem;background:#fbf3df;border:1px solid #f0d9b8;color:#5c4326;padding:.18em .6em;border-radius:999px}
.dom-xc-chip b{color:#7a3818}
@media(max-width:900px){.dom-grid,.dom-subgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.dom-grid,.dom-subgrid{grid-template-columns:1fr}}

/* ---- callout box ---- */
.callout{border-radius:var(--r-md);padding:var(--s-4);font-size:.88rem;line-height:1.55;border:1px solid var(--c-border)}
.callout-warn{background:#FCEFEF;border-color:#f0d9b8;color:#5c4326}
.callout-warn b{color:#7a3818}

/* ---- About×By quadrant grid (C2, 2026-06-10) ---- */
.kpi.click{cursor:pointer;transition:box-shadow .15s,transform .15s}
.kpi.click:hover{box-shadow:var(--shadow-2);transform:translateY(-1px)}
.quad-grid{display:grid;grid-template-columns:auto 1fr 1fr;gap:var(--s-2);align-items:stretch;margin-top:var(--s-3)}
.quad-grid .qhead{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.8rem;color:var(--c-muted);padding:var(--s-2);text-align:center}
.quad-grid .qhead.vert{writing-mode:vertical-rl;transform:rotate(180deg);justify-self:center}
.qcell{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--s-4);box-shadow:var(--shadow-1);min-height:96px}
.qcell.click{cursor:pointer;transition:box-shadow .15s,transform .15s}
.qcell.click:hover{box-shadow:var(--shadow-2);transform:translateY(-1px)}
.qcell.muted{background:repeating-linear-gradient(45deg,#fafafa,#fafafa 6px,#f2f2f2 6px,#f2f2f2 12px);color:var(--c-muted)}
.qcell .qlab{font-size:.78rem;font-weight:600;color:var(--c-text);margin-bottom:4px}
.qcell .qn{font-family:var(--ff-serif);font-size:var(--fs-xl);color:var(--c-accent);line-height:1.1}
@media(max-width:640px){.quad-grid{grid-template-columns:1fr 1fr}.quad-grid .qhead.vert{display:none}}

/* ---- topics & gaps (B2/B3) ---- */
.sig-legend{margin:8px 0 0;padding-left:18px;font-size:.85rem;line-height:1.7;color:var(--c-text)}
.sig-legend b{color:var(--c-accent)}

/* ============ ARC HTA design-language alignment (redesign 2026-06-12) ============ */
/* top loading/accent bar (navy→gold→teal) */
.util-bar{position:relative}
.util-bar::after{content:"";position:absolute;left:0;right:0;bottom:-0px;height:0}
/* section eyebrow (gold uppercase sublabel above section titles) */
.section-head h2{position:relative}
.section-head{margin-bottom:var(--s-5)}
/* panels: crisper HTA card */
.panel{border-radius:var(--r-md)}
.panel h3{font-weight:500;color:var(--c-navy)}
/* layer/eyebrow labels → gold (HTA sublabel) */
.layer-head{color:var(--c-gold);letter-spacing:.15em}
/* tags / pills → HTA semantic soft-bg */
.tag{border-radius:var(--r-sm);font-weight:600;letter-spacing:.03em;text-transform:uppercase;font-size:.7rem;padding:.12em .5em}
.tag.Communicable{background:var(--c-coral-soft);color:var(--c-coral)}
.tag.NCD{background:var(--c-teal-soft);color:var(--c-teal)}
.tag.Maternal\/Neonatal\/Nutrition{background:var(--c-gold-soft);color:var(--c-gold)}
.tag.Injuries{background:var(--c-ice);color:var(--c-blue)}
.scope-tag{background:var(--c-blue)} .scope-tag.overall{background:var(--c-ice);color:var(--c-muted)}
/* parachute ✈ pill → coral soft */
.ptag{background:var(--c-coral-soft);color:var(--c-coral);border-radius:var(--r-sm)}
/* finding cards: navy serif number + teal left border */
.finding{border-left-color:var(--c-teal)} .finding b{color:var(--c-navy)}
/* PRISMA included box → navy/teal, not terracotta */
.pr-incl{border-left-color:var(--c-teal)} .pr-incl b{color:var(--c-teal)}
.pr-phase{color:var(--c-gold)}
/* exec-summary header → navy serif */
.exec-summary h4{color:var(--c-navy)}
/* domain pct + mstrip + gbig numbers → navy serif (was terracotta via --c-accent) */
.dom-pct,.gbig,.mstrip b,.pd-stat-n,.paper-detail .pd-title{color:var(--c-navy)}
/* meters/bars subtle cool track */
.meter-track,.dbar-track,.dsr-bar{background:#EAEEF5}
/* buttons / selects → HTA */
select,button.btn,.bp-in,.bp-sel{border-radius:var(--r-sm);border-color:var(--c-border)}
select:hover,button.btn:hover{border-color:var(--c-blue)}
.btn-ghost{font-family:var(--ff-sans);font-size:var(--fs-sm);padding:.4em .9em;border:1px solid var(--c-border);border-radius:var(--r-sm);background:#fff;cursor:pointer;color:var(--c-text)}
.btn-ghost:hover{border-color:var(--c-blue);color:var(--c-blue)}
/* footer → navy text */
.site-footer strong{font-family:var(--ff-serif);color:var(--c-navy)}
/* drill panel close → coral on hover (HTA primary action color) */
.dp-close:hover{background:var(--c-coral);border-color:var(--c-coral)}
/* hero lede readable navy-grey */
.hero .lede{color:#33425c}
/* mobile: hide utility tag */
@media(max-width:640px){.util-tag{display:none}}

/* ============ UX REDESIGN (2026-06-13): grouped nav, sub-tabs, guided flow ============ */
/* grouped nav */
.nav-links{gap:var(--s-3)}
.nav-group{display:inline-flex;align-items:center;gap:2px;position:relative;padding-left:var(--s-3);border-left:1px solid var(--c-border)}
.nav-group:first-child{border-left:none;padding-left:0}
.nav-group-lbl{font-size:.6rem;text-transform:uppercase;letter-spacing:.12em;color:var(--c-muted);font-weight:700;margin-right:4px;opacity:.7}
@media(max-width:900px){.nav-group-lbl{display:none}.nav-group{border-left:none;padding-left:0}}
/* in-page sub-tab strip (Landscape / Classification hubs) */
.subtabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--c-border);margin:var(--s-4) 0 0;padding-bottom:0}
.subtab{font-family:var(--ff-sans);font-size:var(--fs-sm);padding:.5em 1em;border:none;background:none;cursor:pointer;color:var(--c-muted);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.subtab:hover{color:var(--c-blue)}
.subtab.on{color:var(--c-navy);font-weight:700;border-bottom-color:var(--c-gold)}
@media(max-width:640px){.subtabs{flex-wrap:nowrap;overflow-x:auto}}
/* guided "Start here" path */
.guided{background:linear-gradient(180deg,#fff,#fbfcfe);border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--s-4) var(--s-5);margin:var(--s-5) 0;box-shadow:var(--shadow-1)}
.guided h4{font-family:var(--ff-serif);font-size:var(--fs-md);color:var(--c-navy);margin:0 0 var(--s-3)}
.guided ol{margin:0;padding:0;list-style:none;counter-reset:gd;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--s-3)}
.guided li{counter-increment:gd;position:relative;padding:.6em .7em .6em 2.4em;border:1px solid var(--c-border-soft);border-radius:var(--r-sm);background:#fff;font-size:var(--fs-sm);line-height:1.4}
.guided li::before{content:counter(gd);position:absolute;left:.6em;top:.6em;width:1.5em;height:1.5em;border-radius:50%;background:var(--c-navy);color:#fff;font-family:var(--ff-serif);font-size:.8rem;display:flex;align-items:center;justify-content:center}
.guided li a{font-weight:700}
.guided li small{display:block;color:var(--c-muted);font-size:.75rem;margin-top:.2em}
/* "Next →" footer link */
.next-step{display:flex;justify-content:flex-end;margin:var(--s-5) 0 0}
.next-step a{display:inline-flex;align-items:center;gap:.4em;font-weight:700;font-size:var(--fs-sm);background:var(--c-navy);color:#fff;padding:.55em 1.1em;border-radius:var(--r-sm)}
.next-step a:hover{background:var(--c-blue);text-decoration:none}
/* layer banner (top of a section) */
.layer-banner{display:flex;align-items:center;gap:var(--s-3);background:var(--c-ice);border:1px solid var(--c-border);border-left:4px solid var(--c-gold);border-radius:var(--r-md);padding:.7em var(--s-4);margin:var(--s-4) 0;font-size:var(--fs-sm)}
.layer-banner b{font-family:var(--ff-sans);text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;color:var(--c-gold);font-weight:700}
.layer-banner span{color:var(--c-muted)}
/* Recommendations view */
.rec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s-4);margin-top:var(--s-3)}
.rec-card{background:#fff;border:1px solid var(--c-border);border-top:3px solid var(--c-teal);border-radius:var(--r-md);padding:var(--s-4);box-shadow:var(--shadow-1);display:flex;flex-direction:column}
.rec-card.priority{border-top-color:var(--c-coral)} .rec-card.target{border-top-color:var(--c-gold)}
.rec-tag{font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700;color:var(--c-muted);margin-bottom:.3em}
.rec-card h4{font-family:var(--ff-serif);font-size:var(--fs-base);color:var(--c-navy);margin:0 0 .3em;line-height:1.3}
.rec-card p{font-size:var(--fs-sm);color:#33425c;line-height:1.5;margin:0 0 .6em}
.rec-card .rec-metric{font-family:var(--ff-serif);font-size:1.3rem;color:var(--c-navy);line-height:1}
.rec-card .rec-link{margin-top:auto;font-size:var(--fs-sm);font-weight:700}
/* paper-detail Context footer */
.pd-context{margin-top:var(--s-3);padding-top:var(--s-3);border-top:1px dashed var(--c-border);font-size:var(--fs-xs);color:var(--c-muted)}
.pd-context a{font-weight:600}
.pd-context .pd-ctx-tag{display:inline-block;background:var(--c-ice);color:var(--c-blue);border-radius:var(--r-sm);padding:.1em .5em;margin:0 .3em .3em 0;font-weight:600}

/* merged About×By inside Overview: neutralise nested .container double-padding */
.container .container{max-width:none;margin:0;padding:0}

/* plain-language glossary (Methods) */
.glossary{margin:var(--s-3) 0 0;display:grid;gap:0}
.gl-row{display:grid;grid-template-columns:minmax(160px,230px) 1fr;gap:var(--s-4);padding:.7em 0;border-top:1px solid var(--c-border-soft)}
.gl-row dt{font-weight:700;color:var(--c-navy);font-size:var(--fs-sm)}
.gl-row dd{margin:0;color:#33425c;font-size:var(--fs-sm);line-height:1.5}
@media(max-width:640px){.gl-row{grid-template-columns:1fr;gap:.2em}}

/* utility-bar "back to ARC" link */
.util-bar .util-brand{text-decoration:none}
.util-bar .util-brand:hover{color:#fff;text-decoration:none}
.util-home{margin-left:auto;color:#cfe;font-weight:600;white-space:nowrap}
.util-home:hover{color:#fff;text-decoration:none}

/* outward 4-pillar domain bar (DeepSeek 5-rater) */
.dombar{display:flex;height:18px;border-radius:var(--r-sm);overflow:hidden;margin:.3em 0 .4em;border:1px solid var(--c-border)}
.dombar-seg{height:100%}
.dombar-leg{display:flex;flex-wrap:wrap;gap:.4em 1em;font-size:var(--fs-xs);color:var(--c-muted)}
.dombar-leg i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.dseg-D1_BASIC{background:#576CBC} .dseg-D2_CLINICAL{background:#0E8388} .dseg-D3_EPI{background:#B8860B} .dseg-D4_HSP{background:#19376D}

/* heatmap cell legibility on the diverging ramp */
.dt.hm tbody td.num{text-shadow:0 1px 1px rgba(255,255,255,.55);font-weight:600;color:#1a2b40}

/* corpus toggle (Classification: ABOUT ↔ BY/outward) */
.corpus-toggle{display:inline-flex;gap:0;border:1px solid var(--c-border);border-radius:var(--r-md);overflow:hidden;margin:var(--s-3) 0 0}
.ctog{font-family:var(--ff-sans);font-size:var(--fs-sm);padding:.5em 1em;border:none;background:#fff;cursor:pointer;color:var(--c-muted)}
.ctog+.ctog{border-left:1px solid var(--c-border)}
.ctog.on{background:var(--c-navy);color:#fff;font-weight:700}
/* ABOUT-vs-outward comparison rows */
.cmp-row{display:grid;grid-template-columns:minmax(110px,170px) 1fr auto 1fr auto;gap:.5em;align-items:center;padding:.25em 0;font-size:var(--fs-xs)}
.cmp-l{color:var(--c-text)}
.cmp-b{height:10px;background:#eef1f7;border-radius:3px;overflow:hidden}
.cmp-b i{display:block;height:100%}
.cmp-v{font-variant-numeric:tabular-nums;color:var(--c-muted);white-space:nowrap}
.cmp-v small{color:#9aa6c0}
@media(max-width:640px){.cmp-row{grid-template-columns:1fr;gap:.1em}.cmp-b{display:none}}
