.relative-risk-product {
  border:1px solid rgba(56,189,248,.28);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(8,145,178,.11),rgba(15,23,42,.52));
  color:#f8fafc;
}
.relative-risk-badges {
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  align-items:center;
}
.relative-risk-badge {
  display:inline-flex;
  align-items:center;
  min-height:1.7rem;
  padding:.22rem .6rem;
  border:1px solid rgba(94,234,212,.38);
  border-radius:999px;
  background:rgba(13,148,136,.15);
  color:#ccfbf1;
  font-size:.74rem;
  font-weight:850;
  letter-spacing:.02em;
}
.relative-risk-badge--beta {
  border-color:rgba(250,204,21,.42);
  background:rgba(202,138,4,.14);
  color:#fef3c7;
}
.relative-risk-badge--confidence {
  border-color:rgba(56,189,248,.4);
  background:rgba(2,132,199,.14);
  color:#e0f2fe;
}
.relative-risk-badge--confidence[data-confidence="LOW"],
.relative-risk-badge--confidence[data-confidence="MODERATE"] {
  border-color:rgba(251,191,36,.44);
  background:rgba(217,119,6,.14);
  color:#fef3c7;
}
.relative-risk-badge--confidence[data-confidence="UNAVAILABLE"] {
  border-color:rgba(248,113,113,.42);
  background:rgba(185,28,28,.15);
  color:#fee2e2;
}
.relative-risk-assistive-text {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}
.relative-risk-percentile-histogram {
  display:grid;
  gap:.45rem;
  margin:.65rem 0 0;
}
.relative-risk-percentile-bin {
  display:grid;
  grid-template-columns:minmax(6.5rem,auto) minmax(5rem,1fr) auto;
  gap:.55rem;
  align-items:center;
  color:#dbeafe;
  font-size:.78rem;
}
.relative-risk-percentile-bin progress {
  width:100%;
  accent-color:#38bdf8;
}
.relative-risk-disclosure {
  margin:.75rem 0 0;
  padding:.7rem .8rem;
  border-left:3px solid #38bdf8;
  background:rgba(2,132,199,.09);
  color:#dbeafe;
  font-size:.84rem;
  line-height:1.5;
}
.relative-risk-methodology {
  color:#a5f3fc;
  font-weight:800;
  text-underline-offset:3px;
}
.relative-risk-freshness {
  display:grid;
  gap:.22rem;
  color:#cbd5e1;
  font-size:.8rem;
  line-height:1.4;
}
.relative-risk-live-status {
  margin:0 0 .8rem;
  padding:.7rem .85rem;
  border:1px solid rgba(251,191,36,.42);
  border-radius:8px;
  background:rgba(146,64,14,.2);
  color:#fef3c7;
  font-size:.84rem;
  font-weight:750;
  line-height:1.45;
}
[data-relative-risk-live-state="unavailable"] [data-relative-risk-live-scope][hidden] {
  display:none !important;
}
.relative-risk-legend,
.relative-risk-band-list {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:.6rem;
  margin:.75rem 0;
  padding:0;
  list-style:none;
}
.relative-risk-legend li,
.relative-risk-band-item {
  display:grid;
  grid-template-columns:2rem minmax(0,1fr);
  gap:.65rem;
  align-items:start;
  min-width:0;
  font-size:.75rem;
  color:#dbeafe;
}
.relative-risk-band-copy {
  display:grid;
  gap:.12rem;
  min-width:0;
}
.relative-risk-band-name,
.relative-risk-band-range {
  display:block;
  min-width:0;
  writing-mode:horizontal-tb;
  word-break:normal;
  overflow-wrap:break-word;
  hyphens:none;
}
.relative-risk-band-name { color:#f8fafc; }
.relative-risk-band-range { color:#cbd5e1; }
.relative-risk-band-symbol {
  display:inline-grid;
  place-items:center;
  width:1.55rem;
  height:1.55rem;
  border:2px solid currentColor;
  border-radius:5px;
  font-size:.64rem;
  font-weight:900;
}
.relative-risk-band-symbol--highest { color:#fb7185; background:rgba(225,29,72,.24); }
.relative-risk-band-symbol--elevated { color:#fbbf24; background:rgba(217,119,6,.22); border-style:dashed; }
.relative-risk-band-symbol--moderate { color:#22d3ee; background:rgba(8,145,178,.2); border-style:dotted; }
.relative-risk-band-symbol--lower { color:#94a3b8; background:rgba(71,85,105,.24); }
.timeframe-product-state {
  display:block;
  margin-top:.2rem;
  font-size:.66rem;
  font-weight:750;
  opacity:.82;
}
.relative-risk-accessible-list {
  display:grid;
  gap:.4rem;
  max-height:18rem;
  margin:.65rem 0;
  padding:0 .2rem 0 1.35rem;
  overflow:auto;
}
.relative-risk-accessible-result {
  width:100%;
  display:grid;
  gap:.2rem;
  min-height:44px;
  padding:.55rem .6rem;
  border:1px solid rgba(56,189,248,.25);
  border-radius:7px;
  background:rgba(15,23,42,.62);
  color:#f8fafc;
  text-align:left;
}
.relative-risk-accessible-result span,
.relative-risk-accessible-result small {
  color:#cbd5e1;
  line-height:1.35;
}
.relative-risk-accessible-result:focus-visible {
  outline:3px solid #facc15;
  outline-offset:2px;
}
.relative-risk-count-summary {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.45rem;
  margin:.7rem 0;
}
.relative-risk-count-summary > div {
  min-width:0;
  padding:.55rem;
  border:1px solid rgba(125,211,252,.2);
  border-radius:8px;
  background:rgba(11,23,40,.72);
}
.relative-risk-count-summary dt {
  color:#cbd5e1;
  font-size:.68rem;
  line-height:1.3;
}
.relative-risk-count-summary dd {
  margin:.22rem 0 0;
  color:#f8fafc;
  font-size:1rem;
  font-weight:850;
  line-height:1.15;
}
.relative-risk-results-scope {
  margin:.55rem 0 0;
  color:#cbd5e1;
  font-size:.78rem;
  line-height:1.45;
}
.relative-risk-confidence-details {
  margin-top:.65rem;
  border-top:1px solid rgba(125,211,252,.18);
  padding-top:.65rem;
}
.relative-risk-confidence-details > summary {
  min-height:2.75rem;
  color:#e0f2fe;
  font-weight:800;
  cursor:pointer;
}
/* The relative-risk beta summary and the calibrated-probability product are
 * separate products. Every block in this card stays in normal flow so the two
 * notices can never render on top of each other or on top of the metrics. */
.relative-risk-product :is(
  .relative-risk-badges,
  .relative-risk-selected-timeframe,
  .relative-risk-count-summary,
  .relative-risk-results-scope,
  .relative-risk-legend,
  .relative-risk-band-list,
  .relative-risk-disclosure,
  .relative-risk-confidence-details,
  .relative-risk-methodology,
  .relative-risk-calibrated-notice
) {
  position:static;
}

.relative-risk-product :is(p, span, strong, small, dt, dd, li, summary, a) {
  word-break:normal;
  overflow-wrap:break-word;
  hyphens:none;
}

/* Selected-cell explanation panel. Ranking, attribution, and product
 * limitation are three separate blocks so a high rank is never hidden by a
 * limited attribution, and a limited attribution never reads as a low
 * probability. */
.relative-risk-explanation-ranking {
  margin:0 0 .5rem;
  color:#e0f2fe;
  font-size:.82rem;
  font-weight:800;
  line-height:1.4;
}
.relative-risk-explanation-headline {
  margin:0 0 .3rem;
  color:#f8fafc;
  font-size:.84rem;
  font-weight:800;
}
.relative-risk-explanation-summary {
  margin:0;
  color:#dbeafe;
  font-size:.8rem;
  line-height:1.5;
  word-break:normal;
  overflow-wrap:break-word;
}
.relative-risk-associations {
  display:grid;
  gap:.4rem;
  margin:.55rem 0 0;
  padding:0;
  list-style:none;
}
.relative-risk-associations li {
  display:grid;
  gap:.1rem;
  min-width:0;
  padding:.45rem .55rem;
  border:1px solid rgba(94,234,212,.24);
  border-radius:7px;
  background:rgba(13,148,136,.12);
}
.relative-risk-associations strong { color:#f8fafc; font-size:.8rem; }
.relative-risk-associations span { color:#cbd5e1; font-size:.72rem; }
/* Sanctioned missingness is an expected governed state. Amber/neutral
 * information styling, never red failure styling. */
.relative-risk-attribution-limited {
  margin:.55rem 0 0;
  padding:.6rem .7rem;
  border:1px solid rgba(251,191,36,.34);
  border-left:3px solid #fbbf24;
  border-radius:7px;
  background:rgba(69,26,3,.22);
  color:#fef3c7;
}
.relative-risk-attribution-limited .relative-risk-explanation-summary { color:#fef3c7; }
.relative-risk-explanation-limitations {
  display:grid;
  gap:.22rem;
  margin:.55rem 0 0;
  padding-left:1.1rem;
  color:#cbd5e1;
  font-size:.74rem;
  line-height:1.45;
}
/* A genuine contract error is distinct from expected missingness. */
.relative-risk-explanation-error {
  margin:.5rem 0 0;
  padding:.6rem .7rem;
  border:1px solid rgba(248,113,113,.42);
  border-radius:7px;
  background:rgba(185,28,28,.16);
  color:#fee2e2;
  font-size:.78rem;
}
.relative-risk-calibrated-notice {
  display:grid;
  gap:.22rem;
  width:100%;
  min-width:0;
  max-width:100%;
  margin:.8rem 0 0;
  padding:.65rem .75rem;
  border:1px solid rgba(251,191,36,.34);
  border-radius:8px;
  background:rgba(69,26,3,.26);
  color:#fef3c7;
  font-size:.78rem;
  line-height:1.4;
}
.relative-risk-calibrated-notice strong,
.relative-risk-calibrated-notice span { display:block; }
.relative-risk-calibrated-notice p { margin:0; color:#fde68a; }
@media (max-width:420px) {
  .relative-risk-count-summary { grid-template-columns:minmax(0,1fr); }
}
