.statistik-val { position: fixed; inset: auto 1rem 1rem; z-index: 1000; max-width: 46rem; margin-inline: auto; padding: 1.25rem; border: 1px solid #777; border-radius: .75rem; background: #fff; color: #172330; box-shadow: 0 .25rem 2rem #0003; max-height: 75vh; overflow: auto; }
.statistik-val[hidden] { display: none; }
.statistik-val h2 { font-size: 1.2rem; margin: 0 0 .5rem; }
.statistik-val p { margin: .5rem 0; font-size: .95rem; line-height: 1.5; }
.statistik-knappar { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .75rem; }
.statistik-knappar .knapp { flex: 1; background: #172330; color: white; border: 1px solid #172330; }
.statistik-andra { background: transparent; border: 0; padding: 0; color: inherit; font: inherit; text-decoration: underline; cursor: pointer; }
/* Mobil: rutan täckte rubrik, knapp och pris i heron vid första besöket. Samma text och lika stora val,
   men tätare och lägre; resten av texten nås med scroll i rutan. */
@media (max-width: 600px) {
  .statistik-val { inset: auto .5rem .5rem; padding: .8rem .9rem; max-height: 40vh; border-radius: .6rem; }
  .statistik-val h2 { font-size: 1rem; margin-bottom: .25rem; }
  .statistik-val p { font-size: .82rem; line-height: 1.4; margin: .3rem 0; }
  .statistik-knappar { gap: .5rem; margin-top: .5rem; flex-wrap: nowrap; }
  .statistik-knappar .knapp { min-height: 44px; padding: .5rem .6rem; font-size: .9rem; line-height: 1.2; }
}
