:root {
  --sfondo: #f7fafb;
  --carta: #ffffff;
  --testo: #1c2a30;
  --testo2: #5b6b72;
  --blu: #1f6f8b;
  --blu-chiaro: #e3f0f4;
  --limone: #f2d05b;
  --linea: #dbe6ea;
  --wykres: var(--blu);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --sfondo: #10181b;
    --carta: #172226;
    --testo: #e6eef1;
    --testo2: #a2b3ba;
    --blu: #6cc0dc;
    --blu-chiaro: #1c3139;
    --limone: #e8c64d;
    --linea: #29393f;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--sfondo); color: var(--testo); font: 1.02rem/1.7 "Helvetica Neue", Arial, "Segoe UI", sans-serif; }
.box { max-width: 50rem; margin: 0 auto; padding: 0 1rem; }
a { color: var(--blu); }

.testa { background: var(--carta); border-bottom: 1px solid var(--linea); }
.testa-in { padding-top: 1rem; padding-bottom: 0.3rem; }
.marchio { font-size: 1.15rem; color: var(--testo); text-decoration: none; word-break: break-word; }
.marchio b { color: var(--blu); }
.motto { margin: 0.1rem 0 0; font-size: 0.82rem; color: var(--testo2); }
.menu { background: var(--blu); }
.menu ul { list-style: none; margin: 0 auto; padding-top: 0.45rem; padding-bottom: 0.45rem; display: flex; flex-wrap: wrap; gap: 0.2rem 1.1rem; }
.menu a { color: #fff; text-decoration: none; font-size: 0.86rem; }
.menu a:hover { text-decoration: underline; text-decoration-color: var(--limone); }

.corpo { padding-top: 1.3rem; }
.okruszki { font-size: 0.8rem; color: var(--testo2); }
.okruszki a { color: var(--testo2); }
.okruszki span { margin: 0 0.3rem; }
h1 { font-size: clamp(1.5rem, 4.5vw, 2.1rem); line-height: 1.25; margin: 0.5rem 0 0.3rem; }
.aggiornato { font-size: 0.8rem; color: var(--testo2); margin: 0 0 1.3rem; }
.testo > p:first-child { background: var(--blu-chiaro); border-radius: 12px; padding: 1rem 1.2rem; font-size: 1.05rem; }
.testo h2 { font-size: 1.28rem; line-height: 1.35; margin: 2.3rem 0 0.6rem; }
.testo h2::before { content: ""; display: inline-block; width: 0.55rem; height: 0.55rem; background: var(--limone); border-radius: 2px; margin-right: 0.5rem; vertical-align: middle; }
.testo h3 { font-size: 1rem; margin: 1.3rem 0 0.3rem; }
.testo p, .testo ul, .testo ol { margin: 0 0 1rem; }

.tabela { overflow-x: auto; margin: 1.1rem 0 1.4rem; border: 1px solid var(--linea); border-radius: 10px; background: var(--carta); }
table { border-collapse: collapse; width: 100%; font-size: 0.86rem; line-height: 1.45; }
th { text-align: left; padding: 0.55rem 0.7rem; background: var(--blu-chiaro); white-space: nowrap; }
td { padding: 0.5rem 0.7rem; border-top: 1px solid var(--linea); vertical-align: top; }

.piede { margin-top: 3.2rem; background: var(--carta); border-top: 1px solid var(--linea); padding: 1.5rem 0 2.4rem; font-size: 0.84rem; color: var(--testo2); }
.piede-menu { list-style: none; padding: 0; margin: 0.8rem 0; display: flex; flex-wrap: wrap; gap: 0.2rem 1rem; }
.piede-menu a { color: var(--testo2); }
.nota { font-size: 0.76rem; }

/* dopisane przez build.py: obraz pod pierwszym akapitem i wykresy slupkowe */
.obraz { margin: 1.4rem 0 1.6rem; }
.obraz img { display: block; width: 100%; height: auto; border-radius: 10px; }
.wykres { margin: 1.3rem 0 1.5rem; }
.wykres figcaption { font-weight: 600; margin-bottom: .6rem; }
.wykres-wiersz { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: .6rem; margin: 0 0 .55rem; font-size: .9rem; }
.wykres-etykieta { grid-column: 1 / -1; line-height: 1.35; }
.wykres-pasek { display: block; height: .7rem; margin-top: .25rem; border-radius: 99px; background: var(--wykres-tlo, rgba(127, 127, 127, .18)); overflow: hidden; align-self: center; }
.wykres-pasek span { display: block; height: 100%; border-radius: 99px; background: var(--wykres, #1f6f8b); }
.wykres-wartosc { font-variant-numeric: tabular-nums; font-weight: 600; align-self: center; margin-top: .25rem; }
.wykres-nota { font-size: .8rem; opacity: .8; margin: .5rem 0 0; }