/* DiseaseSignal — shared stylesheet */
:root {
  --bg: #0a0e1c;
  --bg-2: #0d1226;
  --bg-soft: #141b33;
  --card: #141d36;
  --card-2: #182a47;
  --line: rgba(255, 255, 255, 0.09);
  --ink: #e8edf7;
  --muted: #a3afc6;
  --accent: #2dd4e8;
  --accent-2: #7c9cff;
  --danger: #f4a3a3;
  --maxw: 1080px;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background-color: var(--bg);
  background-image:
    radial-gradient(1100px 600px at 50% -10%, rgba(124, 156, 255, 0.08), transparent 70%),
    linear-gradient(180deg, var(--bg-2) 0%, var(--bg) 55%);
  background-attachment: fixed;
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.6;
  font-size: 17px;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }

/* Header / nav */
.ds-header {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  max-width: 1180px; margin: 0 auto; padding: 1.1rem 1.25rem;
  border-bottom: 1px solid var(--line);
}
.ds-brand { display: inline-flex; align-items: center; gap: .55rem; color: var(--ink); font-weight: 800; font-size: 1.15rem; letter-spacing: -.01em; }
.ds-brand:hover { text-decoration: none; }
.ds-mark {
  width: 22px; height: 14px; display: inline-block;
  background:
    linear-gradient(var(--accent), var(--accent)) left 6px/4px 2px no-repeat,
    linear-gradient(var(--accent), var(--accent)) 6px 2px/4px 10px no-repeat,
    linear-gradient(var(--accent), var(--accent)) 12px 0/4px 14px no-repeat,
    linear-gradient(var(--accent), var(--accent)) 18px 5px/4px 4px no-repeat;
}
.ds-nav { display: flex; flex-wrap: wrap; gap: .35rem .9rem; align-items: center; }
.ds-nav a { color: var(--muted); font-size: .95rem; font-weight: 600; }
.ds-nav a:hover, .ds-nav a[aria-current="page"] { color: var(--accent); text-decoration: none; }

/* Page container */
.ds-page { max-width: var(--maxw); margin: 0 auto; padding: 2rem 1.25rem 3rem; }
.ds-kicker { color: var(--accent); font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; margin-bottom: .6rem; }
.ds-crumbs { color: var(--muted); font-size: .85rem; margin-bottom: 1rem; }
.ds-crumbs a { color: var(--muted); }

/* Hero (homepage) */
.ds-hero {
  max-width: var(--maxw); margin: 0 auto; padding: 3.25rem 1.25rem 1.5rem;
  background:
    radial-gradient(60% 80% at 20% 15%, rgba(45, 212, 232, 0.07), transparent 70%),
    radial-gradient(50% 70% at 85% 10%, rgba(124, 156, 255, 0.06), transparent 70%);
}
.ds-hero h1 { font-size: clamp(2.3rem, 6vw, 4rem); line-height: 1.05; margin: 0 0 1rem; letter-spacing: -.02em; }
.ds-hero .ds-tagline { color: var(--accent); font-weight: 700; }
@supports (-webkit-background-clip: text) {
  .ds-hero .ds-tagline {
    background: linear-gradient(100deg, var(--accent), var(--accent-2));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
.ds-hero p.ds-sub { color: var(--muted); font-size: 1.12rem; max-width: 60ch; margin: 0; }

/* Section intro */
.ds-section-top { padding: .5rem 0 1.4rem; border-bottom: 1px solid var(--line); margin-bottom: 1.5rem; }
.ds-section-top h1 { font-size: clamp(1.9rem, 5vw, 3.2rem); line-height: 1.06; margin: 0 0 .7rem; letter-spacing: -.02em; }
.ds-section-top p { color: var(--muted); margin: 0; max-width: 65ch; }

/* Card grids */
.ds-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }
.ds-card {
  display: block; padding: 1.25rem; border: 1px solid var(--line); border-radius: 12px;
  background: linear-gradient(180deg, var(--card-2), var(--card)); color: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition: border-color .2s, transform .2s, box-shadow .2s;
}
.ds-card:hover { border-color: var(--accent); transform: translateY(-2px); text-decoration: none; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 10px 30px rgba(45, 212, 232, 0.14); }
.ds-card-meta { display: block; color: var(--muted); font-size: .72rem; font-family: var(--mono); text-transform: uppercase; letter-spacing: .05em; margin-bottom: .5rem; }
.ds-card strong { display: block; color: #fff; font-size: 1.15rem; line-height: 1.35; margin-bottom: .55rem; }
.ds-card p { color: var(--muted); font-size: .92rem; margin: 0; }
.ds-card .ds-tag { color: var(--accent); font-weight: 700; font-size: .85rem; }

.ds-empty { border: 1px solid var(--line); border-radius: 12px; background: var(--card); padding: 1.25rem; }
.ds-empty p { color: var(--muted); margin: 0; }

/* Article */
.ds-article { max-width: 760px; }
.ds-article h1 { font-size: clamp(1.8rem, 4.5vw, 2.7rem); line-height: 1.12; margin: 0 0 .6rem; letter-spacing: -.01em; }
.ds-meta { color: var(--muted); font-size: .8rem; font-family: var(--mono); margin: 0 0 1.1rem; }
.ds-lede { font-size: 1.18rem; color: var(--ink); margin: 0 0 1.4rem; }
.ds-body p { color: #cbd3e6; margin: 0 0 1.15rem; }
.ds-body p:first-child { margin-top: 0; }
.ds-body h2 { font-size: 1.28rem; line-height: 1.25; margin: 1.9rem 0 .6rem; color: #fff; letter-spacing: -.01em; }
.ds-body h3 { font-size: 1.06rem; margin: 1.4rem 0 .45rem; color: #fff; }
.ds-body h2:first-child, .ds-body h3:first-child { margin-top: 0; }
.ds-sources { margin: 2rem 0 0; padding: 1.1rem 1.25rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-soft); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03); }
.ds-sources h2 { font-size: .95rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 0 0 .5rem; }
.ds-sources h2 + * { margin-top: 0; }
.ds-sources ol, .ds-sources ul { padding-left: 1.25rem; margin: 0 0 .5rem; }
.ds-sources li { margin: .4rem 0; color: #cbd3e6; word-break: break-word; }
.ds-cites { list-style: none; padding-left: 0 !important; display: flex; flex-wrap: wrap; gap: .5rem; }
.ds-cites li { margin: 0; }
.ds-cites a { display: inline-block; padding: .25rem .6rem; border: 1px solid var(--line); border-radius: 6px; font-family: var(--mono); font-size: .78rem; }

/* Ad slots */
.ad-slot { min-height: 0; }
.adsterra-unit { max-width: 100%; overflow: hidden; }

/* Footer + disclaimer */
.ds-footer { max-width: var(--maxw); margin: 2.5rem auto 0; padding: 1.5rem 1.25rem 3rem; border-top: 1px solid var(--line); }
.ds-disclaimer { color: var(--muted); font-size: .86rem; line-height: 1.6; margin: 0 0 .75rem; }
.ds-disclaimer strong { color: var(--danger); }
.ds-footlinks { color: var(--muted); font-size: .86rem; margin: 0; }
.ds-footlinks a { color: var(--muted); }

/* Prose (about) */
.ds-prose { max-width: 720px; }
.ds-prose h1 { font-size: clamp(1.9rem, 5vw, 2.8rem); margin: 0 0 1rem; }
.ds-prose h2 { margin: 2rem 0 .6rem; font-size: 1.3rem; }
.ds-prose p, .ds-prose li { color: #cbd3e6; }
.ds-prose .ds-callout { border: 1px solid var(--line); border-left: 3px solid var(--danger); border-radius: 8px; background: var(--bg-soft); padding: 1rem 1.15rem; }
.ds-prose .ds-callout strong { color: var(--danger); }

@media (max-width: 640px) {
  body { font-size: 16px; }
  .ds-header { flex-direction: column; align-items: flex-start; gap: .6rem; }
}

/* Related-briefings internal-linking rail */
.ds-related { margin: 2rem 0 0; padding: 1.1rem 1.25rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-soft); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03); }
.ds-related h2 { font-size: .95rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 0 0 .6rem; }
.ds-related ul { margin: 0; padding-left: 1.1rem; }
.ds-related li { margin: .4rem 0; }
.ds-related a { color: var(--accent); }

/* Breakthrough Bottleneck Tracker */
.ds-bottleneck-page { max-width: 1180px; }
.ds-bottleneck-hero {
  display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .8fr); gap: 2rem;
  align-items: end; padding: 1rem 0 2rem; border-bottom: 1px solid var(--line);
}
.ds-bottleneck-hero h1 {
  font-size: clamp(2.2rem, 6vw, 4.2rem); line-height: 1.02; letter-spacing: -.035em;
  max-width: 12ch; margin: 0 0 1rem;
}
.ds-bottleneck-hero > div > p { color: var(--muted); font-size: 1.08rem; max-width: 68ch; margin: 0; }
.ds-bottleneck-stats {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; margin: 0;
}
.ds-bottleneck-stats div {
  padding: 1rem; border: 1px solid var(--line); border-radius: 12px;
  background: linear-gradient(180deg, rgba(24, 42, 71, .92), rgba(20, 29, 54, .92));
}
.ds-bottleneck-stats dt { color: #fff; font-size: 1.3rem; font-weight: 800; line-height: 1.1; }
.ds-bottleneck-stats dd { color: var(--muted); font-size: .78rem; margin: .35rem 0 0; }
.ds-bottleneck-explainer {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 1.5rem 0;
  border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--bg-soft);
}
.ds-bottleneck-explainer div { position: relative; padding: 1rem 1.1rem; border-right: 1px solid var(--line); }
.ds-bottleneck-explainer div:last-child { border-right: 0; }
.ds-bottleneck-explainer span {
  display: inline-grid; place-items: center; width: 24px; height: 24px; margin-bottom: .65rem;
  border-radius: 999px; background: rgba(45, 212, 232, .13); color: var(--accent);
  font-family: var(--mono); font-size: .74rem; font-weight: 800;
}
.ds-bottleneck-explainer strong { display: block; color: #fff; font-size: .9rem; }
.ds-bottleneck-explainer p { color: var(--muted); font-size: .8rem; line-height: 1.45; margin: .3rem 0 0; }
.ds-method {
  border: 1px solid var(--line); border-radius: 12px; background: rgba(20, 29, 54, .82);
  padding: .9rem 1rem; margin: 1.25rem 0;
}
.ds-method summary { color: var(--accent); cursor: pointer; font-weight: 750; }
.ds-method > p { color: var(--muted); font-size: .82rem; margin: .8rem 0 0; }
.ds-method-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .75rem;
  margin-top: .9rem;
}
.ds-method-grid p { margin: 0; }
.ds-method-grid strong { display: block; color: #fff; font-size: .82rem; }
.ds-method-grid span { display: block; color: var(--muted); font-size: .76rem; line-height: 1.4; margin-top: .2rem; }
.ds-tracker-controls {
  display: grid; grid-template-columns: minmax(240px, 1.6fr) minmax(180px, .8fr) minmax(180px, .8fr) auto;
  gap: .75rem; align-items: end; padding: 1rem; margin: 1.5rem 0;
  border: 1px solid var(--line); border-radius: 14px; background: var(--card);
}
.ds-tracker-controls label {
  display: grid; gap: .35rem; color: var(--muted); font-size: .72rem;
  font-family: var(--mono); text-transform: uppercase; letter-spacing: .04em;
}
.ds-tracker-controls input, .ds-tracker-controls select {
  width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 9px;
  background: var(--bg-2); color: var(--ink); font: 400 .92rem var(--sans); padding: .65rem .75rem;
}
.ds-tracker-controls input:focus, .ds-tracker-controls select:focus {
  outline: 2px solid rgba(45, 212, 232, .5); outline-offset: 1px; border-color: var(--accent);
}
.ds-tracker-count { color: var(--muted); font-size: .78rem; white-space: nowrap; margin: 0 0 .72rem; }
.ds-bottleneck-list { display: grid; gap: 1rem; }
.ds-bottleneck-card {
  padding: 1.35rem; border: 1px solid var(--line); border-radius: 14px;
  background:
    radial-gradient(55% 150% at 100% 0, rgba(45, 212, 232, .06), transparent 70%),
    linear-gradient(180deg, var(--card-2), var(--card));
}
.ds-bottleneck-card[hidden] { display: none; }
.ds-bottleneck-card h2 {
  max-width: 30ch; margin: .75rem 0 .55rem; font-size: clamp(1.28rem, 3vw, 1.8rem);
  line-height: 1.18; letter-spacing: -.015em;
}
.ds-bottleneck-card h2 a { color: #fff; }
.ds-bottleneck-card h2 a:hover { color: var(--accent); text-decoration: none; }
.ds-bottleneck-status { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
.ds-bottleneck-status > span:not(.ds-badge) { color: var(--muted); font: .72rem var(--mono); }
.ds-badge {
  display: inline-flex; align-items: center; min-height: 26px; padding: .2rem .58rem;
  border: 1px solid var(--line); border-radius: 999px; color: #dbe4f6;
  background: rgba(255, 255, 255, .045); font: 700 .68rem var(--mono); letter-spacing: .02em;
}
.ds-badge-strengthening { border-color: rgba(45, 212, 232, .3); background: rgba(45, 212, 232, .1); color: #92f1fb; }
.ds-badge-emerging { border-color: rgba(124, 156, 255, .35); background: rgba(124, 156, 255, .1); color: #b9c8ff; }
.ds-badge-mixed { border-color: rgba(246, 190, 91, .34); background: rgba(246, 190, 91, .09); color: #f7d592; }
.ds-badge-weakened { border-color: rgba(244, 163, 163, .34); background: rgba(244, 163, 163, .09); color: #ffc2c2; }
.ds-bottleneck-summary { max-width: 75ch; color: #cbd3e6; margin: 0 0 1rem; }
.ds-bottleneck-glance {
  display: grid; grid-template-columns: .9fr 1.15fr 1.15fr; gap: 1px; margin: 1rem 0;
  overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--line);
}
.ds-bottleneck-glance div { padding: .9rem; background: rgba(10, 14, 28, .72); }
.ds-bottleneck-glance dt { color: var(--accent); font: 750 .68rem var(--mono); text-transform: uppercase; letter-spacing: .04em; }
.ds-bottleneck-glance dd { color: var(--muted); font-size: .8rem; line-height: 1.48; margin: .35rem 0 0; }
.ds-topic-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin: .9rem 0; }
.ds-topic-tags span {
  padding: .18rem .5rem; border-radius: 5px; color: var(--muted);
  background: rgba(255, 255, 255, .045); font: .7rem var(--mono);
}
.ds-bottleneck-link { display: inline-block; font-weight: 750; font-size: .86rem; }
.ds-tracker-empty {
  padding: 1.2rem; border: 1px dashed var(--line); border-radius: 12px;
  color: var(--muted); text-align: center;
}
.ds-bottleneck-detail { max-width: 920px; }
.ds-bottleneck-detail-head { padding-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.ds-bottleneck-detail-head h1 {
  font-size: clamp(2rem, 5vw, 3.45rem); line-height: 1.06; letter-spacing: -.025em;
  max-width: 20ch; margin: 0 0 .8rem;
}
.ds-bottleneck-detail-head .ds-lede { max-width: 68ch; color: #cbd3e6; }
.ds-movement-note {
  max-width: 75ch; margin: .9rem 0 0; color: var(--muted); font-size: .86rem;
}
.ds-bottleneck-owner {
  display: grid; grid-template-columns: minmax(180px, .45fr) minmax(0, 1.4fr);
  gap: 1rem; margin: 1.25rem 0; padding: 1rem 1.15rem;
  border-left: 3px solid var(--accent); background: var(--bg-soft); border-radius: 8px;
}
.ds-bottleneck-owner dt { color: var(--accent); font: 750 .7rem var(--mono); text-transform: uppercase; letter-spacing: .04em; }
.ds-bottleneck-owner dd { color: #d5ddec; margin: 0; }
.ds-evidence-flow {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem;
  margin: 1.5rem 0 2.5rem;
}
.ds-evidence-flow div {
  min-height: 170px; padding: 1.1rem; border: 1px solid var(--line); border-radius: 12px;
  background: linear-gradient(180deg, var(--card-2), var(--card));
}
.ds-evidence-flow span {
  display: block; color: var(--accent); font: 800 .7rem var(--mono);
  text-transform: uppercase; letter-spacing: .055em;
}
.ds-evidence-flow p { color: #cbd3e6; font-size: .9rem; margin: .55rem 0 0; }
.ds-evidence-flow .ds-next-test {
  border-color: rgba(45, 212, 232, .34);
  box-shadow: inset 0 0 0 1px rgba(45, 212, 232, .06);
}
.ds-section-heading {
  display: flex; justify-content: space-between; gap: 1.5rem; align-items: end;
  margin-bottom: 1rem;
}
.ds-section-heading h2 { margin: 0; color: #fff; font-size: 1.5rem; }
.ds-section-heading p { max-width: 42ch; color: var(--muted); font-size: .78rem; margin: 0; }
.ds-bottleneck-timeline, .ds-bottleneck-sources { margin: 2.5rem 0; }
.ds-bottleneck-timeline > ol { list-style: none; padding: 0; margin: 0; }
.ds-bottleneck-timeline > ol > li {
  display: grid; grid-template-columns: 145px max-content 1fr; gap: .8rem; align-items: start;
  position: relative; padding: 1rem 0; border-top: 1px solid var(--line);
}
.ds-bottleneck-timeline time { color: var(--muted); font: .78rem var(--mono); padding-top: .22rem; }
.ds-bottleneck-timeline li > p { color: #cbd3e6; margin: 0; font-size: .88rem; }
.ds-bottleneck-timeline .ds-update-sources {
  grid-column: 3; color: var(--muted); font-size: .72rem; font-family: var(--mono);
}
.ds-evidence-group {
  padding: 1rem 1.15rem; border: 1px solid var(--line); border-radius: 12px;
  background: var(--bg-soft); margin-bottom: .8rem;
}
.ds-evidence-group h3 { color: #fff; margin: 0; font-size: 1rem; }
.ds-evidence-group > p { margin: .25rem 0 .8rem; font-size: .8rem; }
.ds-evidence-group ol { padding-left: 1.3rem; margin: 0; }
.ds-evidence-group li { color: #cbd3e6; margin: .7rem 0; }
.ds-source-ids { display: block; color: var(--muted); font: .7rem var(--mono); margin-top: .22rem; }
.ds-source-ids a { color: var(--muted); }

@media (max-width: 900px) {
  .ds-bottleneck-hero { grid-template-columns: 1fr; align-items: start; }
  .ds-bottleneck-hero h1 { max-width: 15ch; }
  .ds-bottleneck-explainer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-bottleneck-explainer div:nth-child(2) { border-right: 0; }
  .ds-bottleneck-explainer div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .ds-tracker-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-tracker-count { margin: 0; align-self: center; }
  .ds-bottleneck-glance { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .ds-bottleneck-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-bottleneck-explainer, .ds-tracker-controls, .ds-evidence-flow { grid-template-columns: 1fr; }
  .ds-bottleneck-explainer div { border-right: 0; border-bottom: 1px solid var(--line); }
  .ds-bottleneck-explainer div:last-child { border-bottom: 0; }
  .ds-bottleneck-owner { grid-template-columns: 1fr; }
  .ds-section-heading { display: block; }
  .ds-section-heading p { margin-top: .45rem; }
  .ds-bottleneck-timeline > ol > li { grid-template-columns: 1fr; gap: .45rem; }
  .ds-bottleneck-timeline .ds-update-sources { grid-column: 1; }
}
