/* Czytelnia archiwum uleszka.net – motywy kolorów: jasny (domyślny), sepia, ciemny, kontrast */
:root, [data-motyw="jasny"] {
  color-scheme: light;
  --tlo: #f7f4ec; --tlo-grad: rgba(226, 169, 63, .08); --karta: #ffffff; --pole: #fbf9f4;
  --tekst: #1f2430; --tekst-2: #5b6271; --tresc: #1d212b; --mocny: #0f1218; --naglowek: #1a1e27; --linia: #e2dbcc;
  --akcent: #a96a12; --akcent-mocny: #8a5409; --link: #8a5409; --inicjal: #a96a12;
  --gora: rgba(247, 244, 236, .9); --gora-tekst: #3a4150; --cien: 0 1px 2px rgba(0, 0, 0, .05), 0 8px 24px rgba(30, 30, 50, .07);
  --h1: linear-gradient(180deg, #3a2a10, #8a5409 70%, #a96a12);
  --czytane: rgba(226, 169, 63, .22); --tabela-glowa: #f1ebdd;
}
[data-motyw="sepia"] {
  color-scheme: light;
  --tlo: #f2e8d5; --tlo-grad: rgba(160, 110, 40, .08); --karta: #f9f2e3; --pole: #f6edda;
  --tekst: #3b2f20; --tekst-2: #6e5d45; --tresc: #3a2e1f; --mocny: #24190d; --naglowek: #2e2316; --linia: #dccaa8;
  --akcent: #9a5f12; --akcent-mocny: #7d4a0b; --link: #7d4a0b; --inicjal: #9a5f12;
  --gora: rgba(242, 232, 213, .92); --gora-tekst: #4a3b27; --cien: 0 1px 2px rgba(60, 40, 10, .06), 0 8px 24px rgba(60, 40, 10, .08);
  --h1: linear-gradient(180deg, #3b2a12, #7d4a0b 70%, #9a5f12);
  --czytane: rgba(190, 130, 40, .22); --tabela-glowa: #ead9b9;
}
[data-motyw="ciemny"] {
  color-scheme: dark;
  --tlo: #07090f; --tlo-grad: rgba(30, 48, 90, .25); --karta: #10151f; --pole: #0b0f17;
  --tekst: #ece6d8; --tekst-2: #a6adbb; --tresc: #e4ddcd; --mocny: #fbf3e0; --naglowek: #f4efe4; --linia: #222b3b;
  --akcent: #e2a93f; --akcent-mocny: #f0c46f; --link: #f0c46f; --inicjal: #f0c46f;
  --gora: rgba(7, 9, 15, .82); --gora-tekst: #cfd6e4; --cien: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 32px rgba(0, 0, 0, .35);
  --h1: linear-gradient(180deg, #fff6e0, #f0c46f 60%, #b47a22);
  --czytane: rgba(232, 176, 75, .14); --tabela-glowa: #161d2b;
}
[data-motyw="kontrast"] {
  color-scheme: dark;
  --tlo: #000; --tlo-grad: transparent; --karta: #0d0d0d; --pole: #000;
  --tekst: #fff; --tekst-2: #e0e0e0; --tresc: #fff; --mocny: #fff; --naglowek: #fff; --linia: #6b6b6b;
  --akcent: #ffd84d; --akcent-mocny: #ffe680; --link: #ffe680; --inicjal: #ffd84d;
  --gora: #000; --gora-tekst: #fff; --cien: none;
  --h1: linear-gradient(180deg, #fff, #fff);
  --czytane: rgba(255, 216, 77, .28); --tabela-glowa: #1f1f1f;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; --rozmiar: 19px; }
body { margin: 0; background: radial-gradient(ellipse 80% 40% at 50% 0%, var(--tlo-grad), transparent 70%), var(--tlo); color: var(--tekst);
  font: 17px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; -webkit-text-size-adjust: 100%; transition: background-color .25s, color .25s; }
a { color: var(--link); }
.wrap-sz { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.wrap-czyt { max-width: 760px; margin: 0 auto; padding: 0 20px 40px; }

/* nagłówek */
.gora { position: sticky; top: 0; z-index: 20; background: var(--gora); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linia); }
.gora .wrap-sz { display: flex; justify-content: space-between; align-items: center; gap: 12px; height: 56px; }
.logo { font-family: Georgia, serif; font-weight: 700; color: var(--naglowek); text-decoration: none; white-space: nowrap; }
.logo span { color: var(--akcent); }
.gora nav { display: flex; align-items: center; gap: 6px; font-size: 15px; }
.gora nav a, .przycisk-gora { color: var(--gora-tekst); text-decoration: none; background: none; border: 1px solid transparent; border-radius: 10px;
  padding: 7px 10px; font: inherit; cursor: pointer; white-space: nowrap; }
.gora nav a:hover, .przycisk-gora:hover, .przycisk-gora[aria-expanded="true"] { border-color: var(--linia); background: var(--karta); }
.przycisk-gora b { font-family: Georgia, serif; }

/* panel wyglądu */
.panel-wygladu { position: fixed; top: 62px; right: max(12px, calc((100vw - 1100px) / 2 + 12px)); z-index: 30; width: 290px; background: var(--karta); color: var(--tekst);
  border: 1px solid var(--linia); border-radius: 14px; padding: 14px; box-shadow: 0 18px 50px rgba(0, 0, 0, .25); }
.panel-wygladu p { margin: 4px 0 8px; font-size: 13px; color: var(--tekst-2); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }
.motywy { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 12px; }
.motywy button { border-radius: 10px; padding: 10px 0 6px; cursor: pointer; font: 600 12px system-ui, sans-serif; border: 2px solid transparent; display: grid; gap: 4px; justify-items: center; }
.motywy button span { font: 700 18px Georgia, serif; }
.motywy button[aria-pressed="true"] { border-color: var(--akcent); }
.motywy [data-motyw="jasny"] { background: #f7f4ec; color: #1f2430; box-shadow: inset 0 0 0 1px #e2dbcc; }
.motywy [data-motyw="sepia"] { background: #f2e8d5; color: #3b2f20; box-shadow: inset 0 0 0 1px #dccaa8; }
.motywy [data-motyw="ciemny"] { background: #10151f; color: #ece6d8; }
.motywy [data-motyw="kontrast"] { background: #000; color: #fff; }
.rozmiary { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rozmiary button { flex: 1; padding: 8px; border-radius: 10px; border: 1px solid var(--linia); background: var(--pole); color: var(--tekst); cursor: pointer; font: 700 16px Georgia, serif; }
.rozmiary span { min-width: 54px; text-align: center; font-size: 14px; color: var(--tekst-2); }

/* spis treści – wysuwany panel */
.zaslona { position: fixed; inset: 0; background: rgba(0, 0, 0, .35); z-index: 39; }
.spis-panel { position: fixed; top: 0; bottom: 0; left: 0; z-index: 40; width: min(380px, 88vw); background: var(--karta); color: var(--tekst); border-right: 1px solid var(--linia);
  box-shadow: 18px 0 50px rgba(0, 0, 0, .25); overflow-y: auto; padding: 0 18px 30px; }
.spis-glowa { position: sticky; top: 0; background: var(--karta); display: flex; justify-content: space-between; align-items: center; padding: 16px 0 10px; border-bottom: 1px solid var(--linia); }
.spis-glowa b { font-family: Georgia, serif; font-size: 20px; }
.spis-glowa button { background: none; border: 1px solid var(--linia); color: var(--tekst); border-radius: 10px; width: 36px; height: 36px; font-size: 16px; cursor: pointer; }
.spis-panel h3 { font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--akcent); margin: 18px 0 8px; }
.spis-panel ol, .spis-panel ul { list-style: none; padding: 0; margin: 0; }
.spis-panel li a { display: block; padding: 6px 8px; border-radius: 8px; text-decoration: none; color: var(--tekst); font-size: 15px; line-height: 1.35; }
.spis-panel li a:hover { background: var(--pole); }
.spis-panel li.pod a { padding-left: 22px; font-size: 14px; color: var(--tekst-2); }
.spis-panel li a.aktualny { background: var(--czytane); font-weight: 700; }
.spis-panel ol li a { border-left: 2px solid var(--linia); border-radius: 0 8px 8px 0; }
.spis-panel ol li a.widoczny { border-left-color: var(--akcent); color: var(--akcent-mocny); }
.spis-panel details { border-bottom: 1px solid var(--linia); padding: 4px 0; }
.spis-panel summary { cursor: pointer; padding: 8px 4px; font-weight: 600; font-family: Georgia, serif; font-size: 17px; }
.spis-panel summary small { color: var(--tekst-2); font: 13px system-ui, sans-serif; }
.dzialy-skrot { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.dzialy-skrot a { padding: 7px 12px; border-radius: 999px; border: 1px solid var(--linia); background: var(--karta); text-decoration: none; color: var(--tekst); font-size: 14px; }
.dzialy-skrot a:hover { border-color: var(--akcent); }

/* artykuł */
.okruszki { margin: 34px 0 8px; font-size: 14px; color: var(--tekst-2); }
.okruszki a { color: var(--tekst-2); }
h1 { font-family: Georgia, serif; font-size: clamp(32px, 6vw, 50px); line-height: 1.1; margin: 0 0 10px;
  background: var(--h1); -webkit-background-clip: text; background-clip: text; color: transparent; }
.meta { color: var(--tekst-2); font-size: 14px; margin: 0 0 26px; }
.skrot { background: var(--karta); border: 1px solid var(--linia); border-radius: 14px; padding: 14px 18px; margin: 0 0 30px; box-shadow: var(--cien); }
.skrot summary { cursor: pointer; font-weight: 600; }
.skrot summary span { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--akcent); margin-left: 8px; font-weight: 700; }
.skrot p, .skrot li { color: var(--tekst-2); font-size: 15px; }
.skrot .uwaga { font-size: 13px; font-style: italic; }
.tresc { font-family: Georgia, "Times New Roman", serif; font-size: var(--rozmiar); line-height: 1.75; color: var(--tresc); overflow-wrap: break-word; }
.tresc p { margin: 0 0 1.05em; }
.tresc strong { color: var(--mocny); }
.tresc .rozdzial { scroll-margin-top: 72px; }
.tresc h1, .tresc h2, .tresc h3 { font-family: Georgia, serif; color: var(--naglowek); line-height: 1.25; scroll-margin-top: 72px; }
.tresc img { display: block; max-width: 100%; height: auto; margin: 1.4em auto .5em; border-radius: 6px; box-shadow: var(--cien); background: #fff; }
.tresc a img { display: inline-block; margin: .3em; box-shadow: none; background: none; }
.tresc hr { border: 0; height: 1px; margin: 2.2em auto; width: 40%; background: linear-gradient(90deg, transparent, var(--akcent), transparent); opacity: .6; }
.tresc blockquote { margin: 1.2em 0; padding: .2em 0 .2em 1em; border-left: 3px solid var(--akcent); }
.tresc ul, .tresc ol { padding-left: 1.3em; }
.tresc li { margin-bottom: .35em; }
.tresc .tabela { overflow-x: auto; margin: 1.2em 0; border: 1px solid var(--linia); border-radius: 10px; background: var(--karta); }
.tresc table { border-collapse: collapse; width: 100%; font: 15px/1.45 system-ui, sans-serif; }
.tresc th { background: var(--tabela-glowa); text-align: left; }
.tresc td, .tresc th { border-bottom: 1px solid var(--linia); padding: 8px 10px; vertical-align: top; }
.tresc tr:last-child td { border-bottom: 0; }
.inicjal { float: left; font-size: 3.1em; line-height: .85; margin: .06em .1em 0 0; color: var(--inicjal); font-weight: 700; }
.podstrony, .zapytaj { background: var(--karta); border: 1px solid var(--linia); border-radius: 14px; padding: 16px 20px; margin: 30px 0 16px; box-shadow: var(--cien); }
.podstrony h2 { font-family: Georgia, serif; font-size: 20px; margin: 0 0 8px; }
.zapytaj p { margin: 6px 0 12px; color: var(--tekst-2); font-size: 15px; }
.pytanie { width: 100%; text-align: left; background: var(--pole); border: 1px solid var(--linia); border-radius: 12px; padding: 12px 14px; color: var(--tekst);
  font: 15px/1.5 system-ui, sans-serif; cursor: pointer; display: flex; justify-content: space-between; gap: 12px; }
.pytanie:hover { border-color: var(--akcent); }
.kop { font-size: 13px; color: var(--akcent-mocny); font-weight: 600; white-space: nowrap; }
.zrodla-art { font-size: 14px; color: var(--tekst-2); overflow-wrap: anywhere; }
.poprz-nast { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
.poprz-nast a { display: block; background: var(--karta); border: 1px solid var(--linia); border-radius: 12px; padding: 12px 14px; text-decoration: none; color: var(--tekst); }
.poprz-nast a:hover { border-color: var(--akcent); }
.poprz-nast span { display: block; font-size: 12px; color: var(--akcent); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 2px; }
.poprz-nast .nast { text-align: right; }

/* spis artykułów (strona główna czytelni) */
.spis input { width: 100%; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--linia); background: var(--karta); color: var(--tekst); font-size: 16px; margin: 0 0 16px; }
.spis input:focus { outline: 2px solid var(--akcent); }
.dzial h2 { font-family: Georgia, serif; font-size: 26px; margin: 30px 0 10px; color: var(--naglowek); scroll-margin-top: 72px; }
.dzial h2 small { font-size: 14px; color: var(--tekst-2); font-family: system-ui, sans-serif; }
.dzial ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.dzial li a { display: block; padding: 12px 14px; border-radius: 12px; background: var(--karta); border: 1px solid var(--linia); text-decoration: none; color: var(--tekst); }
.dzial li a:hover { border-color: var(--akcent); }
.dzial li.pod { margin-left: 22px; }
.dzial li b { display: block; font-family: Georgia, serif; font-size: 18px; color: var(--naglowek); }
.dzial li span { display: block; font-size: 14px; color: var(--tekst-2); margin-top: 2px; }
.brak { color: var(--tekst-2); }
footer { margin-top: 50px; padding: 26px 0 40px; border-top: 1px solid var(--linia); color: var(--tekst-2); font-size: 14px; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); opacity: 0; transition: .2s; background: #e8b04b; color: #14110a;
  font-weight: 600; padding: 10px 18px; border-radius: 999px; pointer-events: none; z-index: 50; }
.toast.widoczny { opacity: 1; transform: translateX(-50%); }

/* odtwarzacz „Posłuchaj” (syntezator mowy przeglądarki) */
.odtwarzacz { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 0 0 22px; padding: 10px 12px; border-radius: 14px;
  background: linear-gradient(180deg, rgba(226, 169, 63, .14), rgba(226, 169, 63, .05)); border: 1px solid rgba(190, 130, 40, .35); }
.odtwarzacz button { font: 600 15px system-ui, sans-serif; border: 0; border-radius: 10px; cursor: pointer; }
.graj { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; background: linear-gradient(180deg, #f3c873, #dc9f35); color: #14110a; }
.graj:hover { background: linear-gradient(180deg, #f8d590, #e8ad45); }
.ikona-graj { width: 0; height: 0; border-left: 11px solid currentColor; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.graj.gra .ikona-graj { width: 10px; height: 13px; border: 0; border-left: 3px solid currentColor; border-right: 3px solid currentColor; }
.stop { padding: 9px 12px; background: var(--pole); color: var(--tekst); box-shadow: inset 0 0 0 1px var(--linia); }
.odtwarzacz label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--tekst-2); }
.odtwarzacz select { background: var(--pole); color: var(--tekst); border: 1px solid var(--linia); border-radius: 8px; padding: 6px 8px; font-size: 14px; max-width: 260px; }
.postep { font-size: 13px; color: var(--tekst-2); margin-left: auto; }
.wskazowka-glos { flex-basis: 100%; margin: 2px 0 0; font-size: 13px; color: var(--tekst-2); }
.tresc .czytane { background: var(--czytane); box-shadow: -14px 0 0 var(--czytane), 14px 0 0 var(--czytane); border-radius: 4px; transition: background .3s; }
.tresc.slucha [data-seg] { cursor: pointer; }

@media (max-width: 640px) {
  .poprz-nast { grid-template-columns: 1fr; }
  .poprz-nast .nast { text-align: left; }
  .gora nav { gap: 2px; font-size: 14px; }
  .gora nav a, .przycisk-gora { padding: 7px 7px; }
  .gora .tylko-szeroki { display: none; }
  .logo { font-size: 15px; }
  .dzial li.pod { margin-left: 12px; }
  .odtwarzacz label.glos { flex-basis: 100%; }
  .odtwarzacz label.glos select { flex: 1; }
  .panel-wygladu { right: 12px; left: 12px; width: auto; }
}
@media print {
  .gora, .odtwarzacz, .zapytaj, .poprz-nast, footer, .skrot, .spis-panel, .zaslona, .panel-wygladu { display: none !important; }
  body { background: #fff; color: #000; }
  .tresc { color: #000; font-size: 12pt; }
}
