/* Dewellux: ekrany aplikacji w stylu Localo. Tylko tokeny z globals.css. */

/* ---------- Szkielet: górny pasek, treść, stopka ---------- */
.warsztat { display: grid; grid-template-areas: "gora" "tresc" "stan"; grid-template-rows: auto 1fr auto; min-height: 100dvh; }
.gora { grid-area: gora; position: sticky; top: 0; z-index: var(--z-sticky); display: flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap; padding: var(--sp-2) var(--sp-5); background: var(--surface); border-bottom: var(--kreska) solid var(--line); }
.marka { display: inline-flex; align-items: center; gap: var(--sp-2); font-family: var(--font-display); font-weight: 800; font-size: var(--fs-xl); color: var(--accent); text-decoration: none; min-height: 44px; }
.marka svg { width: var(--sp-6); height: var(--sp-6); }
.plan { font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: var(--poz-dol); background: var(--poz-dol-tlo); border-radius: var(--radius-sm); padding: var(--sp-1) var(--sp-2); }
.przelacznik { display: flex; align-items: center; gap: var(--sp-2); }
.przelacznik select, .konto-nazwa { min-height: 44px; border: var(--kreska) solid var(--line); border-radius: var(--radius-pill); padding: var(--sp-2) var(--sp-4); background: var(--surface); font-weight: 600; margin: 0; display: inline-flex; align-items: center; }
.nawigacja { display: flex; align-items: center; gap: var(--sp-1); margin-left: auto; flex-wrap: wrap; }
.nawigacja a, .nawigacja button { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--sp-3); border-radius: var(--radius-pill); color: var(--ink-soft); font-weight: 600; text-decoration: none; }
.nawigacja a:hover, .nawigacja button:hover { color: var(--accent); background: var(--accent-tlo); }
[aria-current="page"] { color: var(--accent) !important; background: var(--accent-tlo); }
[aria-pressed="true"] { background: var(--accent-tlo); color: var(--accent); border-color: var(--accent); }
.nawigacja form { margin: 0; }
main { grid-area: tresc; width: 100%; max-width: calc(var(--sp-8) * 18 + var(--sp-7)); margin: 0 auto; padding: var(--sp-6) var(--sp-5) var(--sp-7); min-width: 0; }
.stan { grid-area: stan; padding: var(--sp-4) var(--sp-5); font-size: var(--fs-sm); color: var(--muted); text-align: center; }
.warsztat-publiczny main { max-width: calc(var(--sp-8) * 19); display: flex; align-items: center; justify-content: center; }

/* ---------- Typografia i nagłówki ---------- */
h1 { margin-bottom: var(--sp-4); overflow-wrap: anywhere; }
h2 { margin-bottom: var(--sp-4); overflow-wrap: anywhere; }
h3 { margin-top: var(--sp-5); margin-bottom: var(--sp-3); }
p { overflow-wrap: anywhere; }
.naglowek { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; margin-bottom: var(--sp-5); }
.naglowek h1 { margin: 0; }
.podtytul { color: var(--ink-soft); margin: 0 0 var(--sp-5); }

/* ---------- Karty ---------- */
.karta { background: var(--surface); border: var(--kreska) solid var(--line); border-radius: var(--radius); padding: var(--sp-5); box-shadow: var(--cien); margin-bottom: var(--sp-4); }
.karta > h2:first-child, .karta > header h2 { font-size: var(--fs-lg); margin: 0; }
.karta-naglowek { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.karta-naglowek h2 { font-size: var(--fs-lg); margin: 0; }
.karta-naglowek a { font-weight: 600; text-decoration: none; }
.siatka-kart { display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(var(--sp-8) * 3), 1fr)); gap: var(--sp-4); margin-bottom: var(--sp-4); }
.siatka-kart .karta { margin: 0; }
.uklad-profilu { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.kafel { display: grid; gap: var(--sp-2); }
.kafel dt, .kafel-tytul { color: var(--ink-soft); font-weight: 600; font-size: var(--fs-sm); }
.kafel dd, .kafel-wartosc { margin: 0; font-size: var(--fs-2xl); font-weight: 800; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; }
.kafel-opis, .kafel dd.kafel-opis { color: var(--muted); font-size: var(--fs-sm); font-weight: 400; margin: 0; display: block; }
.kafel-aktywny { border-color: var(--accent); background: var(--accent-tlo); }

/* ---------- Przyciski i pola: pigułki ---------- */
.przycisk, .przycisk-drugi { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2); min-height: 44px; padding: var(--sp-2) var(--sp-5); border-radius: var(--radius-pill); text-decoration: none; font-weight: 700; }
.przycisk { background: var(--accent); color: var(--on-accent); }
.przycisk:hover { background: var(--accent-soft); color: var(--on-accent); }
.przycisk-drugi { border: var(--kreska) solid var(--line); background: var(--surface); color: var(--accent); }
.przycisk-drugi:hover { border-color: var(--accent); }
button:disabled { cursor: not-allowed; background: var(--surface-2); color: var(--muted); }
input:not([type="radio"]):not([type="checkbox"]), select { border-radius: var(--radius-pill); }
textarea { border-radius: var(--radius); }
.formularz { display: grid; max-width: calc(var(--sp-8) * 9); gap: var(--sp-2); }
.formularz label { font-weight: 700; font-size: var(--fs-sm); }
.formularz > label:not(:first-child) { margin-top: var(--sp-3); }
.formularz input:not([type="radio"]):not([type="checkbox"]), .formularz textarea, .formularz select { width: 100%; min-height: 44px; min-width: 0; }
.formularz input[type="checkbox"], .formularz input[type="radio"] { width: var(--sp-5); height: var(--sp-5); margin: 0; flex-shrink: 0; accent-color: var(--accent); }
.formularz textarea { resize: vertical; }
.formularz .przycisk { justify-self: start; margin-top: var(--sp-4); }
.formularz p { margin: var(--sp-1) 0; color: var(--ink-soft); font-size: var(--fs-sm); }
.formularz-szeroki { max-width: calc(var(--sp-8) * 11); }
fieldset { border: 0; margin: 0 0 var(--sp-5); padding: 0; min-width: 0; display: grid; gap: var(--sp-3); }
legend { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-lg); margin-bottom: var(--sp-3); padding: 0; }
.pole { display: grid; gap: var(--sp-2); }
.dzialania { display: flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap; }
.dzialania .przycisk { margin-top: 0; }
.blad { color: var(--danger); }
.komunikat { padding: var(--sp-3) var(--sp-5); background: var(--accent-tlo); color: var(--ink); border-radius: var(--radius); margin-bottom: var(--sp-4); }
.pusty { padding: var(--sp-7) var(--sp-5); text-align: center; }
.pusty p { font-size: var(--fs-lg); margin-bottom: var(--sp-5); color: var(--ink-soft); }
.filtr { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
.filtr select, .filtr input { min-width: 0; max-width: 100%; min-height: 44px; }
.szukaj { flex: 1; min-width: calc(var(--sp-8) * 3); }

/* ---------- Odznaki pozycji, paski widoczności, zmiany, wykresy ---------- */
.poz { display: inline-flex; align-items: center; padding: var(--sp-1) var(--sp-3); border-radius: var(--radius-sm); font-weight: 800; font-size: var(--fs-sm); white-space: nowrap; font-variant-numeric: tabular-nums; }
.poz-top { background: var(--poz-top-tlo); color: var(--poz-top); }
.poz-srodek { background: var(--poz-srodek-tlo); color: var(--poz-srodek); }
.poz-dol { background: var(--poz-dol-tlo); color: var(--poz-dol); }
.poz-brak { background: var(--poz-brak-tlo); color: var(--poz-brak); }
.zmiana { font-weight: 800; font-size: var(--fs-sm); white-space: nowrap; color: var(--muted); }
.zmiana-lepiej { color: var(--ok); }
.zmiana-gorzej { color: var(--danger); }
.widocznosc { display: inline-flex; align-items: center; gap: var(--sp-2); font-weight: 700; font-size: var(--fs-sm); color: var(--ok); white-space: nowrap; }
.pasek { width: calc(var(--sp-8) + var(--sp-4)); height: var(--sp-2); }
.pasek-tlo { fill: var(--line); }
.pasek-wartosc { fill: var(--mapa-top); }
.wykres { width: 100%; height: var(--sp-6); overflow: visible; }
.wykres polyline { fill: none; stroke: var(--mapa-top); stroke-width: var(--kreska-2); vector-effect: non-scaling-stroke; }
.wykres-gorzej polyline { stroke: var(--danger); }
.etykieta { display: inline-block; font-size: var(--fs-xs); font-weight: 700; color: var(--accent); background: var(--accent-tlo); padding: 0 var(--sp-2); border-radius: var(--radius-pill); vertical-align: middle; }
.otwarte { color: var(--ok); font-size: var(--fs-sm); font-weight: 600; }

/* ---------- Lista profili (kokpit) ---------- */
.profil { padding: 0; overflow: hidden; }
.profil-glowa { display: flex; align-items: flex-start; gap: var(--sp-4); padding: var(--sp-5); flex-wrap: wrap; }
.profil-znak { width: calc(var(--sp-7) + var(--sp-1)); height: calc(var(--sp-7) + var(--sp-1)); border-radius: var(--radius-sm); background: var(--accent-tlo); color: var(--accent); display: grid; place-items: center; font-weight: 800; font-size: var(--fs-lg); flex-shrink: 0; }
.profil-dane { flex: 1; min-width: 0; }
.profil-dane h2 { font-size: var(--fs-lg); margin: 0 0 var(--sp-1); }
.profil-dane h2 a { color: var(--ink); text-decoration: none; }
.profil-dane h2 a:hover { color: var(--accent); }
.profil-adres { color: var(--ink-soft); font-size: var(--fs-sm); margin: 0; }
.profil-pasek { display: flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap; padding: var(--sp-3) var(--sp-5); border-top: var(--kreska) solid var(--line-soft); }
.profil-pasek .rozdzielacz { width: var(--kreska); height: var(--sp-5); background: var(--line); }
.frazy { margin: 0 var(--sp-4) var(--sp-4); border: var(--kreska) solid var(--line); border-radius: var(--radius); padding: var(--sp-2) var(--sp-4); }
.frazy-naglowek { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-3); padding: var(--sp-2) 0; }
.frazy-naglowek h3 { margin: 0; font-size: var(--fs-base); }
.fraza { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) auto auto auto; align-items: center; gap: var(--sp-4); padding: var(--sp-3) 0; border-top: var(--kreska) solid var(--line-soft); }
.fraza-tekst { font-weight: 600; overflow-wrap: anywhere; }
.fraza-poz { display: flex; align-items: center; gap: var(--sp-2); }
.fraza-data { color: var(--muted); font-size: var(--fs-xs); line-height: 1.3; text-align: right; }
.fraza-brak { grid-column: 2 / -1; color: var(--muted); font-size: var(--fs-sm); }

/* ---------- Tabele ---------- */
table { width: 100%; border-collapse: collapse; text-align: left; }
caption { text-align: left; padding: var(--sp-3) 0; font-weight: 700; }
th, td { padding: var(--sp-3) var(--sp-4); border-bottom: var(--kreska) solid var(--line-soft); vertical-align: top; }
thead th { font-size: var(--fs-sm); color: var(--ink-soft); font-weight: 700; background: var(--surface-2); }
thead th:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
thead th:last-child { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
th { font-weight: 700; }
th[scope="row"] { min-width: calc(var(--sp-8) * 3); }
.liczby { font-variant-numeric: tabular-nums; white-space: nowrap; }
.identyfikator { font-family: var(--font-mono); font-size: var(--fs-sm); overflow-wrap: anywhere; }
td ol { margin: 0; padding-left: var(--sp-5); }
.strony { display: flex; gap: var(--sp-5); margin-top: var(--sp-4); flex-wrap: wrap; }
.strony a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }

/* ---------- Wizytówka: pomiar, źródła, siatka ---------- */
.zrodlo label { display: flex; gap: var(--sp-2); align-items: center; min-height: 44px; font-weight: 600; }
.zrodlo p { color: var(--muted); font-size: var(--fs-sm); margin: 0 0 var(--sp-2); }
.lista-szczegolow { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--sp-2) var(--sp-4); margin: 0; }
.lista-szczegolow dt { color: var(--ink-soft); font-size: var(--fs-sm); }
.lista-szczegolow dd { margin: 0; font-weight: 600; }
.zadanie { display: flex; gap: var(--sp-4); flex-wrap: wrap; padding: var(--sp-3) var(--sp-4); background: var(--accent-tlo); border-radius: var(--radius-sm); }

/* ---------- Konto, zespół, administracja ---------- */
.motywy [role="group"] { display: flex; gap: var(--sp-3); flex-wrap: wrap; }
.dane-konta { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--sp-3) var(--sp-6); margin: 0; }
dd { margin: 0; overflow-wrap: anywhere; }
.w-wierszu { display: flex; gap: var(--sp-2); align-items: center; }
.w-wierszu select { min-height: 44px; min-width: 0; }
.dzialania-wiersza { display: flex; gap: var(--sp-2); flex-wrap: wrap; }
.osoby .przycisk-drugi { padding-inline: var(--sp-4); }
.nieaktywny th, .nieaktywny td { color: var(--muted); }
.lista-wizytowek label { display: flex; gap: var(--sp-2); align-items: center; min-height: 44px; font-weight: 600; }
.formularz-dostepu { display: grid; gap: var(--sp-2); min-width: calc(var(--sp-8) * 3); }
.formularz-dostepu details label { display: flex; gap: var(--sp-2); align-items: center; min-height: 44px; font-weight: 600; }
.formularz-dostepu summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; color: var(--accent); font-weight: 600; }
.zgoda { display: flex; gap: var(--sp-3); align-items: flex-start; font-weight: 600 !important; }
.zgoda input { margin-top: var(--sp-1); }
.pod-formularzem { margin-top: var(--sp-4); color: var(--ink-soft); }

/* ---------- Ekran wejścia: logowanie, rejestracja, zaproszenia ---------- */
.ekran-wejscia { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; background: var(--surface); border: var(--kreska) solid var(--line); border-radius: calc(var(--radius) + var(--sp-1)); overflow: hidden; min-height: calc(var(--sp-8) * 9); }
.panel-marki { background: var(--accent); color: var(--on-accent); display: grid; align-content: center; justify-items: center; gap: var(--sp-5); padding: var(--sp-7); text-align: center; }
.panel-marki svg { width: 100%; max-width: calc(var(--sp-8) * 5); height: auto; }
.panel-marki p { font-size: var(--fs-lg); font-weight: 700; max-width: 32ch; margin: 0; }
.formularz-logowania { padding: var(--sp-7); display: grid; align-content: center; justify-items: stretch; }
.formularz-logowania h1 { text-align: center; font-size: var(--fs-2xl); }
.formularz-logowania .marka { justify-self: center; margin-bottom: var(--sp-3); }
.formularz-logowania .formularz { max-width: none; }
.formularz-logowania .formularz .przycisk { justify-self: stretch; }
.formularz-logowania .pod-formularzem { text-align: center; margin: var(--sp-3) 0 0; }
.opis-produktu { color: var(--ink-soft); text-align: center; margin-bottom: var(--sp-5); }

/* ---------- Pomiar: mapy ---------- */
.wynik-frazy { margin-bottom: var(--sp-4); }
.mapa-geo { width: 100%; height: calc(var(--sp-8) * 7); margin-bottom: var(--sp-5); background: var(--surface-2); border-radius: var(--radius); overflow: hidden; }
.mapa-geo:focus-visible { outline: var(--kreska-2) solid var(--ring); }
.znacznik { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; font-weight: 800; color: var(--on-mapa); border: var(--kreska-2) solid var(--surface); box-shadow: 0 0 0 calc(var(--sp-2) + var(--sp-1)) var(--mapa-top-poswiata); }
.znacznik-top { background: var(--mapa-top); }
.znacznik-srodek { background: var(--mapa-srodek); }
.znacznik-dol { background: var(--mapa-dol); box-shadow: 0 0 0 calc(var(--sp-2) + var(--sp-1)) var(--mapa-dol-poswiata); }
.znacznik-brak { background: var(--mapa-brak); color: var(--ink); box-shadow: none; }
.znacznik-blad { background: var(--mapa-blad); color: var(--ink); box-shadow: none; }
.leaflet-container { font-family: var(--font-body); }
.leaflet-tile-pane { filter: saturate(0.55) brightness(1.04); }
.mapa-z-legenda { display: flex; align-items: flex-start; gap: var(--sp-6); flex-wrap: wrap; }
.mapa { flex-shrink: 0; max-width: 100%; height: auto; }
.mapa-3 { width: calc(36px * 3); }
.mapa-5 { width: calc(36px * 5); }
.mapa-7 { width: calc(36px * 7); }
.mapa-9 { width: calc(36px * 9); }
.mapa text { fill: var(--on-mapa); font-family: var(--font-body); font-weight: 800; font-size: var(--fs-sm); }
.mapa rect { stroke: var(--surface); stroke-width: var(--kreska-2); rx: var(--sp-1); }
.mapa-top { fill: var(--mapa-top); background: var(--mapa-top); }
.mapa-srodek { fill: var(--mapa-srodek); background: var(--mapa-srodek); }
.mapa-dol { fill: var(--mapa-dol); background: var(--mapa-dol); }
.mapa-brak { fill: var(--mapa-brak); background: var(--mapa-brak); }
.mapa-blad { fill: var(--mapa-blad); background: var(--mapa-blad); }
.mapa-brak + text, .mapa-blad + text { fill: var(--ink); }
.legenda h3 { margin-top: 0; font-size: var(--fs-base); }
.legenda ul { display: grid; gap: var(--sp-2); list-style: none; padding: 0; margin: 0; }
.legenda li { display: flex; gap: var(--sp-3); align-items: center; font-size: var(--fs-sm); }
.probka { display: inline-block; width: var(--sp-4); height: var(--sp-4); border-radius: 50%; }
.podsumowanie { display: flex; gap: var(--sp-6); flex-wrap: wrap; margin-block: var(--sp-5); }
.podsumowanie dt { color: var(--ink-soft); font-size: var(--fs-sm); font-weight: 600; }
.podsumowanie dd { font-size: var(--fs-lg); font-weight: 800; margin-top: var(--sp-1); font-variant-numeric: tabular-nums; }

/* ---------- Dostępność ---------- */
.czytnik, .pomin:not(:focus) { position: absolute; width: var(--kreska); height: var(--kreska); padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pomin:focus { position: fixed; top: var(--sp-4); left: var(--sp-4); z-index: var(--z-overlay); background: var(--surface); padding: var(--sp-4); border-radius: var(--radius-sm); }

/* ---------- Mniejsze ekrany ---------- */
@media (width < 900px) {
  .uklad-profilu { grid-template-columns: minmax(0, 1fr); }
  .ekran-wejscia { grid-template-columns: minmax(0, 1fr); }
  .panel-marki { display: none; }
  .fraza { grid-template-columns: minmax(0, 1fr) auto; }
  .fraza .wykres, .fraza .widocznosc, .fraza-data { display: none; }
  .gora { padding: var(--sp-2) var(--sp-4); gap: var(--sp-2); }
  .nawigacja { margin-left: 0; width: 100%; }
}
@media (width < 640px) {
  main { padding: var(--sp-4) var(--sp-4) var(--sp-6); }
  .formularz-logowania { padding: var(--sp-5); }
  .mapa-z-legenda { flex-direction: column; }
  .mapa-3 { width: calc(28px * 3); }
  .mapa-5 { width: calc(28px * 5); }
  .mapa-7 { width: calc(28px * 7); }
  .mapa-9 { width: calc(28px * 9); }
  .mapa-geo { height: calc(var(--sp-8) * 5); }
  h1 { font-size: var(--fs-2xl); }
}

/* ---------- Poprawki po odbiorze S006 ---------- */
.leaflet-marker-icon.znacznik { display: flex; }
.frazy-naglowek a, .karta-naglowek a, .podtytul a, .profil-dane h2 a { text-decoration: none; font-weight: 700; }
.fraza .wykres { max-width: calc(var(--sp-8) * 3 + var(--sp-6)); height: var(--sp-5); justify-self: center; }
.siatka-kart { grid-template-columns: repeat(auto-fit, minmax(calc(var(--sp-8) * 2 + var(--sp-6)), 1fr)); }
h1, h2 { overflow-wrap: break-word; }
@media (width < 640px) {
  .profil-glowa > .przycisk-drugi { display: none; }
  .szukaj { flex-basis: 100%; }
  .kafel dd, .kafel-wartosc { font-size: var(--fs-xl); }
  .karta { padding: var(--sp-4); }
  .profil-glowa, .profil-pasek { padding-inline: var(--sp-4); }
}

/* ---------- S007: pulpit wizytówki z menu jak w Localo ---------- */
.profil-uklad { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--sp-5); align-items: start; }
.profil-menu { position: sticky; top: calc(var(--sp-8) + var(--sp-2)); background: var(--surface); border: var(--kreska) solid var(--line); border-radius: var(--radius); padding: var(--sp-4); }
.profil-menu-glowa { display: flex; gap: var(--sp-3); align-items: flex-start; padding-bottom: var(--sp-3); margin-bottom: var(--sp-3); border-bottom: var(--kreska) solid var(--line-soft); }
.profil-menu-glowa .profil-znak { width: var(--sp-7); height: var(--sp-7); font-size: var(--fs-base); }
.profil-menu-nazwa { font-weight: 800; margin: 0; line-height: 1.3; overflow-wrap: break-word; }
.profil-menu nav { display: grid; gap: var(--sp-1); }
.profil-menu nav a { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 0 var(--sp-3); border-radius: var(--radius-sm); color: var(--ink-soft); font-weight: 600; text-decoration: none; }
.profil-menu nav a:hover { background: var(--accent-tlo); color: var(--accent); }
.profil-menu-grupa { margin: var(--sp-3) 0 var(--sp-1); padding: 0 var(--sp-3); font-size: var(--fs-xs); font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.licznik { display: inline-flex; align-items: center; justify-content: center; min-width: var(--sp-5); padding: 0 var(--sp-2); border-radius: var(--radius-pill); background: var(--danger); color: var(--surface); font-size: var(--fs-xs); font-weight: 800; }
.profil-tresc { min-width: 0; }
.pulpit-gora { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: var(--sp-4); margin-bottom: var(--sp-4); align-items: stretch; }
.pulpit-gora > .karta { margin: 0; }
.siatka-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.pulpit-trojka { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); margin-bottom: var(--sp-4); }
.pulpit-trojka > .karta { margin: 0; }
.uklad-profilu { margin-bottom: var(--sp-4); }
.uklad-profilu > .karta { margin: 0; }
.kafel .kafel-brak { color: var(--muted); font-size: var(--fs-lg); font-weight: 700; }
.audyt-skrot { display: flex; align-items: center; gap: var(--sp-4); }
.pierscien { width: calc(var(--sp-8) * 2); height: calc(var(--sp-8) * 2); flex-shrink: 0; }
.pierscien circle { fill: none; stroke-width: 10; }
.pierscien-tlo { stroke: var(--line); }
.pierscien-wartosc { stroke-linecap: round; }
.pierscien-dobry { stroke: var(--mapa-top); }
.pierscien-sredni { stroke: var(--mapa-srodek); }
.pierscien-slaby { stroke: var(--mapa-dol); }
.pierscien text { font-family: var(--font-body); font-weight: 800; font-size: var(--fs-xl); fill: var(--ink); }
.audyt-wynik { display: grid; justify-items: center; text-align: center; gap: var(--sp-3); }
.czeka { display: flex; gap: var(--sp-3); align-items: flex-start; padding: var(--sp-4); border-radius: var(--radius); background: var(--surface-2); color: var(--ink-soft); }
.czeka svg { width: var(--sp-5); height: var(--sp-5); flex-shrink: 0; color: var(--accent); }
.czeka p { margin: 0; font-size: var(--fs-sm); }
.czeka .czeka-tytul { font-weight: 800; color: var(--ink); font-size: var(--fs-base); margin-bottom: var(--sp-1); }
.zadania-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.zadanie-pozycja { display: flex; gap: var(--sp-3); align-items: flex-start; }
.zadanie-ikona { display: grid; place-items: center; width: calc(var(--sp-6) + var(--sp-2)); height: calc(var(--sp-6) + var(--sp-2)); border-radius: var(--radius-sm); background: var(--accent-tlo); color: var(--accent); font-weight: 800; flex-shrink: 0; }
.zadanie-wysoka .zadanie-ikona { background: var(--poz-dol-tlo); color: var(--poz-dol); }
.zadanie-srednia .zadanie-ikona { background: var(--poz-srodek-tlo); color: var(--poz-srodek); }
.zadanie-tytul { font-weight: 800; margin: 0; }
.zadanie-tytul a { color: var(--ink); text-decoration: none; }
.zadanie-tytul a:hover { color: var(--accent); }
.zadanie-opis { margin: 0; color: var(--ink-soft); font-size: var(--fs-sm); }
.wszystko-ok { display: grid; justify-items: center; gap: var(--sp-2); padding: var(--sp-5); text-align: center; color: var(--ink-soft); }
.wszystko-ok span { display: grid; place-items: center; width: var(--sp-7); height: var(--sp-7); border-radius: 50%; background: var(--poz-top-tlo); color: var(--poz-top); font-size: var(--fs-xl); font-weight: 800; }
.kalendarz-glowa { display: flex; align-items: center; justify-content: center; gap: var(--sp-4); margin-bottom: var(--sp-3); }
.kalendarz-glowa a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; text-decoration: none; font-size: var(--fs-xl); }
.kalendarz-tytul { font-weight: 800; margin: 0; min-width: calc(var(--sp-8) * 2); text-align: center; }
.kalendarz-siatka th, .kalendarz-siatka td { text-align: center; padding: var(--sp-2) var(--sp-1); border: 0; font-size: var(--fs-sm); }
.kalendarz-siatka thead th { background: none; color: var(--muted); }
.kalendarz-siatka td.inny { color: var(--muted); }
.kalendarz-siatka td.dzis { color: var(--accent); font-weight: 800; background: var(--accent-tlo); border-radius: var(--radius-sm); }
.kalendarz-legenda { display: flex; gap: var(--sp-4); flex-wrap: wrap; justify-content: center; list-style: none; padding: 0; margin: var(--sp-3) 0 0; font-size: var(--fs-sm); color: var(--ink-soft); }
.kalendarz-legenda li { display: flex; align-items: center; gap: var(--sp-2); }
.kropka { width: var(--sp-2); height: var(--sp-2); border-radius: 50%; display: inline-block; }
.kropka-oferta { background: var(--mapa-top); }
.kropka-post { background: var(--accent); }
.kropka-zdjecie { background: var(--mapa-srodek); }
.konkurenci-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.konkurenci-lista li { display: flex; align-items: center; gap: var(--sp-3); font-weight: 700; }
.audyt-lista { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: grid; gap: var(--sp-2); }
.audyt-lista li { display: flex; align-items: center; gap: var(--sp-3); min-height: 44px; padding: 0 var(--sp-3); border-radius: var(--radius-sm); background: var(--surface-2); font-weight: 600; }
.audyt-znak { display: grid; place-items: center; width: var(--sp-5); height: var(--sp-5); border-radius: 50%; font-size: var(--fs-xs); font-weight: 800; flex-shrink: 0; }
.audyt-lista .ok .audyt-znak { background: var(--poz-top-tlo); color: var(--poz-top); }
.audyt-lista .do-zrobienia .audyt-znak { background: var(--poz-dol-tlo); color: var(--poz-dol); }
.audyt-lista .czeka-pozycja { color: var(--ink-soft); }
.audyt-lista .czeka-pozycja .audyt-znak { background: var(--poz-brak-tlo); color: var(--poz-brak); }
.trend { width: 100%; height: calc(var(--sp-8) * 3); background: var(--surface-2); border-radius: var(--radius-sm); }
.trend polyline { fill: none; stroke-width: 3; vector-effect: non-scaling-stroke; }
.trend-widocznosc { stroke: var(--mapa-top); }
.trend-pozycja { stroke: var(--accent); }
.raport-konkurenci { display: grid; gap: var(--sp-2); padding-left: var(--sp-5); }
.raport-konkurenci li { font-weight: 600; }
@media (width < 900px) {
  .profil-uklad { grid-template-columns: minmax(0, 1fr); }
  .profil-menu { position: static; padding: var(--sp-3); }
  .profil-menu nav { display: flex; overflow-x: auto; gap: var(--sp-1); }
  .profil-menu nav a { white-space: nowrap; }
  .profil-menu-grupa { display: none; }
  .pulpit-gora, .pulpit-trojka { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .gora, .profil-menu, .stan, .naglowek .przycisk, .podtytul { display: none; }
  .profil-uklad { display: block; }
  body { background: var(--surface); }
  .karta { break-inside: avoid; box-shadow: none; }
}

/* ---------- S008: połączenie z Google, strona startowa, dokumenty prawne ---------- */
.komunikat-ostrzezenie { padding: var(--sp-3) var(--sp-5); background: var(--poz-srodek-tlo); color: var(--ink); border-radius: var(--radius); margin-bottom: var(--sp-4); }
.polaczenia-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.polaczenie { display: flex; gap: var(--sp-4); align-items: center; justify-content: space-between; flex-wrap: wrap; padding: var(--sp-4); border-radius: var(--radius-sm); background: var(--surface-2); }
.polaczenie-opis { display: grid; gap: var(--sp-1); min-width: 0; }
.polaczenie-opis p { margin: 0; }
.polaczenie-email { font-weight: 800; overflow-wrap: anywhere; }
.lista-zasad { display: grid; gap: var(--sp-2); padding-left: var(--sp-5); margin: 0 0 var(--sp-4); max-width: 72ch; }
.dokument-prawny { max-width: 80ch; margin-inline: auto; }
.dokument-prawny h2 { font-size: var(--fs-lg); margin: var(--sp-6) 0 var(--sp-3); }
.dokument-prawny p, .dokument-prawny ul { max-width: 72ch; }
.dokument-prawny ul { display: grid; gap: var(--sp-2); padding-left: var(--sp-5); }
.zgoda-atrapa { max-width: 72ch; margin-inline: auto; }
.zgoda-atrapa code { overflow-wrap: anywhere; }
.start-opis h1 { text-wrap: balance; }
.start-opis .lista-zasad { padding-left: var(--sp-4); }
.start-przyciski { justify-content: center; margin-top: var(--sp-3); }
.stan a { color: var(--ink-soft); }
.polaczenie .kafel-opis { color: var(--ink-soft); }

/* ---------- S009: zgłaszanie uwag, wyszukiwarka firm ---------- */
.uwagi-obszar { grid-area: uwagi; justify-self: end; margin: 0 var(--sp-5) var(--sp-3); max-width: 100%; }
.zglos-uwage summary { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--sp-4); border-radius: var(--radius-pill); background: var(--accent); color: var(--on-accent); font-weight: 800; cursor: pointer; list-style: none; }
.zglos-uwage summary::-webkit-details-marker { display: none; }
.zglos-uwage[open] { background: var(--surface); border: var(--kreska) solid var(--line); border-radius: var(--radius); padding: var(--sp-4); box-shadow: var(--cien); }
.zglos-uwage form { margin-top: var(--sp-3); max-width: 72ch; }
.warsztat { grid-template-areas: "gora" "tresc" "uwagi" "stan"; grid-template-rows: auto 1fr auto auto; }
.szukaj-wiersz { display: flex; gap: var(--sp-2); flex-wrap: wrap; }
.szukaj-wiersz input { flex: 1 1 calc(var(--sp-8) * 4); min-width: 0; }
.wyniki-szukania { list-style: none; margin: var(--sp-4) 0 0; padding: 0; display: grid; gap: var(--sp-2); }
.wyniki-szukania li { display: flex; gap: var(--sp-3); align-items: center; justify-content: space-between; flex-wrap: wrap; padding: var(--sp-3) var(--sp-4); border-radius: var(--radius-sm); background: var(--surface-2); }
.wyniki-szukania .kafel-opis { color: var(--ink-soft); }
.wynik-opis { display: grid; gap: var(--sp-1); min-width: 0; }
.uwagi-filtry { display: flex; gap: var(--sp-2); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.uwagi-filtry a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--sp-4); border-radius: var(--radius-pill); border: var(--kreska) solid var(--line); text-decoration: none; font-weight: 700; }
.uwaga-tresc { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 60ch; }