.pasangan { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); margin: 16px 0; }
.pasangan figure { margin: 0; }
.pasangan canvas, .kurva canvas {
  display: block; width: 100%; height: auto;
  border: 3px solid var(--navy); border-radius: 6px; background: #fff;
}
.pasangan canvas { aspect-ratio: 1 / 1; max-width: 18rem; }
figcaption { font-weight: 700; margin-top: 6px; }

.kendali { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 12px 0; }
.kendali button, .kendali select {
  min-height: 44px; font: inherit; border-radius: 6px; border: 2px solid var(--navy); padding: 6px 14px;
}
.kendali button { background: var(--gold); color: var(--navy); font-weight: 700; cursor: pointer; min-width: 5.5rem; }
.kendali button[disabled] { background: #d9dee6; color: #3f5167; cursor: default; }
.kendali select { background: #fff; color: var(--navy); }
.kendali label { font-weight: 700; }

dl.statistik { display: grid; grid-template-columns: auto 1fr; gap: 4px 16px; margin: 12px 0; }
dl.statistik dt { color: var(--muted); }
dl.statistik dd { margin: 0; font-weight: 700; font-variant-numeric: tabular-nums; }

.kurva { margin: 12px 0; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }