/* Per-disease report — additions to the shared atlas stylesheet.
   atlas-base.css supplies the shell, rail, chapter, panel, map and record
   vocabulary; only what this report adds is defined here. Lane hues match
   graph-core.js exactly, so a colour means the same thing in the graph, the
   ranked panels and the gap table. */
.dr{--risk:#a35138;--treat:#167b70;--protect:#335f91;--mech:#766092;--assoc:#64788a}

/* ---------------------------------------------------------- graph embed */
.dr-graph{border:1px solid #d9e4eb;border-radius:8px;background:#fff;overflow:hidden}
.dr-graph-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:11px 15px;
  border-bottom:1px solid #d9e4eb;background:#fbfcfd}
.dr-graph-bar>b{font:600 10.5px var(--ex-sans,sans-serif);letter-spacing:.1em;
  text-transform:uppercase;color:#566b7d}
.dr-seg{display:inline-flex;border:1px solid #d9e4eb;border-radius:5px;overflow:hidden}
.dr-seg button{font:400 12px var(--ex-sans,sans-serif);padding:6px 12px;border:0;
  background:#fff;color:#566b7d;cursor:pointer}
.dr-seg button+button{border-left:1px solid #d9e4eb}
.dr-seg button[aria-pressed="true"]{background:#167b70;color:#fff}
.dr-lanes{display:flex;flex-wrap:wrap;gap:5px;margin-left:auto}
.dr-lanes button{font:400 11.5px var(--ex-sans,sans-serif);padding:4px 10px;
  border:1px solid #d9e4eb;border-radius:14px;background:#fff;cursor:pointer;
  display:flex;align-items:center;gap:6px}
.dr-lanes button::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.dr-lanes button[aria-pressed="false"]{opacity:.42}
.dr-l-risk{color:var(--risk)}.dr-l-treat{color:var(--treat)}.dr-l-protect{color:var(--protect)}
.dr-l-mech{color:var(--mech)}.dr-l-assoc{color:var(--assoc)}
.dr-canvas{display:grid;grid-template-columns:minmax(0,1fr) 250px}
.dr-canvas svg{width:100%;height:auto;display:block}
.dx-node{cursor:pointer}
.dx-node text{font:400 16px var(--ex-sans,sans-serif);fill:#24354b;pointer-events:none}
.dx-node:hover circle,.dx-node:focus circle{stroke:#24354b;stroke-width:2.5}
.dx-node:focus{outline:none}.dx-node:focus text{text-decoration:underline}
.dx-hub text{font-family:var(--ex-display,sans-serif);font-weight:500;fill:#fff}
.dx-hub circle{stroke:#fff;stroke-width:3}
.dx-edge{fill:none;stroke-linecap:round}
.dx-lanelab{font:600 13px var(--ex-sans,sans-serif);letter-spacing:.1em;text-transform:uppercase}
.dr-aside{border-left:1px solid #d9e4eb;padding:15px;background:#fbfcfd;font-size:12.5px;min-width:0}
.dr-aside h4{font:500 18px/1.2 var(--ex-display,sans-serif);margin:0 0 3px}
.dr-aside .rel{font:600 9.5px var(--ex-sans,sans-serif);letter-spacing:.09em;
  text-transform:uppercase;margin:0 0 11px}
.dr-aside dl{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin:0 0 12px}
.dr-aside dt{color:#566b7d}
.dr-aside dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.dr-aside p{color:#566b7d;line-height:1.6;margin:0 0 11px}
.dr-aside a.go{display:block;text-align:center;padding:8px;border-radius:5px;
  background:#167b70;color:#fff;text-decoration:none;font-size:12.5px}

/* ---------------------------------------------------------- ranked lists */
.dr-lists{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));margin-top:18px}
.dr-list{border:1px solid #d9e4eb;border-radius:7px;background:#fff;overflow:hidden}
.dr-list>header{padding:10px 14px;border-bottom:1px solid #d9e4eb;display:flex;
  align-items:baseline;gap:8px}
.dr-list>header b{font:600 11px var(--ex-sans,sans-serif);letter-spacing:.06em;text-transform:uppercase}
.dr-list>header small{margin-left:auto;color:#566b7d;font-size:11px}
.dr-list ol{list-style:none;margin:0;padding:5px 0}
.dr-list li{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:6px 14px}
.dr-list li:hover{background:#edf3f6}
.dr-list li a,.dr-list li span.t{font-size:13.5px;color:#24354b;text-decoration:none}
.dr-list li a{text-decoration:underline;text-decoration-color:#c3d3dd}
.dr-list li a:hover{color:#167b70}
.dr-list li i{font-style:normal;font-size:11.5px;color:#566b7d;font-variant-numeric:tabular-nums;
  white-space:nowrap}
.dr-bar{grid-column:1/-1;height:3px;background:#edf3f6;border-radius:2px;overflow:hidden}
.dr-bar span{display:block;height:100%}
.dr-note-warn{padding:10px 14px;font-size:12px;color:#8a5a10;background:#fdf8ef;border-top:1px solid #f0e3cb}

/* ---------------------------------------------------------- charts */
.dr-chart{border:1px solid #d9e4eb;border-radius:7px;background:#fff;padding:15px}
.dr-chart svg{width:100%;height:auto;display:block}
.dr-chart text{font:400 11px var(--ex-sans,sans-serif);fill:#566b7d}
.dr-legend{display:flex;flex-wrap:wrap;gap:15px;margin-top:11px;font-size:11.5px;color:#566b7d}
.dr-legend b{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px}
.dr-split{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.dr-stack{display:flex;height:32px;border-radius:5px;overflow:hidden;border:1px solid #d9e4eb}
.dr-stack span{display:flex;align-items:center;justify-content:center;font-size:10.5px;
  color:#fff;min-width:0;overflow:hidden;white-space:nowrap}

/* movement (rising / falling) */
.dr-move{display:grid;gap:20px;grid-template-columns:1fr 1fr}
.dr-move h4{font:600 11px var(--ex-sans,sans-serif);letter-spacing:.08em;text-transform:uppercase;
  color:#566b7d;margin:0 0 10px}
.dr-move-row{display:grid;grid-template-columns:1fr 78px;gap:10px;align-items:center;
  padding:5px 0;font-size:13px}
.dr-move-track{grid-column:1/-1;height:4px;background:#edf3f6;border-radius:2px;overflow:hidden}
.dr-move-track i{display:block;height:100%}
.dr-move-row b{font-variant-numeric:tabular-nums;text-align:right;font-size:12px}

/* ---------------------------------------------------------- company map */
.dr-map{position:relative;border:1px solid #d9e4eb;border-radius:7px;background:#fff;padding:12px}
.dr-map svg{width:100%;height:auto;display:block}
.dr-map .pt{fill:#167b70;fill-opacity:.62;stroke:#fff;stroke-width:.6}
.dr-map .land{fill:#e8eef3}
.dr-maplabel{font-size:11.5px;color:#566b7d;margin:9px 0 0}

/* ---------------------------------------------------------- tables */
.dr-table{width:100%;border-collapse:collapse;font-size:13px}
.dr-table th{font:600 10px var(--ex-sans,sans-serif);letter-spacing:.07em;text-transform:uppercase;
  color:#566b7d;text-align:right;padding:9px 12px;border-bottom:1px solid #d9e4eb;white-space:nowrap}
.dr-table th:first-child{text-align:left}
.dr-table td{padding:8px 12px;border-bottom:1px solid #edf3f6;vertical-align:top}
.dr-table td:not(:first-child){text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.dr-table tr:last-child td{border-bottom:0}
.dr-table .sub{display:block;font-size:11px;color:#566b7d;margin-top:2px}
.dr-scroll{max-height:430px;overflow:auto;border:1px solid #d9e4eb;border-radius:7px;background:#fff}

.dr-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;
  background:#d9e4eb;border:1px solid #d9e4eb;border-radius:7px;overflow:hidden;margin:18px 0 0}
.dr-kpis div{background:#fff;padding:13px 15px}
.dr-kpis b{display:block;font:500 24px/1.1 var(--ex-display,sans-serif);color:#24354b}
.dr-kpis span{display:block;font-size:11px;color:#566b7d;margin-top:4px;line-height:1.45}
.dr-tag{display:inline-block;padding:2px 7px;border-radius:3px;font-size:10.5px;font-weight:600}
.dr-up{background:#e4efe9;color:#14604f}
.dr-down{background:#fbeee0;color:#8a5a10}
.dr-flat{background:#edf3f6;color:#566b7d}

@media (max-width:860px){
  .dr-canvas{grid-template-columns:1fr}
  .dr-aside{border-left:0;border-top:1px solid #d9e4eb}
  .dr-lanes{margin-left:0;width:100%}
  .dr-move{grid-template-columns:1fr}
}

/* ---------------------------------------------------- hero scene stages */
/* The atlas .scene carries urban-heat's warm accent; a metabolic schematic
   reads better on a cool ground. Stages are plain attribute switches so the
   diagram still shows its first state without JavaScript. */
.dr .scene{background:#eaf2f1;border-color:#cfe1de}
.dr .scene-caption{color:#3d5f5b}
.dr-stage{opacity:0;transition:opacity .25s}
.dr .scene[data-stage="0"] .dr-stage-0,
.dr .scene[data-stage="1"] .dr-stage-1,
.dr .scene[data-stage="2"] .dr-stage-2{opacity:1}
.dr-scene-svg{width:100%;height:auto;display:block;padding:14px 22px 6px}
.dr-scene-svg text{font:400 11px var(--ex-sans,sans-serif);fill:#3d5f5b}
.dr-scene-svg .lab{font-weight:600;font-size:10px;letter-spacing:.06em;text-transform:uppercase}
@media (prefers-reduced-motion:reduce){.dr-stage{transition:none}}

/* The atlas legend ramp is urban-heat's warm scale; this report shades in the
   Prism teal, and a legend that disagrees with the map is worse than none. */
.dr .map-ramp{background:linear-gradient(90deg,#dde9ed,#b9d5d3,#8bbdb8,#559f97,#2b877d,#167b70)}
.dr .map-canvas path,.dr .map-canvas circle{transition:fill .2s}
.dr .map-canvas [data-iso]{cursor:pointer}
.dr .map-canvas [data-iso]:hover{stroke:#24354b;stroke-width:1.2;vector-effect:non-scaling-stroke}
.dr .country-detail b{font:500 30px/1.1 var(--ex-display,sans-serif);color:#167b70;display:block;margin:6px 0 2px}
.dr .country-metrics{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin:14px 0 0;font-size:12.5px}
.dr .country-metrics dt{color:#566b7d}
.dr .country-metrics dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
/* six snapshot cells wrap 4+2 on the atlas grid; let them size themselves */
.dr .snapshot{grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}

/* A five-column table is wider than a phone; each one scrolls inside its own
   box rather than pushing the page sideways. */
.dr-tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.dr-scroll .dr-tscroll{overflow-x:visible}
@media (max-width:620px){
  .dr .dr-kpis{grid-template-columns:1fr 1fr}
  .dr .snapshot{grid-template-columns:1fr 1fr}
  .dr-list li{grid-template-columns:1fr auto}
}

/* ------------------------------------------------- community / questions */
.dr-qlist{list-style:none;margin:0;padding:0;counter-reset:q}
.dr-qlist li{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:baseline;
  padding:9px 0;border-bottom:1px solid #edf3f6}
.dr-qlist li:last-child{border-bottom:0}
.dr-qlist .t{font-size:14.5px;color:#24354b}
.dr-qlist .t::before{counter-increment:q;content:counter(q) ".";color:#8aa0af;
  font-size:11.5px;margin-right:9px;font-variant-numeric:tabular-nums}
.dr-qlist i{font-style:normal;font-size:11.5px;color:#566b7d;font-variant-numeric:tabular-nums;
  white-space:nowrap}
.dr-pol{height:4px;background:#f0e3d6;border-radius:2px;overflow:hidden;margin-top:4px;min-width:64px}
.dr-pol i{display:block;height:100%;background:#167b70}

/* ------------------------------------------------------- solution themes */
.dr-theme-meta{padding:8px 14px;border-bottom:1px solid #edf3f6;font-size:11.5px;color:#566b7d;
  background:#fbfcfd}
.dr-list .dr-ex{grid-column:1/-1;font-size:11.5px;color:#7e8f9c;line-height:1.5;margin-top:1px}
.dr-list li:has(.dr-ex){grid-template-columns:1fr auto}

/* ------------------------------------------------------------ financials */
.dr-spark{width:104px;height:26px;display:block}
.dr-table td:has(.dr-spark){text-align:left}
/* The withheld view: real names, real coverage, figures held back. The rows
   must read as deliberately withheld, never as missing or as zero. */
.dr-locked tbody td:not(:first-child):not(:last-child){color:#adbcc7}
.dr-lock{display:inline-block;letter-spacing:2px;color:#c3d3dd;background:#f2f6f8;
  border-radius:3px;padding:2px 9px;font-size:11px;user-select:none}
.dr-unlock{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;
  margin-top:16px;padding:16px 18px;border:1px solid #cfe1de;border-radius:8px;background:#eaf2f1}
.dr-unlock b{display:block;font-size:14px;color:#24354b}
.dr-unlock span{display:block;font-size:12.5px;color:#4a6b66;margin-top:3px;max-width:62ch}
.dr-unlock a{flex:0 0 auto;background:#167b70;color:#fff;text-decoration:none;padding:10px 18px;
  border-radius:6px;font-size:13.5px}
.dr-unlock a:hover{background:#12655c}

/* Bars dropped into a .panel rather than a .dr-list card: keep the list
   styling, drop the card chrome. */
.dr-bare{border:0;border-radius:0;background:none}
.dr-bare ol{padding:0}
.dr-bare li{padding:6px 0}
.dr-bare li:hover{background:none}

/* Theme cards are different heights; align them to the top so the grid does
   not stretch short cards into ragged whitespace. */
.dr-lists{align-items:start}

/* A measured caution, not a disclaimer: it carries the numbers that justify it. */
.dr-caution{margin:18px 0 0;padding:15px 18px;border:1px solid #e5d3bd;border-left:4px solid #a8752f;
  border-radius:7px;background:#fdf8f1}
.dr-caution b{display:block;font-size:14px;color:#24354b;margin-bottom:5px}
.dr-caution p{margin:0;font-size:13px;line-height:1.65;color:#6b5540;max-width:92ch}
.dr-caution a{color:#8a5a10}
