:root { --cold: #3d6f86; --hot: #b5553a; --woda: #c6d6dc; --lad: #e9e1d0; --lad-k: #8b8172; }
@media (prefers-color-scheme: dark) { :root { --cold: #8cb7cb; --hot: #e08a68; --woda: #2c3a40; --lad: #4a453d; --lad-k: #8f8679; } }

.tab.geo td:last-child { text-align: left; }
.tab.geo td:first-child { width: 40%; overflow-wrap: normal; hyphens: manual; }
.dim { color: var(--ink-2); }

/* mapa świata */
.mapa { display: block; width: 100%; height: auto; margin: 8px 0 14px; border-radius: 10px; box-shadow: var(--carve); }
.m-woda { fill: var(--woda); }
.m-lad { fill: var(--lad); stroke: var(--lad-k); stroke-width: .8; stroke-linejoin: round; }
.m-lad.wyr, .m-lad.pokaz { fill: var(--hot); fill-opacity: .75; }
.m-lad.dobrze { fill: var(--ok); fill-opacity: .6; }
.m-siatka { stroke: var(--ink); stroke-opacity: .12; stroke-width: .8; }
.m-gr .m-l { stroke: var(--ink); stroke-opacity: .28; stroke-width: 1.2; }
.m-l { fill: none; stroke: var(--cold); stroke-width: 2.4; }
.m-hot .m-l, .m-l.m-pokaz { stroke: var(--hot); stroke-width: 3; }
.m-hit { fill: none; stroke: transparent; stroke-width: 18; }
.m-lit { font: 700 17px 'Atkinson', system-ui, sans-serif; fill: var(--ink); paint-order: stroke; stroke: var(--woda); stroke-width: 4px; }
.m-hot .m-lit { fill: var(--hot); }
.m-pkt { fill: none; stroke: var(--hot); stroke-width: 3.5; }
.m-pkt-s { fill: var(--hot); }
.m-podp { font: 700 17px 'Atkinson', system-ui, sans-serif; fill: var(--ink); text-anchor: middle; paint-order: stroke; stroke: var(--lad); stroke-width: 3px; }
.m-podp-o { font-weight: 400; font-style: italic; fill: var(--cold); stroke: var(--woda); font-size: 15px; }
.m-polk { fill: var(--ok); fill-opacity: .16; pointer-events: none; }
.lab-mapa { cursor: pointer; touch-action: manipulation; }
.lab-mapa .m-linia, .lab-mapa .m-pkt, .lab-mapa .m-pkt-s, .lab-mapa .m-pokaz, .lab-mapa .sw-stuk { pointer-events: none; }
.sw-pol { font-size: 18px; margin: 12px 0 2px; min-height: 1.5em; }
.sw-ramka { margin: 0 -6px; }
.sw-stuk { stroke-width: 3; fill: none; }
.sw-stuk.ok { stroke: var(--ok); }
.sw-stuk.zle { stroke: var(--bad); }
.sw-fb { border-radius: 12px; padding: 4px 12px 12px; margin-top: 8px; }
.sw-fb.ok { background: var(--ok-bg); }
.sw-fb.zle { background: var(--bad-bg); }
.lab-chip.sw-ok { border-color: var(--ok); background: var(--ok-bg); }
.lab-chip.sw-zle { border-color: var(--bad); background: var(--bad-bg); }
.sw-nazwy { margin-top: 4px; }

/* rysunek: elementy mapy */
.fig.fig-mapa { max-width: 380px; }
.e-tytul { font: 700 17px 'Fraunces', Georgia, serif; fill: var(--ink); text-anchor: middle; }
.e-tlo { fill: rgba(130, 160, 100, .16); stroke: var(--ink); stroke-width: 1.6; }
.e-las { fill: rgba(85, 117, 70, .35); }
.e-woda { fill: var(--woda); stroke: var(--cold); stroke-width: 1.2; }
.e-rzeka { fill: none; stroke: var(--cold); stroke-width: 3; }
.e-droga { fill: none; stroke: var(--hot); stroke-width: 2.4; }
.e-miasto { fill: var(--ink); }
.e-siatka { fill: none; stroke: var(--ink); stroke-opacity: .35; stroke-width: 1; stroke-dasharray: 4 3; }
.e-st { font: 400 10px 'Atkinson', system-ui, sans-serif; fill: var(--ink-2); text-anchor: middle; }
.e-st-l { text-anchor: start; }
.e-leg { fill: var(--slab); stroke: var(--ink); stroke-width: 1; }
.e-mt { font: 400 10.5px 'Atkinson', system-ui, sans-serif; fill: var(--ink); }
.e-n { font-weight: 700; text-anchor: middle; }
.e-pod1 { stroke: var(--ink); stroke-width: 5; }
.e-pod2 { stroke: var(--slab); stroke-width: 5; }
.e-roza { fill: var(--ink); }
.e-lit { fill: var(--hot); }
.e-litt { font: 700 13px 'Atkinson', system-ui, sans-serif; fill: #fff; text-anchor: middle; }

/* podziałka liniowa */
.fig.fig-pod { max-width: 260px; margin: 8px 0 12px; }
.lab-chip .fig.fig-pod, .sk-lin .fig.fig-pod { margin: 4px 0; }
.p-c { fill: var(--ink); stroke: var(--ink); stroke-width: 1; }
.p-j { fill: var(--slab); stroke: var(--ink); stroke-width: 1; }
.p-t { font: 400 13px 'Atkinson', system-ui, sans-serif; fill: var(--ink); text-anchor: middle; }
.p-u { text-anchor: start; font-weight: 700; }

/* globus */
.fig.fig-glob { max-width: 300px; }
.g-kula { fill: var(--woda); stroke: var(--ink); stroke-width: 2; }
.g-r, .g-p { fill: none; stroke: var(--ink); stroke-opacity: .45; stroke-width: 1.2; }
.g-rownik { fill: none; stroke: var(--hot); stroke-width: 2.6; }
.g-bieg { fill: var(--ink); }
.g-t { font: 700 15px 'Atkinson', system-ui, sans-serif; fill: var(--ink); text-anchor: middle; }
.g-opis { font: 400 13px 'Atkinson', system-ui, sans-serif; fill: var(--ink); }
.g-hot { fill: var(--hot); font-weight: 700; }

/* odwzorowania */
.fig.fig-odw { max-width: 160px; margin: 4px auto; }
.o-p { fill: none; stroke: var(--cold); stroke-width: 1.6; }
.o-r { fill: none; stroke: var(--hot); stroke-width: 1.6; }

/* te same lądy w trzech odwzorowaniach */
.fig.fig-rzut { max-width: 460px; margin: 4px auto 14px; }
.r-tlo { stroke: var(--ink); stroke-opacity: .35; stroke-width: 1; }
.fig-rzut .m-lad { stroke-width: .6; }
.m-lad.r-grenl { fill: var(--hot); }
.m-lad.r-afr { fill: var(--hot); fill-opacity: .4; }
.r-siatka { fill: none; stroke: var(--ink); stroke-opacity: .3; stroke-width: .7; }
.r-rownik { stroke: var(--hot); stroke-opacity: .8; }
.r-podp { font: 700 11px 'Atkinson', system-ui, sans-serif; fill: var(--ink); text-anchor: middle; paint-order: stroke; stroke: var(--lad); stroke-width: 3px; }

/* laboratorium: skala */
.sk-tab { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 10px 0; }
.sk-tab > div { background: var(--slab-2); box-shadow: var(--carve); border-radius: 12px; padding: 10px; }
.sk-tab span { display: block; font-size: 13px; color: var(--ink-2); }
.sk-tab > div > b { font-family: 'Fraunces', Georgia, serif; font-size: 20px; }
.sk-tab small { display: block; color: var(--ink-2); }
.sk-tab .sk-lin { grid-column: 1 / -1; }
.sk-tab p { grid-column: 1 / -1; margin: 0; font-size: 16px; }
.sk-opcje .sk-opcja { min-width: 120px; }
.sk-zad > p { font-size: 17px; margin: 8px 0; }

/* mapa w labie: na całą szerokość, ale tak, żeby zmieściła się w wysokości ekranu (polecenie nad nią widoczne) */
.sw-ramka .lab-mapa { width: min(100%, calc((100vh - 210px) * 2.12)); margin: 6px auto 10px; }
.sw-ramka { margin: 0; }
@media (min-width: 700px) {
  .fig.fig-mapa { max-width: 560px; }
  .fig.fig-pod { max-width: 360px; }
  .fig.fig-glob { max-width: 420px; }
  .fig.fig-odw { max-width: 240px; }
  .fig.fig-rzut { max-width: 720px; }
  .sw-pol { font-size: 22px; text-align: center; }
  .lab .sw-nazwy, .lab .tryby { justify-content: center; }
  .sk-tab { grid-template-columns: 1fr 1fr 2fr; }
  .sk-tab .sk-lin { grid-column: auto; }
  .lab-chip .fig.fig-pod, .sk-lin .fig.fig-pod { max-width: 300px; }
}
