:root {
  --krem: #faf6f0;
  --bialy: #ffffff;
  --kawa: #6b4226;
  --kawa-jasna: #f1e6d8;
  --tekst: #2b211b;
  --tekst-2: #6f625a;
  --obrys: #e7dccd;
  --zielen: #3f7a4f;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --krem: #17120f;
    --bialy: #211a15;
    --kawa: #d9a878;
    --kawa-jasna: #2e241c;
    --tekst: #efe7df;
    --tekst-2: #b4a79c;
    --obrys: #3a2f27;
    --zielen: #86c596;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--krem); color: var(--tekst); font: 1.05rem/1.7 "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif; }
.srodek { max-width: 48rem; margin: 0 auto; padding: 0 1rem; }
a { color: var(--kawa); font-weight: 600; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }

.gora { background: var(--bialy); border-bottom: 1px solid var(--obrys); padding: 1.1rem 0 0.9rem; text-align: center; }
.nazwa { display: inline-block; font-size: 1.5rem; font-weight: 800; letter-spacing: -0.02em; color: var(--kawa); text-decoration: none; margin-bottom: 0.7rem; }
.pigulki { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4rem; }
.pigulki a { display: inline-block; padding: 0.28rem 0.8rem; border: 1px solid var(--obrys); border-radius: 999px; font-size: 0.86rem; font-weight: 500; color: var(--tekst); text-decoration: none; background: var(--krem); }
.pigulki a:hover { border-color: var(--kawa); color: var(--kawa); }

.artykul { padding-top: 1.6rem; }
.okruszki { font-size: 0.85rem; color: var(--tekst-2); }
.okruszki a { font-weight: 400; color: var(--tekst-2); }
.okruszki span { margin: 0 0.3rem; }
h1 { font-size: clamp(1.7rem, 5vw, 2.3rem); line-height: 1.2; letter-spacing: -0.02em; margin: 0.8rem 0 0.4rem; }
.data { color: var(--tekst-2); font-size: 0.88rem; margin: 0 0 1.5rem; }
.tresc > p:first-child { font-size: 1.12rem; background: var(--kawa-jasna); padding: 1.1rem 1.25rem; border-radius: 14px; }
.tresc h2 { font-size: 1.4rem; line-height: 1.3; margin: 2.4rem 0 0.6rem; letter-spacing: -0.01em; }
.tresc h2::before { content: ""; display: block; width: 2.2rem; height: 4px; border-radius: 2px; background: var(--kawa); margin-bottom: 0.7rem; }
.tresc h3 { font-size: 1.08rem; margin: 1.4rem 0 0.3rem; }
.tresc p, .tresc ul { margin: 0 0 1rem; }

.tabela { overflow-x: auto; margin: 1.2rem 0 1.5rem; background: var(--bialy); border: 1px solid var(--obrys); border-radius: 14px; }
table { border-collapse: collapse; width: 100%; font-size: 0.92rem; line-height: 1.45; }
th { text-align: left; font-weight: 700; padding: 0.7rem 0.8rem; border-bottom: 2px solid var(--obrys); white-space: nowrap; }
td { padding: 0.6rem 0.8rem; border-bottom: 1px solid var(--obrys); vertical-align: top; }
tr:last-child td { border-bottom: 0; }
.poza { font-size: 0.9rem; color: var(--tekst-2); }

.stopa { margin-top: 4rem; background: var(--bialy); border-top: 1px solid var(--obrys); padding: 1.8rem 0 2.6rem; font-size: 0.9rem; color: var(--tekst-2); }
.drobne { font-size: 0.82rem; }