/* Wspólny styl lekcji i ściąg. */
:root {
  --tekst: #111111;
  --tlo: #ffffff;
  --szary: #444444;
  --linia: #dddddd;
  --akcent: #0046ad;
  --znacznik: #ff5800;
  --dobrze: #00883f;
  --zle: #c41e3a;
  --ramka: #f3f5f8;
  --kod-tlo: #eef3fb;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--tlo);
  color: var(--tekst);
  font: 19px/1.6 "Iowan Old Style", Charter, Georgia, serif;
}

main {
  max-width: 54rem;
  margin: 0 auto;
  padding: 3rem 1.25rem 5rem;
}

h1 { font-size: 2.1rem; line-height: 1.2; margin: 0 0 .4rem; font-weight: 600; }
h2 { font-size: 1.35rem; margin: 2.6rem 0 .6rem; font-weight: 600; border-left: 5px solid var(--znacznik); padding-left: .6rem; }
h3 { font-size: 1.05rem; margin: 1.6rem 0 .3rem; }
p, li { max-width: 38rem; }
a { color: var(--akcent); }

.podtytul { color: var(--szary); font-style: italic; margin: 0 0 2rem; }
.nawigacja { font: 15px/1.4 system-ui, sans-serif; display: flex; gap: 1.2rem; flex-wrap: wrap; color: var(--szary); margin-bottom: 2rem; }
.nawigacja a { text-decoration: none; }

.cel { border-left: 3px solid var(--znacznik); padding: .2rem 0 .2rem 1rem; }

code, .ruchy { font: 600 .95em/1.4 ui-monospace, "SF Mono", Menlo, monospace; }
code { color: var(--akcent); background: var(--kod-tlo); padding: .05em .3em; border-radius: 4px; }

/* Pasek algorytmu nad animacją */
.alg { max-width: none; margin: 1rem 0 .6rem; }
.alg code { display: inline-block; font-size: 1.35rem; line-height: 1.2; padding: .5rem .8rem; border-radius: 6px; background: var(--akcent); color: white; -webkit-print-color-adjust: exact; print-color-adjust: exact; }

small, .zrodlo { font-size: .8rem; color: var(--szary); }

/* Animacje */
.przypadki { display: grid; grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr)); gap: 2rem 1.6rem; margin: 1.4rem 0; }
.przypadek { margin: 0; }
.przypadek figcaption { font-size: .92rem; line-height: 1.45; color: var(--szary); margin-top: .3rem; }
.szeroki { margin: 1.4rem 0; }
kostka-alg { display: block; }
kostka-alg twisty-player { width: 100%; height: 19rem; }
.szeroki kostka-alg twisty-player { height: 24rem; }
kostka-alg .sterowanie { display: flex; justify-content: center; gap: .4rem; margin-top: .2rem; }
kostka-alg .sterowanie button {
  font: 1rem system-ui, sans-serif; width: 2.6rem; height: 2.2rem; cursor: pointer;
  border: 1px solid var(--linia); border-radius: 999px; background: white; color: var(--tekst);
}
kostka-alg .sterowanie button:hover { border-color: var(--tekst); }
kostka-alg .zapis { display: block; text-align: center; margin: .5rem 0 0; font: 600 1.05rem/1.5 ui-monospace, "SF Mono", Menlo, monospace; }

/* Quiz */
.quiz { border-top: 1px solid var(--linia); padding: 1rem 0; }
.quiz kostka-alg twisty-player { height: 16rem; max-width: 20rem; }
.quiz button {
  font: 600 1rem ui-monospace, Menlo, monospace;
  min-width: 5.5rem; padding: .45rem .8rem; margin: .2rem .3rem .2rem 0;
  border: 1px solid var(--linia); border-radius: 6px; background: white; cursor: pointer;
}
.quiz button:hover:enabled { border-color: var(--tekst); }
.quiz button.dobrze { background: var(--dobrze); color: white; border-color: var(--dobrze); }
.quiz button.zle { background: white; color: var(--zle); border-color: var(--zle); text-decoration: line-through; }
.quiz .wyjasnienie { display: none; font-size: .95rem; }
.quiz.rozwiazany .wyjasnienie { display: block; }

/* Ramki */
.ramka { background: var(--ramka); border-radius: 8px; padding: .4rem 1.2rem .8rem; margin: 2rem 0; }
.ramka h2 { margin-top: .8rem; font-size: 1.1rem; border-left: 0; padding-left: 0; }
.pytania { font-style: italic; color: var(--szary); }

table { border-collapse: collapse; width: 100%; font-size: .95rem; }
th, td { text-align: left; padding: .4rem .6rem; border-bottom: 1px solid var(--linia); vertical-align: top; }

@media print {
  body { font-size: 11pt; background: white; }
  main { max-width: none; padding: 0; }
  .nawigacja, twisty-player, .quiz button, .sterowanie { display: none; }
  .ramka { border: 1px solid #999; }
  a { color: inherit; text-decoration: none; }
}