.rate-map { margin: 28px 0; padding: clamp(14px, 3vw, 26px); border: 1px solid #cbd7e1; border-radius: 12px; background: #fff; scroll-margin-top: 120px; }
.rate-map h3 { margin: 0 0 10px; font-size: 1.35rem; }
.rate-map p { max-width: 78ch; }
.rate-map .rate-controls { padding: 14px 0; border-block: 1px solid #dce4ea; margin: 18px 0; }
.rate-map label { display: flex; justify-content: space-between; gap: 12px; font-weight: 700; }
.rate-map output { font-variant-numeric: tabular-nums; }
.rate-map input[type="range"] { display: block; width: 100%; height: 30px; accent-color: #235f9e; }
.rate-map .rate-buttons { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.rate-map button { font: inherit; font-size: .85rem; min-height: 40px; padding: 7px 11px; border: 1px solid #bbcbd8; border-radius: 6px; background: #fff; color: #24354a; cursor: pointer; }
.rate-map button[aria-pressed="true"] { border-color: #235f9e; background: #e7f1fa; color: #164c7e; }
.rate-map :focus-visible { outline: 3px solid #235f9e; outline-offset: 3px; }
.rate-map .rate-boundaries { display: grid; gap: 0; }
.rate-map .rate-boundary { display: grid; grid-template-columns: minmax(190px, 1fr) minmax(200px, 1.25fr); align-items: center; gap: 6px 24px; padding: 13px 0; border-bottom: 1px solid #e0e6eb; }
.rate-map .rate-boundary strong, .rate-map .rate-boundary small { display: block; }
.rate-map .rate-boundary small { font-size: .8rem; line-height: 1.45; color: #4c5d70; margin-top: 4px; }
.rate-map .rate-description { border-radius: 5px; }
/* Pair the named guarantee with its outlined track. Every other ruler keeps
   its full contrast and all of its native drag/keyboard behavior. */
html.ra-on #rateBoundary1[data-ra-hot="ctx-rate-mean"] [data-rate-description="ctx-rate-mean"],
html.ra-on #rateBoundary2[data-ra-hot="ctx-rate-risk"] [data-rate-description="ctx-rate-risk"],
html.ra-on #rateBoundary3[data-ra-hot="ctx-rate-batch"] [data-rate-description="ctx-rate-batch"],
html.ra-on #rateBoundary4[data-ra-hot="ctx-rate-point"] [data-rate-description="ctx-rate-point"] { background: var(--ra-accent-soft, #eaf2fa); }
.rate-map .rate-track { position: relative; margin: 8px 0 9px; height: 28px; border-radius: 3px; background: linear-gradient(transparent 9px, #f1e6e0 9px 19px, transparent 19px); touch-action: pan-y; cursor: ew-resize; }
.rate-map .rate-safe { position: absolute; inset: 9px auto 9px 0; background: #d5e7f3; border-right: 2px solid #235f9e; }
.rate-map .rate-pin { position: absolute; top: 4px; height: 20px; width: 3px; background: #182b42; transform: translateX(-1px); }
.rate-map #rateMomentPlot { touch-action: pan-y; cursor: ew-resize; }
.rate-map .rate-verdict { font-size: .8rem; line-height: 1.45; font-variant-numeric: tabular-nums; }
.rate-map .rate-verdict.outside { color: #8c4225; }
.rate-map .rate-verdict.inside { color: #235f76; }
.rate-map .rate-map-key { font-size: .8rem; color: #4c5d70; }
.rate-map .rate-caption { font-size: .86rem; line-height: 1.55; color: #46576a; }
.rate-map .rate-takeaway { border-left: 3px solid #235f9e; background: #f0f6fa; padding: 12px 14px; font-size: .95rem; }
.rate-map .rate-legend { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 16px 0 8px; font-size: .86rem; }
.rate-map .rate-legend span { display: inline-flex; align-items: center; gap: 7px; }
.rate-map .rate-legend i { width: 24px; border-top: 3px solid #367d51; }
.rate-map .rate-legend .mean { border-top-color: #a5760c; border-top-style: dashed; }
.rate-map .rate-legend .variance { width: 16px; height: 12px; border: 1px solid #abbdd2; background: #e5edf7; }
.rate-map .rate-moment-plot { margin: 0; }
.rate-map #rateMomentPlot > svg { display: block; width: 100%; height: auto; font-family: inherit; }
.rate-map .rate-values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 15px 0; }
.rate-map .rate-values div { border-top: 2px solid #d3dde6; padding-top: 9px; }
.rate-map .rate-values dt { font-size: .8rem; line-height: 1.4; }
.rate-map .rate-values dd { margin: 6px 0 0; font-size: 1.25rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.rate-map .rate-equation { overflow-x: auto; padding: 6px 0; }
.rate-map .rate-formulas { padding: 4px 18px 14px; }
.rate-map .rate-formulas p { font-size: .94rem; }
.rate-map .rate-formulas li { margin-bottom: 12px; }
.rate-map .rate-formulas details { margin-top: 16px; }
#context-reuse-detail { margin: 24px 0; }
#context-reuse-detail > .concept-aside-body { padding: 14px; }
@media (max-width: 640px) {
  .rate-map .rate-boundary { grid-template-columns: minmax(0, 1fr); gap: 7px; }
  .rate-map .rate-values { gap: 9px; }
  .rate-map .rate-values dd { font-size: 1.06rem; }
  .rate-map .rate-values dt { font-size: .76rem; }
  .rate-map label { flex-wrap: wrap; }
}

.rate-map button:disabled { color:#647184; background:#f1f3f5; cursor:default; }