/* Z203 (21.10, decyzja usera „Spis: B”): „Spis wszystkich jednostek” (/spis) — makieta spis-b-ksiega--claude.html „Kolumny okręgów jak dawniej”:
   okręg w lewej kolumnie (przesuwa się w dół razem z oddziałami), jego oddziały w tabeli po prawej, wiersze na zmianę jaśniejsze,
   z lewego boku spis 40 okręgów, który podświetla okręg czytany. Telefon: „Skocz do okręgu” i granatowy pasek z nazwą okręgu. Druk A4. */
.spis .widoki { justify-content: flex-start; margin: 26px 0 0; }
.spis .widoki > .kap { margin-right: 0; }
.tyt { display: flex; flex-wrap: wrap; align-items: end; gap: 10px 20px; margin-top: 24px; padding-bottom: 14px; border-bottom: 1.5px solid var(--ink); }
.tyt h1 { font: 400 46px/1 var(--f-d); letter-spacing: -.02em; margin: 0 auto 0 0; font-variation-settings: "opsz" 120; }
.tyt .liczby { flex-basis: 100%; order: 3; margin: 0; font: 500 15px/1.4 var(--f-t); color: var(--ink-2); }
.tyt .liczby b { color: var(--ink); }
.tyt #spis-moj .tab { font-variant-numeric: tabular-nums; }
.spis-pod { margin: 12px 0 0; font: 400 14.5px/1.45 var(--f-t); color: var(--muted); }
.spis-pod kbd { font: 600 12.5px var(--f-t); border: .5px solid var(--ink-3); border-bottom-width: 1.5px; padding: 1px 5px; background: var(--karta); color: var(--ink); }
.spis-pod .tel { display: none; }

.ks { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 0 44px; }
.spis-tr { position: sticky; top: 0; align-self: start; max-height: 100vh; overflow: auto; padding: 18px 8px 30px 0; border-right: .5px solid var(--line); scrollbar-width: thin; }
.spis-tr .kap { display: block; margin: 0 0 6px; }
.spis-tr h2 { font: italic 500 17px/1.2 var(--f-d); color: var(--sepia); margin: 14px 0 2px; }
.spis-tr h2 a { text-decoration: none; color: inherit; }
.spis-tr ul { list-style: none; margin: 0; padding: 0; }
.spis-tr li a { display: flex; justify-content: space-between; gap: 8px; padding: 3px 8px 3px 10px; font: 500 14.5px/1.3 var(--f-t); text-decoration: none; color: var(--ink-2); border-left: 2px solid transparent; }
.spis-tr li a span { color: var(--muted); font-variant-numeric: tabular-nums; font-size: 13px; }
.spis-tr li a.akt { border-left-color: var(--red); color: var(--ink); background: var(--karta); font-weight: 700; }
.spis-tr .moj-l { display: block; margin-top: 18px; font: 600 14.5px/1.3 var(--f-t); color: var(--red); }

.k-reg { display: flex; align-items: baseline; gap: 14px; margin: 40px 0 0; padding: 0 0 8px; border-bottom: 1.5px solid var(--ink); scroll-margin-top: 10px; }
.k-reg .rz { font: italic 300 44px/1 var(--f-d); color: var(--sepia); }
.k-reg h2 { font: 500 28px/1.1 var(--f-d); margin: 0; }
.k-reg .kap { margin-left: auto; }
.k-okr { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 0 28px; padding: 18px 0 22px; border-bottom: .5px solid var(--ink); scroll-margin-top: 10px; }
.k-okr-n { position: sticky; top: 14px; align-self: start; }
.k-okr-n .kap { display: block; }
.k-okr-n h3 { font: 500 26px/1.1 var(--f-d); margin: 2px 0 8px; }
.k-okr-n p { margin: 0; font: 400 14px/1.45 var(--f-t); color: var(--ink-2); }
.k-okr-n p a { overflow-wrap: anywhere; }
.k-okr-n .st-sl { color: var(--muted); }
.k-okr-n .btn { min-height: 40px; padding: 0 12px; font-size: 14px; margin-top: 10px; }
.k-okr-n .n-tel { display: none; }
table.k-tab { width: 100%; border-collapse: collapse; }
.k-tab th { text-align: left; font: 600 11.5px/1.2 var(--f-t); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); padding: 4px 10px 8px; border-bottom: .5px solid var(--ink); }
.k-tab td { padding: 8px 10px; vertical-align: top; border-bottom: .5px solid var(--line-2); font: 400 15.5px/1.35 var(--f-t); }
.k-tab tbody tr:nth-child(even) td { background: rgba(221, 210, 188, .28); }
.k-tab tr { scroll-margin-top: 80px; }
.k-tab .nr { width: 4.4em; font-variant-numeric: tabular-nums; font-weight: 600; }
.k-tab .nr a { text-decoration: underline dotted; text-underline-offset: .22em; }
.k-tab .nz a { font-weight: 600; text-decoration: none; }
.k-tab .nz a:hover { text-decoration: underline; }
/* nazwy sekcji schowane pod „4 sekcje ▸” — <details> (Ctrl+F w Chrome i Firefoksie znajduje treść i sam rozwija) */
.sek-d { display: inline; margin-left: 8px; }
.sek-d > summary { display: inline; list-style: none; font: 500 12.5px var(--f-t); color: var(--muted); border-bottom: .5px dotted var(--muted); cursor: pointer; }
.sek-d > summary::-webkit-details-marker { display: none; }
.sek-d > summary::after { content: " ▸"; }
.sek-d[open] > summary::after { content: " ▾"; }
.sek-d > summary:hover { color: var(--red); }
.k-tab .sek { display: block; font-size: 13px; line-height: 1.4; color: var(--muted); margin-top: 2px; }
.k-tab .ad { width: 34%; overflow-wrap: anywhere; }
.k-tab .ad a { color: var(--ink-2); }
.k-tab .st { font: 600 13px/1.2 var(--f-t); }
.k-tab .st-mar { color: var(--red); }
.k-tab .st-brak, .k-tab .st-arch, .k-tab .st-spr { color: var(--muted); }
.k-tab .wz { width: 6.5em; text-align: right; }
.k-tab .wz a { font: 600 13.5px var(--f-t); }
.k-tab tr.moj td { background: #f6dcc9 !important; }
.k-tab tr.moj .nz > a::after { content: "Twój oddział"; margin-left: 8px; font: 700 10px var(--f-t); letter-spacing: .12em; text-transform: uppercase; color: var(--red); }
.k-tab tr.arch td { color: var(--muted); }
.k-tab tr.arch .nz a { color: var(--ink-2); }
.k-tab tr:target td { background: #f6dcc9; }
.skok-tel { display: none; }

@media (max-width: 1100px) {
  .k-okr { grid-template-columns: 1fr; }
  .k-okr-n { position: static; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; margin-bottom: 8px; }
  .k-okr-n h3 { margin: 0; }
  .k-okr-n .kap { width: 100%; }
  .k-okr-n .btn { margin-top: 0; }
}
@media (max-width: 860px) {
  .spis .widoki { margin-top: 18px; }
  .spis .widoki > .kap { display: block; width: 100%; }
  .tyt { margin-top: 18px; }
  .tyt h1 { font-size: 32px; font-variation-settings: "opsz" 36; }
  .tyt .btn { display: none !important; }
  .spis-pod .tel { display: inline; }
  .ks { display: block; }
  .spis-tr { display: none; }
  .skok-tel { display: block; position: sticky; top: 0; z-index: 12; background: var(--paper); padding: 8px 0; margin-top: 10px; border-bottom: .5px solid var(--ink); }
  .skok-tel select { width: 100%; min-height: 46px; font: 600 16px var(--f-t); border: 1px solid var(--ink); background: var(--karta); color: var(--ink); padding: 0 10px; }
  .k-reg { scroll-margin-top: 66px; margin-top: 32px; }
  .k-reg .rz { font-size: 34px; }
  .k-reg h2 { font-size: 22px; }
  .k-reg .kap { display: none; }
  .k-okr { padding: 0 0 14px; scroll-margin-top: 62px; border-bottom: 0; }
  .k-okr-n { position: sticky; top: 62px; z-index: 5; background: var(--ink); color: var(--paper); margin: 14px calc(-1 * var(--gut)) 4px; padding: 8px var(--gut); display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 10px; }
  .k-okr-n .kap { color: #cfc6b4; width: auto; }
  .k-okr-n h3 { font-size: 21px; color: var(--paper); }
  .k-okr-n p, .k-okr-n .btn { display: none; }
  .k-okr-n .n-tel { display: inline; margin-left: auto; font: 500 13px var(--f-t); color: #cfc6b4; }
  .k-tab thead { display: none; }
  .k-tab, .k-tab tbody, .k-tab tr, .k-tab td { display: block; width: auto !important; }
  .k-tab tr { display: grid; grid-template-columns: 3.4em minmax(0, 1fr) auto; gap: 0 10px; padding: 9px 0; border-bottom: .5px solid var(--line-2); scroll-margin-top: 110px; }
  .k-tab tbody tr:nth-child(even) td { background: none; }
  .k-tab td { padding: 0; border: 0; text-align: left !important; }
  .k-tab .nr { grid-row: 1 / span 3; font-size: 16px; }
  .k-tab .nz { grid-column: 2 / span 2; }
  .k-tab .nz > a { font-size: 17px; }
  .k-tab .ad { grid-column: 2; font-size: 14px; margin-top: 2px; }
  .k-tab .wz { grid-column: 3; grid-row: 2; font-size: 14px; margin-top: 2px; }
  .k-tab .wz:empty { display: none; }
  .k-tab tr.moj, .k-tab tr:target { background: #f6dcc9; margin: 0 -8px; padding-left: 8px; padding-right: 8px; }
  .k-tab tr.moj td, .k-tab tr:target td { background: none !important; }
  .sek-d > summary { font-size: 13.5px; }
}
@media print {
  @page { size: A4; margin: 10mm; }
  #naglowek, #stopka, .widoki, .spis-tr, .skok-tel, .spis-pod, .k-okr-n .btn, .k-tab .wz, .tyt .btn, body::after, body::before { display: none !important; }
  body { background: #fff; }
  .wrap { max-width: none; padding: 0; }
  .ks { display: block; }
  .tyt { margin-top: 0; }
  .tyt h1 { font-size: 15pt; }
  .k-okr { grid-template-columns: 34mm 1fr; padding: 4px 0; break-inside: avoid; }
  .k-okr-n { position: static; }
  .k-okr-n h3 { font-size: 11pt; }
  .k-okr-n p { font-size: 7pt; }
  .k-tab td { padding: 1px 4px; font-size: 7.5pt; }
  .k-tab .sek { font-size: 6.5pt; }
  .k-tab th { font-size: 6pt; padding: 1px 4px; }
  .sek-d > summary { font-size: 6.5pt; border: 0; }
  .sek-d > summary::after { content: ""; }
  .k-reg { margin-top: 8px; break-after: avoid; }
  .k-reg .rz { font-size: 16pt; }
  .k-reg h2 { font-size: 12pt; }
  .k-tab tr.moj td { background: none !important; }
  .k-tab tr.moj .nz > a::after { content: ""; }
}
