
:root {
  --atrament: #123029;      /* głęboka zieleń — tożsamość, zaufanie */
  --atrament-2: #1E4E40;    /* średnia zieleń do gradientu hero */
  --papier: #F3F4EF;        /* cieplejsza złamana biel (nuta piaskowa) */
  --karta: #FFFFFF;
  --kremowy: #EBF0E9;       /* jasny zielony tint: pasy sekcji, zebra */
  --miod: #B5831A;          /* akcent — używany oszczędnie */
  --miod-jasny: #E4B34A;    /* jaśniejszy miód na ciemnym tle */
  --linia: #DDE2D8;
  --szary: #55625A;
  --cien: 0 1px 2px rgba(18,48,41,.05), 0 4px 14px rgba(18,48,41,.05);
  --cien-h: 0 2px 6px rgba(18,48,41,.08), 0 12px 28px rgba(18,48,41,.08);
  --r: 10px;   /* spójne zaokrąglenie */
  --r-s: 6px;
}
* { box-sizing: border-box; }
/* --- dostępność --- */
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--miod); color: #fff; padding: 0.6rem 1rem; border-radius: 0 0 var(--r-s) 0;
  font-family: "IBM Plex Sans", sans-serif; text-decoration: none; }
.skip-link:focus { left: 0; }
:focus-visible { outline: 3px solid var(--miod); outline-offset: 2px; border-radius: 2px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, th:focus-visible {
  outline: 3px solid var(--miod); outline-offset: 2px; }
body { margin: 0; background: var(--papier); color: var(--atrament);
  background-image: radial-gradient(1200px 400px at 70% -100px, rgba(30,78,64,.05), transparent);
  background-repeat: no-repeat;
  font-family: "IBM Plex Sans", system-ui, sans-serif; line-height: 1.6;
  -webkit-font-smoothing: antialiased; }
main { max-width: 1080px; margin: 0 auto; padding: 1.4rem 1rem 3rem; }
h1, h2 { font-family: "Space Grotesk", sans-serif; letter-spacing: -0.015em; }
h1 { font-size: clamp(1.8rem, 4.5vw, 2.6rem); margin: 0.3em 0; line-height: 1.1; }
a { color: var(--atrament); }
/* nagłówki sekcji dostają krótki miodowy znacznik (spójny element strukturalny) */
main h2 { position: relative; padding-top: 0.5rem; }
main h2::before { content: ""; position: absolute; top: 0; left: 0;
  width: 34px; height: 3px; background: var(--miod); border-radius: 2px; }
/* --- pasek górny --- */
.pasek { display: flex; justify-content: space-between; align-items: center;
  padding: 0.85rem 1.2rem; background: var(--atrament); color: #fff;
  position: sticky; top: 0; z-index: 20; }
.logo { font-family: "Space Grotesk"; font-weight: 700; text-decoration: none;
  font-size: 1.1rem; color: #fff; }
.logo span { font-weight: 500; color: var(--miod-jasny); font-size: 0.7rem;
  margin-left: 0.4rem; letter-spacing: 0.04em; text-transform: uppercase; }
.pasek nav a { margin-left: 1.3rem; text-decoration: none; color: rgba(255,255,255,.72);
  font-size: 0.92rem; transition: color .15s; }
.pasek nav a:hover { color: #fff; }
/* --- hero (element sygnaturowy) --- */
.hero { position: relative; overflow: hidden; border-radius: var(--r);
  background: linear-gradient(120deg, var(--atrament) 0%, var(--atrament-2) 100%);
  color: #fff; margin: 0.4rem 0 1.8rem; box-shadow: var(--cien-h); }
.hero-motyw { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-tresc { position: relative; padding: 2.4rem 1.8rem; max-width: 44rem; }
.hero-eyebrow { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.12em;
  color: var(--miod-jasny); font-weight: 600; }
.hero h1 { margin: 0.5rem 0 0.7rem; color: #fff; }
.hero h1 .akcent { color: #fff; box-shadow: inset 0 -0.32em 0 rgba(228,179,74,.38); }
.hero p { margin: 0; max-width: 40rem; color: rgba(255,255,255,.82); font-size: 1.05rem; }
/* --- tabela --- */
.tabela-glowa { display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 0.8rem; margin-top: 1.6rem; }
.tabela-glowa h2 { margin: 0; font-size: 1.15rem; }
.szukajka { display: flex; align-items: center; gap: 0.6rem; }
#szukaj { font-family: "IBM Plex Sans"; font-size: 0.9rem; padding: 0.5rem 0.9rem;
  border: 1px solid var(--linia); border-radius: 999px; background: var(--karta);
  min-width: 240px; color: var(--atrament); box-shadow: var(--cien); }
#szukaj:focus { outline: none; border-color: var(--atrament); box-shadow: 0 0 0 3px rgba(18,48,41,.08); }
.licznik { font-size: 0.8rem; color: var(--szary); font-variant-numeric: tabular-nums; }
.tabela-otok { }
table { border-collapse: separate; border-spacing: 0; width: 100%; background: var(--karta);
  font-size: 0.92rem; margin-top: 0.8rem; border-radius: var(--r); overflow: hidden;
  box-shadow: var(--cien); }
th, td { padding: 0.6rem 0.8rem; text-align: right; border-bottom: 1px solid var(--linia);
  font-family: "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; white-space: nowrap; }
th { font-family: "IBM Plex Sans"; background: var(--atrament); color: #fff;
  cursor: pointer; user-select: none; position: sticky; top: 57px; font-weight: 600;
  font-size: 0.82rem; white-space: nowrap; }
th:hover { background: var(--atrament-2); }
td.lewo, th:first-child, th:nth-child(2) { text-align: left; font-family: "IBM Plex Sans"; }
td.lewo a { text-decoration: none; font-weight: 600; }
td.lewo a:hover { color: var(--miod); text-decoration: underline; }
tbody tr:nth-child(even) td { background: #FAFCFB; }
tbody tr:hover td { background: var(--kremowy); }
tbody tr:last-child td { border-bottom: none; }
.legenda { font-size: 0.85rem; color: var(--szary); margin-top: 1rem; line-height: 1.7; }
.legenda a { color: var(--atrament); }
.drobne { font-size: 0.78rem; color: var(--szary); }
.okruszki { font-size: 0.85rem; color: var(--szary); margin: 0.4rem 0 1rem; }
.okruszki a { color: var(--szary); }
/* --- strona spółki --- */
.naglowek-spolki { display: flex; justify-content: space-between; align-items: flex-end;
  flex-wrap: wrap; gap: 1rem; padding: 1.2rem 1.4rem; background: var(--karta);
  border-radius: var(--r); box-shadow: var(--cien); border-top: 3px solid var(--miod); }
.sektor { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--miod);
  font-weight: 600; }
.naglowek-spolki h1 { margin: 0.2rem 0 0; }
.kurs-duzy { font-family: "IBM Plex Mono"; font-size: 2rem; text-align: right; font-weight: 500; }
.kurs-duzy span { display: block; font-family: "IBM Plex Sans"; font-size: 0.72rem;
  color: var(--szary); text-transform: uppercase; letter-spacing: 0.06em; }
.opis-spolki { background: var(--kremowy); border-radius: var(--r);
  padding: 1rem 1.3rem; margin: 1.4rem 0; }
.opis-spolki h2 { margin: 0 0 0.3rem; font-size: 1.05rem; }
.opis-spolki h2::before { display: none; }
.opis-spolki p { margin: 0; }
.siatka-kart { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1rem; }
.karta { background: var(--karta); border-radius: var(--r); padding: 1.1rem 1.2rem;
  box-shadow: var(--cien); transition: box-shadow .18s, transform .18s; }
.karta:hover { box-shadow: var(--cien-h); transform: translateY(-2px); }
.karta-glowa { display: flex; justify-content: space-between; font-size: 0.85rem; align-items: baseline; }
.karta-nazwa { font-weight: 600; }
.karta-info { color: var(--miod); font-size: 0.78rem; text-decoration: none; }
.karta-info:hover { text-decoration: underline; }
.karta-liczba { font-family: "IBM Plex Mono"; font-size: 2.1rem; margin: 0.3rem 0 0.6rem;
  font-weight: 500; letter-spacing: -0.02em; }
.karta-tekst { font-size: 0.88rem; color: var(--szary); margin: 0.7rem 0 0; }
.pasek-tlo { position: relative; height: 6px; background: var(--linia); border-radius: 3px; }
.pasek-kropka { position: absolute; top: -3px; width: 12px; height: 12px; margin-left: -6px;
  background: var(--atrament); border-radius: 50%; box-shadow: 0 1px 3px rgba(18,48,41,.3); }
.pasek-med { position: absolute; top: -4px; width: 2px; height: 14px; background: var(--miod); }
.pasek-podpis { display: flex; justify-content: space-between; font-size: 0.68rem;
  color: var(--szary); margin-top: 0.35rem; }
.pigulki { margin: 0.5rem 0 1.2rem; }
.pigulka { display: inline-block; padding: 0.3rem 0.8rem; margin: 0 0.4rem 0.4rem 0;
  border: 1px solid var(--linia); border-radius: 999px; text-decoration: none;
  font-size: 0.85rem; background: var(--karta); box-shadow: var(--cien); transition: border-color .15s; }
.pigulka:hover { border-color: var(--atrament); }
.pigulka.akt { background: var(--atrament); color: #fff; border-color: var(--atrament); }
.lead { font-size: 1.15rem; color: var(--szary); }
footer { border-top: 1px solid var(--linia); margin-top: 2.5rem; background: var(--karta); }
footer p { max-width: 1080px; margin: 0 auto; padding: 0 1rem 1.2rem; font-size: 0.75rem; color: var(--szary); }
.stopka-nawigacja { max-width: 1080px; margin: 0 auto; padding: 1.2rem 1rem 0.6rem;
  display: flex; flex-wrap: wrap; gap: 1.4rem; }
.stopka-nawigacja a { font-size: 0.85rem; color: var(--atrament); text-decoration: none; font-weight: 600; }
.stopka-nawigacja a:hover { color: var(--miod); text-decoration: underline; }
/* --- strony treściowe (proza) --- */
.proza { max-width: 46rem; }
.proza h1 { margin-bottom: 0.6rem; }
.proza h2 { font-size: 1.15rem; margin: 1.8rem 0 0.4rem; }
.proza p { margin: 0.5rem 0; }
/* --- artykuły / poradnik --- */
.artykul { max-width: 44rem; font-size: 1.02rem; line-height: 1.72; }
.artykul .lead { font-size: 1.2rem; color: var(--atrament); line-height: 1.55; margin: 0.6rem 0 1.4rem; }
.artykul h2 { font-size: 1.4rem; margin: 2rem 0 0.5rem; }
.artykul p { margin: 0.7rem 0; }
.artykul a { color: var(--atrament-2); text-decoration: underline; text-underline-offset: 2px;
  text-decoration-color: var(--miod); }
.artykul a:hover { color: var(--miod); }
.artykul ul { margin: 0.7rem 0; padding-left: 1.3rem; }
.artykul li { margin: 0.4rem 0; }
.artykul ul li::marker { color: var(--miod); }
.wskazowka { background: var(--kremowy); border-radius: var(--r); padding: 0.9rem 1.2rem;
  margin: 1.3rem 0; font-size: 0.96rem; border-left: 3px solid var(--miod); }
.wskazowka a { color: var(--atrament-2); }
.powiazane-narzedzia { margin-top: 2.5rem; padding-top: 1.2rem; border-top: 2px solid var(--linia); }
.powiazane-narzedzia h2 { font-size: 1.15rem; }
.powiazane-narzedzia .lista-karta strong { font-size: 0.9rem; }
.artykuly-siatka { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.9rem; }
.artykul-karta { background: var(--karta); border-radius: var(--r); padding: 1.1rem 1.2rem;
  text-decoration: none; display: block; box-shadow: var(--cien);
  border-left: 3px solid var(--miod); transition: transform .15s, box-shadow .15s; }
.artykul-karta:hover { transform: translateY(-2px); box-shadow: var(--cien-h); }
.artykul-karta strong { display: block; font-family: "Space Grotesk"; font-size: 1.05rem;
  margin-bottom: 0.3rem; line-height: 1.25; }
.artykul-karta span { font-size: 0.88rem; color: var(--szary); line-height: 1.45; }
.sekcja-wiecej { margin-top: 0.9rem; }
.sekcja-wiecej a { color: var(--atrament-2); font-weight: 600; text-decoration: none; }
.sekcja-wiecej a:hover { color: var(--miod); text-decoration: underline; }
/* --- elementy graficzne w artykułach --- */
.ilustracja { margin: 1.6rem 0; text-align: center; }
.ilustracja svg { width: 100%; max-width: 560px; height: auto; }
.ilustracja figcaption { font-size: 0.82rem; color: var(--szary); margin-top: 0.5rem; }
.ilustr-etyk { font-family: "IBM Plex Sans", sans-serif; font-size: 15px; fill: var(--szary); font-weight: 600; }
.ilustr-etyk-jasny { font-family: "IBM Plex Sans", sans-serif; font-size: 15px; fill: rgba(255,255,255,.75); font-weight: 600; }
.ilustr-liczba { font-family: "IBM Plex Mono", monospace; font-size: 26px; fill: var(--atrament); font-weight: 500; }
.ilustr-liczba-jasny { font-family: "IBM Plex Mono", monospace; font-size: 26px; fill: #fff; font-weight: 600; }
.ilustr-znak { font-family: "IBM Plex Sans", sans-serif; font-size: 30px; fill: var(--miod); font-weight: 700; }
.ilustr-opis { font-family: "IBM Plex Sans", sans-serif; font-size: 13px; fill: var(--szary); }
.ilustr-akcent { fill: var(--miod); }
.cytat { margin: 1.6rem 0; padding: 0.4rem 0 0.4rem 1.4rem; border-left: 4px solid var(--miod);
  font-family: "Space Grotesk", sans-serif; font-size: 1.35rem; line-height: 1.4;
  color: var(--atrament); font-weight: 500; }
.przyklad { background: linear-gradient(180deg, #fff, var(--kremowy)); border-radius: var(--r);
  padding: 1.2rem 1.4rem 1rem; margin: 1.6rem 0; box-shadow: var(--cien); position: relative; }
.przyklad-plakietka { display: inline-block; font-family: "IBM Plex Sans"; font-size: 0.7rem;
  text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; color: var(--miod);
  margin-bottom: 0.3rem; }
.przyklad h3 { font-family: "Space Grotesk"; font-size: 1.1rem; margin: 0 0 0.5rem; }
.przyklad p { margin: 0.4rem 0; font-size: 0.97rem; }
.tabela-art-otok { overflow-x: auto; margin: 1.5rem 0; }
.tabela-art { border-collapse: separate; border-spacing: 0; width: 100%; background: var(--karta);
  border-radius: var(--r); overflow: hidden; box-shadow: var(--cien); font-size: 0.95rem; }
.tabela-art th { background: var(--atrament); color: #fff; text-align: left; padding: 0.6rem 0.9rem;
  font-family: "IBM Plex Sans"; font-weight: 600; font-size: 0.9rem; }
.tabela-art td { padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--linia); vertical-align: top; }
.tabela-art tr:last-child td { border-bottom: none; }
.tabela-art td:first-child { font-weight: 600; }
/* --- wykresy --- */
.blok-wykresu { background: var(--karta); border-radius: var(--r); box-shadow: var(--cien);
  padding: 1rem 1.2rem 0.5rem; margin: 1.4rem 0 0; }
.wykres-glowa { display: flex; justify-content: space-between; align-items: center; }
.wykres-glowa h2 { margin: 0; font-size: 1.05rem; }
.wykres-glowa h2::before { display: none; }
.zakresy { display: flex; gap: 0.3rem; }
.zakres { font-family: "IBM Plex Mono", monospace; font-size: 0.8rem; padding: 0.3rem 0.75rem;
  border: 1px solid var(--linia); background: var(--karta); cursor: pointer; border-radius: var(--r-s); }
.zakres.akt { background: var(--atrament); color: #fff; border-color: var(--atrament); }
.zakres:hover:not(.akt) { border-color: var(--atrament); }
.panel-wykresu.ukryty { display: none; }
.wykres { width: 100%; height: auto; display: block; margin-top: 0.4rem; }
.w-siatka { stroke: var(--linia); stroke-width: 1; }
.w-linia { fill: none; stroke: var(--atrament); stroke-width: 2; stroke-linejoin: round; }
.w-kropka { fill: var(--atrament); }
.w-etyk { font-family: "IBM Plex Mono", monospace; font-size: 11px; fill: var(--szary); }
.w-data { text-anchor: middle; }
.w-zmiana { font-family: "IBM Plex Sans", sans-serif; font-size: 13px; font-weight: 600; }
.w-plus { fill: #1C7C4A; }
.w-minus { fill: #B3372B; }
.td-spark { padding: 0.2rem 0.5rem; }
.spark { width: 90px; height: 26px; display: block; margin-left: auto; }
.spark polyline { fill: none; stroke: var(--atrament); stroke-width: 1.5; opacity: 0.7; }
/* --- gotowe listy / kalkulatory (karty nawigacyjne) --- */
.listy-sekcja { margin-top: 2.2rem; }
.listy-sekcja h2 { font-size: 1.25rem; margin: 0 0 0.2rem; }
.sekcja-opis { color: var(--szary); font-size: 0.9rem; margin: 0 0 0.9rem; }
.listy-siatka { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 0.6rem; }
.lista-karta { background: var(--karta); border-radius: var(--r-s); padding: 0.75rem 0.9rem;
  text-decoration: none; display: block; box-shadow: var(--cien);
  border-left: 3px solid transparent; transition: border-color .15s, transform .15s, box-shadow .15s; }
.lista-karta:hover { border-left-color: var(--miod); transform: translateY(-2px); box-shadow: var(--cien-h); }
.lista-karta strong { display: block; font-family: "Space Grotesk"; font-size: 0.95rem;
  margin-bottom: 0.1rem; line-height: 1.25; }
.lista-karta span { font-size: 0.8rem; color: var(--szary); line-height: 1.35; }
/* --- kalkulatory (formularze) --- */
.kalk { background: var(--karta); border-radius: var(--r); box-shadow: var(--cien);
  padding: 1.2rem 1.3rem; margin: 1rem 0 1.6rem; }
.kalk label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.85rem; color: var(--szary); }
.kalk input[type=number], .kalk input[type=text], .kalk select {
  font-family: "IBM Plex Mono", monospace; font-size: 1rem; padding: 0.5rem 0.7rem;
  border: 1px solid var(--linia); border-radius: var(--r-s); color: var(--atrament); width: 100%;
  background: var(--karta); }
.kalk input:focus, .kalk select:focus { outline: none; border-color: var(--atrament);
  box-shadow: 0 0 0 3px rgba(18,48,41,.08); }
.kalk-siatka { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 0.9rem; }
.kalk-check { flex-direction: row !important; align-items: center; gap: 0.5rem; grid-column: 1 / -1; }
.kalk-check input { width: auto; }
.kalk-wiersz { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: 0.8rem; align-items: end;
  padding: 0.6rem 0; border-bottom: 1px dashed var(--linia); }
.kalk-usun { border: none; background: none; font-size: 1.3rem; color: var(--szary); cursor: pointer; padding: 0.4rem; }
.kalk-usun:hover { color: #B3372B; }
.kalk-dodaj { margin-top: 0.8rem; padding: 0.45rem 1rem; border: 1px solid var(--atrament);
  background: var(--karta); border-radius: var(--r-s); cursor: pointer; font-family: "IBM Plex Sans"; }
.kalk-dodaj:hover { background: var(--atrament); color: #fff; }
.kalk-wynik { margin-top: 1.2rem; }
.kalk-wynik div { display: flex; justify-content: space-between; padding: 0.4rem 0;
  border-bottom: 1px solid var(--linia); font-size: 0.95rem; }
.kalk-wynik strong { font-family: "IBM Plex Mono", monospace; }
.kalk-glowny { background: var(--kremowy); margin: 0.3rem -1.3rem 0; padding: 0.6rem 1.3rem !important;
  font-weight: 600; border-radius: var(--r-s); }
.kalk-uwaga { font-size: 0.85rem; color: var(--miod); margin-top: 0.6rem; }
.w-wplaty { stroke-dasharray: 5 4; opacity: 0.5; }
/* --- słupki dywidend --- */
.dyw-slup { fill: var(--atrament); }
.dyw-kwota { font-family: "IBM Plex Mono", monospace; font-size: 11px; fill: var(--szary); text-anchor: middle; }
.dyw-rok { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; fill: var(--szary); text-anchor: middle; }
/* --- akcje nad tabelą: szukajka, filtry, excel --- */
.tabela-akcje { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; }
.btn-filtry, .btn-excel { font-family: "IBM Plex Sans"; font-size: 0.85rem; padding: 0.5rem 0.9rem;
  border-radius: var(--r-s); cursor: pointer; text-decoration: none; white-space: nowrap;
  border: 1px solid var(--linia); background: var(--karta); color: var(--atrament); box-shadow: var(--cien); }
.btn-filtry:hover, .btn-excel:hover { border-color: var(--atrament); }
.btn-excel { border-color: var(--miod); color: var(--miod); font-weight: 600; }
.btn-excel:hover { background: var(--miod); color: #fff; border-color: var(--miod); }
/* --- portret spółki (auto-podsumowanie) --- */
.spolka-portret { background: var(--kremowy); border-left: 3px solid var(--miod);
  border-radius: var(--r-s); padding: 1rem 1.2rem; margin: 1.2rem 0; }
.spolka-portret p { font-size: 1.08rem; line-height: 1.62; color: var(--atrament); margin: 0; }
.portret-auto { display: block; font-size: 0.75rem; color: var(--szary); margin-top: 0.5rem; font-style: italic; }
.sym-strat-opis { font-size: 0.82rem; color: var(--szary); margin: 0.4rem 0 0; line-height: 1.45; }
.glowna-opis { margin: 2.2rem 0 1rem; }
.glowna-opis h2 { margin-bottom: 0.5rem; }
.glowna-opis p { margin: 0 0 0.8rem; max-width: 72ch; }
.faq-sekcja { margin: 1.5rem 0; }
.faq-item { border: 1px solid var(--linia); border-radius: 8px; margin-bottom: 0.5rem; background: var(--karta); }
.faq-item summary { padding: 0.75rem 1rem; cursor: pointer; font-weight: 600; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::before { content: "+"; color: var(--miod); font-weight: 700; margin-right: 0.5rem; }
.faq-item[open] summary::before { content: "−"; }
.faq-odp { padding: 0 1rem 0.85rem; color: var(--szary); max-width: 72ch; line-height: 1.5; }
.faq-odp a { color: var(--miod); }
.stopka-inne { font-size: 0.85rem; margin: 0 auto; padding: 0 1rem 0.5rem; }
.stopka-inne a { color: var(--miod); font-weight: 600; }
.autor-foto { float: right; width: 150px; height: auto; border-radius: 10px;
  margin: 0.2rem 0 1rem 1.5rem; border: 1px solid var(--linia); }
@media (max-width: 480px) { .autor-foto { width: 110px; margin-left: 1rem; } }
/* --- nota autora (E-E-A-T) --- */
.autor-nota { background: var(--kremowy); border-left: 3px solid var(--miod);
  border-radius: 8px; padding: 0.9rem 1.1rem; margin: 1.8rem 0 0.8rem; font-size: 0.92rem; }
.autor-nota p { margin: 0 0 0.45rem; }
.autor-nota p:last-child { margin-bottom: 0; }
.autor-glowa { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: baseline; }
.autor-data { font-size: 0.8rem; color: var(--szary); font-family: "IBM Plex Mono", monospace; }
.autor-kontakt { font-size: 0.85rem; color: var(--szary); }
.autor-kontakt a { color: var(--miod); }
/* --- podobne spółki --- */
.pod-sekcja { margin: 1.8rem 0 0.5rem; }
.pod-opis { font-size: 0.9rem; color: var(--szary); margin: 0.3rem 0 0.8rem; }
.pod-guziki { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pod-guzik { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.45rem 0.75rem;
  border: 1.5px solid var(--linia); border-radius: 10px; background: var(--karta);
  color: var(--atrament); text-decoration: none; font-size: 0.9rem; font-weight: 600;
  transition: border-color 0.15s, transform 0.15s; }
.pod-guzik:hover { border-color: var(--miod); transform: translateY(-1px); }
.pod-tick { font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; color: var(--miod);
  background: rgba(181,131,26,0.12); padding: 0.12rem 0.35rem; border-radius: 5px; }
/* --- filtr sektora --- */
.filtr-sektor-box { display: flex; flex-direction: column; gap: 0.3rem; min-width: 190px; }
.filtr-sektor-box label { font-size: 0.82rem; font-weight: 600; color: var(--atrament); }
#filtr-sektor { font-family: "IBM Plex Sans", sans-serif; font-size: 0.9rem; padding: 0.5rem 0.6rem;
  border: 1.5px solid var(--linia); border-radius: 8px; background: var(--karta); color: var(--atrament); cursor: pointer; }
#filtr-sektor:hover { border-color: var(--miod); }
/* --- mini-wykres płynności --- */
.plyn-sekcja { margin: 1.6rem 0; }
.plyn-svg { width: 100%; max-width: 490px; height: auto; display: block; margin: 0.6rem 0; }
.plyn-nazwa { font-family: "Space Grotesk", sans-serif; font-size: 12px; font-weight: 600; fill: var(--atrament); }
.plyn-opis { font-size: 9px; fill: #8A8F98; }
.plyn-wart { font-family: "IBM Plex Mono", monospace; font-size: 12px; font-weight: 700; }
.plyn-strefa-zla { fill: rgba(178,59,59,0.07); }
.plyn-strefa-ok { fill: rgba(30,122,75,0.06); }
.plyn-linia { stroke: var(--atrament); stroke-width: 1.5; stroke-dasharray: 3 3; opacity: 0.5; }
.plyn-linia-txt { font-size: 9px; fill: #8A8F98; }
.plyn-punch { font-size: 1.05rem; color: var(--atrament); margin: 0.2rem 0 0.4rem; }
.plyn-note { font-size: 0.85rem; color: #8A8F98; font-style: italic; margin-top: 0.3rem; }
/* --- od przychodu do zysku --- */
.wod-sekcja { margin: 1.6rem 0; }
.wod-svg { width: 100%; max-width: 490px; height: auto; display: block; margin: 0.6rem 0; }
.wod-nazwa { font-family: "Space Grotesk", sans-serif; font-size: 12px; font-weight: 600; fill: var(--atrament); }
.wod-opis { font-size: 9px; fill: #8A8F98; }
.wod-tor { fill: rgba(18,48,41,0.06); }
.wod-wart { font-family: "IBM Plex Mono", monospace; font-size: 12px; font-weight: 600; }
.wod-punch { font-size: 1.05rem; color: var(--atrament); margin: 0.2rem 0 0.4rem; }
.wod-punch strong { color: var(--miod); }
.wod-note { font-size: 0.85rem; color: #8A8F98; font-style: italic; margin-top: 0.3rem; }
.wod-uwaga { font-size: 0.88rem; color: var(--atrament); background: var(--kremowy); border-left: 3px solid var(--miod); padding: 0.5rem 0.8rem; border-radius: 6px; margin: 0.5rem 0 0; }
/* --- presety screenera („po ludzku") --- */
.presety { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 1.3rem 0 0.3rem; }
.presety-etyk { font-size: 0.9rem; color: var(--szary); font-weight: 600; margin-right: 0.15rem; }
.preset-btn { font-family: "Space Grotesk", sans-serif; font-size: 0.9rem; font-weight: 600;
  padding: 0.45rem 0.95rem; border-radius: 999px; border: 1.5px solid var(--linia);
  background: var(--karta); color: var(--atrament); cursor: pointer; transition: all .15s; }
.preset-btn:hover { border-color: var(--miod); color: var(--atrament); }
.preset-btn.akt { background: var(--atrament); color: #fff; border-color: var(--atrament); }
.presety-opis { font-size: 0.9rem; color: var(--szary); margin: 0.15rem 0 0.5rem; min-height: 1.15em;
  font-style: italic; }
/* --- karta zdrowia spółki --- */
.spolka-lead { font-size: 1.08rem; line-height: 1.65; color: var(--atrament);
  margin: 1.1rem 0 0.2rem; padding: 0.2rem 0 0.2rem 1rem; border-left: 3px solid var(--miod); }
.karta-zdrowia { background: var(--karta); border: 1px solid var(--linia); border-radius: var(--r);
  box-shadow: var(--cien); padding: 1.4rem 1.5rem; margin: 1.4rem 0; }
.kz-glowa { display: flex; align-items: baseline; gap: 0.7rem; flex-wrap: wrap; margin-bottom: 0.4rem; }
.kz-glowa h2 { margin: 0; }
.kz-podpis { font-size: 0.8rem; color: var(--szary); }
.kz-uklad { display: flex; gap: 1.6rem; align-items: center; margin: 0.6rem 0 0.4rem; }
.kz-radar { flex: 0 0 340px; max-width: 340px; }
.kz-radar-svg { width: 100%; height: auto; }
.kz-radar-label { font-family: "IBM Plex Sans", sans-serif; font-size: 10.5px; font-weight: 600; fill: var(--atrament); }
.kz-wiersze { flex: 1; min-width: 240px; display: flex; flex-direction: column; gap: 0.55rem; }
.kz-wiersz { border-bottom: 1px solid var(--linia); padding-bottom: 0.5rem; }
.kz-wiersz:last-child { border-bottom: none; padding-bottom: 0; }
.kz-wg { display: flex; align-items: center; gap: 0.5rem; }
.kz-wn { font-weight: 600; color: var(--atrament); font-size: 0.95rem; }
.kz-kropki { display: inline-flex; gap: 3px; margin-left: auto; }
.kz-kropka { width: 11px; height: 11px; border-radius: 50%; display: inline-block; }
.kz-wo { font-family: "IBM Plex Mono", monospace; font-size: 0.85rem; font-weight: 600; min-width: 2.4rem; text-align: right; }
.kz-bd .kz-wo { color: var(--szary); }
.kz-wz { font-size: 0.85rem; color: var(--szary); margin: 0.2rem 0 0; line-height: 1.5; }
.kz-podsum { font-size: 0.95rem; color: var(--atrament); margin: 0.8rem 0 0; padding-top: 0.7rem; border-top: 1px solid var(--linia); }
.kz-nota { font-size: 0.82rem; color: var(--szary); margin: 0.5rem 0 0; line-height: 1.5; font-style: italic; }
.kz-caveat { font-size: 0.8rem; color: var(--szary); margin: 0.7rem 0 0; line-height: 1.5; }
.kz-link { color: var(--miod); font-weight: 600; text-decoration: none; white-space: nowrap; }
@media (max-width: 640px) {
  .kz-uklad { flex-direction: column; gap: 0.8rem; }
  .kz-radar { flex-basis: auto; max-width: 320px; width: 100%; }
}
/* --- heatmapa korelacji sektora --- */
.korel-kontrole { display: flex; flex-wrap: wrap; gap: 1.2rem; margin: 0.6rem 0 0.4rem; }
.korel-grupa { display: flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; }
.korel-etyk { font-size: 0.8rem; color: var(--szary); font-weight: 600; margin-right: 0.1rem; }
.korel-freq, .korel-okno { font-family: "IBM Plex Sans", sans-serif; font-size: 0.82rem; font-weight: 600;
  padding: 0.3rem 0.7rem; border-radius: 999px; border: 1px solid var(--linia); background: var(--karta);
  color: var(--szary); cursor: pointer; transition: all .15s; }
.korel-freq:hover, .korel-okno:hover { border-color: var(--miod); color: var(--atrament); }
.korel-freq.akt, .korel-okno.akt { background: var(--atrament); color: #fff; border-color: var(--atrament); }
.korel-ostrz { font-size: 0.8rem; color: #9a6f14; margin: 0 0 0.5rem; }
.korel-otok { overflow-x: auto; margin: 0.7rem 0; padding-bottom: 0.3rem; }
.korel { border-collapse: separate; border-spacing: 3px; }
.korel th { font-family: "IBM Plex Sans", sans-serif; font-weight: 600; color: #fff; font-size: 0.7rem; }
.korel-kol { vertical-align: bottom; padding: 0.25rem 0.15rem; text-align: center; background: var(--atrament); border-radius: 3px; }
.korel-wier { text-align: right; padding: 0.15rem 0.5rem; white-space: nowrap; background: var(--atrament); border-radius: 3px; }
.korel-rog { background: var(--atrament); border-radius: 3px; }
.korel-okno:disabled { opacity: 0.38; cursor: not-allowed; }
.korel td { min-width: 42px; height: 30px; text-align: center; font-family: "IBM Plex Mono", monospace;
  font-size: 0.72rem; font-weight: 500; border-radius: 3px; }
.korel-opis { font-size: 0.9rem; color: var(--szary); line-height: 1.55; margin: 0.4rem 0 0.2rem; }
.korel-drobne { font-size: 0.82rem; color: var(--szary); margin-top: 0.5rem; line-height: 1.5; }
.korel-skala { display: flex; align-items: center; gap: 0.6rem; font-size: 0.72rem; color: var(--szary);
  max-width: 380px; margin: 0.5rem 0 0.2rem; }
.korel-grad { flex: 1; height: 10px; border-radius: 3px;
  background: linear-gradient(90deg, rgb(178,74,42), rgb(243,246,240), rgb(22,108,66)); }
/* --- grafiki w artykułach --- */
.indeks-pokrycie { background: var(--kremowy); border-left: 3px solid var(--miod);
  border-radius: var(--r-s); padding: 0.7rem 1rem; margin: 0.4rem 0 1.2rem;
  font-size: 0.88rem; color: var(--szary); }
.indeks-pokrycie strong { color: var(--atrament); }
.ilustracja { margin: 1.6rem 0; }
.ilustracja svg { width: 100%; height: auto; display: block; background: var(--karta);
  border: 1px solid var(--linia); border-radius: var(--r-s); padding: 0.6rem; }
.ilustracja figcaption { font-size: 0.82rem; color: var(--szary); margin-top: 0.5rem;
  line-height: 1.5; font-style: italic; }
.ilu-mocny { font-family: "Space Grotesk", sans-serif; font-size: 13px; font-weight: 700; fill: #123029; }
.ilu-drobny { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; fill: #55625A; font-style: italic; }
.ilu-akcent { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; fill: #9a6f14; font-weight: 600; }
.ilu-etap { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; fill: #55625A; }
.ilu-val { font-family: "IBM Plex Mono", monospace; font-size: 12px; font-weight: 600; fill: #123029; }
.ilu-os { font-family: "IBM Plex Sans", sans-serif; font-size: 10px; fill: #55625A; }
/* --- porównania X vs Y --- */
.cmp-hero { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch;
  gap: 0; margin: 1.2rem 0 1.8rem; }
.cmp-strona { display: flex; flex-direction: column; gap: 0.15rem; padding: 1.2rem 1.3rem;
  background: var(--karta); box-shadow: var(--cien); text-decoration: none; color: inherit; }
.cmp-strona.cmp-a { border-top: 4px solid #123029; border-radius: var(--r) 0 0 var(--r); }
.cmp-strona.cmp-b { border-top: 4px solid #B5831A; border-radius: 0 var(--r) var(--r) 0; text-align: right; align-items: flex-end; }
.cmp-strona:hover { box-shadow: var(--cien-h); }
.cmp-tick { font-family: "IBM Plex Mono", monospace; font-size: 0.8rem; color: var(--szary); font-weight: 600; }
.cmp-nazwa { font-family: "Space Grotesk", sans-serif; font-size: 1.2rem; font-weight: 600; color: var(--atrament); line-height: 1.15; }
.cmp-meta { font-size: 0.8rem; color: var(--szary); }
.cmp-kurs { font-family: "IBM Plex Mono", monospace; font-size: 1.5rem; color: var(--atrament); margin-top: 0.3rem; }
.cmp-kap { font-size: 0.78rem; color: var(--szary); }
.cmp-vs { display: flex; align-items: center; justify-content: center; background: var(--atrament);
  color: #fff; padding: 0 0.9rem; }
.cmp-vs span { font-family: "Space Grotesk", sans-serif; font-weight: 700; font-size: 1.1rem; letter-spacing: 0.05em; }
.cmp-svg { width: 100%; height: auto; }
.cmp-wykres { margin: 0.3rem 0; }
.cmp-legenda { display: flex; gap: 1.6rem; justify-content: center; font-size: 0.88rem; color: var(--szary); flex-wrap: wrap; }
.cmp-legenda span { display: inline-flex; align-items: center; gap: 0.4rem; }
.cmp-legenda i { width: 16px; height: 4px; border-radius: 2px; display: inline-block; }
.cmp-podtytul { font-size: 0.85rem; color: var(--szary); margin: -0.4rem 0 1rem; }
.cmp-metryki { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.6rem; }
.cmp-metryka { background: var(--karta); border-radius: var(--r-s); box-shadow: var(--cien); padding: 0.9rem 1.1rem; }
.cmp-metryka-glowa { font-weight: 600; color: var(--atrament); font-size: 0.92rem; margin-bottom: 0.6rem; }
.cmp-co { color: var(--szary); font-weight: 400; font-size: 0.82rem; text-decoration: none; }
.cmp-co:hover { color: var(--miod); }
.cmp-bar-row { display: flex; align-items: center; gap: 0.6rem; margin: 0.35rem 0; }
.cmp-bar-tor { flex: 1; height: 12px; background: var(--kremowy); border-radius: 6px; overflow: hidden; min-width: 60px; }
.cmp-bar-fill { height: 100%; border-radius: 6px; }
.cmp-bar-fill.fa { background: #123029; }
.cmp-bar-fill.fb { background: #B5831A; }
.cmp-bar-val { font-family: "IBM Plex Mono", monospace; font-size: 0.85rem; color: var(--atrament);
  white-space: nowrap; min-width: 4.5rem; }
.cmp-fav { display: inline-block; margin-left: 0.3rem; font-family: "IBM Plex Sans", sans-serif;
  font-size: 0.68rem; font-weight: 700; color: #1E7A4B; }
.cmp-52-row { margin: 0.7rem 0; }
.cmp-52-nazwa { font-size: 0.85rem; font-weight: 600; display: block; margin-bottom: 0.25rem; }
.cmp-txt-a { color: #123029; } .cmp-txt-b { color: #9a6f14; }
.cmp-powiazane, .cmp-hub-lista a { }
.cmp-powiazane { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.cmp-powiazane a { background: var(--kremowy); border-radius: 999px; padding: 0.4rem 0.9rem;
  font-size: 0.82rem; color: var(--atrament); text-decoration: none; font-weight: 500; }
.cmp-powiazane a:hover { background: var(--miod-jasny); }
.cmp-hub-sekcja { margin-bottom: 1.4rem; }
.cmp-picker { background: var(--karta); border: 1px solid var(--linia); border-radius: var(--r);
  box-shadow: var(--cien); padding: 1.2rem 1.3rem; margin: 1.2rem 0 1.8rem; }
.cmp-picker-pola { display: flex; flex-wrap: wrap; align-items: center; gap: 0.7rem; }
.cmp-picker-pola select { flex: 1; min-width: 170px; padding: 0.6rem 0.7rem; border: 1px solid var(--linia);
  border-radius: var(--r-s); font-family: inherit; font-size: 0.95rem; background: #fff; color: var(--atrament); }
.cmp-picker-vs { font-family: "Space Grotesk", sans-serif; font-weight: 700; color: var(--miod); }
.cmp-go-btn { padding: 0.6rem 1.3rem; background: var(--atrament); color: #fff; border: none;
  border-radius: var(--r-s); font-family: "Space Grotesk", sans-serif; font-weight: 600; font-size: 0.95rem;
  cursor: pointer; transition: opacity .15s, background .15s; }
.cmp-go-btn:disabled { opacity: 0.45; cursor: not-allowed; }
.cmp-go-btn:not(:disabled):hover { background: var(--atrament-2); }
.cmp-picker-hint { font-size: 0.82rem; color: var(--szary); margin: 0.7rem 0 0; }
.cmp-hub-naglowek { margin-top: 2rem; }
@media (max-width: 560px){ .cmp-picker-pola select, .cmp-go-btn { width: 100%; flex: none; } .cmp-picker-vs{ display:none; } }
.cmp-hub-lista { list-style: none; padding: 0; margin: 0; display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0.4rem; }
.cmp-hub-lista a { display: block; padding: 0.55rem 0.8rem; background: var(--karta);
  border: 1px solid var(--linia); border-radius: var(--r-s); text-decoration: none;
  color: var(--atrament); font-size: 0.9rem; }
.cmp-hub-lista a:hover { border-color: var(--miod); }
.cmp-vs-inline { color: var(--miod); font-weight: 700; font-size: 0.8rem; }
@media (max-width: 620px) {
  .cmp-hero { grid-template-columns: 1fr; }
  .cmp-strona.cmp-a { border-radius: var(--r) var(--r) 0 0; }
  .cmp-strona.cmp-b { border-radius: 0 0 var(--r) var(--r); text-align: left; align-items: flex-start; }
  .cmp-vs { padding: 0.4rem; }
  .cmp-metryki { grid-template-columns: 1fr; }
}
/* --- porównania koniec --- */
/* --- 52-tygodniowe: pasek pozycji w zakresie --- */
.s52-jak, .dyw-jak { background: var(--kremowy); border-left: 3px solid var(--miod);
  border-radius: var(--r-s); padding: 0.9rem 1.1rem; margin: 1rem 0 1.2rem; font-size: 0.88rem;
  color: var(--szary); line-height: 1.55; }
.s52-jak strong, .dyw-jak strong { color: var(--atrament); }
.tabela-52 td { vertical-align: middle; }
.zakres-cell { min-width: 200px; width: 42%; }
.zakres-row { display: flex; align-items: center; gap: 0.5rem; }
.zakres-kraniec { font-size: 0.75rem; color: var(--szary); white-space: nowrap; }
.zakres-tor { flex: 1; height: 8px; border-radius: 4px; position: relative;
  background: linear-gradient(90deg, #B23B3B 0%, #D8A93A 50%, #1E7A4B 100%); min-width: 90px; }
.zakres-marker { position: absolute; top: -3px; width: 3px; height: 14px; background: var(--atrament);
  border-radius: 2px; transform: translateX(-50%); box-shadow: 0 0 0 1.5px #fff; }
.dist-lbl { display: block; font-size: 0.7rem; color: var(--szary); font-family: "IBM Plex Sans", sans-serif; }
.badge-52 { font-size: 0.68rem; font-weight: 700; padding: 0.1rem 0.4rem; border-radius: 999px;
  vertical-align: middle; text-transform: uppercase; letter-spacing: 0.03em; }
.badge-hi { background: #1E7A4B; color: #fff; }
.badge-lo { background: #B23B3B; color: #fff; }
.mono { font-family: "IBM Plex Mono", monospace; }
.dyw-pusto { color: var(--szary); padding: 1.2rem 0; }
.dyw-linki { display: flex; gap: 1.2rem; flex-wrap: wrap; margin: 1.4rem 0; }
.dyw-linki a { color: var(--atrament-2); font-weight: 600; text-decoration: none; font-size: 0.9rem; }
.dyw-linki a:hover { color: var(--miod); text-decoration: underline; }
/* --- 52-tygodniowe koniec --- */
/* --- ruch tygodnia: mapa cieplna --- */
.ruch-przelacznik { display: flex; gap: 0.4rem; margin: 0.6rem 0 1rem; }
.mapa-svg { width: 100%; height: auto; display: block; border-radius: var(--r-s); overflow: hidden; }
.kafel-tick { font-family: "IBM Plex Sans", sans-serif; font-size: 9.5px; font-weight: 700; fill: #fff; }
.kafel-proc { font-family: "IBM Plex Mono", monospace; font-size: 8px; font-weight: 500; fill: #fff; }
.sekt-label { font-family: "IBM Plex Sans", sans-serif; font-weight: 700; fill: #123029;
  letter-spacing: 0.03em; }
.ruch-legenda { font-size: 0.8rem; color: var(--szary); margin: 0.7rem 0 0.4rem;
  display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.ruch-skala { margin: 0.9rem 0 0.3rem; max-width: 380px; }
.ruch-skala-grad { height: 12px; border-radius: 3px; background: linear-gradient(90deg,
  rgb(146,24,24), rgb(226,62,54), rgb(138,142,145), rgb(46,190,90), rgb(16,110,52)); }
.ruch-skala-etyk { display: flex; justify-content: space-between; font-family: "IBM Plex Mono", monospace;
  font-size: 0.72rem; color: var(--szary); margin-top: 0.25rem; }
.ruch-skala-podpis { font-size: 0.78rem; color: var(--szary); margin-top: 0.4rem; }
.ruch-legenda .ll { width: 16px; height: 12px; border-radius: 2px; display: inline-block; margin-right: 0.1rem; }
.ruch-legenda .ll.minus { background: rgb(176,59,59); }
.ruch-legenda .ll.neutral { background: rgb(120,132,125); }
.ruch-legenda .ll.plus { background: rgb(30,122,75); }
.ruch-listy { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; margin-top: 1.4rem; }
.ruch-lista { width: 100%; }
.ruch-lista td { padding: 0.4rem 0.6rem; }
.ruch-lista td.plus { text-align: right; color: #1E7A4B; font-family: "IBM Plex Mono", monospace; font-weight: 600; }
.ruch-lista td.minus { text-align: right; color: #B23B3B; font-family: "IBM Plex Mono", monospace; font-weight: 600; }
@media (max-width: 640px) { .ruch-listy { grid-template-columns: 1fr; } }
/* baner ruchu na stronie głównej */
.ruch-baner { display: block; background: var(--karta); border: 1px solid var(--linia);
  border-radius: var(--r); box-shadow: var(--cien); padding: 1.2rem 1.4rem; margin-top: 1rem;
  text-decoration: none; color: inherit; transition: box-shadow .15s, border-color .15s; }
.ruch-baner:hover { box-shadow: var(--cien-h); border-color: var(--miod); }
.ruch-baner strong { color: var(--atrament); display: block; font-family: "Space Grotesk", sans-serif;
  font-size: 1.15rem; margin-bottom: 0.2rem; }
.ruch-baner span { color: var(--szary); font-size: 0.9rem; }
/* --- ruch tygodnia koniec --- */
.sym-tryb { display: flex; gap: 0.4rem; flex-wrap: wrap; margin: 0.4rem 0 0.3rem; }
.s-tryb { font-family: "IBM Plex Sans", sans-serif; font-size: 0.9rem; font-weight: 600;
  padding: 0.5rem 1.1rem; border-radius: 999px; border: 1px solid var(--linia);
  background: var(--karta); color: var(--szary); cursor: pointer; transition: all .15s; }
.s-tryb:hover { border-color: var(--miod); color: var(--atrament); }
.s-tryb.akt { background: var(--atrament); color: #fff; border-color: var(--atrament); }
.sym-tryb-opis { font-size: 0.85rem; color: var(--szary); margin: 0 0 0.8rem; line-height: 1.5; }
.sym-faza { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; fill: var(--szary); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.sym-pod { font-weight: 400; color: var(--szary); font-size: 0.75rem; }
.sym-drobne { font-size: 0.82rem; color: var(--szary); margin: 0.5rem 0; line-height: 1.5; }
.pigulki-slownik { margin-bottom: 1.4rem; }
.pigulki-grupa { margin-bottom: 0.6rem; display: flex; align-items: baseline; gap: 0.5rem; flex-wrap: wrap; }
.pigulki-etykieta { font-size: 0.78rem; color: var(--szary); font-weight: 600; }
.sym-adv .sym-pole-szer { max-width: 420px; margin-bottom: 1.1rem; }
.sym-adv .sym-pole-szer select { width: 100%; padding: 0.5rem 0.6rem; border: 1px solid var(--linia);
  border-radius: var(--r-s); font-family: inherit; font-size: 0.9rem; background: #fff; color: var(--atrament); }
.sym-baner { background: linear-gradient(135deg, var(--atrament), var(--atrament-2));
  border-radius: var(--r); padding: 1.6rem 1.8rem; margin-top: 2.2rem; color: #fff; }
.sym-baner .hero-eyebrow { color: var(--miod-jasny); }
.sym-baner h2 { color: #fff; margin: 0.3rem 0 0.4rem; }
.sym-baner p { color: rgba(255,255,255,0.82); max-width: 44rem; margin: 0 0 1rem; }
.sym-baner-btn { display: inline-block; background: var(--miod-jasny); color: var(--atrament);
  font-weight: 700; padding: 0.6rem 1.2rem; border-radius: var(--r-s); text-decoration: none; }
.sym-baner-btn:hover { background: #fff; }
.sym-panel { display: flex; flex-wrap: wrap; gap: 1.2rem; background: var(--karta);
  border-radius: var(--r); box-shadow: var(--cien); padding: 1.2rem 1.4rem; margin: 1.2rem 0; }
.sym-pole { flex: 1 1 220px; }
.sym-pole > label { display: block; font-size: 0.82rem; color: var(--szary); font-weight: 600; margin-bottom: 0.4rem; }
.sym-pole select { width: 100%; padding: 0.5rem 0.6rem; border: 1px solid var(--linia);
  border-radius: var(--r-s); font-family: inherit; font-size: 0.9rem; background: #fff; color: var(--atrament); }
.sym-n { display: flex; gap: 0.4rem; }
.s-n { flex: 1; padding: 0.5rem; border: 1px solid var(--linia); background: #fff; border-radius: var(--r-s);
  font-family: "IBM Plex Mono", monospace; font-weight: 500; cursor: pointer; color: var(--szary); }
.s-n.akt { background: var(--atrament); color: #fff; border-color: var(--atrament); }
.sym-info { color: var(--szary); font-size: 0.92rem; }
.sym-info p { margin: 0.6rem 0; }
.sym-wykres { margin: 0.4rem 0 0.6rem; }
.sym-wykres svg { width: 100%; height: auto; }
.sym-axl { font-family: "IBM Plex Mono", monospace; font-size: 11px; fill: var(--szary); }
.sym-legenda { display: flex; gap: 1.4rem; justify-content: center; font-size: 0.85rem; color: var(--szary); margin-top: 0.3rem; }
.sym-legenda span { display: inline-flex; align-items: center; gap: 0.4rem; }
.sym-legenda i { width: 16px; height: 4px; border-radius: 2px; display: inline-block; }
.sym-karty { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0.8rem; margin: 1.2rem 0; }
.sym-k { background: var(--karta); border-radius: var(--r-s); box-shadow: var(--cien); padding: 0.9rem 1.1rem; }
.sym-k span { display: block; font-size: 0.8rem; color: var(--szary); margin-bottom: 0.2rem; }
.sym-k strong { font-family: "IBM Plex Mono", monospace; font-size: 1.5rem; }
.sym-k .plus, .sym-wynik td.plus { color: #1E7A4B; }
.sym-k .minus, .sym-wynik td.minus { color: #B23B3B; }
.sym-uwaga { background: var(--kremowy); border-left: 3px solid var(--miod); border-radius: var(--r-s);
  padding: 1rem 1.2rem; margin: 1.6rem 0; font-size: 0.85rem; color: var(--szary); line-height: 1.6; }
.sym-uwaga strong { color: var(--atrament); }
/* --- filtry zaawansowane symulatora --- */
.sym-adv-btn { background: none; border: 1px solid var(--linia); border-radius: var(--r-s);
  padding: 0.45rem 0.95rem; font-family: inherit; font-size: 0.85rem; font-weight: 600;
  color: var(--atrament); cursor: pointer; margin: 0.2rem 0 0.4rem; }
.sym-adv-btn:hover { border-color: var(--miod); }
.sym-adv { background: var(--kremowy); border-radius: var(--r); padding: 1.1rem 1.3rem; margin: 0.2rem 0 0.6rem; }
.sym-adv-info { font-size: 0.82rem; color: var(--szary); margin: 0 0 1rem; line-height: 1.55; }
.sym-adv-info strong { color: var(--atrament); }
.sym-suwaki { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem 1.4rem; margin-bottom: 1rem; }
.sym-suwak > label { display: block; font-size: 0.8rem; color: var(--szary); font-weight: 600; margin-bottom: 0.6rem; }
.suwak2 { position: relative; height: 20px; }
.suwak2::before { content: ""; position: absolute; left: 0; right: 0; top: 8px; height: 3px;
  background: var(--linia); border-radius: 2px; }
.suwak2 input[type=range] { position: absolute; width: 100%; margin: 0; background: transparent;
  -webkit-appearance: none; appearance: none; pointer-events: none; height: 20px; }
.suwak2 input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: auto;
  width: 16px; height: 16px; border-radius: 50%; background: var(--atrament); border: 2px solid #fff;
  box-shadow: var(--cien); cursor: pointer; margin-top: 0; }
.suwak2 input[type=range]::-moz-range-thumb { pointer-events: auto; width: 16px; height: 16px;
  border-radius: 50%; background: var(--atrament); border: 2px solid #fff; cursor: pointer; }
.suwak2 input[type=range]::-webkit-slider-runnable-track { background: transparent; }
.suwak-val { display: flex; justify-content: space-between; font-family: "IBM Plex Mono", monospace;
  font-size: 0.78rem; color: var(--atrament); margin-top: 0.4rem; }
.sym-licznik { font-size: 0.95rem; margin: 0.7rem 0; color: var(--atrament); }
.sym-licznik .ostrz { color: #B23B3B; font-size: 0.85rem; font-weight: 600; }
.sym-akcja { display: flex; align-items: center; gap: 0.9rem; flex-wrap: wrap; margin: 0.2rem 0 0.8rem; }
.sym-run-btn { background: var(--miod); color: #fff; border: none; border-radius: var(--r-s);
  padding: 0.55rem 1.2rem; font-family: inherit; font-size: 0.9rem; font-weight: 700; cursor: pointer; }
.sym-run-btn:hover { background: var(--atrament); }
.sym-hint { font-size: 0.8rem; color: var(--szary); }
.btn-reset { background: none; border: 1px solid var(--linia); border-radius: var(--r-s);
  padding: 0.4rem 0.9rem; font-family: inherit; font-size: 0.82rem; color: var(--szary); cursor: pointer; }
.btn-reset:hover { border-color: var(--miod); color: var(--atrament); }
/* --- zakładki filtra indeksu --- */
.zakladki-indeks { display: flex; gap: 0.4rem; flex-wrap: wrap; margin: 0 0 0.9rem; }
.zakladka { font-family: "IBM Plex Sans", sans-serif; font-size: 0.85rem; font-weight: 600;
  padding: 0.4rem 0.95rem; border-radius: 999px; border: 1px solid var(--linia);
  background: var(--karta); color: var(--szary); cursor: pointer;
  transition: border-color .15s, color .15s, background .15s; }
.zakladka:hover { border-color: var(--miod); color: var(--atrament); }
.zakladka.akt { background: var(--atrament); color: #fff; border-color: var(--atrament); }
.zakladka:focus-visible { outline: 3px solid var(--miod); outline-offset: 2px; }
.zakladki-link { align-self: center; margin-left: auto; font-size: 0.82rem; font-weight: 600;
  color: var(--atrament-2); text-decoration: none; }
.zakladki-link:hover { color: var(--miod); text-decoration: underline; }
.panel-filtry:not([hidden]) { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1.4rem;
  background: var(--karta); border-radius: var(--r); box-shadow: var(--cien);
  padding: 1.1rem 1.3rem; margin: 0.8rem 0; }
.filtr { flex: 1 1 190px; min-width: 170px; }
.filtr > label { display: block; font-size: 0.82rem; color: var(--szary); font-weight: 600; margin-bottom: 0.7rem; }
.suwak { position: relative; height: 22px; }
.suwak-tor { position: absolute; top: 9px; left: 0; right: 0; height: 4px;
  background: var(--linia); border-radius: 2px; }
.suwak-akt { position: absolute; top: 0; bottom: 0; background: var(--miod); border-radius: 2px; }
.suwak input[type=range] { position: absolute; top: 0; left: 0; width: 100%; margin: 0;
  background: none; pointer-events: none; -webkit-appearance: none; appearance: none; height: 22px; }
.suwak input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none;
  pointer-events: auto; width: 16px; height: 16px; border-radius: 50%; background: var(--atrament);
  border: 2px solid #fff; box-shadow: 0 1px 3px rgba(18,48,41,.35); cursor: pointer; }
.suwak input[type=range]::-moz-range-thumb { pointer-events: auto; width: 16px; height: 16px;
  border-radius: 50%; background: var(--atrament); border: 2px solid #fff; cursor: pointer; }
.suwak-wart { display: flex; justify-content: space-between; font-family: "IBM Plex Mono", monospace;
  font-size: 0.78rem; color: var(--atrament); margin-top: 0.5rem; }
.btn-reset { align-self: flex-end; font-family: "IBM Plex Sans"; font-size: 0.82rem;
  padding: 0.45rem 0.8rem; border: 1px solid var(--linia); background: var(--karta);
  border-radius: var(--r-s); cursor: pointer; color: var(--szary); }
.btn-reset:hover { border-color: var(--atrament); color: var(--atrament); }
.panel-filtry .licznik { align-self: flex-end; margin-left: auto; }
/* --- sektory --- */
.tagi-sektory { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.tag-sektor { display: inline-block; padding: 0.4rem 0.9rem; border-radius: 999px;
  background: var(--karta); border: 1px solid var(--linia); text-decoration: none;
  font-size: 0.9rem; box-shadow: var(--cien); transition: border-color .15s, transform .15s; }
.tag-sektor:hover { border-color: var(--miod); transform: translateY(-2px); }
a.sektor { text-decoration: none; }
a.sektor:hover { text-decoration: underline; }
.tabela-sektor { margin-top: 1.2rem; }
.wiersz-mediana td { background: var(--kremowy) !important; border-top: 2px solid var(--miod); }
/* --- mobile --- */
@media (max-width: 700px) {
  .hero-tresc { padding: 1.8rem 1.3rem; }
  table { font-size: 0.82rem; }
  th, td { padding: 0.5rem 0.5rem; }
  th { top: 53px; }
  .um { display: none; }
  .kurs-duzy { font-size: 1.6rem; }
  .karta-liczba { font-size: 1.7rem; }
  .kalk-wiersz { grid-template-columns: 1fr 1fr; }
  #szukaj { min-width: 0; width: 100%; }
  .szukajka { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .karta, .lista-karta, .pigulka { transition: none; }
  .karta:hover, .lista-karta:hover { transform: none; }
}
