@charset "UTF-8";
/* ============================================================
   app.scss – root SCSS powłoki produkcyjnej (system projektowy RIG,
   clean-light). Osobny root sass-bundle; partiale w assets/styles/app/.
   Ładowany przez <link> w module/layout.html.twig (bez FOUC), nie przez
   entrypoint JS.
   ============================================================ */
/* --- Inter (treść) – font wariantowy, oś wght 100–900 --- */
/* latin-ext: polskie ą ć ę ł ń ś ź ż */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-ext-var-9fzmmZy.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin: alfabet podstawowy + polskie ó */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-var-joy4ri1.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* --- Manrope (nagłówki, wartości KPI) – font wariantowy, oś wght 200–800 --- */
/* latin-ext: polskie ą ć ę ł ń ś ź ż */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/manrope-latin-ext-var-Q3ebhOa.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin: alfabet podstawowy + polskie ó */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/manrope-latin-var-bDYqjI6.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* ============================================================
   _tokens.scss – kanon tokenów systemu projektowego RIG (clean-light, D3)
   Źródło wartości: public/propozycje/clean-light-2026-06-15/policy.html
   Akcent = zielony marki rig (#0A706E / #005A5B), używany OSZCZĘDNIE.
   Kolor niesie wyłącznie STATUS; typy/kategorie = neutralny szary.
   Zaokrąglenia małe (6/8px); sidebar zostaje ciemną zielenią marki.
   ============================================================ */
:root {
  /* --- akcent marki (zielony rig) — wspólny dla proto.css i clean-light --- */
  --rig-50: #eaf7f4;
  --rig-100: #d3ece7;
  --rig-200: #8fc6c0;
  --rig-300: #56a29d;
  --rig-400: #2d8986;
  --rig-500: #0a706e;
  --rig-600: #005a5b;
  --rig-700: #004b4c;
  --rig-800: #003c3d;
  --rig-900: #002d2e;
  --rig-950: #002428;
  --accent: #0a706e;
  --accent-700: #005a5b;
  --accent-50: #eaf7f4;
  --accent-100: #d3ece7;
  /* --- neutralne (clean-light — kanon: jasne, czyste) --- */
  --ink: #101828;
  --ink-2: #475467;
  --muted: #667085;
  --line: #e4e7ec;
  --line-2: #d6dae0;
  --bg: #f6f7fb;
  --bg-2: #fafbfc;
  --white: #fff;
  /* --- statusy (stonowane, pastelowe — używane wyłącznie dla statusu) --- */
  --ok: #067647;
  --ok-bg: #e7f8ef;
  --warn: #b54708;
  --warn-bg: #fef3e2;
  --info: #1849a9;
  --info-bg: #eaf1ff;
  --danger: #b42318;
  --danger-bg: #fef3f2;
  --grey: #475467;
  --grey-bg: #f2f4f7;
  /* --- geometria --- */
  --radius: 6px; /* zaokrąglenie bazowe — przyciski, inputy, sb-link, taby */
  --radius-lg: 8px; /* kontenery: karty, listy, drawer, KPI (maks. dopuszczalne) */
  --shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.04);
  /* --- sidebar (ciemna zieleń marki, decyzja Przemka 2026-06-15) --- */
  --sb-bg: #002428;
  --sb-active: #0c5350; /* aktywny element: czyste zaokrąglone tło, BEZ lewego paska */
  --sb-link: #cfe7e0;
  --sb-sec: #56a29d; /* etykiety sekcji – rozjaśnione do wartości --sb-org: kontrast AA ≥ 4.5:1 (było #3f7d72 = 3,42:1 → #56a29d = 5,50:1 na tle --sb-bg) */
  --sb-ico: #7fb3aa;
  --sb-org: #56a29d;
  --sb-wip: #e3a008; /* znacznik „moduł w dopracowaniu" — bursztyn, poza zielenią/czerwienią */
  /* --- pasek PROTOTYP (kwarantanna żywego prototypu) --- */
  --proto-bar: #7e22ce;
  /* --- wyróżnienia w treści polityk (ADR-103) ---
     Zamknięty zestaw 6 barw markera, BEZ semantyki – nie są statusem i nie wolno im
     przypisywać znaczenia (to robią stany dokumentu). Jasne tła z ciemnym tekstem,
     żeby ten sam zapis był czytelny na ekranie, w PDF i w druku. Koloru TEKSTU
     świadomie nie ma: druga oś barwna podwaja liczbę kombinacji, których nie da się
     zwalidować na kontrast, nie dając zdolności, której nie daje wyróżnienie. */
  --hl-ink: #1c2a31;
  --hl-1: #fdefb4;
  --hl-2: #cfeccd;
  --hl-3: #cfe4f7;
  --hl-4: #f5d8e6;
  --hl-5: #e5dcf5;
  --hl-6: #f9dcc4;
}

/* ============================================================
   _layout.scss – szkielet aplikacji: shell, sidebar (5 sekcji + hub),
   topbar odchudzony, nagłówek strony.
   Sidebar = ciemna zieleń marki; aktywny element bez lewego paska/poświaty.
   ============================================================ */
* {
  box-sizing: border-box;
}

/* `hidden` znaczy ukryty – bezwarunkowo. Reguła autorska nadająca `display` (np.
   `.pill { display: inline-flex }`) bije regułę arkusza przeglądarki `[hidden]` niezależnie
   od specyficzności, więc bez tego resetu plakietka „Propozycja AI" stała na ekranie zawsze,
   a filtr listy kontroli nie ukrywał wierszy (Stimulus przełącza właśnie ten atrybut). */
[hidden] {
  display: none !important;
}

html {
  font-size: 14px;
}

body {
  margin: 0;
  font-family: "Inter", system-ui, sans-serif;
  line-height: 1.5;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Manrope", "Inter", sans-serif;
  margin: 0;
  color: var(--ink);
  letter-spacing: -0.01em;
}

a {
  color: inherit;
  text-decoration: none;
}

/* ---------- scrollbary (issue #1): wąskie, dopasowane do tła strefy ----------
   Domyślny systemowy scrollbar (szeroki, jasnoszary) gryzł się z designem —
   szczególnie na ciemnym sidebarze. `scrollbar-color` dziedziczy w dół drzewa
   (Firefox/Chrome 121+); reguły ::-webkit-* pokrywają Safari. */
html {
  scrollbar-width: thin;
  scrollbar-color: #c4cdd8 transparent;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: #c4cdd8;
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--muted);
  background-clip: padding-box;
}

/* ciemna strefa sidebara: jaśniejszy, półprzezroczysty uchwyt */
.rig-sidebar,
.rig-sb-nav {
  scrollbar-color: rgba(255, 255, 255, 0.25) transparent;
}

.rig-sb-nav::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.25);
  background-clip: padding-box;
}

.rig-sb-nav::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.4);
  background-clip: padding-box;
}

svg.ico {
  width: 16px;
  height: 16px;
  flex: none;
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

svg.ico-sm {
  width: 14px;
  height: 14px;
}

/* ---------- pasek PROTOTYP (kwarantanna żywego prototypu) ---------- */
.proto-bar {
  background: var(--proto-bar);
  color: #fff;
  font-size: 12px;
  padding: 7px 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.proto-bar .tag {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 10.5px;
  background: rgba(255, 255, 255, 0.18);
  padding: 2px 8px;
  border-radius: 9999px;
}

.proto-bar a {
  color: #e9d5ff;
  font-weight: 600;
}

.proto-bar a:hover {
  color: #fff;
}

.proto-bar .grow {
  flex: 1;
}

/* ---------- shell ---------- */
/* app-shell: powłoka przyklejona do wysokości okna; przewija się TYLKO panel treści.
   Dzięki temu sidebar (ze stopką przypiętą do dołu) jest zawsze w całości widoczny,
   niezależnie od długości treści po prawej. Pełne 100vh – produkcyjny layout nie ma
   paska „.proto-bar" nad powłoką (ten jest tylko w żywym prototypie, stąd tam -33px). */
.rig-shell {
  display: flex;
  height: 100vh;
  overflow: hidden;
}

.rig-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

.rig-body {
  flex: 1;
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  padding: 22px 28px 60px;
}

/* ekran pełnoekranowy (np. kokpit audytu) — bez ograniczenia szerokości */
.rig-body.rig-body--wide {
  max-width: none;
}

.rig-doc {
  max-width: 1120px;
  margin: 0 auto;
  padding: 24px 28px 60px;
}

/* ---------- sidebar (ciemna zieleń marki) ---------- */
.rig-sidebar {
  width: 238px;
  flex: none;
  background: var(--sb-bg);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.rig-sb-brand {
  padding: 22px 18px 16px;
  display: block;
} /* więcej światła dookoła logotypu */
.rig-sb-brand:hover {
  background: rgba(255, 255, 255, 0.03);
}

.rig-sb-brand svg {
  width: 150px;
  height: auto;
  display: block;
}

.rig-sb-org {
  font-size: 11px;
  color: var(--sb-org);
  padding: 0 18px 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.rig-sb-nav {
  flex: 1;
  overflow-y: auto;
  padding: 8px 10px;
}

.rig-sb-sec {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--sb-sec);
  padding: 12px 8px 5px;
}

.rig-sb-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 9px;
  border-radius: var(--radius);
  color: var(--sb-link);
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 1px;
  cursor: pointer;
}

.rig-sb-link .ico {
  color: var(--sb-ico);
}

.rig-sb-link:hover {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
}

.rig-sb-link.active {
  background: var(--sb-active);
  color: #fff;
  font-weight: 600;
}

.rig-sb-link.active .ico {
  color: #fff;
}

.rig-sb-link.soon {
  opacity: 0.42;
  cursor: default;
}

.rig-sb-link.soon:hover {
  background: transparent;
  color: var(--sb-link);
}

.rig-sb-link .soon-mk {
  margin-left: auto;
  font-size: 8.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--sb-ico);
  border: 1px solid rgba(127, 179, 170, 0.35);
  border-radius: 9999px;
  padding: 1px 6px;
  line-height: 1.4;
}

.rig-sb-link .badge {
  margin-left: auto;
  font-size: 10px;
  background: var(--sb-active);
  color: #bfe9df;
  padding: 1px 6px;
  border-radius: 9999px;
  font-weight: 700;
}

.rig-sb-link.active .badge {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

/* znacznik „moduł w dopracowaniu": mała bursztynowa kropka przy krawędzi, pozycja nadal klikalna */
.rig-sb-link .wip-dot {
  margin-left: auto;
  flex: none;
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  background: var(--sb-wip);
  box-shadow: 0 0 0 3px rgba(227, 160, 8, 0.18);
}

/* Podmenu pozycji paska (ADR-128) – jeden poziom, rozwinięty tylko pod pozycją aktywną.
   Wcięcie plus cienka pionowa linia mówią „to jest wnętrze obszaru", a nie kolejna sekcja. */
.rig-sb-sub {
  margin: 2px 0 6px 20px;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
  padding-left: 8px;
}

.rig-sb-sub .rig-sb-link {
  font-size: 12.5px;
  padding: 5px 8px;
  /* Pozycja podrzędna niesie tekst stanu dla czytnika ekranu (`.rig-visually-hidden`), a ten
     jest `position: absolute`. Bez pozycjonowanego przodka liczyłby się względem bloku
     początkowego i UCIEKŁ z `.rig-shell { height: 100vh; overflow: hidden }`, dokładając
     dokumentowi wysokość – cała strona dostawała pasek przewijania. Ta sama klasa usterki,
     którą opisuje StyleContainmentTest; złapała ją bramka e2e/tests/layout.spec.ts. */
  position: relative;
}

/* Aktywna pozycja podrzędna ciemniejsza niż aktywny obszar (--sb-active): oba tła są widoczne
   naraz, więc muszą się różnić – inaczej podświetlenie wygląda na jedną plamę. */
.rig-sb-sub .rig-sb-link.active {
  background: var(--rig-600);
}

/* Kropka zamiast ikony: pozycje podmenu są miejscami w jednym obszarze, a piętnaście ikon obok
   siebie czyta się jak druga lista modułów. */
.rig-sb-link .bullet {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--sb-ico);
  flex: 0 0 5px;
  margin-left: 3px;
}

/* Stan „wkrótce" w podmenu: pusta kropka przy krawędzi. Plakietka `.soon-mk` z pierwszego poziomu
   tu nie mieści się w żadnym układzie – „Ocena prawdopodobieństwa" plus „w przygotowaniu" łamie
   wiersz na dwa. Znaczenie niesie tekst dla czytnika ekranu i tooltip; kropka jest sygnałem. */
.rig-sb-sub .rig-sb-link .soon-dot {
  margin-left: auto;
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  border: 1px solid var(--sb-ico);
}

/* Nagłówek grupy w podmenu. Kolor z `--sb-sec`, a NIE #6b8a86 z prototypu: ten daje 4,37:1 na
   tle paska, czyli poniżej AA – dokładnie ten sam błąd, który audyt UX/UI wyciął z `.rig-sb-sec`. */
.rig-sb-subsec {
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--sb-sec);
  margin: 8px 0 3px 8px;
}

.rig-sb-subsec:first-child {
  margin-top: 2px;
}

.rig-sb-foot {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 10px;
}

.rig-sb-user {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 8px;
}

.rig-sb-user .av {
  width: 30px;
  height: 30px;
  border-radius: 9999px;
  background: var(--rig-600);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 700;
  flex: none;
}

.rig-sb-user .nm {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rig-100);
}

.rig-sb-user .ro {
  font-size: 10.5px;
  color: var(--sb-org);
}

.rig-sb-user-meta {
  flex: 1;
  min-width: 0;
}

.rig-sb-user-meta .nm,
.rig-sb-user-meta .ro {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Ikona „Wyloguj" przy widżecie konta (P-80): jeden klik, tooltip, hover-highlight. */
.rig-sb-logout {
  flex: none;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: var(--radius);
  color: var(--sb-ico);
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}

.rig-sb-logout .ico {
  width: 17px;
  height: 17px;
}

.rig-sb-logout:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

/* ---------- topbar odchudzony ---------- */
.rig-topbar {
  height: 56px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0 28px;
  position: sticky;
  top: 0;
  z-index: 10;
}

.rig-topbar .crumb {
  font-size: 12.5px;
  color: var(--muted);
}

.rig-topbar .crumb b {
  color: var(--ink);
  font-weight: 700;
}

.rig-topbar .crumb .sep {
  margin: 0 5px;
  color: var(--line-2);
}

.rig-topbar .spacer {
  flex: 1;
}

/* P-72: pole szukania opakowane w <form> (GET /search) — display:contents utrzymuje
   dotychczasowy układ flex paska (label .search dalej jest dzieckiem topbara). */
.rig-topbar .search-form {
  display: contents;
}

.rig-topbar .search {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 8px 14px;
  color: var(--muted);
  background: var(--white);
  min-width: 240px;
  max-width: 340px;
  flex: 1;
}

.rig-topbar .search:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-50);
}

.rig-topbar .search input {
  border: 0;
  outline: 0;
  font-size: 13px;
  width: 100%;
  font-family: inherit;
  color: var(--ink);
  background: transparent;
}

.rig-topbar .lang {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 6px 11px;
  background: #fff;
  cursor: pointer;
}

.rig-topbar .iconbtn-top {
  width: 36px;
  height: 36px;
  border-radius: var(--radius);
  border: 1px solid transparent;
  background: transparent;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.rig-topbar .iconbtn-top.has-notif {
  position: relative;
}

.rig-topbar .iconbtn-top:hover {
  background: var(--grey-bg);
  color: var(--ink);
}

.rig-topbar .iconbtn-top .notif-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--danger, #d92d20);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Dropdowny topbara (język, powiadomienia) — styl spójny z menu „Sesja". */
.rig-topbar .topbar-dd {
  position: relative;
  display: inline-flex;
}

.rig-topbar .topbar-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 40;
  min-width: 200px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: 0 10px 28px rgba(16, 24, 40, 0.12);
}

.rig-topbar .topbar-menu--notif {
  min-width: 236px;
}

.rig-topbar .topbar-menu__group {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 6px 10px 4px;
}

.rig-topbar .topbar-menu__item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 10px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  background: transparent;
  border: 0;
  border-radius: var(--radius);
  cursor: pointer;
  text-align: left;
}

.rig-topbar .topbar-menu__item:hover {
  background: var(--grey-bg);
}

.rig-topbar .topbar-menu__item.is-active {
  color: var(--accent);
  font-weight: 600;
}

.rig-topbar .topbar-menu__note {
  font-size: 10.5px;
  color: var(--muted);
  padding: 4px 10px 6px;
}

.rig-topbar .topbar-menu__empty {
  font-size: 12.5px;
  color: var(--muted);
  padding: 8px 10px;
}

/* ---------- nagłówek strony ---------- */
.rig-head {
  margin-bottom: 18px;
}

.rig-head h1 {
  font-size: 23px;
  font-weight: 800;
}

.rig-head p {
  color: var(--muted);
  font-size: 13px;
  margin: 5px 0 0;
  max-width: 74ch;
  line-height: 1.55;
}

@media (max-width: 900px) {
  .rig-sidebar {
    display: none;
  }
}
/* ============================================================
   _components.scss — prymitywy współdzielone v2 (clean-light look).
   .btn, .rig-list (P0.1), .rig-card, .rig-kpi, .pill (status/kategoria),
   .rig-meter, .rig-tabs, .rig-drawer (P0.4), .rig-callout, .rig-tl, .rig-ba.
   Kolor niesie wyłącznie STATUS; typy/kategorie = neutralny szary (.pill.cat).
   ============================================================ */
/* ---------- przyciski ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  border-radius: var(--radius);
  padding: 8px 14px;
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  line-height: 1.2;
  font-family: inherit;
}

.btn-primary {
  background: var(--accent);
  color: #fff;
}

.btn-primary:hover {
  background: var(--accent-700);
}

/* Przycisk nieaktywny (np. zatwierdzenie audytu luki przy ocenie w toku –
   rozstrzygnięcie 3 przeglądu prototypu) i atrapy tras w budowie (aria-disabled). */
.btn:disabled,
.btn[aria-disabled=true] {
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
}

.btn-ghost {
  background: #fff;
  color: var(--ink);
  border-color: var(--line-2);
}

.btn-ghost:hover {
  background: var(--bg-2);
}

.btn-sm {
  padding: 6px 11px;
  font-size: 12.5px;
}

/* ---------- karty ---------- */
.rig-grid {
  display: grid;
  gap: 16px;
}

/* Ciaśniejsza siatka: trzy krótkie wartości obok siebie (składowe oceny) czytają się jako
   JEDNA grupa, a przy odstępie 16 px rozjeżdżają się na trzy osobne bloki. */
.rig-grid.tight {
  gap: 10px;
}

.rig-grid.cols-2 {
  grid-template-columns: repeat(2, 1fr);
}

.rig-grid.cols-3 {
  grid-template-columns: repeat(3, 1fr);
}

.rig-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 18px;
}

/* Karta rozwijana (`<details class="rig-card">`): nagłówek musi WYGLĄDAĆ na klikalny, inaczej
   zwinięta karta wygląda na pustą. Reguła jest w komponencie, więc szablon nie nosi kursora
   w atrybucie – `.rig-formcard > summary` dokłada do tego krój i wagę nagłówka formularza. */
.rig-card > summary {
  cursor: pointer;
}

.rig-card.link {
  display: block;
  transition: border-color 0.12s, box-shadow 0.12s, transform 0.12s;
}

.rig-card.link:hover {
  border-color: var(--rig-300);
  box-shadow: 0 6px 20px -8px rgba(0, 60, 61, 0.18);
  transform: translateY(-1px);
}

/* Nadtytuł sekcji – klasa GLOBALNA (nie tylko w karcie), bo ten sam wzór występuje
   w nagłówkach ekranów i paskach filtrów; do audytu UX 2026-07-28 był powtarzany
   28 razy stylem w atrybucie `style`. */
.kicker {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--accent-700);
  margin-bottom: 7px;
}

/* Wariant wyciszony – ten sam nadtytuł kolorem tekstu drugorzędnego (etykiety metadanych,
   nagłówki pasków filtrów). JEDEN modyfikator zamiast wariantów ad hoc; specyficzność 0,2,0
   wygrywa z helperem `.muted` niezależnie od kolejności reguł w arkuszu. */
.kicker.muted {
  color: var(--muted);
}

.rig-card h3 {
  font-size: 15.5px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 6px;
}

.rig-card p {
  font-size: 12.5px;
  color: var(--muted);
  margin: 0;
  line-height: 1.5;
}

.rig-card .go {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--accent);
  margin-top: 12px;
  display: inline-flex;
  gap: 5px;
  align-items: center;
}

/* ---------- KPI ---------- */
.rig-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}

.rig-kpi {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 15px 17px;
}

/* Kafel KPI jako odnośnik (licznik → ekran z zawężeniem). Świadoma kopia komponentu
   z arkusza prototypu (ADR-025). Kafel nieklikalny zostaje <div> i wygląda tak samo. */
a.rig-kpi {
  display: block;
  color: inherit;
  text-decoration: none;
}

a.rig-kpi:hover {
  border-color: var(--accent);
}

/* Nota o czynnym zawężeniu listy (przyszliśmy z licznika) + odnośnik zdejmujący je. */
.rig-filternote {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 18px;
}

.rig-kpi .lab {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}

.rig-kpi .val {
  font-size: 30px;
  font-weight: 800;
  color: var(--accent);
  margin-top: 5px;
  line-height: 1;
  letter-spacing: -0.02em;
  font-family: "Manrope", "Inter", sans-serif;
}

.rig-kpi .hint {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 5px;
}

/* ---------- komponent listy (P0.1) ---------- */
.rig-list {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.rig-list-top {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.rig-list-top h2 {
  font-size: 15px;
  font-weight: 700;
}

.rig-list-top .count {
  font-size: 12.5px;
  color: var(--muted);
}

.rig-list-top .grow {
  flex: 1;
}

/* Treść opisowa (akapit-wprowadzenie, .hint) wstawiona bezpośrednio w kartę .rig-list
   dziedziczy wcięcie 16px nagłówka .rig-list-top – bez tego przykleja się do lewej
   krawędzi karty i łamie wyrównanie z nagłówkiem oraz z tekstem callouta poniżej.
   Tabele (.rig-tablewrap) i .rig-callout mają własny padding, więc tu nie wchodzą. */
.rig-list > p,
.rig-list > .hint {
  margin: 0 0 12px;
  padding: 0 16px;
}

.rig-search {
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 7px 12px;
  min-width: 220px;
  flex: 1;
  max-width: 360px;
  color: var(--muted);
  background: var(--white);
}

.rig-search:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-50);
}

.rig-search input {
  border: 0;
  outline: 0;
  font-size: 12.5px;
  width: 100%;
  color: var(--ink);
  background: transparent;
  font-family: inherit;
}

.rig-views {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 8px;
  padding: 6px 16px 0;
}

.rig-view {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
  padding: 7px 12px;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

/* Licznik przy zakładce widoku – stonowany i wyraźnie odsunięty od etykiety
   (gap) oraz od sąsiedniej zakładki. Szablony używają dwóch wariantów
   znacznika: <b> oraz <span class="muted">. Bez tej reguły bold <b> zlewał
   etykietę z liczbą w jeden ciąg (np. „Wszystkie15 Połączone7"). */
.rig-view b,
.rig-view .muted {
  font-weight: 600;
  color: var(--muted);
}

.rig-view:hover {
  color: var(--ink);
}

.rig-view.active {
  color: var(--accent-700);
  border-bottom-color: var(--accent);
}

.rig-view.active b,
.rig-view.active .muted {
  color: var(--accent-700);
}

.rig-view:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}

.rig-pillbar {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  padding: 11px 16px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.rig-pillf {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 9999px;
  padding: 4px 11px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.rig-pillf .n {
  color: var(--muted);
}

.rig-pillf:hover {
  border-color: var(--line-2);
}

.rig-pillf.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

.rig-pillf.active .n {
  color: rgba(255, 255, 255, 0.82);
}

.rig-pillf:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Wiersz filtrów kategorii (facety). Ekran Integracje renderuje spany
   .rig-filter, które nie miały ŻADNYCH reguł w warstwie app – etykiety
   i liczniki zlewały się w jeden ciąg tekstu inline
   („Wszystkie kategorie 15 Tożsamość (IdP) 2 Chmura 3 …"). Ten sam wygląd
   pigułek co .rig-pillbar/.rig-pillf – jeden spójny wzorzec filtrów w całej
   platformie (Aktywa, Dostawcy itd. używają .rig-pillf). */
.rig-filters {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  padding: 11px 16px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.rig-filter {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 9999px;
  padding: 4px 11px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.rig-filter b {
  font-weight: 600;
  color: var(--muted);
}

.rig-filter:hover {
  border-color: var(--line-2);
}

.rig-filter.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

.rig-filter.active b {
  color: rgba(255, 255, 255, 0.82);
}

.rig-filter:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Wrapper tabeli listy: karta .rig-list tnie nadmiar (overflow: hidden dla
   zaokrągleń), więc tabela szersza niż karta – np. Dowody na wąskim oknie –
   scrolluje się poziomo we własnym kontenerze zamiast być ucinana. Gdy tabela
   mieści się w karcie, pasek nie występuje (auto). */
.rig-tablewrap {
  overflow-x: auto;
}

/* Wariant z własną ramką – dla tabeli, która NIE siedzi w karcie `.rig-list` ani `.rig-card`.
   Bez ramki przewijana poziomo tabela nie ma widocznej krawędzi i pasek przewijania wygląda
   na pasek całej strony. */
.rig-tablewrap.framed {
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

/* .rig-table – alias klasy tabeli. 18 użyć w szablonach nis2/policy nosi klasę
   .rig-table, dla której nie było żadnej reguły (brak globalnego resetu
   table/th/td), więc kolumny renderowały się bez paddingu, nagłówka i linii –
   wartości i nagłówki zlewały się poziomo. Alias daje im pełny wygląd .rig-tbl
   bez zmian w znacznikach (kanoniczną klasą pozostaje .rig-tbl). */
table.rig-tbl,
table.rig-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.rig-tbl thead th,
.rig-table thead th {
  text-align: left;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
  white-space: nowrap;
}

.rig-tbl tbody td,
.rig-table tbody td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-2);
  vertical-align: middle;
}

.rig-tbl tbody tr:last-child td,
.rig-table tbody tr:last-child td {
  border-bottom: 0;
}

.rig-tbl tbody tr.clickable:hover,
.rig-table tbody tr.clickable:hover {
  background: #fbfcfe;
  cursor: pointer;
}

.rig-tbl .nm {
  font-weight: 600;
  color: var(--ink);
}

.rig-tbl .sub {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 1px;
}

.rig-tbl .docnr {
  font-variant-numeric: tabular-nums;
  font-size: 11px;
  font-weight: 700;
  color: var(--accent-700);
  letter-spacing: 0.02em;
}

/*
  ---------- .rig-dense – SIATKA GĘSTYCH DANYCH (ADR-130 decyzja 1) ----------

  NAZWA: plan toru C mówił `.rig-grid` – ta klasa jest ZAJĘTA od dawna (siatka kart, 116 użyć
  w szablonach, reguła wyżej w tym pliku) i znaczy zupełnie co innego: układ CSS grid, nie tabelę.
  Stąd `.rig-dense` – nazywa cechę, która ten komponent odróżnia, i nie da się jej pomylić
  z pomocnikiem układu.

  Komponent OBOK `.rig-tbl`, nie zamiast. Wybór jest mechaniczny, nie kwestią gustu:
  rejestr administracyjny do ~8 kolumn zostaje `.rig-tbl` (odstęp 12 × 14, treść się zawija,
  linie tylko poziome); siatka analizy o kilkunastu i więcej kolumnach dostaje `.rig-dense`.

  Przy trzydziestu kolumnach `.rig-tbl` daje LISTĘ, nie siatkę – wiersz nie czyta się w poprzek,
  bo nie ma czym oddzielić kolumny od kolumny. Odwzorowanie `table.t` z makiet trybu klasycznego
  (`docs/prototypes/tryb-klasyczny/_shared.css`): świadoma kopia z ADR-025 decyzja 3.

  Strefy ryzyka bierze z `.pill.lvl-*` i NIE definiuje własnych kolorów (ADR-130 decyzja 4) –
  dwie palety tego samego znaczenia rozjeżdżają się przy pierwszej korekcie odcienia.
  Pilnuje tego `GridPaletteConventionTest`.
*/
table.rig-dense {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.7px;
}

.rig-dense th,
.rig-dense td {
  padding: 7px 9px;
  text-align: left;
  vertical-align: middle;
  /* Bez zawijania: przy trzydziestu kolumnach jedna długa treść rozpycha wiersz na trzy linie
     i siatka przestaje być siatką. Zawijanie na żądanie – klasa `.wrap` na tabeli. */
  white-space: nowrap;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
}

/* Nagłówek bez WERSALIKÓW i w kolorze tekstu, inaczej niż w `.rig-tbl`: nazwa kolumny siatki
   jest treścią do przeczytania („Prawdopodobieństwo – dostępność"), nie etykietą sekcji. */
.rig-dense thead th {
  background: var(--bg-2);
  color: var(--ink);
  font-weight: 600;
  font-size: 12.2px;
  text-transform: none;
  letter-spacing: 0;
  position: relative;
}

/* Wiersz nagłówków GRUPUJĄCY obszary (np. „Prawdopodobieństwo" nad pięcioma atrybutami). */
.rig-dense thead tr.rig-dense-sec th {
  background: var(--accent-50);
  color: var(--accent-700);
  text-align: center;
  font-family: "Manrope", "Inter", sans-serif;
}

.rig-dense tbody tr:nth-child(even) {
  background: var(--bg-2);
}

.rig-dense tbody tr:hover {
  background: var(--rig-50);
}

.rig-dense tbody tr:last-child td {
  border-bottom: 0;
}

/* Przyklejona kolumna nazwy – bez niej przewinięcie w poprzek gubi to, CZEGO dotyczy wiersz.
   Cień zamiast obramowania, bo obramowanie przyklejonej komórki znika przy przewijaniu. */
.rig-dense .stick {
  position: sticky;
  left: 0;
  z-index: 2;
  background: #fff;
  box-shadow: 1px 0 0 var(--line);
}

.rig-dense tbody tr:nth-child(even) .stick {
  background: var(--bg-2);
}

/* Kolumna liczbowa: cyfry o równej szerokości, żeby wartości układały się w pion. */
.rig-dense .num {
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.rig-dense.wrap th,
.rig-dense.wrap td {
  white-space: normal;
}

/* Brak danych: „N/D" (decyzja Przemka z 2026-08-02) odróżnialne od wartości, ale nie krzyczące. */
.rig-dense .nd {
  font-size: 11px;
  color: var(--muted);
  background: var(--grey-bg);
  padding: 2px 6px;
  border-radius: 4px;
}

.rig-rowlink {
  color: var(--ink);
  text-decoration: none;
}

.rig-rowlink:hover {
  color: var(--accent-700);
  text-decoration: underline;
}

.rig-rowact {
  display: flex;
  align-items: center;
  gap: 4px;
  justify-content: flex-end;
}

.rig-iconbtn {
  width: 28px;
  height: 28px;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
}

.rig-iconbtn:hover {
  background: var(--grey-bg);
  color: var(--ink);
}

/* ---------- pigułki: STATUS (z kropką) vs KATEGORIA (neutralna, bez kropki) ---------- */
.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 600;
  border-radius: 9999px;
  padding: 3px 9px;
  line-height: 1.5;
  /* Pigułka nigdy się nie łamie: dwuwyrazowe statusy („Nie zadeklarowano",
     „Do zrobienia") rozpadały się na dwie linie i rozciągały wiersz tabeli
     (audyt UX 2026-07-28: SoA, NIS2). */
  white-space: nowrap;
}

/* Pigułka DOSTAWIONA za zdaniem albo za nazwą (a nie stojąca w kolumnie stanu) – odstęp,
   bez którego przykleja się do ostatniej litery. Jedna wartość dla wszystkich takich miejsc:
   szablony niosły w atrybucie raz 6, raz 8 px. */
.pill.after-text {
  margin-left: 6px;
}

.pill::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  background: currentColor;
  flex: none;
}

.pill.ok {
  background: var(--ok-bg);
  color: var(--ok);
}

.pill.warn {
  background: var(--warn-bg);
  color: var(--warn);
}

.pill.info {
  background: var(--info-bg);
  color: var(--info);
}

.pill.danger {
  background: var(--danger-bg);
  color: var(--danger);
}

.pill.accent {
  background: var(--accent-50);
  color: var(--accent-700);
}

/* kategoria/typ = neutralny szary, BEZ kropki (kluczowa redukcja kolorowości) */
.pill.cat {
  background: var(--grey-bg);
  color: var(--grey);
}

.pill.cat::before {
  display: none;
}

/* „Wkrótce" (planned) — dostępność katalogowa przed konfiguracją: ton stonowany
   (neutralny, NIE zielony/czerwony), kropka wyciszona, by odróżnić od „Dostępny". */
.pill.muted {
  background: var(--grey-bg);
  color: var(--muted);
}

.pill.muted::before {
  opacity: 0.5;
}

/* poziom ryzyka — 4-klasowa paleta marki (teal → zielony → złoty → bordowy) */
.pill.lvl-low {
  background: #e4f0ee;
  color: #1e5854;
}

.pill.lvl-med {
  background: #e9f3ec;
  color: #3c7b51;
}

.pill.lvl-high {
  background: #fcf3d6;
  color: #8a6d08;
}

.pill.lvl-crit {
  background: #f6e1e7;
  color: #8e1b38;
}

/* ---------- pasek akceptacji / postępu (jeden akcent) ---------- */
.rig-meter {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 130px;
}

.rig-meter .bar {
  flex: 1;
  height: 6px;
  border-radius: 9999px;
  background: var(--grey-bg);
  overflow: hidden;
}

.rig-meter .bar i {
  display: block;
  height: 100%;
  border-radius: 9999px;
  background: var(--accent);
}

.rig-meter .bar i.warn {
  background: var(--warn);
}

/* Dowód po terminie ważności (ADR-150) – czerwień oddziela „minęło" od „zbliża się". */
.rig-meter .bar i.danger {
  background: var(--danger);
}

.rig-meter .pct {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* ---------- callout / panel pomocy ---------- */
.rig-callout {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: var(--radius-lg);
  padding: 13px 15px;
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.55;
  box-shadow: var(--shadow);
}

.rig-callout.info {
  background: var(--accent-50);
  border-color: var(--accent-100);
  color: #0b4a48;
}

.rig-callout.warn {
  background: var(--warn-bg);
  border-color: #f6dcae;
  color: #7a3a06;
}

.rig-callout.danger {
  background: var(--danger-bg);
  border-color: #f3c9c9;
  color: #7f1d1d;
}

.rig-callout h4 {
  margin: 0 0 5px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
}

/* ---------- taby (P0.4: głębia przez taby) ---------- */
.rig-tabs {
  display: flex;
  gap: 2px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 16px;
}

/* Grupa `role="tablist"` wewnątrz paska: obejmuje same zakładki-przyciski (bez linków na inne
   ekrany – patrz komentarz w module/organization/_tabs.html.twig). `display: contents` zdejmuje
   jej pudełko, więc przyciski pozostają bezpośrednimi elementami rzędu flex i pasek wygląda
   tak samo, a drzewo dostępności ma poprawną strukturę tablist → tab. */
.rig-tabs-group {
  display: contents;
}

.rig-tab {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  padding: 8px 14px;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  background: none;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  font-family: inherit;
}

.rig-tab:hover {
  color: var(--ink);
}

.rig-tab.active {
  color: var(--accent-700);
  border-bottom-color: var(--accent);
}

.rig-tab-n {
  margin-left: 6px;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
  font-weight: 700;
}

.rig-tab.active .rig-tab-n {
  color: var(--accent-700);
}

/* Widoczność paneli steruje kontroler `tabs` przez inline style.display
   (nieaktywne startują z style="display:none" w szablonie) — bez reguły CSS,
   która nadpisywałaby inline display="" ustawiane przez kontroler. */
/* ---------- panel szczegółów (drawer, P0.4) ---------- */
.rig-drawer-bd {
  position: fixed;
  inset: 0;
  background: rgba(13, 20, 25, 0.38);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s;
  z-index: 40;
}

.rig-drawer-bd.open {
  opacity: 1;
  pointer-events: auto;
}

.rig-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: min(460px, 92vw);
  background: #fff;
  transform: translateX(100%);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  z-index: 50;
  display: flex;
  flex-direction: column;
}

/* Cień tylko na otwartym panelu — inaczej kilkanaście schowanych drawerów
   (translateX(100%)) nakłada swoje cienie i przecieka ciemną smugą na prawą krawędź. */
.rig-drawer.open {
  transform: translateX(0);
  box-shadow: -12px 0 40px -16px rgba(0, 0, 0, 0.35);
}

.rig-drawer-h {
  padding: 15px 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.rig-drawer-h h3 {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  margin: 0;
}

.rig-drawer-h .sub {
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

.rig-drawer-b {
  padding: 16px 18px;
  overflow-y: auto;
  flex: 1;
}

/* ---------- timeline (historia) ---------- */
.rig-tl {
  position: relative;
  padding-left: 20px;
  margin: 0;
}

.rig-tl::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 4px;
  bottom: 4px;
  width: 2px;
  background: var(--line);
}

.rig-tl li {
  position: relative;
  list-style: none;
  padding: 0 0 14px;
}

.rig-tl li::before {
  content: "";
  position: absolute;
  left: -18px;
  top: 3px;
  width: 10px;
  height: 10px;
  border-radius: 9999px;
  background: var(--rig-400);
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px var(--rig-200);
}

.rig-tl .t {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
}

.rig-tl .m {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 1px;
}

/* ---------- before/after ---------- */
.rig-ba {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.rig-ba .col {
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  overflow: hidden;
  background: #fff;
}

.rig-ba .col .h {
  padding: 8px 14px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.rig-ba .col.before .h {
  background: var(--danger-bg);
  color: var(--danger);
  border-bottom: 1px solid var(--danger-bg);
}

.rig-ba .col.after .h {
  background: var(--ok-bg);
  color: var(--ok);
  border-bottom: 1px solid var(--ok-bg);
}

.rig-ba .col .bd {
  padding: 14px;
}

/* ---------- chipy (klauzule, drobne tagi neutralne) ---------- */
.rig-tags {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}

.rig-tag {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1px 6px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.rig-tag.more {
  color: var(--muted);
  background: transparent;
  border-style: dashed;
}

/* ---------- lista klikalnych powiązań (drawer, blok 'links') ---------- */
.rig-linklist {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rig-linklist li {
  margin-bottom: 4px;
}

.rig-linklist li:last-child {
  margin-bottom: 0;
}

/* Wiersz BEZ odnośnika (np. pozycja informacyjna w szynie dostawców albo w rejestrze S46)
   dostaje te same metryki co wiersz z odnośnikiem. Bez tego `.t` i `.n` sklejały się
   w jeden ciąg („T+3E-mail…", audyt UX 2026-07-28), a wiersz zgniatał się do wysokości tekstu. */
.rig-linklist a,
.rig-linklist li:not(:has(> a)) {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 500;
  text-decoration: none;
}

.rig-linklist a:hover {
  background: var(--bg-2);
  border-color: var(--line-2);
}

.rig-linklist .t {
  flex: 1;
  min-width: 0;
}

.rig-linklist .n {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.rig-linklist .arr {
  width: 14px;
  height: 14px;
  color: var(--muted);
  flex: none;
}

/* ---------- lista klucz–wartość (panel szczegółów) ---------- */
.rig-kv {
  display: grid;
  grid-template-columns: minmax(96px, 38%) 1fr;
  gap: 9px 14px;
  margin: 0;
  font-size: 12.5px;
}

.rig-kv dt {
  color: var(--muted);
  font-weight: 600;
}

.rig-kv dd {
  margin: 0;
  color: var(--ink);
}

/* ---------- spis sekcji dokumentu (panel szczegółów) ---------- */
.rig-doclist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.rig-doclist li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
}

.rig-doclist li:last-child {
  border-bottom: 0;
}

.rig-doclist .num {
  color: var(--accent-700);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  flex: none;
  min-width: 26px;
}

.rig-doclist .t {
  color: var(--ink);
}

/* ---------- drobne sekcje w panelu (odstępy między tabami treści) ---------- */
.rig-drawer-b .blk {
  margin-bottom: 18px;
}

.rig-drawer-b .blk:last-child {
  margin-bottom: 0;
}

.rig-drawer-b .blk > h4 {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin: 0 0 9px;
}

.rig-drawer-h .docnr {
  margin-bottom: 3px;
}

/* ---------- helpers ---------- */
.muted {
  color: var(--muted);
}

/* Dwa mniejsze stopnie tekstu wyciszonego: `.sm` – dopisek przy nazwie („4 czynności"),
   `.xs` – podpis pod wykresem, gdzie nie ma miejsca na nic większego. Modyfikator stoi
   przy komponencie, a nie w arkuszu jednego modułu, bo `.muted` jest w użyciu we wszystkich. */
.muted.sm {
  font-size: 12px;
}

.muted.xs {
  font-size: 10.5px;
}

.mono {
  font-variant-numeric: tabular-nums;
}

.sec-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}

hr.rig {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 18px 0;
}

@media (max-width: 900px) {
  .rig-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .rig-grid.cols-2,
  .rig-grid.cols-3 {
    grid-template-columns: 1fr;
  }
  .rig-ba {
    grid-template-columns: 1fr;
  }
}
/* ============================================================
   _organigram.scss — diagram struktury organizacyjnej (Organizacja,
   zakładka „Diagram struktury organizacyjnej"). Widok TYLKO DO ODCZYTU
   wyprowadzony z działów (Struktura) i osób (Osoby).

   Dwa poziomy zależności: zarząd (kl. 5.1) → działy. Łączniki rysowane
   pseudo-elementami (klasyczny org-chart): działy w jednym, nieprzewijanym
   rzędzie; przy nadmiarze pojawia się poziome przewijanie (jak w realnych
   schematach organizacyjnych). Kolor niesie wyłącznie status.
   ============================================================ */
.org-chart {
  overflow-x: auto;
  padding: 4px 2px 6px;
}

.org-tier-lab {
  text-align: center;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 10px;
}

/* --- Poziom 0: zarząd --- */
.org-board {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.org-stem {
  width: 2px;
  height: 22px;
  background: var(--line-2);
  margin: 2px auto 0;
}

/* --- Poziom 1: działy (jeden rząd, łączniki) --- */
.org-units {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  justify-content: center;
  min-width: max-content;
}

.org-unit {
  position: relative;
  padding-top: 20px;
  width: 218px;
  flex: none;
}

/* pionowy odcinek od szyny do karty działu */
.org-unit::before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(50% - 1px);
  width: 2px;
  height: 20px;
  background: var(--line-2);
}

/* pozioma szyna nad rzędem działów */
.org-unit::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--line-2);
}

.org-unit:first-child::after {
  left: calc(50% - 1px);
}

.org-unit:last-child::after {
  right: calc(50% - 1px);
}

.org-box {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--white);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.org-unit-h {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 11px;
  background: var(--bg-2);
  border-bottom: 1px solid var(--line);
}

.org-unit-code {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--accent-700);
  background: var(--accent-50);
  border-radius: 4px;
  padding: 2px 6px;
  flex: none;
}

.org-unit-name {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
  flex: 1;
  min-width: 0;
}

.org-unit-n {
  font-size: 11.5px;
  font-weight: 700;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  flex: none;
}

.org-unit-lead {
  font-size: 11.5px;
  color: var(--ink-2);
  padding: 7px 11px;
  border-bottom: 1px solid var(--line);
}
.org-unit-lead strong {
  color: var(--ink);
  font-weight: 600;
}
.org-unit-lead.none {
  color: var(--warn);
}

.org-unit-people {
  padding: 4px 6px 6px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.org-empty {
  font-size: 11.5px;
  color: var(--muted);
  padding: 8px 6px;
}

/* --- Węzeł osoby (wiersz w dziale) --- */
.org-node {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px;
  border-radius: var(--radius);
}
.org-node:hover {
  background: var(--bg-2);
}
.org-node.inactive {
  opacity: 0.6;
}

/* --- Karta osoby (zarząd) --- */
.org-person {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 240px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--white);
  box-shadow: var(--shadow);
}
.org-person .org-meta {
  flex: 1;
  min-width: 0;
}
.org-person.inactive {
  opacity: 0.6;
}

/* awatar / inicjały */
.org-ini {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 12.5px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.org-ini.sm {
  width: 26px;
  height: 26px;
  font-size: 10.5px;
  background: var(--grey-bg);
  color: var(--grey);
}

.org-name {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.3;
}

.org-node-meta {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.org-node-meta .org-name {
  font-size: 12px;
  font-weight: 600;
}

.org-pos {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.3;
}

/* poziom dostępu RIG (R1–R4) — neutralny znacznik */
.org-rig {
  font-size: 10px;
  font-weight: 700;
  color: var(--grey);
  background: var(--grey-bg);
  border-radius: 4px;
  padding: 2px 5px;
  flex: none;
  font-variant-numeric: tabular-nums;
}

.org-lead-tag {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--accent-700);
  background: var(--accent-50);
  border-radius: 4px;
  padding: 1px 5px;
  margin-left: 4px;
}

.org-off {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--warn);
  background: var(--warn-bg);
  border-radius: 4px;
  padding: 1px 5px;
  margin-left: 4px;
}

/* --- Osoby bez przypisania do działu --- */
.org-orphans {
  margin-top: 18px;
  border: 1px dashed var(--line-2);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.org-orphans .org-unit-h {
  background: var(--warn-bg);
  border-bottom-color: var(--line);
}
.org-orphans .org-unit-name {
  color: var(--warn);
}

.org-orphan-list {
  padding: 6px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 2px;
}

/* ============================================================
   Diagram w kontekście (ADR-045): dwa widoki + drzewo wielopoziomowe.
   Klasy przeniesione z zatwierdzonego prototypu
   docs/prototypes/organizacja-diagram-w-kontekscie.html na zmienne rig-*.
   Łączniki drzewa rysowane pseudo-elementami zagnieżdżonych <ul>.
   ============================================================ */
/* --- przełącznik widoków --- */
.org-viewbar {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 4px 0 0;
}

.org-seg {
  display: inline-flex;
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 3px;
}
.org-seg button {
  border: 0;
  background: transparent;
  font: inherit;
  font-weight: 600;
  font-size: 12.5px;
  color: var(--ink-2);
  padding: 7px 15px;
  border-radius: 999px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
}
.org-seg button.on {
  background: var(--white);
  color: var(--accent-700);
  box-shadow: var(--shadow);
}
.org-seg svg {
  width: 15px;
  height: 15px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}

.org-view-hint {
  font-size: 12px;
  color: var(--muted);
  max-width: 64ch;
}
.org-view-hint.hidden {
  display: none;
}

/* --- pojemniki widoków --- */
.org-diagram-wrap {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--bg-2);
  margin-top: 12px;
}
.org-diagram-wrap.hidden {
  display: none;
}

.org-diagram {
  padding: 22px 18px 26px;
  overflow-x: auto;
}

.org-forest {
  display: flex;
  gap: 40px;
  justify-content: center;
  min-width: max-content;
}

/* --- drzewo (łączniki pseudo-elementami) --- */
.org-tree,
.org-tree ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.org-tree {
  min-width: max-content;
  display: flex;
  justify-content: center;
}

.org-tree ul {
  display: flex;
  justify-content: center;
  padding-top: 22px;
  position: relative;
}

.org-tree li {
  position: relative;
  padding: 22px 9px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.org-tree li::before,
.org-tree li::after {
  content: "";
  position: absolute;
  top: 0;
  width: 50%;
  height: 22px;
  border-top: 2px solid var(--line-2);
}

.org-tree li::before {
  right: 50%;
  border-right: 2px solid var(--line-2);
}

.org-tree li::after {
  left: 50%;
}

.org-tree li:only-child::before,
.org-tree li:only-child::after {
  display: none;
}

.org-tree li:first-child::before {
  border: 0;
}

.org-tree li:last-child::after {
  border: 0;
}

.org-tree li:last-child::before {
  border-right: 2px solid var(--line-2);
}

.org-tree ul::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 22px;
  background: var(--line-2);
}

.org-tree > li {
  padding-top: 0;
}

.org-tree > li > ul {
  padding-top: 0;
}

.org-tree li.collapsed > ul {
  display: none;
}

.org-node-toggle {
  position: absolute;
  bottom: -11px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid var(--line-2);
  background: var(--white);
  color: var(--ink-2);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow);
}
.org-node-toggle:hover {
  border-color: var(--accent);
  color: var(--accent-700);
}

/* --- karta działu w drzewie --- */
.org-ucard {
  position: relative;
  width: 230px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--white);
  box-shadow: var(--shadow);
  overflow: hidden;
  text-align: left;
}

.org-people-toggle {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent-700);
  padding: 7px 11px;
  cursor: pointer;
}
.org-people-toggle:hover {
  background: var(--bg-2);
}

.org-people {
  padding: 2px 6px 6px;
  display: none;
  flex-direction: column;
  gap: 2px;
  max-height: 230px;
  overflow-y: auto;
}
.org-people.open {
  display: flex;
}

/* --- węzeł-organ zarządzający (board) w drzewie --- */
.org-board-node {
  width: auto;
  min-width: 260px;
}
.org-board-node .org-unit-h {
  background: var(--accent-50);
}

.org-board-members {
  padding: 8px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.org-mb {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 220px;
  padding: 6px 4px;
}
.org-mb .org-ini {
  width: 34px;
  height: 34px;
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 12px;
}

/* --- karta osoby w linii raportowania --- */
.org-rcard {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 236px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--white);
  box-shadow: var(--shadow);
  text-align: left;
}
.org-rcard.top {
  border-color: var(--accent-50);
  background: linear-gradient(0deg, var(--white), var(--accent-50));
}
.org-rcard.inactive {
  opacity: 0.6;
}
.org-rcard .org-ini {
  width: 34px;
  height: 34px;
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 11px;
}

.org-rdept {
  font-size: 9px;
  font-weight: 700;
  color: var(--grey);
  background: var(--grey-bg);
  border-radius: 4px;
  padding: 1px 6px;
  margin-top: 3px;
  display: inline-block;
  width: fit-content;
}

.org-rcount {
  font-size: 9px;
  font-weight: 700;
  color: var(--accent-700);
  margin-left: 6px;
}

/* --- notka nadzoru (NIS2 art. 20 / A.5.3) + legenda --- */
.org-gov-note {
  margin: 16px auto 0;
  max-width: 680px;
  border: 1px dashed var(--warn);
  background: var(--warn-bg);
  border-radius: var(--radius-lg);
  padding: 10px 13px;
  font-size: 11.5px;
  color: var(--warn);
  display: flex;
  gap: 9px;
  align-items: flex-start;
}
.org-gov-note svg {
  width: 16px;
  height: 16px;
  flex: none;
  margin-top: 1px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}

.org-legend {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 11.5px;
  color: var(--ink-2);
  margin-top: 16px;
  padding: 14px 8px 2px;
  border-top: 1px solid var(--line);
}
.org-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.org-legend .muted {
  color: var(--muted);
}

.org-swatch {
  width: 22px;
  height: 0;
  border-top: 2px solid var(--line-2);
}
.org-swatch.dashed {
  border-top: 2px dashed var(--warn);
}

/* ============================================================
   _screens.scss — komponenty specyficzne dla ekranów (dosypywane fazami).
   Faza 0: placeholder „Ekran w przygotowaniu", panel przewodnika (§12.3),
   spec-badges (?spec=1). Hero/PDCA/method-tabs/audit-nav/wizard → Fazy 1–4.
   ============================================================ */
/* ---------- placeholder „Ekran w przygotowaniu" (Faza 0) ---------- */
.rig-empty {
  background: #fff;
  border: 1px dashed var(--line-2);
  border-radius: var(--radius-lg);
  padding: 48px 32px;
  text-align: center;
  box-shadow: var(--shadow);
}

.rig-empty .ic {
  width: 48px;
  height: 48px;
  margin: 0 auto 14px;
  border-radius: var(--radius-lg);
  background: var(--accent-50);
  color: var(--accent);
  display: grid;
  place-items: center;
}

.rig-empty .ic svg {
  width: 24px;
  height: 24px;
}

.rig-empty h2 {
  font-size: 17px;
  font-weight: 800;
  color: var(--ink);
}

.rig-empty p {
  font-size: 13px;
  color: var(--muted);
  margin: 8px auto 0;
  max-width: 56ch;
  line-height: 1.55;
}

.rig-empty .meta {
  margin-top: 16px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  color: var(--ink-2);
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 9999px;
  padding: 5px 13px;
}

/* ---------- band PDCA „Droga do certyfikacji" ---------- */
.rig-journey-head {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 18px 20px;
  margin-bottom: 18px;
}

.rig-journey-head .big {
  display: flex;
  flex-direction: column;
}

.rig-journey-head .big .val {
  font-family: "Manrope", "Inter", sans-serif;
  font-weight: 800;
  font-size: 38px;
  line-height: 1;
  color: var(--accent);
  letter-spacing: -0.02em;
}

.rig-journey-head .big .lab {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 4px;
}

.rig-journey-head .mid {
  flex: 1;
  min-width: 200px;
}

.rig-journey-head .mid .stage {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 8px;
}

.rig-journey-head .facts {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--ink-2);
}

.rig-journey-head .facts .muted {
  color: var(--muted);
}

.rig-pdca {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}

.rig-phase {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 14px;
}

.rig-phase.active {
  border-color: var(--rig-300);
  box-shadow: 0 0 0 1px var(--rig-200), var(--shadow);
}

.rig-phase .ph-h {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 10px;
}

.rig-phase .ph-h .lab {
  font-family: "Manrope", "Inter", sans-serif;
  font-weight: 800;
  font-size: 15px;
  color: var(--ink);
}

.rig-phase.active .ph-h .lab {
  color: var(--accent-700);
}

.rig-phase .ph-h .sub {
  font-size: 10.5px;
  color: var(--muted);
}

.rig-steps {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.rig-step {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 7px 7px;
  border-radius: var(--radius);
}

.rig-step .no {
  width: 22px;
  height: 22px;
  border-radius: 9999px;
  display: grid;
  place-items: center;
  flex: none;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid var(--line-2);
  color: var(--muted);
  background: #fff;
  font-variant-numeric: tabular-nums;
  margin-top: 1px;
}

.rig-step .no svg {
  width: 12px;
  height: 12px;
}

.rig-step .txt {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.rig-step .lab {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
}

.rig-step .dsc {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.4;
  margin-top: 2px;
}

.rig-step.done .no {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.rig-step.done .lab {
  color: var(--ink);
}

.rig-step.active {
  background: var(--accent-50);
}

.rig-step.active .no {
  border-color: var(--accent);
  color: var(--accent-700);
  box-shadow: 0 0 0 3px var(--accent-100);
}

.rig-step.active .lab {
  color: var(--accent-700);
  font-weight: 600;
}

.rig-step.is-link {
  text-decoration: none;
  cursor: pointer;
  transition: background 0.12s;
}

.rig-step.is-link:hover {
  background: var(--bg);
}

.rig-step.active.is-link:hover {
  background: var(--accent-100);
}

.rig-step .go-ic {
  width: 13px;
  height: 13px;
  margin-left: auto;
  align-self: center;
  flex: none;
  color: var(--muted);
  opacity: 0;
  transition: opacity 0.12s;
}

.rig-step.is-link:hover .go-ic {
  opacity: 1;
}

/* spis modułów etapu zbiorczego (Mechanizmy) — zawsze widoczny pod etapem */
.rig-substeps {
  margin: 0 0 4px 18px;
  padding: 2px 0 2px 13px;
  border-left: 1.5px solid var(--accent-100);
  display: flex;
  flex-direction: column;
}

.rig-substep {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: var(--radius);
  text-decoration: none;
  color: inherit;
  transition: background 0.12s;
}

.rig-substep:hover {
  background: var(--bg);
}

.rig-substep .lab {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
}

.rig-substep svg {
  width: 12px;
  height: 12px;
  margin-left: auto;
  flex: none;
  color: var(--muted);
}

.rig-substep:hover .lab,
.rig-substep:hover svg {
  color: var(--accent-700);
}

/* ---------- karty „co teraz" (Droga) ---------- */
.rig-now {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.rig-now .rig-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rig-now .rig-card .meta {
  font-size: 11px;
  color: var(--muted);
}

.rig-now .rig-card h3 {
  font-size: 14px;
  font-weight: 700;
}

/* ---------- karty frameworków (ekran Frameworki) ---------- */
/* cała karta = link: zachowaj układ flex (pokonuje display:block z .rig-card.link) */
.fw-card,
a.fw-card.link {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

a.fw-card {
  color: inherit;
  text-decoration: none;
}

a.fw-card .go {
  margin-top: 4px;
}

.fw-top {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.fw-top h3 {
  flex: 1;
  min-width: 0;
  font-size: 15.5px;
  font-weight: 700;
}

.fw-top h3 .fw-wip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  vertical-align: middle;
  margin-left: 6px;
  font-size: 10px;
  font-weight: 700;
  color: var(--sb-wip);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.fw-top h3 .fw-wip i {
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  background: var(--sb-wip);
  box-shadow: 0 0 0 3px rgba(227, 160, 8, 0.18);
  display: inline-block;
  flex: none;
}

.fw-sub {
  font-size: 12px;
  color: var(--ink-2);
  font-weight: 600;
  margin-top: -3px;
}

.fw-card p {
  margin: 0;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
}

.fw-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 9px;
  border-top: 1px solid var(--line);
  font-size: 11.5px;
  color: var(--muted);
}

.fw-prog {
  color: var(--accent-700);
  font-weight: 700;
  white-space: nowrap;
}

/* framework monitorowany (nie włączony teraz) — wygaszony, czyta się jako „off";
   pełna czytelność dopiero przy najechaniu (karta wciąż klikalna → profil) */
.fw-card--off {
  opacity: 0.62;
}

.fw-card--off:hover,
.fw-card--off:focus-within {
  opacity: 1;
}

.fw-card--off .fw-prog {
  color: var(--muted);
}

/* ---------- macierz nakładających się wymagań ---------- */
.rig-matrix .theme {
  font-weight: 600;
  color: var(--ink);
}

.rig-matrix td.dash {
  color: var(--line-2);
}

/* ---------- Przegląd zarządzania: trendy (kl. 9.3.2 d) ---------- */
.rig-trends {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}

.rig-trend {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 14px;
}

.rig-trend .top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.rig-trend .top .lab {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink-2);
  line-height: 1.3;
}

.rig-trend .dir {
  font-size: 10.5px;
  font-weight: 700;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.rig-trend .dir svg {
  width: 11px;
  height: 11px;
}

.rig-trend .dir.good {
  color: var(--ok);
}

.rig-trend .dir.bad {
  color: var(--danger);
}

.rig-trend .val {
  font-family: "Manrope", "Inter", sans-serif;
  font-weight: 800;
  font-size: 26px;
  color: var(--ink);
  line-height: 1.1;
  margin-top: 8px;
}

.rig-trend .vsub {
  font-size: 11px;
  color: var(--muted);
}

.rig-trend .spark {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  height: 34px;
  margin-top: 10px;
}

.rig-trend .spark i {
  flex: 1;
  min-height: 2px;
  background: var(--rig-200);
  border-radius: 2px 2px 0 0;
}

.rig-trend .spark i.now {
  background: var(--accent);
}

.rig-trend .foot {
  font-size: 10.5px;
  color: var(--muted);
  margin-top: 8px;
  line-height: 1.4;
}

@media (max-width: 1100px) {
  .rig-trends {
    grid-template-columns: repeat(2, 1fr);
  }
}
/* ---------- lista norm dostępnych do dodania ---------- */
.fw-avail {
  display: flex;
  flex-direction: column;
}

.fw-avail-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.fw-avail-row:last-child {
  border-bottom: 0;
}

.fw-avail-row .code {
  font-weight: 700;
  color: var(--ink);
  font-size: 12.5px;
  min-width: 0;
}

.fw-avail-row .sub {
  font-size: 11.5px;
  color: var(--muted);
}

.fw-avail-row .grow {
  flex: 1;
}

.fw-avail-row .note {
  font-size: 11px;
  color: var(--warn);
}

/* ---------- panel przewodnika „Gdzie jestem?" (§12.3) ---------- */
.guide-panel {
  background: linear-gradient(135deg, var(--accent-50) 0%, var(--bg-2) 100%);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all 0.3s ease;
  margin-bottom: 18px;
}

.guide-panel.collapsed .guide-body {
  display: none;
}

.guide-panel.collapsed .guide-chevron {
  transform: rotate(0deg);
}

.guide-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  color: var(--accent-700);
}

.guide-chevron {
  margin-left: auto;
  transform: rotate(180deg);
  transition: transform 0.3s ease;
  color: var(--accent);
}

.guide-body {
  padding: 0 16px 14px;
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.55;
}

.guide-tips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.guide-tip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: var(--radius);
  background: #fff;
  border: 1px solid var(--line);
  font-size: 12px;
  color: var(--ink-2);
  font-weight: 500;
  transition: border-color 0.15s;
}

.guide-tip:hover {
  border-color: var(--accent-100);
}

/* ---------- spec-badges (?spec=1, §12.3) ---------- */
.spec-on [data-spec] {
  position: relative;
  outline: 1px dashed rgba(126, 34, 206, 0.55);
  outline-offset: 2px;
}

.spec-badge {
  position: absolute;
  top: -10px;
  left: -2px;
  z-index: 60;
  background: var(--proto-bar);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.4;
  padding: 1px 5px;
  border-radius: 4px;
  pointer-events: none;
}

.spec-hint {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 60;
  background: var(--proto-bar);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 7px 12px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

/* ============================================================
   Analiza luk (Compliance Engine) + Mechanizmy (hub) — etapy Drogi
   ============================================================ */
/* ---------- pasek cross-framework ---------- */
.xfw {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}

.xfw .fw {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 13px 15px;
  box-shadow: var(--shadow);
  text-decoration: none;
  color: inherit;
  display: block;
}

a.xfw .fw:hover,
a.fw:hover {
  border-color: var(--line-2);
}

.xfw .fw.lead {
  border-color: var(--accent-100);
  box-shadow: 0 0 0 1px var(--accent-100), var(--shadow);
}

.xfw .fw .nm {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
  display: flex;
  align-items: center;
  gap: 7px;
}

.xfw .fw .nm .tag {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: var(--accent-700);
  background: var(--accent-50);
  border-radius: 4px;
  padding: 1px 5px;
}

.xfw .fw .pc {
  font-size: 24px;
  font-weight: 800;
  font-family: "Manrope", "Inter", sans-serif;
  letter-spacing: -0.02em;
  margin: 6px 0 7px;
  line-height: 1;
}

.xfw .fw .pc.ok {
  color: var(--ok);
}

.xfw .fw .pc.warn {
  color: var(--warn);
}

.xfw .fw .pc.danger {
  color: var(--danger);
}

/* ---------- wiersz wymagania (klauzule 4–10) i hub (Mechanizmy) ---------- */
.gap-row,
.hub-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  color: inherit;
}

.gap-row:last-child,
.hub-row:last-child {
  border-bottom: 0;
}

.gap-row:hover,
.hub-row:hover {
  background: #fbfcfe;
}

.gap-row .cl,
.hub-row .cl {
  font-variant-numeric: tabular-nums;
  font-size: 11.5px;
  font-weight: 800;
  color: var(--accent-700);
  flex: none;
}

.gap-row .cl {
  width: 54px;
}

.hub-row .cl {
  width: 100px;
}

.gap-row .tx,
.hub-row .tx {
  flex: 1;
  min-width: 0;
}

.gap-row .tx .nm,
.hub-row .tx .nm {
  font-weight: 600;
  color: var(--ink);
  font-size: 13.5px;
}

.gap-row .tx .sub,
.hub-row .tx .sub {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 1px;
}

.gap-row .st {
  width: 116px;
  flex: none;
  display: flex;
  justify-content: flex-end;
}

.gap-row .drill,
.hub-row .to {
  flex: none;
  font-size: 12.5px;
  color: var(--accent);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 5px;
  justify-content: flex-end;
}

.gap-row .drill {
  width: 176px;
  white-space: nowrap;
}

/* CE-01/CE-02 (wzorzec #8): placeholder kolumny akcji — zajmuje miejsce (zachowuje
   szerokość), ale jest niewidoczny, gdy wiersz nie ma deep-linku. Wyrównuje prawą
   krawędź siatki flex niezależnie od tego, czy moduł docelowy istnieje w deployu. */
.gap-row .drill.drill--empty,
.hub-row .to.to--empty {
  visibility: hidden;
}

.gap-row .drill svg,
.hub-row .to svg {
  width: 13px;
  height: 13px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ---------- kafle motywów Załącznika A ---------- */
.themes {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.theme {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 14px 15px;
  box-shadow: var(--shadow);
  text-decoration: none;
  color: inherit;
  display: block;
}

.theme:hover {
  border-color: var(--line-2);
}

.theme .hd {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.theme .hd .ax {
  font-size: 11px;
  font-weight: 800;
  color: var(--accent-700);
}

.theme .hd .ct {
  font-size: 11.5px;
  color: var(--muted);
}

.theme .nm {
  font-size: 13px;
  font-weight: 700;
  margin: 3px 0 10px;
  color: var(--ink);
}

.theme .seg {
  display: flex;
  height: 7px;
  border-radius: 9999px;
  overflow: hidden;
  background: var(--grey-bg);
}

.theme .seg i {
  height: 100%;
}

.theme .seg i.ok {
  background: var(--ok);
}

.theme .seg i.warn {
  background: var(--warn);
}

.theme .seg i.bad {
  background: var(--danger);
}

.theme .lg {
  display: flex;
  gap: 12px;
  margin-top: 9px;
  font-size: 11px;
  color: var(--muted);
  flex-wrap: wrap;
}

.theme .lg b {
  color: var(--ink);
}

/* nagłówek listy oddzielony od wierszy */
.rig-list-top.divided {
  border-bottom: 1px solid var(--line);
}

/* zakładka frameworka: kropka statusu + procent (pasek = przegląd cross-framework) */
.rig-tab .fwdot {
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  display: inline-block;
  margin-right: 7px;
  vertical-align: middle;
  background: var(--muted);
}

.rig-tab .fwdot.ok {
  background: var(--ok);
}

.rig-tab .fwdot.warn {
  background: var(--warn);
}

.rig-tab .fwdot.danger {
  background: var(--danger);
}

.rig-tab .fwpct {
  font-variant-numeric: tabular-nums;
  color: var(--muted);
  font-weight: 700;
}

.rig-tab.active .fwpct {
  color: var(--accent-700);
}

@media (max-width: 980px) {
  .xfw,
  .themes {
    grid-template-columns: repeat(2, 1fr);
  }
}
/* ============================================================
   Edycja Organizacji (osoby / role / działy) — formularze w drawerze
   ============================================================ */
.rig-flash {
  border-radius: var(--radius);
  padding: 10px 14px;
  font-size: 13px;
  margin-bottom: 14px;
  border: 1px solid;
}

.rig-flash.ok {
  background: var(--ok-bg);
  border-color: var(--ok);
  color: var(--ok);
}

.rig-flash.danger {
  background: var(--danger-bg);
  border-color: var(--danger);
  color: var(--danger);
}

.oe-rowact {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
}

.oe-rowact form {
  display: inline;
  margin: 0;
}

/* Pola formularza w drawerze edycji */
.oe-field {
  margin-bottom: 14px;
}

.oe-field > label {
  display: block;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 5px;
}

/* Lista typów jest KOMPLETNA wobec szablonów – pilnuje tego strażnik
   tests/Architecture/StyleFormControlCoverageTest. Typ pominięty tutaj renderuje się
   krojem i rozmiarem przeglądarki (mikroskopijne pole bez ramki), co audyt UX 2026-07-28
   wykrył na `number`, `datetime-local` i `tel`. Nowy typ w formularzu = wpis w tej liście. */
.oe-field input[type=text],
.oe-field input[type=email],
.oe-field input[type=password],
.oe-field input[type=date],
.oe-field input[type=datetime-local],
.oe-field input[type=number],
.oe-field input[type=tel],
.oe-field select,
.oe-field textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 8px 10px;
  font-size: 13px;
  color: var(--ink);
  background: #fff;
  font-family: inherit;
}

.oe-field input:focus,
.oe-field select:focus,
.oe-field textarea:focus {
  outline: 0;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-100);
}

.oe-field textarea {
  resize: vertical;
  min-height: 66px;
}

/* Kontrolka wyłączona MUSI wyglądać na wyłączoną (decyzja N7.2 z planu naprawczego UX):
   funkcja jeszcze niezapisywana zostaje na ekranie – wyszarzona, z kursorem „nie wolno"
   i informacją obok – zamiast udawać działające pole. Kolor nie jest jedynym nośnikiem:
   przy sekcji stoi callout „W przygotowaniu". */
.oe-field input:disabled,
.oe-field select:disabled,
.oe-field textarea:disabled {
  background: var(--grey-bg);
  color: var(--muted);
  border-color: var(--line);
  cursor: not-allowed;
}

.oe-field input:disabled::placeholder,
.oe-field textarea:disabled::placeholder {
  color: var(--muted);
  opacity: 0.7;
}

/* Ten sam wariant dla kontrolek wyboru w etykiecie (chipy kontroli, checkboxy zgód,
   checklisty kreatora): sam wyszarzony kwadracik jest za cichy – etykieta klikalna
   musi zgubić kursor „ręka" i zblednąć razem z kontrolką (N7.2). */
.oe-chip:has(input:disabled),
.oe-check:has(input:disabled),
.rig-check:has(input:disabled) {
  cursor: not-allowed;
  color: var(--muted);
  background: var(--grey-bg);
}

.oe-chip:has(input:disabled) {
  border-color: var(--line);
}

.oe-chip:has(input:disabled):hover {
  border-color: var(--line);
}

.oe-check:has(input:disabled),
.rig-check:has(input:disabled) {
  background: transparent;
}

.oe-field .hint {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 4px;
}

/* Nietknięta propozycja AI (ADR-086): dopóki oznaczenie stoi, treści NIKT nie zweryfikował.
   Pasek rysujemy cieniem wewnętrznym, nie `border-left` – ramka zmieniłaby szerokość i pole
   podskoczyłoby o 2 px w chwili wstawienia propozycji, co wygląda na usterkę. Kolor nie jest
   jedynym nośnikiem: przy etykiecie stoi plakietka „Propozycja AI" (`.pill.accent`), stąd tu
   wyłącznie tło i pasek.

   JEDNA deklaracja wyglądu na WSZYSTKIE miejsca podpowiedzi: pola formularzy rejestrów
   (`.oe-field`) i sekcję dokumentu SZBI (`.ed-body`, treść w `contenteditable`). Selektor sekcji
   niesie `.ed-sec`, bo `.ed-sec.editing .ed-body` ustawia własne tło – a propozycja wstawia się
   dokładnie w trybie edycji, więc bez tego członu oznaczenie byłoby niewidoczne właśnie wtedy,
   kiedy jest potrzebne. */
.oe-field input.is-ai-suggested,
.oe-field textarea.is-ai-suggested,
.ed-sec .ed-body.is-ai-suggested {
  background: var(--accent-50);
  box-shadow: inset 3px 0 0 var(--accent);
}

/* Fokus dokłada obwódkę do paska, a nie zamiast niego – `box-shadow` nie kumuluje się
   między regułami, więc oba cienie muszą stać w jednej deklaracji. */
.oe-field input.is-ai-suggested:focus,
.oe-field textarea.is-ai-suggested:focus {
  box-shadow: inset 3px 0 0 var(--accent), 0 0 0 3px var(--accent-100);
}

/* Ta sama zasada w sekcji dokumentu: oznaczenie NIE może zabrać obwódki „tę sekcję można
   pisać" (`.ed-body[contenteditable="true"]`), więc oba cienie stoją w jednej deklaracji. */
.ed-sec .ed-body.is-ai-suggested[contenteditable=true] {
  box-shadow: inset 3px 0 0 var(--accent), inset 0 0 0 1px var(--accent-100);
}

/* Linia stanu podpowiedzi AI: komunikat i „Cofnij" w jednym wierszu pod polem. */
.rig-ai-line {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

/* Status podpowiedzi to region ogłaszany (role="status") – stoi w drzewie ZAWSZE, bo atrybut
   `hidden` wyjąłby go z drzewa dostępności i czytnik ekranu nie ogłosiłby komunikatu. Pusty
   stan chowamy tutaj; szablon renderuje element bez białych znaków w środku, inaczej `:empty`
   go nie złapie. */
.rig-ai-line .hint:empty,
.rig-ai-line .ed-ai-status:empty {
  display: none;
}

.rig-ai-undo {
  flex: none;
  margin-top: 4px;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--accent-700);
  text-decoration: underline;
  cursor: pointer;
}

.rig-ai-undo:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 3px;
}

.oe-grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.oe-scale {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.oe-scale-opt {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 34px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
}

.oe-scale-opt:hover {
  border-color: var(--accent);
}

.oe-scale-opt input {
  position: absolute;
  opacity: 0;
  inset: 0;
  margin: 0;
  cursor: pointer;
}

.oe-scale-opt:has(input:checked) {
  background: var(--accent-50);
  border-color: var(--accent);
  color: var(--accent-700);
}

.oe-scale-opt:has(input:focus-visible) {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.oe-scale-ends {
  display: inline-flex;
  flex-direction: column;
  gap: 1px;
  margin-left: 8px;
}

.oe-scale-ends em {
  font-style: normal;
  font-size: 10.5px;
  color: var(--muted);
  line-height: 1.3;
}

.map-rows {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 2px 0 10px;
}

.map-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

.map-row select {
  flex: 0 0 36%;
  min-width: 0;
}

.map-row input {
  flex: 1;
  min-width: 0;
}

.map-row .rig-iconbtn {
  flex: none;
}

.oe-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink);
}

.oe-check input {
  width: 15px;
  height: 15px;
}

.oe-assignees {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 10px;
  max-height: 180px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px;
}

.oe-assignees label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  color: var(--ink);
}

/* Kategorie personelu (ADR-038) korzystają z kanonicznych kart wyboru `.rig-picks` /
   `.rig-pick` – lokalny komponent `.oe-cat-card` był ich kopią i zszedł w paczce N5
   planu naprawczego UX/UI (znalezisko A5). */
/* Krytyczność roli (ADR-038): zwijana legenda poziomów pod selektem. */
.oe-lvl-help {
  margin-top: 8px;
}

.oe-lvl-help summary {
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--accent-700);
}

.oe-lvl-legend {
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white, #fff);
  overflow: hidden;
}

.oe-lvl-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  align-items: baseline;
  padding: 8px 12px;
  border-top: 1px solid var(--line);
}

.oe-lvl-row:first-child {
  border-top: 0;
}

.oe-lvl-badge {
  justify-self: start;
  font-size: 11px;
  font-weight: 700;
  color: var(--grey);
  background: var(--grey-bg);
  border-radius: var(--radius);
  padding: 2px 8px;
}

.oe-lvl-desc {
  font-size: 12.5px;
  color: var(--ink-2);
}

.oe-lvl-foot {
  padding: 9px 12px;
  border-top: 1px solid var(--line);
  background: var(--bg-2, #fafbfc);
  font-size: 12px;
  color: var(--muted);
}

/* Blok ujawniany warunkowo (np. picker częstotliwości po „Zadanie cykliczne") */
.oe-reveal[hidden] {
  display: none;
}

.oe-reveal {
  margin: 4px 0 2px;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  background: var(--surface-2, #f8fafc);
}

/* Chipy wyboru z wyszukiwarką (kontrole ISO na formularzu zadania) */
.oe-chipsearch {
  margin-bottom: 8px;
}

.oe-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-height: 172px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px;
}

.oe-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 5px 9px;
  font-size: 12.5px;
  color: var(--ink);
  background: #fff;
  cursor: pointer;
}

.oe-chip:hover {
  border-color: var(--line-2);
}

.oe-chip input {
  accent-color: var(--accent);
  width: 14px;
  height: 14px;
}

.oe-chip b {
  font-weight: 700;
}

.oe-chip.is-off {
  display: none;
}

.oe-chips-empty[hidden] {
  display: none;
}

.oe-chips-empty {
  font-size: 12px;
  color: var(--muted);
  padding: 4px 2px;
}

.oe-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding-top: 14px;
  margin-top: 4px;
  border-top: 1px solid var(--line);
}

.oe-actions .grow {
  flex: 1;
}

/* Rząd akcji edycji w stopce karty (profil regulacyjny: kontekst 4.1, strony 4.2) */
.rig-cardact {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.rig-cardact form {
  display: inline;
  margin: 0;
}

/* Grupy tematyczne sekcji huba Ustawień (R6) — nagłówek-rozdzielacz nad blokiem sekcji */
.rig-secgroup {
  margin: 36px 0 16px;
  padding-top: 20px;
  border-top: 2px solid var(--line);
}

/* Tabela różnic „pole / było / jest" w karcie zdarzenia dziennika bezpieczeństwa */
.rig-diff {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  margin-top: 2px;
}

.rig-diff th {
  text-align: left;
  font-weight: 600;
  color: var(--muted);
  padding: 4px 8px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}

.rig-diff td {
  padding: 5px 8px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}

.rig-diff td.old {
  color: var(--danger);
  text-decoration: line-through;
}

.rig-diff td.new {
  color: var(--ok);
  font-weight: 600;
}

.rig-secgroup > h2 {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 4px;
  color: var(--ink);
  letter-spacing: -0.01em;
}

.rig-secgroup > p {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
  max-width: 78ch;
}

/* ============================================================================
   Plan i zakres dokumentacji — grupowany układ wg poziomu obowiązkowości
   (zakładka ekranu „Polityki i dokumenty"). Czytelność dla wdrożeniowca:
   sekcje wg poziomu, podtytuł, licznik, inline ostrzeżenia SoA, toggle „po co".
   Kolor niesie wyłącznie status; hierarchię poziomów oddaje monochromatyczna
   rampa lewej krawędzi (ciemniej = ważniejszy), nie barwy.
   ============================================================================ */
.plan-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.plan-toolbar .grow {
  flex: 1;
}

.plan-po-toggle {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.plan-po-btn {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--accent-700);
  cursor: pointer;
  border: 1px solid var(--line-2);
  background: #fff;
  border-radius: var(--radius);
  padding: 7px 12px;
}

.plan-po-btn:hover {
  background: var(--bg-2);
}

.plan-po-btn .on {
  display: none;
}

.plan-wrap:has(.plan-po-toggle:checked) .plan-po-btn .on {
  display: inline;
}

.plan-wrap:has(.plan-po-toggle:checked) .plan-po-btn .off {
  display: none;
}

.plan-po {
  display: none;
}

.plan-wrap:has(.plan-po-toggle:checked) .plan-po {
  display: block;
}

.plan-grp {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  margin-bottom: 14px;
  overflow: hidden;
}

.plan-grp-h {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--lc-bg, var(--bg-2));
  border-left: 3px solid var(--lc, var(--line));
}

/* Subtelna rampa ważności (decyzja Przemka 2026-06-16): pastelowy tint tła +
   barwna lewa krawędź + barwna pigułka poziomu. Wyjątek od „kolor = tylko status"
   — tu barwa koduje hierarchię obowiązkowości (ciepłe = ważniejsze, chłodne/szare = pomocnicze). */
.plan-grp--l1 {
  --lc: #b42318;
  --lc-bg: #fef4f2;
}

.plan-grp--l2 {
  --lc: #b54708;
  --lc-bg: #fef5ea;
}

.plan-grp--l3 {
  --lc: #1849a9;
  --lc-bg: #eff4fe;
}

.plan-grp--l4 {
  --lc: #475467;
  --lc-bg: #f4f6f9;
}

.plan-grp--l5 {
  --lc: #667085;
  --lc-bg: #f8f9fb;
}

.plan-lvl {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--lc, var(--grey));
  background: #fff;
  border: 1px solid currentColor;
  border-radius: 9999px;
  padding: 2px 9px;
  white-space: nowrap;
}

.plan-grp-h h2 {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--ink);
}

.plan-grp-count {
  margin-left: auto;
  font-size: 11.5px;
  color: var(--muted);
  white-space: nowrap;
}

.plan-grp-count .warn {
  color: var(--warn);
  font-weight: 600;
}

.plan-rows {
  list-style: none;
  margin: 0;
  padding: 0;
}

.plan-row {
  /* Ostatnia kolumna (akcja) = auto: „Utwórz ze wzorca →" jest szersze niż „Otwórz"
   i przy sztywnych 78px nakładało się na pigułkę „Do utworzenia" (fix 2026-07-03). */
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr) 148px 156px 112px auto;
  gap: 14px;
  align-items: start;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  transition: background 0.12s;
}

.plan-row.clickable {
  cursor: pointer;
}

.plan-row:last-child {
  border-bottom: 0;
}

.plan-row.clickable:hover {
  background: #fbfcfe;
}

.plan-row:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.plan-row.warn-row {
  background: #fffdf8;
}

.plan-row.warn-row:hover {
  background: #fffbf1;
}

/* Pozycja wskazana z Drogi („Zakres" → konkretny wiersz planu, #plan-…): podświetlenie
   + odstęp pod sticky topbarem, by docelowy wiersz nie chował się pod paskiem. */
.plan-row:target {
  scroll-margin-top: 84px;
  background: #f0faf5;
  box-shadow: inset 3px 0 0 var(--accent);
}

.plan-src {
  font-size: 11px;
  font-weight: 700;
  color: var(--accent-700);
  letter-spacing: 0.01em;
  padding-top: 2px;
}

.plan-main {
  min-width: 0;
}

.plan-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.4;
}

.plan-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin-top: 7px;
}

.plan-note {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--accent-700);
  background: var(--accent-50);
  border-radius: 4px;
  padding: 1px 6px;
}

.plan-zatw {
  font-size: 11px;
  color: var(--muted);
}

.plan-zatw b {
  color: var(--ink-2);
  font-weight: 600;
}

.plan-zatw-form {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.plan-zatw-sel {
  font-size: 11px;
  color: var(--ink-2);
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 1px 4px;
  max-width: 200px;
  cursor: pointer;
}

.plan-zatw-ov {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--accent-700);
  background: var(--accent-50);
  border-radius: 4px;
  padding: 1px 5px;
}

.plan-po {
  font-size: 12px;
  color: var(--ink-2);
  line-height: 1.5;
  margin: 8px 0 0;
}

.plan-warn {
  margin-top: 8px;
  font-size: 11.5px;
  font-weight: 500;
  color: var(--warn);
  background: var(--warn-bg);
  border: 1px solid #f3c98b;
  border-radius: var(--radius);
  padding: 6px 9px;
  line-height: 1.45;
}

.plan-row .pill {
  align-self: start;
}

.plan-row .rig-rowact {
  align-self: start;
}

@media (max-width: 1180px) {
  .plan-row {
    grid-template-columns: 100px minmax(0, 1fr);
    gap: 6px 12px;
  }
  .plan-row .pill,
  .plan-row .rig-rowact {
    grid-column: 2;
    justify-self: start;
  }
  .plan-row .rig-rowact {
    justify-content: flex-start;
  }
}
/* ============================================================
   Picker pozycji planu — ścieżki „Z szablonu" i „Wgraj" (edytor dokumentu).
   Układ grup dziedziczy z planu (.plan-grp/.plan-row); wiersz ma własną siatkę
   (źródło | treść | status | akcja). Filtr „tylko do utworzenia" = czysty CSS :has.
   ============================================================ */
.pick-filter {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.pick-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.pick-toolbar .grow {
  flex: 1;
}

.pick-count {
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}

.pick-filter-btn .on {
  display: none;
}

.pick-wrap:has(.pick-filter:checked) .pick-filter-btn .on {
  display: inline;
}

.pick-wrap:has(.pick-filter:checked) .pick-filter-btn .off {
  display: none;
}

.pick-row {
  grid-template-columns: 116px minmax(0, 1fr) 156px 156px;
  cursor: default;
}

.pick-row.is-dim {
  opacity: 0.58;
}

.pick-row.is-dim:hover {
  opacity: 0.82;
  background: #fbfcfe;
}

/* Filtr ON → ukryj wiersze inne niż „Utwórz" oraz całe grupy bez takich wierszy. */
.pick-wrap:has(.pick-filter:checked) .pick-row.is-dim {
  display: none;
}

.pick-wrap:has(.pick-filter:checked) .pick-grp:not(:has(.pick-row:not(.is-dim))) {
  display: none;
}

@media (max-width: 1180px) {
  .pick-row {
    grid-template-columns: 100px minmax(0, 1fr);
  }
}
/* ============================================================
   Krok 2 uploadu — trzy wyjścia dla pliku (RIG-NIS2-032, prototyp
   policy-upload-nowy-krok2.html): legenda wyjść, pasek filtrów klienckich
   pickera (wyszukiwarka + chipy), callout „wszystko pokryte", zwijane sekcje
   oraz baner kontekstu importu w edytorze (policy-upload-nowy-edytor.html).
   ============================================================ */
.exits {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 16px;
}

.exit {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
}

.exit .nr {
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  background: var(--rig-500);
}

.exit h4 {
  font-size: 12.5px;
  margin: 0 0 2px;
}

.exit p {
  margin: 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
}

@media (max-width: 980px) {
  .exits {
    grid-template-columns: 1fr;
  }
}
.pick-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  flex-wrap: wrap;
}

.pick-search {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 7px 11px;
  color: var(--muted);
  flex: 1;
  min-width: 220px;
  background: #fff;
}

.pick-search input {
  border: 0;
  outline: 0;
  font-size: 13px;
  width: 100%;
  font-family: inherit;
  color: var(--ink);
  background: transparent;
}

.chip {
  border: 1px solid var(--line-2);
  background: #fff;
  border-radius: 20px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  cursor: pointer;
  font-family: inherit;
}

.chip.active {
  background: var(--rig-500);
  border-color: var(--rig-500);
  color: #fff;
}

.covered-callout {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--info-bg);
  border: 1px solid #c7d7f9;
  border-radius: var(--radius);
  padding: 14px 16px;
  margin: 0 0 14px;
}

.covered-callout .ico {
  color: var(--info);
  margin-top: 1px;
}

.covered-callout h4 {
  font-size: 13px;
  color: var(--info);
  margin: 0 0 3px;
}

.covered-callout p {
  margin: 0;
  font-size: 12.5px;
  color: #1d3f7a;
}

.covered-callout .acts {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}

.upl-sections {
  margin-top: 12px;
}

.upl-sections summary {
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rig-600);
}

/* Formularz „Zapisz poza planem" (Z4, ADR-040) korzysta z kanonicznych kart wyboru
   `.rig-picks` / `.rig-pick` – lokalny komponent `.radio-opt` był ich kopią i zszedł
   w paczce N5 planu naprawczego UX/UI (znalezisko A5). */
/* Karta „poza planem" pod pickerem kroku 2 (Z4). */
.offplan {
  display: flex;
  gap: 12px;
  align-items: center;
  border: 1px dashed var(--line-2);
  border-radius: var(--radius);
  padding: 13px 16px;
  margin-top: 16px;
  background: #fcfcfd;
}

.offplan .ico {
  color: var(--muted);
}

.offplan p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-2);
  flex: 1;
}

.import-banner {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 16px;
}

.import-banner .ico {
  color: var(--rig-600);
  margin-top: 1px;
}

.import-banner h4 {
  font-size: 13px;
  color: var(--rig-700);
  margin: 0 0 3px;
}

.import-banner p {
  margin: 0;
  font-size: 12.5px;
  color: var(--rig-700);
}

/* ============================================================
   Analiza ryzyka — prowadzona ścieżka (flow) ISO 27005.
   Rejestr = dom; flow = silnik uruchamiany w 3 biegach. Stepper trybowy,
   karty kroków, macierz P×K, skale, progi. Kolor niesie wyłącznie status.
   ============================================================ */
/* --- skala poziomu ryzyka (4-klasowa, paleta marki: teal→zielony→złoty→bordowy)
       wspólna: macierz, pigułki stref, legenda; spójna z .pill.lvl-* w rejestrze --- */
.m-low {
  background: #e4f0ee;
  color: #1e5854;
}

.m-med {
  background: #e9f3ec;
  color: #3c7b51;
}

.m-high {
  background: #fcf3d6;
  color: #8a6d08;
}

.m-crit {
  background: #f6e1e7;
  color: #8e1b38;
}

/* --- pasek-skala ryzyka (1–25) z opisami i znacznikiem (wzorzec referencyjny) --- */
.rig-rband {
  margin: 2px 0;
}

.rig-rband-wrap {
  position: relative;
  padding-top: 30px;
}

.rig-rband-track {
  display: flex;
  height: 22px;
  border-radius: var(--radius);
  overflow: hidden;
}

.rig-rband-track .seg.low {
  background: #2d6e6a;
}

.rig-rband-track .seg.med {
  background: #579a6b;
}

.rig-rband-track .seg.high {
  background: #f2c53d;
}

.rig-rband-track .seg.crit {
  background: #9e1f3f;
}

.rig-rband-axis {
  display: flex;
  margin-top: 4px;
}

.rig-rband-axis span {
  font-size: 10px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.rig-rband-axis span.end {
  flex: none;
}

.rig-rband-legend {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 18px;
  margin-top: 14px;
}

.rig-rband-li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}

.rig-rband-sw {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  flex: none;
  margin-top: 2px;
}

.rig-rband-li .nm {
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
}

.rig-rband-li .ds {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.4;
  margin-top: 1px;
}

.rig-rband-marker {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  transition: left 0.15s;
  text-align: center;
}

.rig-rband-marker .chip {
  display: inline-block;
  background: var(--ink);
  color: #fff;
  font-weight: 800;
  font-size: 11px;
  border-radius: var(--radius);
  padding: 3px 9px;
  white-space: nowrap;
}

.rig-rband-marker .stem {
  width: 0;
  height: 0;
  margin: 0 auto;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid var(--ink);
}

/* znacznik „było" (stan inherentny przed postępowaniem) — wyblakły, konturowy */
.rig-rband-marker.is-muted .chip {
  background: #fff;
  color: var(--muted);
  border: 1px solid var(--line-2);
}

.rig-rband-marker.is-muted .stem {
  border-top-color: var(--line-2);
}

@media (max-width: 720px) {
  .rig-rband-legend {
    grid-template-columns: 1fr;
  }
}
/* --- pasek trybu + powrót do rejestru --- */
.rig-flow-mode {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.rig-flow-mode .grow,
.rig-flow-nav .grow {
  flex: 1;
}

.rig-flow-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
  text-decoration: none;
}

.rig-flow-back:hover {
  color: var(--accent-700);
}

.rig-flow-modebadge {
  font-size: 11.5px;
  font-weight: 700;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius);
  padding: 3px 9px;
}

.rig-flow-count {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}

/* --- stepper trybowy --- */
.rig-flowsteps {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-wrap: wrap;
  padding: 10px 12px;
  margin-bottom: 18px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.rig-flowstep {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 9px;
  border-radius: var(--radius);
  text-decoration: none;
  white-space: nowrap;
}

.rig-flowstep:hover {
  background: var(--bg-2);
}

.rig-flowstep .num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

.rig-flowstep .lab {
  font-size: 12.5px;
  font-weight: 600;
}

.rig-flowstep.is-todo .num {
  background: var(--grey-bg);
  color: var(--muted);
}

.rig-flowstep.is-todo .lab {
  color: var(--muted);
}

.rig-flowstep.is-done .num {
  background: var(--accent-100);
  color: var(--accent-700);
}

.rig-flowstep.is-done .lab {
  color: var(--ink-2);
}

.rig-flowstep.is-now .num {
  background: var(--accent);
  color: #fff;
}

.rig-flowstep.is-now .lab {
  color: var(--ink);
  font-weight: 700;
}

.rig-flowstep-sep {
  display: inline-flex;
  color: var(--line-2);
}

/* --- nagłówek kroku --- */
.rig-flow-head {
  margin-bottom: 16px;
}

.rig-flow-clause {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent-700);
  margin-bottom: 4px;
}

/* --- nawigacja prev/next --- */
.rig-flow-nav {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.rig-flow-nav .btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* --- karty treści kroku --- */
.rig-flow-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 16px 18px;
}

.rig-flow-card-lab {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 12px;
}

.rig-flow-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}

.rig-flow-hint {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
  margin: 10px 0 0;
}

.rig-flow-foldlab {
  font-size: 11.5px;
  font-weight: 700;
  color: var(--ink-2);
  margin: 16px 0 10px;
  padding-top: 12px;
  border-top: 1px dashed var(--line-2);
}

.rig-flow-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 12px;
}

.rig-flow-inline label {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  display: flex;
  flex-direction: column;
  gap: 5px;
}

/* --- katalog integracji (/integrations/add) --- */
.rig-catgroup {
  margin-bottom: 26px;
}

.rig-catgroup-h {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 11px;
}

.rig-catgroup-h h2 {
  font-family: "Manrope", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
}

.rig-catgroup-h .n {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  background: var(--grey-bg);
  border-radius: 999px;
  padding: 1px 8px;
}

.rig-catalog {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 10px;
}

.rig-catcard {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 12px 14px;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.rig-catcard:hover {
  border-color: var(--accent);
  box-shadow: 0 2px 10px rgba(16, 47, 41, 0.08);
}

.rig-catcard .badge {
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Manrope", sans-serif;
  font-size: 13px;
  font-weight: 700;
  background: var(--bg-2);
  color: var(--ink-2);
  border: 1px solid var(--line);
}

.rig-catcard .bd {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.rig-catcard .nm {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
}

.rig-catcard .role {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 1px;
}

.rig-catcard .meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  flex: none;
}

.rig-catcard .cta {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent-700);
  white-space: nowrap;
}

.rig-catcard .cta .arr {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.rig-catcard.is-added {
  background: var(--bg-2);
}

.rig-catcard.is-added .cta {
  color: var(--muted);
}

.rig-catalog-empty {
  font-size: 13px;
  color: var(--muted);
  padding: 24px 0;
  text-align: center;
}

/* --- kreator: checklista i wiersz testu --- */
.rig-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rig-checklist li {
  margin-bottom: 7px;
}

.rig-check {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.5;
  cursor: pointer;
}

.rig-check input {
  margin-top: 2px;
  flex: none;
  accent-color: var(--accent);
}

.rig-testrow {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.rig-testrow-hint {
  font-size: 12px;
  color: var(--muted);
}

/* --- markery wymagalności (zmienna głębokość) --- */
.rig-req,
.rig-opt {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 1px 7px;
  margin-left: 6px;
  vertical-align: middle;
}

.rig-req {
  background: var(--accent-50);
  color: var(--accent-700);
  border: 1px solid var(--accent-100);
}

.rig-opt {
  background: var(--grey-bg);
  color: var(--muted);
  border: 1px solid var(--line);
}

/* --- chips (neutralne — kategoria, nie status) --- */
.rig-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.rig-chip {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 4px 10px;
}

.rig-chip.is-on {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

button.rig-chip {
  cursor: pointer;
  font-family: inherit;
}

/* sygnał „w strefie / poza strefą" akceptacji */
.rig-instrefa {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
}

.rig-instrefa.ok {
  color: var(--ok);
}

.rig-instrefa.no {
  color: var(--danger);
}

/* --- pigułka strefy ryzyka --- */
.rig-zone {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  padding: 2px 10px;
}

/* --- karty wyboru (nakładka, strategia, decyzja) --- */
.rig-picks {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.rig-picks.rig-picks-4 {
  grid-template-columns: repeat(4, 1fr);
}

/* `position: relative` zamyka ukryty `<input>` (niżej) w etykiecie. Bez tego input liczy
   się od bloku początkowego dokumentu, wychodzi poza `.rig-shell { height: 100vh }` i
   dokłada wysokość do strony – patrz tests/Ui/StyleContainmentTest. */
.rig-pick {
  position: relative;
  display: block;
  cursor: pointer;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 14px 15px;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.rig-pick:hover {
  border-color: var(--rig-200);
}

.rig-pick.is-on {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.12);
}

/* Ten sam rysunek stanu wybranego BEZ udziału serwera: `.is-on` nadaje szablon po zapisie,
   a `:has(input:checked)` daje odpowiedź natychmiast po kliknięciu – bez tej reguły karta
   milczała do przeładowania strony (znalezisko A5 audytu UX/UI 2026-07-28). */
.rig-pick:has(input:checked) {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.12);
}

/* Input jest wizualnie ukryty, więc bez tej reguły nawigacja klawiaturą nie miała ŻADNEGO
   widocznego fokusu (WCAG 2.4.7) – kanon `.ctrl-row` ma to od początku. */
.rig-pick:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.12);
}

/* Opcja niedostępna (np. wynik z automatu przed uruchomieniem konektora): karta zostaje
   widoczna, bo pokazuje kierunek produktu, ale wygląda na wyłączoną (rules.md §12.7). */
.rig-pick:has(input:disabled) {
  background: var(--bg-2);
  border-color: var(--line);
  cursor: not-allowed;
  opacity: 0.65;
}

.rig-pick input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.rig-pick-h {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 13.5px;
  color: var(--ink);
}

.rig-pick-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 24px;
  padding: 0 6px;
  border-radius: var(--radius);
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  background: var(--grey);
}

.rig-pick-norm {
  display: block;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--muted);
  margin: 5px 0 0;
}

.rig-pick-kv {
  margin: 11px 0 0;
  font-size: 12px;
}

.rig-pick-kv dt {
  color: var(--muted);
  font-weight: 600;
  margin-top: 8px;
}

.rig-pick-kv dd {
  color: var(--ink-2);
  margin: 1px 0 0;
  line-height: 1.45;
}

/* --- picker kontroli wspólnych (krok „Postępowanie", ADR-054) --- */
.ctrl-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  flex-wrap: wrap;
}

.ctrl-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 340px;
  overflow-y: auto;
  padding: 2px;
  margin: 0 0 4px;
}

/* `position: relative` jak w `.rig-pick`: przy 93 kontrolach uciekające inputy dawały
   dokumentowi ~4100 px wysokości, a klik w wiersz przewijał powłokę poza ekran. */
.ctrl-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}

.ctrl-row:hover {
  border-color: var(--rig-200);
}

.ctrl-row input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.ctrl-check {
  flex: none;
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--line-2);
  border-radius: 5px;
  display: grid;
  place-items: center;
  background: #fff;
}

.ctrl-check::after {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background: var(--accent);
  transform: scale(0);
  transition: transform 0.1s;
}

/* WIERSZ Z WIELOLINIJKOWĄ ETYKIETĄ (nazwa reguły + zdanie wyjaśniające pod nią). Baza wyrównuje
   do środka, bo etykieta jest zwykle jedną linijką; przy dwóch linijkach znacznik zjeżdżałby na
   ich środek i przestawał wskazywać nazwę. Nazwa `.start` jest ta sama co w `.rig-row.start` –
   jedno znaczenie, jedna nazwa w całym systemie. Dlaczego MODYFIKATOR, nie reguła bazowa:
   `.ctrl-row` to kanon wyboru z rules.md §12.6, 46 wystąpień w 31 szablonach, i wszystkie
   pozostałe mają etykietę jednolinijkową. Korekta 1 px na znaczniku równa go z linią pisma
   pierwszej linijki (znacznik ma 18 px przy wysokości linii tekstu ~20 px). */
.ctrl-row.start {
  align-items: flex-start;
}

.ctrl-row.start .ctrl-check {
  margin-top: 1px;
}

.ctrl-row:has(input:checked) {
  border-color: var(--accent);
  background: rgba(10, 112, 110, 0.06);
}

.ctrl-row:has(input:checked) .ctrl-check {
  border-color: var(--accent);
}

.ctrl-row:has(input:checked) .ctrl-check::after {
  transform: scale(1);
}

.ctrl-row:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.12);
}

/* WYBÓR JEDNOKROTNY w wierszu: znacznik jest okrągły, bo kwadrat obiecuje wybór wielokrotny.
   Kanon ma dwa nośniki wyboru jednokrotnego – kafle `.rig-picks` (opcja z opisem) i wiersz
   `.ctrl-row` (opcja krótka, lista kilku wartości: status, tryb, odpowiedź tak/nie/ND).
   Bez tej reguły radia w wierszu rysowały się jak checkboxy (znalezisko A5). */
.ctrl-row:has(input[type=radio]) .ctrl-check {
  border-radius: 50%;
}

.ctrl-row:has(input[type=radio]) .ctrl-check::after {
  border-radius: 50%;
}

/* Kontrolka bez zapisu ALBO opcja niedostępna: wiersz zostaje widoczny, ale wygląda na
   wyłączony – zamiast obiecywać i milczeć (rules.md §12.7). */
.ctrl-row:has(input:disabled) {
  background: var(--bg-2);
  border-color: var(--line);
  cursor: not-allowed;
}

.ctrl-row:has(input:disabled) .ctrl-check {
  border-color: var(--line);
  background: var(--bg-2);
}

.ctrl-row:has(input:disabled) .ctrl-name {
  color: var(--muted);
}

.ctrl-name {
  flex: 1;
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.ctrl-code {
  font-family: ui-monospace, monospace;
  font-size: 11.5px;
  color: var(--muted);
  white-space: nowrap;
}

.ctrl-regimes {
  flex: none;
}

.ctrl-empty {
  padding: 10px 12px;
  font-size: 12.5px;
  color: var(--muted);
}

/* --- przełącznik segmentowy (tryb macierzy) --- */
.rig-seg {
  display: inline-flex;
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 3px;
  gap: 3px;
}

.rig-seg button {
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 4px;
  padding: 6px 12px;
}

.rig-seg button.is-on {
  background: #fff;
  color: var(--accent-700);
  box-shadow: var(--shadow);
}

/* --- macierz ryzyka P×K (flow) --- */
.rig-rmx {
  border-collapse: separate;
  border-spacing: 4px;
  width: 100%;
}

.rig-rmx th {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  padding: 4px;
  text-align: center;
}

.rig-rmx th.corner {
  color: var(--line-2);
  font-size: 10px;
}

.rig-rmx td {
  text-align: center;
  font-size: 13px;
  font-weight: 800;
  padding: 9px 0;
  border-radius: 4px;
}

.rig-rmx-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.rig-rmx-legend span {
  font-size: 10.5px;
  font-weight: 700;
  border-radius: 999px;
  padding: 2px 9px;
}

/* --- skale (P, wymiary K) --- */
.rig-scale {
  width: 100%;
  border-collapse: collapse;
}

.rig-scale td {
  padding: 7px 4px;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
  color: var(--ink-2);
}

.rig-scale tr:last-child td {
  border-bottom: 0;
}

.rig-scale td.n {
  width: 30px;
  text-align: center;
  font-weight: 800;
  color: var(--accent-700);
}

.rig-scale td.mut {
  color: var(--muted);
  font-size: 11.5px;
}

/* ============================================================
   Konfigurator metodyki (krok Kontekst) — dynamiczna macierz N×N,
   skale adaptacyjne (band 0..4), edytowalne wymiary konsekwencji.
   Strefy biorą tła z .m-* (4-klasowa skala marki); zieleń = intensywność skali.
   ============================================================ */
/* sterowanie metodyką — pasek segmentów */
.rig-mxctl {
  display: flex;
  flex-wrap: wrap;
  gap: 22px 30px;
  align-items: flex-end;
}

.rig-mxctl-g .lab {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
}

.rig-mxctl .rig-seg.dense button {
  padding: 6px 9px;
}

.rig-mxctl-note {
  font-size: 12px;
  color: var(--muted);
  max-width: 22rem;
  align-self: flex-end;
}

/* dynamiczna siatka macierzy */
.rig-mxgrid {
  display: grid;
  gap: 5px;
}

.rig-mxgrid.dense {
  gap: 3px;
}

.rig-mxcell {
  border-radius: 5px;
  padding: 7px 3px;
  text-align: center;
  min-height: 50px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: 1.5px solid transparent;
}

.rig-mxgrid.dense .rig-mxcell {
  min-height: 30px;
  padding: 3px 1px;
  border-width: 1px;
  border-radius: 3px;
}

.rig-mxcell .main {
  font-weight: 800;
  font-size: 12px;
  line-height: 1;
}

.rig-mxcell .alt {
  font-size: 9px;
  opacity: 0.65;
  line-height: 1;
}

.rig-mxgrid.dense .rig-mxcell .alt {
  display: none;
}

.rig-mxcell.click {
  cursor: pointer;
  transition: transform 0.08s;
}

.rig-mxcell.click:hover {
  transform: scale(1.06);
}

.rig-mxcell.ring {
  box-shadow: 0 0 0 2px var(--ink);
}

.rig-mxcell.m-low {
  border-color: #b7dbd4;
}

.rig-mxcell.m-med {
  border-color: #bfe0c6;
}

.rig-mxcell.m-high {
  border-color: #edd89a;
}

.rig-mxcell.m-crit {
  border-color: #e7bbc6;
}

.rig-mxax {
  font-size: 10px;
  color: var(--muted);
  font-weight: 700;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.rig-mxgrid.dense .rig-mxax {
  font-size: 8px;
}

.rig-mxax .w {
  font-weight: 500;
  color: var(--line-2);
}

/* legenda stref */
.rig-mxlegend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.rig-mxlegend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--ink-2);
}

.rig-mxlegend .sw {
  width: 13px;
  height: 13px;
  border-radius: 3px;
  border: 1.5px solid;
}

/* skala adaptacyjna (P / K) — rząd: chip poziomu + etykieta + opis */
.rig-mxscale {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rig-mxscale-row {
  display: flex;
  align-items: center;
  gap: 9px;
}

.rig-mxscale-lv {
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 12px;
}

.rig-mxscale-row .t {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
}

.rig-mxscale-row .d {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.35;
}

/* kontrast dwóch „piątek" */
.rig-mxcontrast {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.rig-mxcontrast .rig-mxcell {
  min-height: 70px;
}

.rig-mxcontrast .rig-mxcell .main {
  font-size: 15px;
}

.rig-mxcontrast .rig-mxcell .zn {
  font-size: 10px;
  margin-top: 3px;
}

.rig-mxcontrast .cap {
  font-size: 11px;
  color: var(--muted);
  text-align: center;
  margin-top: 2px;
}

/* edytowalne wymiary konsekwencji */
.rig-dims {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rig-dim {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 6px 9px;
}

.rig-dim input {
  border: 0;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  background: transparent;
  flex: 1;
  min-width: 0;
}

.rig-dim input:focus {
  outline: none;
}

.rig-dim .del {
  color: var(--line-2);
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  background: none;
  border: 0;
}

.rig-dim .del:hover {
  color: var(--danger);
}

.rig-dimrow {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.rig-dimrow input {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 8px 11px;
  font-size: 12.5px;
  font-family: inherit;
  color: var(--ink);
  background: #fff;
}

.rig-dimrow input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.12);
}

.rig-dimsets {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.rig-dimp {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  background: var(--accent-50);
  border: 1px dashed var(--accent-100);
  border-radius: var(--radius);
  padding: 8px 10px;
  cursor: pointer;
  transition: background 0.12s;
  margin-bottom: 6px;
}

.rig-dimp:hover {
  background: var(--rig-100);
}

.rig-dimp .plus {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-weight: 800;
  font-size: 13px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

.rig-dimp .nm {
  font-size: 12px;
  font-weight: 700;
  color: var(--accent-700);
  display: block;
}

.rig-dimp .ls {
  font-size: 10.5px;
  color: var(--muted);
  display: block;
}

.rig-dimp.added {
  background: var(--grey-bg);
  border: 1px solid var(--line);
  cursor: default;
}

.rig-dimp.added .plus {
  background: var(--line-2);
}

.rig-dimp.added .nm {
  color: var(--muted);
}

/* ============================================================
   Identyfikacja zagrożeń (threat-first) — karty zagrożeń, szybkie
   przykłady, oś źródła, tag P/K, ocena inline. Status = kolor; reszta neutralna.
   ============================================================ */
/* pole dodawania + szybkie przykłady */
.rig-thr-add {
  background: var(--bg-2);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
}

.rig-thr-add-row {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.rig-thr-add-row input {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 9px 12px;
  font-size: 13px;
  font-family: inherit;
  color: var(--ink);
  background: #fff;
}

.rig-thr-add-row input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.12);
}

.rig-qchips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
  align-items: center;
}

.rig-qchips .lab {
  font-size: 12px;
  color: var(--muted);
}

.rig-qchip {
  cursor: pointer;
  font-family: inherit;
  border: 1px dashed var(--accent-100);
  background: var(--accent-50);
  color: var(--accent-700);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 11px;
  transition: background 0.12s, border-color 0.12s;
}

.rig-qchip:hover {
  background: var(--rig-100);
  border-color: var(--accent);
}

/* karta zagrożenia */
.rig-thr {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 13px 15px;
  box-shadow: var(--shadow);
  transition: border-color 0.12s, box-shadow 0.25s;
}

.rig-thr[data-depth=poglebione] {
  border-color: var(--rig-200);
}

.rig-thr-top {
  display: flex;
  align-items: flex-start;
  gap: 11px;
}

.rig-thr-ico {
  width: 30px;
  height: 30px;
  border-radius: var(--radius);
  background: var(--danger-bg);
  color: var(--danger);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

.rig-thr-title {
  font-weight: 700;
  color: var(--ink);
  font-size: 13.5px;
}

.rig-thr-st {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  padding: 2px 9px;
}

.rig-thr-st.draft {
  background: var(--grey-bg);
  color: var(--grey);
  border: 1px solid var(--line);
}

.rig-thr-st.scored {
  background: var(--ok-bg);
  color: var(--ok);
  border: 1px solid #b7e4cc;
}

.rig-thr-srcchip {
  font-size: 10.5px;
  font-weight: 700;
  border-radius: 999px;
  padding: 2px 8px;
  background: var(--info-bg);
  color: var(--info);
  border: 1px solid #c7d7f5;
}

.rig-thr-del {
  color: var(--line-2);
  background: none;
  border: 0;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}

.rig-thr-del:hover {
  color: var(--danger);
}

.rig-thr-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--muted);
}

.rig-thr-deepsum {
  color: var(--accent-700);
  font-weight: 600;
}

.rig-thr-acts {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 11px;
  padding-left: 41px;
}

.rig-thr-link {
  font-size: 12px;
  font-weight: 600;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  color: var(--accent-700);
}

.rig-thr-link:hover {
  text-decoration: underline;
}

.rig-thr-link.mut {
  color: var(--muted);
}

.rig-thr-link.right {
  margin-left: auto;
}

.rig-thr-deepen,
.rig-thr-score {
  margin-top: 12px;
  padding-left: 41px;
}

.rig-thr-deepen {
  display: grid;
  gap: 10px;
}

.rig-thr-deepen .sublab {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 4px;
}

.rig-thr-deepen input {
  width: 100%;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 7px 10px;
  font-size: 12.5px;
  font-family: inherit;
  color: var(--ink);
  background: #fff;
}

.rig-thr-deepen input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.12);
}

.rig-thr-srcrow {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.rig-thr-hint {
  font-size: 10.5px;
  color: var(--muted);
  margin: 2px 0 0;
  line-height: 1.4;
}

/* mini-select (poziom, P/K, źródło) */
.rig-mini {
  font-family: inherit;
  font-size: 12px;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 4px 8px;
  background: #fff;
  color: var(--ink-2);
}

.rig-mini:focus {
  outline: none;
  border-color: var(--accent);
}

/* przełącznik P/K (czy podatność rusza P czy K) */
.rig-vk {
  display: inline-flex;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  overflow: hidden;
  flex: none;
}

.rig-vk button {
  font-family: inherit;
  cursor: pointer;
  background: #fff;
  border: 0;
  padding: 6px 11px;
  font-size: 11px;
  font-weight: 800;
  color: var(--muted);
}

.rig-vk button + button {
  border-left: 1px solid var(--line-2);
}

.rig-vk button.on {
  background: var(--accent);
  color: #fff;
}

/* odznaka wyniku R w karcie */
.rig-rbadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 26px;
  border-radius: var(--radius);
  font-weight: 800;
  font-size: 13px;
  padding: 0 7px;
}

.rig-rbadge.r-none {
  background: var(--grey-bg);
  color: var(--line-2);
}

.rig-rbadge.r-low {
  background: #e4f0ee;
  color: #1e5854;
}

.rig-rbadge.r-med {
  background: #e9f3ec;
  color: #3c7b51;
}

.rig-rbadge.r-high {
  background: #fcf3d6;
  color: #8a6d08;
}

.rig-rbadge.r-crit {
  background: #f6e1e7;
  color: #8e1b38;
}

.rig-lvlpill {
  font-size: 11px;
  font-weight: 700;
  border-radius: var(--radius);
  padding: 2px 7px;
  background: var(--grey-bg);
  color: var(--ink-2);
}

/* sidebar postępu identyfikacji */
.rig-thr-progress {
  position: sticky;
  top: 12px;
}

.rig-thr-bignum {
  font-size: 30px;
  font-weight: 800;
  color: var(--ink);
  line-height: 1;
}

.rig-thr-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 14px 0;
  text-align: center;
}

.rig-thr-stat {
  background: var(--grey-bg);
  border-radius: var(--radius);
  padding: 9px 4px;
}

.rig-thr-stat.accent {
  background: var(--accent-50);
}

.rig-thr-stat.ok {
  background: var(--ok-bg);
}

.rig-thr-stat .v {
  font-weight: 800;
  font-size: 16px;
  color: var(--ink);
}

.rig-thr-stat.accent .v {
  color: var(--accent-700);
}

.rig-thr-stat.ok .v {
  color: var(--ok);
}

.rig-thr-stat .k {
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  margin-top: 2px;
}

/* ============================================================
   Analiza P×K (kl. 7.3) — biblioteka przykładów (galeria) z filtrami,
   skale oceny 1–N, macierz z markerami inherentne/szczątkowe, boxy wyniku.
   ============================================================ */
/* karta bieżącego przykładu (nagłówek) */
.rig-anex {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 11px 14px;
  max-width: 21rem;
}

.rig-anex-top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}

.rig-anex-code {
  font-family: ui-monospace, "SF Mono", monospace;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
}

.rig-anex-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.3;
}

.rig-anex-src {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}

/* galeria + filtry */
.rig-galfilters {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 24px;
  align-items: flex-end;
  margin-bottom: 14px;
}

.rig-galfilters .g .lab {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  margin-bottom: 6px;
}

.rig-galfilters .note {
  font-size: 11px;
  color: var(--muted);
  max-width: 24rem;
  align-self: flex-end;
}

.rig-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.rig-gcard {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 11px 12px;
  background: #fff;
  cursor: pointer;
  text-align: left;
  width: 100%;
  font-family: inherit;
  transition: border-color 0.1s, box-shadow 0.1s;
}

.rig-gcard:hover {
  border-color: var(--rig-200);
  box-shadow: var(--shadow);
}

.rig-gcard.on {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(10, 112, 110, 0.2);
}

.rig-gcard-top {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 5px;
}

.rig-gcard-ov {
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--line-2);
  margin-left: auto;
}

.rig-gcard-title {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.3;
  margin-bottom: 7px;
}

.rig-gcard-foot {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.rig-gcard-pair {
  font-family: ui-monospace, "SF Mono", monospace;
  font-size: 11px;
  font-weight: 700;
  color: var(--ink-2);
}

.rig-zbadge {
  display: inline-flex;
  align-items: center;
  border-radius: var(--radius);
  font-size: 10px;
  font-weight: 800;
  padding: 1px 7px;
}

.rig-zbadge.warn {
  background: var(--warn-bg);
  color: var(--warn);
}

@media (max-width: 1180px) {
  .rig-gallery {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 720px) {
  .rig-gallery {
    grid-template-columns: 1fr;
  }
}
/* skala oceny 1–N (przyciski) */
.rig-anscale {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.rig-anscale button {
  flex: 1;
  min-width: 34px;
  text-align: center;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 7px 2px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink-2);
  cursor: pointer;
  background: #fff;
  font-family: inherit;
  transition: border-color 0.1s, background 0.1s;
}

.rig-anscale button:hover {
  border-color: var(--rig-200);
  background: var(--accent-50);
}

.rig-anscale button.on {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.15);
}

.rig-anscale button.na {
  flex: 0 0 38px;
  color: var(--muted);
}

.rig-anscale button.na.on {
  background: var(--grey);
  border-color: var(--grey);
  color: #fff;
  box-shadow: none;
}

/* wiersz wymiaru K */
.rig-dimrow {
  padding: 9px 0;
  border-top: 1px solid var(--line);
}

.rig-dimrow:first-child {
  border-top: 0;
}

.rig-dimrow .nm {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 7px;
}

/* notatki P (lista punktowa) */
.rig-pnotes {
  list-style: none;
  margin: 8px 0 14px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.rig-pnotes li {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 12px;
  color: var(--ink-2);
}

.rig-pnotes li::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--rig-300);
  margin-top: 6px;
  flex: none;
}

/* boxy wyniku (inherentne / szczątkowe) */
.rig-resbox {
  border-radius: var(--radius-lg);
  text-align: center;
  padding: 12px 8px;
  background: var(--grey-bg);
  color: var(--muted);
}

.rig-resbox .lab {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  opacity: 0.8;
}

.rig-resbox .pair {
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  margin-top: 5px;
}

.rig-resbox .zn {
  font-size: 11px;
  font-weight: 600;
  margin-top: 4px;
}

/* macierz analizy = kompaktowy wariant mxgrid + markery */
.rig-mxgrid.compact .rig-mxcell {
  min-height: 36px;
  padding: 4px 1px;
  gap: 1px;
}

.rig-mxgrid.compact .rig-mxcell .main {
  font-size: 10.5px;
}

.rig-mxcell.mk-inh {
  box-shadow: 0 0 0 2px var(--ink);
  z-index: 1;
}

.rig-mxcell.mk-res {
  outline: 2px dashed var(--accent);
  outline-offset: -2px;
}

.rig-mxmark {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  font-size: 10px;
  color: var(--muted);
}

.rig-mxmark span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.rig-mxmark .sw {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  flex: none;
}

.rig-mxcell .rig-mxtag {
  position: absolute;
  top: -8px;
  right: -6px;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.03em;
  background: var(--ink);
  color: #fff;
  border-radius: 999px;
  padding: 0 5px;
  line-height: 1.5;
}

.rig-mxcell {
  position: relative;
}

/* ============================================================
   Postępowanie / Akceptacja — istniejące vs plan, boxy inherentne/szczątkowe,
   sygnatury źródła zabezpieczeń, ścieżki decyzji.
   ============================================================ */
.rig-srctag {
  display: inline-flex;
  align-items: center;
  border-radius: 4px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.03em;
  padding: 1px 5px;
  flex: none;
  margin-top: 1px;
}

.rig-srctag.jest {
  background: var(--ok-bg);
  color: var(--ok);
}

.rig-srctag.luka {
  background: var(--danger-bg);
  color: var(--danger);
}

.rig-srctag.nowe {
  background: var(--info-bg);
  color: var(--info);
}

.rig-splitlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rig-splitlist li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12.5px;
  color: var(--ink-2);
}

.rig-soachip {
  font-size: 10px;
  font-weight: 700;
  border-radius: 999px;
  padding: 1px 8px;
  background: var(--ok-bg);
  color: var(--ok);
}

.rig-suggchip {
  font-size: 10px;
  font-weight: 600;
  border-radius: 999px;
  padding: 1px 8px;
  background: var(--grey-bg);
  color: var(--muted);
}

.rig-accbox {
  border-radius: var(--radius-lg);
  padding: 14px 16px;
  border: 1.5px solid var(--line);
  background: var(--grey-bg);
}

.rig-accbox .lab {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  opacity: 0.8;
  margin-bottom: 4px;
}

.rig-accbox .big {
  font-size: 18px;
  font-weight: 800;
  color: var(--ink);
}

.rig-accarrow {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--line-2);
  font-size: 24px;
  font-weight: 700;
}

.rig-signbox {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--bg-2);
  padding: 13px 15px;
}

.rig-signbox .who {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
  margin: 3px 0 10px;
}

/* --- tabele progów / rejestru w flow --- */
.rig-thresholds {
  width: 100%;
  border-collapse: collapse;
}

/* Wariant dziesięciokolumnowy (wiersze zbiorczego dodawania ryzyk: aktywo, właściciel, P, C, I, A,
   K, R, strefa, usuń). Bez dolnej granicy pola wyboru w komórkach zwężają się do nieczytelnych
   kilkudziesięciu pikseli. Dlaczego MODYFIKATOR, a nie reguła bazowa: `.rig-thresholds` ma pięć
   wystąpień, a pozostałe cztery (strefy w kroku „Kontekst", dwie tabele monitorowania, wynik
   ewaluacji) mają po dwie–trzy kolumny i NIE siedzą w pojemniku przewijanym w poziomie –
   dolna granica 860 px wypchnęłaby je za krawędź karty. Nośnik do przewijania daje
   `.rig-tablewrap.framed` wokół tabeli. */
.rig-thresholds.wide {
  min-width: 860px;
}

.rig-thresholds th {
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--muted);
  padding: 7px 10px;
  border-bottom: 1px solid var(--line);
}

.rig-thresholds td {
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
  color: var(--ink-2);
}

.rig-thresholds tr:last-child td {
  border-bottom: 0;
}

/* Odznaka „właściciel wzięty z aktywa" pod polem wyboru w wierszu zbiorczego dodawania.
   Blok w linii pod polem, nie obok niego – dlatego `inline-block` zamiast `inline-flex`
   z `.pill`. Widocznością steruje `risk_bulk_controller.ts` przez `badge.hidden`, a `[hidden]`
   w `_layout.scss` jest oznaczone `!important`, więc ten `display` nie odbierze mu ukrywania.
   Pozostałe klasy `.rb-*` tego ekranu są wyłącznie uchwytami dla JS i nie mają żadnej reguły –
   ta jedna wchodzi tu, przy tabeli, którą opisuje. */
.rb-owner-pre {
  display: inline-block;
  margin-top: 4px;
}

/* --- listy i checkboxy w flow --- */
.rig-flow-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rig-flow-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.rig-flow-list li:last-child {
  border-bottom: 0;
}

.rig-flow-list .t {
  flex: 1;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
}

.rig-flow-checks {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rig-flow-checks li {
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
}

.rig-flow-checks li:last-child {
  border-bottom: 0;
}

.rig-flow-checks label {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
  color: var(--ink-2);
  cursor: pointer;
}

/* --- karta wyniku oceny (R = P×K) --- */
.rig-flow-result {
  text-align: center;
}

.rig-flow-result .rig-flow-card-lab {
  text-align: left;
}

.rig-rscore {
  font-size: 26px;
  font-weight: 800;
  color: var(--ink);
  margin: 6px 0 10px;
}

.rig-rscore strong {
  color: var(--accent-700);
}

.rig-flow-result .rig-zone {
  font-size: 13px;
  padding: 4px 14px;
}

@media (max-width: 1180px) {
  .rig-flow-2col {
    grid-template-columns: 1fr;
  }
  .rig-picks,
  .rig-picks.rig-picks-4 {
    grid-template-columns: 1fr;
  }
}
/* --- pasek stanu modułu Ryzyko (rejestr = dom; metodyka + 3 intencje) --- */
.rig-riskstate {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.rig-riskstate .s-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--ok);
  flex: none;
  box-shadow: 0 0 0 3px var(--ok-bg);
}

.rig-riskstate .s-meta {
  min-width: 0;
}

.rig-riskstate .s-lab {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ok);
}

.rig-riskstate .s-val {
  font-size: 12.5px;
  color: var(--ink-2);
  margin-top: 2px;
}

.rig-riskstate .grow {
  flex: 1;
}

.rig-riskstate .s-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

@media (max-width: 1024px) {
  .rig-riskstate {
    flex-wrap: wrap;
  }
}
/* --- onboarding (pierwsze uruchomienie, pusty rejestr) --- */
.rig-onb {
  display: flex;
  justify-content: center;
  padding: 24px 0;
}

.rig-onb-card {
  max-width: 640px;
  text-align: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 36px 32px;
}

.rig-onb-ico {
  width: 56px;
  height: 56px;
  margin: 0 auto 16px;
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
}

.rig-onb-card h2 {
  font-size: 20px;
  font-weight: 800;
  color: var(--ink);
  margin: 0 0 8px;
  font-family: "Manrope", "Inter", sans-serif;
}

.rig-onb-card p {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.6;
  margin: 0 auto 18px;
  max-width: 52ch;
}

.rig-onb-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin-bottom: 22px;
}

.rig-onb-steps span {
  font-size: 11px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 4px 9px;
}

.rig-onb-cta {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}

/* ============================================================
   Zadania — Kalendarz + Koło roczne (te same zadania, inne formy).
   clean-light: kolor niesie WYŁĄCZNIE status zadania; segmenty/karty
   neutralne, jeden akcent (zielony) dla bieżącego miesiąca i postępu.
   ============================================================ */
/* ---------- Kalendarz: 12 kart miesięcy ---------- */
.rig-cal {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

@media (max-width: 1180px) {
  .rig-cal {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 820px) {
  .rig-cal {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 520px) {
  .rig-cal {
    grid-template-columns: 1fr;
  }
}
.rig-cal-m {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.rig-cal-m .hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
}

.rig-cal-m .hd .nm {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
}

.rig-cal-m .hd .ct {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.rig-cal-m.is-now {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent), var(--shadow);
}

.rig-cal-m.is-now .hd {
  background: var(--accent-50);
}

.rig-cal-m.is-now .hd .nm {
  color: var(--accent-700);
}

.rig-cal-m.is-empty {
  opacity: 0.72;
}

.rig-cal-m .bd {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 8px;
  min-height: 56px;
}

.rig-cal-t {
  display: block;
  width: 100%;
  text-align: left;
  cursor: pointer;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 6px 8px;
  transition: border-color 0.12s, background 0.12s;
}

.rig-cal-t:hover {
  border-color: var(--line-2);
  background: #fff;
}

.rig-cal-t .top {
  display: flex;
  align-items: center;
  gap: 6px;
}

.rig-cal-t .top .tt {
  flex: 1;
  min-width: 0;
  font-size: 11.5px;
  color: var(--ink);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rig-cal-t .dot {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.rig-cal-t .mt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
  font-size: 10px;
  color: var(--muted);
}

.rig-cal-t .mt .who {
  font-weight: 700;
  color: var(--ink-2);
}

.rig-cal-empty {
  font-size: 11px;
  color: var(--muted);
  text-align: center;
  padding: 9px 0;
}

.rig-cal .dot.ok {
  background: var(--ok);
}

.rig-cal .dot.warn {
  background: var(--warn);
}

.rig-cal .dot.info {
  background: var(--info);
}

.rig-cal .dot.danger {
  background: var(--danger);
}

/* ---------- Koło roczne: donut 12 miesięcy ---------- */
/* Układ: donut po lewej, rail kontekstu po prawej (zwija się w jedną kolumnę). */
.rig-wheel-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(264px, 1fr);
  gap: 16px;
  align-items: start;
}

@media (max-width: 1080px) {
  .rig-wheel-layout {
    grid-template-columns: 1fr;
  }
}
.rig-wheel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 24px;
}

.rig-wheel .ring {
  width: 100%;
  max-width: 420px;
}

.rig-wheel svg {
  display: block;
  width: 100%;
  height: auto;
}

/* Rail kontekstu — dwie listy tych samych zadań obok koła. */
.rig-wheel-aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.rig-wheel-box {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 14px 16px 12px;
}

.rig-wheel-box .hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.rig-wheel-box .hd h4 {
  font-family: "Manrope", "Inter", sans-serif;
  font-size: 13px;
  font-weight: 800;
  margin: 0;
}

.rig-wheel-box .hd .ct {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  min-width: 22px;
  height: 20px;
  padding: 0 7px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--grey-bg);
}

.rig-wheel-box.danger .hd h4 {
  color: var(--danger);
}

.rig-wheel-box.danger .hd .ct {
  color: var(--danger);
  background: var(--danger-bg);
}

.rig-wheel-box.warn .hd h4 {
  color: var(--warn);
}

.rig-wheel-box.warn .hd .ct {
  color: var(--warn);
  background: var(--warn-bg);
}

.rig-wheel-item {
  display: block;
  width: 100%;
  text-align: left;
  cursor: pointer;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 8px 10px;
  transition: border-color 0.12s, background 0.12s;
}

.rig-wheel-item + .rig-wheel-item {
  margin-top: 6px;
}

.rig-wheel-item:hover {
  border-color: var(--line-2);
  background: #fff;
}

.rig-wheel-item .tt {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.3;
}

.rig-wheel-item .mt {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 5px;
}

.rig-wheel-item .cat {
  font-size: 10px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--grey-bg);
  border-radius: 4px;
  padding: 1px 6px;
}

.rig-wheel-item .note {
  font-size: 10px;
  font-weight: 700;
  border-radius: 4px;
  padding: 1px 6px;
}

.rig-wheel-item .note.danger {
  color: var(--danger);
  background: var(--danger-bg);
}

.rig-wheel-item .note.warn {
  color: var(--warn);
  background: var(--warn-bg);
}

.rig-wheel-item .note.info {
  color: var(--info);
  background: var(--info-bg);
}

.rig-wheel-item .note.ok {
  color: var(--ok);
  background: var(--ok-bg);
}

.rig-wheel-item .due {
  font-size: 10.5px;
  color: var(--muted);
  margin-left: auto;
  font-variant-numeric: tabular-nums;
}

.rig-wheel-none {
  font-size: 11.5px;
  color: var(--muted);
  text-align: center;
  padding: 8px 0;
}

.rig-wheel-all {
  display: block;
  width: 100%;
  margin-top: 10px;
  padding-top: 10px;
  cursor: pointer;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--accent-700);
  text-align: center;
}

.rig-wheel-all:hover {
  color: var(--accent);
}

.rig-wheel .seg {
  fill: var(--grey-bg);
  stroke: #fff;
  stroke-width: 2;
  transition: fill 0.12s;
}

.rig-wheel .seg.empty {
  fill: var(--bg-2);
}

.rig-wheel .seg.current {
  fill: var(--accent-50);
  stroke: var(--accent);
  stroke-width: 2;
}

.rig-wheel .seg-lab {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 11px;
  font-weight: 600;
  fill: var(--muted);
  pointer-events: none;
}

.rig-wheel .seg-lab.empty {
  fill: var(--line-2);
}

.rig-wheel .seg-lab.current {
  fill: var(--accent-700);
  font-weight: 800;
}

.rig-wheel .seg-q {
  font-family: "Manrope", "Inter", sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.1em;
  fill: var(--line-2);
  pointer-events: none;
}

.rig-wheel .dot {
  stroke: #fff;
  stroke-width: 1.5;
  cursor: pointer;
  transition: r 0.1s ease;
}

.rig-wheel .dot:hover {
  r: 5.5;
}

.rig-wheel .dot.ok {
  fill: var(--ok);
}

.rig-wheel .dot.warn {
  fill: var(--warn);
}

.rig-wheel .dot.info {
  fill: var(--info);
}

.rig-wheel .dot.danger {
  fill: var(--danger);
}

.rig-wheel .ctr-bg {
  fill: #fff;
  stroke: var(--line);
  stroke-width: 1;
}

.rig-wheel .ctr-track {
  fill: none;
  stroke: var(--line);
  stroke-width: 5;
}

.rig-wheel .ctr-prog {
  fill: none;
  stroke: var(--accent);
  stroke-width: 5;
  stroke-linecap: round;
}

.rig-wheel .ctr-cap {
  fill: var(--muted);
  font-family: "Inter", system-ui, sans-serif;
  font-size: 11px;
}

.rig-wheel .ctr-pct {
  fill: var(--ink);
  font-family: "Manrope", "Inter", sans-serif;
  font-size: 34px;
  font-weight: 800;
}

.rig-wheel .ctr-sub {
  fill: var(--muted);
  font-family: "Inter", system-ui, sans-serif;
  font-size: 12px;
}

.rig-wheel-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  font-size: 11.5px;
  color: var(--ink-2);
}

.rig-wheel-legend .lg {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.rig-wheel-legend .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.rig-wheel-legend .dot.ok {
  background: var(--ok);
}

.rig-wheel-legend .dot.warn {
  background: var(--warn);
}

.rig-wheel-legend .dot.info {
  background: var(--info);
}

.rig-wheel-legend .dot.danger {
  background: var(--danger);
}

.rig-wheel-cap {
  font-size: 11.5px;
  color: var(--muted);
  text-align: center;
  max-width: 46ch;
}

.cf-reqs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.cf-req {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.cf-req-id {
  flex: none;
}

.cf-req-code {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 28px;
  padding: 0 8px;
  border-radius: var(--radius);
  background: var(--accent-50, var(--accent-100));
  color: var(--accent-700);
  font-weight: 700;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.cf-req-body {
  flex: 1;
  min-width: 0;
}

.cf-req-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.cf-req-head h3 {
  font-size: 14.5px;
  font-weight: 650;
  color: var(--ink);
  margin: 0;
}

.cf-req-body p {
  font-size: 12.5px;
  color: var(--ink-2, var(--muted));
  margin: 0;
  line-height: 1.5;
}

.cf-req-act {
  flex: none;
  align-self: center;
}

@media (max-width: 720px) {
  .cf-req {
    flex-direction: column;
    gap: 10px;
  }
  .cf-req-act {
    align-self: stretch;
  }
  .cf-req-act .btn {
    width: 100%;
    justify-content: center;
  }
}
/* Podgląd układu pliku eksportu rejestru informacji DORA — arkusz, a nie lista.
   Nagłówek kolumny niesie pod etykietą numer pola standardowego wzoru rejestru
   (rozporządzenie wykonawcze (UE) 2024/2956), żeby dało się zestawić podgląd
   z arkuszem przekazywanym organowi. Tabela jest szeroka z natury (8 kolumn
   opisowych), więc przewija się we własnym kontenerze .rig-tablewrap. */
.rig-sheet-caption {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.rig-sheet-caption .nm {
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
}

.rig-sheet-caption .sub {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 2px;
}

.rig-sheet-tbl {
  min-width: 1040px;
}

.rig-sheet-tbl thead th,
.rig-sheet-tbl tbody td {
  vertical-align: top;
}

.rig-sheet-code {
  display: block;
  margin-top: 3px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--muted);
  text-transform: none;
}

.rig-sheet-idx {
  width: 40px;
  text-align: right;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

/* ============================================================
   _readiness.scss — wyliczany wskaźnik „Gotowość do analizy ryzyka" (P-09).
   Banner w domu modułu Ryzyko (NIE osobna bramka-ekran). Definition of Ready
   (kl. 6.1.2): 3 warunki, stan liczony z danych. Stan „ready" = kompaktowy pasek;
   stan „todo" = pasek + lista warunków z CTA. Kolor wyłącznie status; rounded ≤ 8px.
   ============================================================ */
.rig-readiness {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.rig-readiness.is-ready {
  border-color: var(--ok-bg);
  background: var(--ok-bg, #f0faf4);
}

.rig-readiness .rr-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
}

.rig-readiness .rr-ic {
  flex: none;
  width: 30px;
  height: 30px;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.rig-readiness .rr-ic svg {
  width: 17px;
  height: 17px;
}

.rig-readiness.is-ready .rr-ic {
  background: var(--ok-bg);
  color: var(--ok);
}

.rig-readiness.is-todo .rr-ic {
  background: var(--warn-bg);
  color: var(--warn);
}

.rig-readiness .rr-tx {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rig-readiness .rr-tx b {
  font-size: 13.5px;
  color: var(--ink);
}

.rig-readiness .rr-sub {
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
}

.rig-readiness .rr-badge {
  flex: none;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
}

.rig-readiness.is-ready .rr-badge {
  background: var(--ok);
  color: #fff;
}

.rig-readiness.is-todo .rr-badge {
  background: var(--warn-bg);
  color: var(--warn);
}

/* --- lista warunków (tylko gdy niegotowy) --- */
.rig-readiness .rr-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
}

.rig-readiness .rr-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}

.rig-readiness .rr-list li:last-child {
  border-bottom: 0;
}

.rig-readiness .rr-list li.todo {
  background: #fffcfa;
}

.rig-readiness .rr-dot {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--line-2);
}

.rig-readiness .rr-list li.ok .rr-dot {
  background: var(--ok);
  border-color: var(--ok);
  color: #fff;
}

.rig-readiness .rr-dot svg {
  width: 12px;
  height: 12px;
}

.rig-readiness .rr-c {
  flex: 1;
  min-width: 0;
}

.rig-readiness .rr-nm {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-weight: 600;
  font-size: 13px;
  color: var(--ink);
}

.rig-readiness .rr-cl {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  background: var(--grey-bg);
  border-radius: 4px;
  padding: 2px 6px;
}

.rig-readiness .rr-c p {
  font-size: 12.5px;
  color: var(--muted);
  margin: 3px 0 0;
  line-height: 1.5;
}

.rig-readiness .rr-c p strong {
  color: var(--ink);
}

.rig-readiness .rr-cta {
  flex: none;
  align-self: center;
  white-space: nowrap;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--warn);
  text-decoration: none;
}

.rig-readiness .rr-cta:hover {
  text-decoration: underline;
}

/* ============================================================
   _reader.scss — czytnik dokumentu (D2): pełna treść polityki SZBI.
   3 strefy: spis treści (sticky) | treść ~720px | rail metadanych (sticky).
   Reużywa prymitywów z _components.scss: .pill, .rig-meter, .rig-tl,
   .rig-tags/.rig-tag, .rig-kv, .rig-callout. Tu tylko układ + typografia treści.
   Estetyka clean-light: akcent zielony oszczędnie, kolor niesie tylko status.
   ============================================================ */
.rig-reader {
  display: grid;
  grid-template-columns: 212px minmax(0, 720px) 304px;
  gap: 34px;
  justify-content: center;
  width: 100%;
}

/* pasek powrotu + akcje (pełna szerokość strefy treści) */
.rig-reader-bar {
  grid-column: 1/-1;
  max-width: 1306px;
  width: 100%;
  margin: 0 auto 4px;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* flash w czytniku: pełna szerokość strefy treści (bez tej reguły wpada
   do pierwszej kolumny grida 212px i jest ściśnięty — issue #9) */
.rig-reader > .rig-flash {
  grid-column: 1/-1;
  max-width: 1306px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.rig-reader-bar .grow {
  flex: 1;
}

.rig-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
}

.rig-back:hover {
  color: var(--ink);
}

/* ---------- spis treści (lewa kolumna) ---------- */
.rig-toc {
  position: sticky;
  top: 78px;
  align-self: start;
  max-height: calc(100vh - 96px);
  overflow-y: auto;
}

.rig-toc-lab {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  padding: 0 10px 8px;
}

.rig-toc-link {
  display: flex;
  gap: 8px;
  align-items: baseline;
  padding: 7px 10px;
  border-radius: var(--radius);
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.4;
  border-left: 2px solid transparent;
}

.rig-toc-link:hover {
  background: var(--bg-2);
  color: var(--ink);
}

.rig-toc-link.active {
  background: var(--accent-50);
  color: var(--accent-700);
  font-weight: 600;
  border-left-color: var(--accent);
}

.rig-toc-link .n {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--muted);
  flex: none;
}

.rig-toc-link.active .n {
  color: var(--accent-700);
}

/* ---------- treść (środek) ---------- */
.rig-doc-head {
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
  margin-bottom: 24px;
}

.rig-doc-head .nr {
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent-700);
  letter-spacing: 0.03em;
}

.rig-doc-head h1 {
  font-family: "Manrope", sans-serif;
  font-size: 26px;
  font-weight: 800;
  margin: 6px 0 10px;
  line-height: 1.25;
}

.rig-doc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  font-size: 12.5px;
  color: var(--muted);
  align-items: center;
}

.rig-doc-meta b {
  color: var(--ink-2);
  font-weight: 600;
}

.rig-sec {
  margin-bottom: 34px;
  scroll-margin-top: 78px;
}

.rig-sec-h {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 12px;
}

.rig-sec-h .n {
  font-family: "Manrope", sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: var(--accent);
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  flex: none;
}

.rig-sec-h h2 {
  font-family: "Manrope", sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* treść narracyjna sekcji (html z edytora WYSIWYG) */
.rig-docbody {
  font-size: 14.5px;
  color: var(--ink-2);
}

.rig-docbody p {
  margin: 0 0 14px;
  line-height: 1.72;
}

.rig-docbody strong {
  color: var(--ink);
  font-weight: 700;
}

.rig-docbody em {
  font-style: italic;
}

.rig-docbody ol,
.rig-docbody ul {
  margin: 0 0 14px;
  padding-left: 22px;
  line-height: 1.72;
}

.rig-docbody li {
  margin-bottom: 7px;
}

.rig-docbody table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 18px;
  font-size: 13px;
}

.rig-docbody th {
  text-align: left;
  background: var(--bg-2);
  color: var(--muted);
  font-weight: 700;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 9px 12px;
  border: 1px solid var(--line);
}

.rig-docbody td {
  padding: 9px 12px;
  border: 1px solid var(--line);
  color: var(--ink-2);
  vertical-align: top;
  line-height: 1.55;
}

/* elementy treści dokumentów SZBI (import z ISMSDOCS: podsekcje, kod inline, cytaty) */
.rig-docbody h3 {
  font-family: "Manrope", sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.01em;
  margin: 20px 0 10px;
}

.rig-docbody h4 {
  font-family: "Manrope", sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
  margin: 16px 0 8px;
}

.rig-docbody code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 12.5px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 1px 5px;
}

.rig-docbody hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 18px 0;
}

.rig-docbody blockquote {
  margin: 0 0 14px;
  padding: 10px 14px;
  border-left: 3px solid var(--accent);
  background: var(--bg-2);
  border-radius: 0 8px 8px 0;
}

.rig-docbody blockquote p:last-child {
  margin-bottom: 0;
}

.rig-docbody s {
  color: var(--muted);
}

/* Indeksy z drugiego rzędu paska (ADR-103): bez własnej reguły przeglądarka wprawdzie
   je podnosi, ale rozpycha interlinię akapitu. */
.rig-docbody sup,
.rig-docbody sub {
  font-size: 0.72em;
  line-height: 0;
}

/* ---------- rail metadanych (prawa kolumna) ---------- */
.rig-rail {
  position: sticky;
  top: 78px;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-height: calc(100vh - 96px);
  overflow-y: auto;
}

.rig-rcard {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 14px 15px;
}

.rig-rcard h3 {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin: 0 0 11px;
}

.rig-rcard .rig-kv dd {
  text-align: right;
  font-weight: 500;
}

.rig-rail-lab {
  margin-top: 11px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 4px;
}

.rig-rtags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.rig-rtag {
  font-variant-numeric: tabular-nums;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius);
  padding: 4px 8px;
}

.rig-rtag:hover {
  background: var(--accent-100);
}

.rig-src {
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.5;
}

.rig-src b {
  color: var(--ink-2);
}

/* ---------- bloki karty kontroli SoA ---------- */
/* pole opcjonalne (np. „opis wdrożenia") — placeholder dla treści wpisywanej */
.rig-field {
  border: 1px dashed var(--line-2);
  border-radius: var(--radius);
  padding: 11px 13px;
  background: var(--bg-2);
}

.rig-field .lab {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 4px;
}

.rig-field .ph {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.55;
}

/* znacznik źródła danych sekcji („zaciągane z modułu X") */
.rig-srcmod {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  font-size: 11.5px;
  color: var(--muted);
}

.rig-srcmod .ico {
  width: 13px;
  height: 13px;
  color: var(--rig-300);
}

.rig-srcmod b {
  color: var(--ink-2);
  font-weight: 600;
}

/* odstęp między blokami w sekcji karty */
.rig-docbody > .rig-callout,
.rig-docbody > .rig-kv,
.rig-docbody > .rig-tags,
.rig-docbody > .rig-linklist,
.rig-docbody > .rig-field {
  margin-bottom: 12px;
}

.rig-docbody > :last-child {
  margin-bottom: 0;
}

/* ============================================================
   Rozbudowana karta kontroli SoA (rig-soacard) — bloki treści.
   Port karty v1 (05-soa-control-card.html). Estetyka clean-light:
   kolor niesie wyłącznie status; akcent zielony oszczędnie.
   ============================================================ */
/* pasek metryk (pełna szerokość, nad kolumnami) */
.rig-metricbar {
  grid-column: 1/-1;
  max-width: 1306px;
  width: 100%;
  margin: 0 auto 8px;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}

.rig-metric {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 9px 12px;
}

.rig-metric .lab {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.rig-metric .val {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
  margin-top: 3px;
}

.rig-metric .val.ok {
  color: var(--ok);
}

.rig-metric .val.warn {
  color: var(--warn);
}

.rig-metric .val.info {
  color: var(--info);
}

.rig-metric .val.danger {
  color: var(--danger);
}

/* odstępy między blokami w sekcji karty */
.rig-cardbody > * {
  margin-bottom: 12px;
}

.rig-cardbody > :last-child {
  margin-bottom: 0;
}

/* podtytuł klauzuli w nagłówku sekcji */
.rig-sec-h h2 .sfx {
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
}

/* blok wiodący „Cel (Purpose)" */
.rig-lead {
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius-lg);
  padding: 13px 15px;
}

.rig-lead .lab {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--accent-700);
  margin-bottom: 4px;
}

.rig-lead p {
  margin: 0;
  font-size: 14px;
  line-height: 1.62;
  color: var(--ink-2);
}

.rig-subnote {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.55;
}

/* pole z chipami (np. „Pochodzenie wymagania") */
.rig-tagfield .lab {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 6px;
}

/* tabela ryzyk (Przed / Po / Postępowanie) */
.rig-rtbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  margin: 0;
}

.rig-rtbl th {
  text-align: left;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--line);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  font-weight: 700;
  padding: 7px 8px;
}

.rig-rtbl td {
  border: none;
  border-bottom: 1px solid var(--line);
  padding: 9px 8px;
  color: var(--ink-2);
  vertical-align: middle;
}

.rig-rtbl tr:last-child td {
  border-bottom: none;
}

.rig-rtbl th.c,
.rig-rtbl td.c {
  text-align: center;
}

.rig-rtbl td.mono {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink);
}

/* dwie kolumny (systemy + dokumenty) */
.rig-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.rig-cols .lab {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 7px;
}

.rig-dots {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rig-dots li {
  position: relative;
  padding-left: 16px;
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.85;
}

.rig-dots li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 11px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--rig-300);
}

.rig-doclinks {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rig-doclinks li {
  margin-bottom: 8px;
}

.rig-doclinks a {
  font-size: 13px;
  font-weight: 600;
  color: var(--accent-700);
}

.rig-doclinks a:hover {
  color: var(--accent);
}

.rig-doclinks .n {
  display: block;
  font-size: 11px;
  font-weight: 500;
  color: var(--muted);
  margin-top: 1px;
}

/* karty miar (KPI wg ISO 27004) */
.rig-kpicards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.rig-kpicard {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.rig-kpicard .hd {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg-2);
  border-bottom: 1px solid var(--line);
  padding: 8px 12px;
}

.rig-kpicard .hd .grow {
  flex: 1;
}

.rig-kpicard .code {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
}

.rig-kpicard .nm {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.rig-kpicard .kind {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 2px 5px;
}

.rig-kpicard .val {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
}

.rig-kpicard .val .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
}

.rig-kpicard .val.ok {
  color: var(--ok);
}

.rig-kpicard .val.warn {
  color: var(--warn);
}

.rig-kpicard .val.danger {
  color: var(--danger);
}

.rig-kpicard .grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  padding: 9px 12px;
}

.rig-kpicard .grid .l {
  display: block;
  font-size: 10px;
  color: var(--muted);
  margin-bottom: 2px;
}

.rig-kpicard .grid .v {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
}

.rig-spark {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  height: 18px;
}

.rig-spark i {
  width: 3px;
  background: var(--accent-100);
  border-radius: 1px;
}

.rig-spark i:last-child {
  background: var(--accent);
}

/* lista dowodów */
.rig-evlist {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.rig-evrow {
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 8px 11px;
}

.rig-evrow .ic {
  color: var(--accent);
  flex: none;
  display: inline-flex;
}

.rig-evrow .ic .ico {
  width: 15px;
  height: 15px;
}

.rig-evrow .nm {
  font-size: 13px;
  color: var(--ink-2);
  flex: 1;
}

.rig-evrow .meta {
  font-size: 10.5px;
  color: var(--muted);
  flex: none;
}

/* wiersze incydentów */
.rig-incrow {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--warn);
  border-radius: var(--radius-lg);
  padding: 11px 13px;
}

.rig-incrow .bd .top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.rig-incrow .mono {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--ink);
}

.rig-incrow p {
  margin: 0;
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.55;
}

.rig-incrow .date {
  font-size: 10.5px;
  color: var(--muted);
  white-space: nowrap;
  flex: none;
}

/* siatka mini-kart (audyt/przegląd) */
.rig-minigrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.rig-mini {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 11px 12px;
}

.rig-mini .lab {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 5px;
}

.rig-mini p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.5;
}

/* wiersze powiązań międzymodułowych */
.rig-xlinks {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rig-xlink {
  display: flex;
  align-items: center;
  gap: 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 10px 13px;
}

.rig-xlink:hover {
  border-color: var(--rig-200);
  background: var(--bg-2);
}

.rig-xlink .ic {
  color: var(--accent);
  flex: none;
  display: inline-flex;
}

.rig-xlink .ic .ico {
  width: 18px;
  height: 18px;
}

.rig-xlink .bd {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.rig-xlink .bd .t {
  font-size: 13px;
  color: var(--ink-2);
}

.rig-xlink .bd .s {
  font-size: 11px;
  color: var(--muted);
  margin-top: 1px;
}

.rig-xlink .code {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--accent-700);
  white-space: nowrap;
  flex: none;
}

.rig-xlink .code .arr {
  width: 13px;
  height: 13px;
}

/* rail: mapowanie na inne ramy */
.rig-maprows {
  margin: 0;
}

.rig-maprows .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
}

.rig-maprows .row:last-child {
  border-bottom: none;
}

.rig-maprows dt {
  font-weight: 600;
  color: var(--ink-2);
}

.rig-maprows dd {
  margin: 0;
  color: var(--muted);
  text-align: right;
}

.rig-maprows dd a {
  color: var(--accent-700);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

.rig-maprows dd a .arr {
  width: 12px;
  height: 12px;
}

/* rail: baza wiedzy */
.rig-kbintro {
  font-size: 12px;
  color: var(--ink-2);
  line-height: 1.55;
  margin: 0 0 10px;
}

.rig-kblinks {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rig-kblinks li {
  margin-bottom: 7px;
}

.rig-kblinks a {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-700);
  line-height: 1.4;
}

.rig-kblinks a:hover {
  color: var(--accent);
}

/* ścieżka konfiguracji kolektora (kroki ze statusem) */
.rig-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.rig-step {
  display: flex;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.rig-step:last-child {
  border-bottom: 0;
}

.rig-step > .n {
  flex: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11.5px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  background: var(--bg-2);
  color: var(--muted);
  border: 1px solid var(--line-2);
}

.rig-step.done > .n {
  background: var(--accent-100);
  color: var(--accent-700);
  border-color: transparent;
}

.rig-step.error > .n {
  background: var(--danger-bg);
  color: var(--danger);
  border-color: transparent;
}

.rig-step .bd {
  flex: 1;
  min-width: 0;
}

.rig-step .bd .top {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}

.rig-step .bd .t {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
}

.rig-step .bd p {
  margin: 3px 0 0;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.55;
}

.rig-step.pending .bd .t {
  color: var(--ink-2);
}

/* rail: nagłówek z klauzulą + tony osi czasu */
.rig-rcard h3 .lc {
  text-transform: none;
  font-weight: 400;
  letter-spacing: 0;
}

.rig-tl li.tl-ok::before {
  background: var(--ok);
}

.rig-tl li.tl-warn::before {
  background: var(--warn);
}

.rig-tl li.tl-mute::before {
  background: var(--line-2);
}

@media (max-width: 1180px) {
  .rig-reader {
    grid-template-columns: minmax(0, 720px) 304px;
  }
  .rig-toc {
    display: none;
  }
  .rig-metricbar {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 900px) {
  .rig-reader {
    grid-template-columns: minmax(0, 1fr);
  }
  .rig-rail {
    display: none;
  }
  .rig-metricbar {
    grid-template-columns: repeat(2, 1fr);
  }
  .rig-cols,
  .rig-minigrid,
  .rig-kpicard .grid {
    grid-template-columns: 1fr;
  }
}
/* ============================================================
   _editor.scss — EDYTOR dokumentu SZBI (v2, Faza A).
   Warstwa edycji nałożona na układ czytnika (_reader.scss): te same 3 strefy,
   tu dochodzą tryby sekcji, toolbar, typ zmiany i sugestie AI.
   Estetyka clean-light: kolor niesie WYŁĄCZNIE status (zmiana/nowa/aktywna),
   jeden akcent zielony; sugestia AI jest neutralna z akcentem, nie „amber".
   ============================================================ */
/* pasek górny — autosave */
.ed-autosave {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--muted);
}

.ed-autosave .dot {
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  background: var(--ok);
  flex: none;
}

/* Autozapis odmówiony albo nieudany: wskaźnik NIE może wyglądać jak zapis, który się udał.
   Kolor niesie tu stan utrwalenia treści, nie ozdobę – stąd zmiana także kropki. */
.ed-autosave.is-error {
  color: var(--danger);
  font-weight: 600;
}

.ed-autosave.is-error .dot {
  background: var(--danger);
}

/* ---------- LEWA: nawigator sekcji ---------- */
.ed-nav-link {
  justify-content: flex-start;
}

.ed-nav-link .t {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ed-nav-link .lk {
  width: 13px;
  height: 13px;
  flex: none;
  color: var(--muted);
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

/* znacznik zmiany (status, nie dekoracja) */
.ed-chg {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-radius: 9999px;
  padding: 2px 7px;
  flex: none;
  line-height: 1.5;
}

.ed-chg.modified {
  background: var(--warn-bg);
  color: var(--warn);
}

.ed-chg.new {
  background: var(--accent-50);
  color: var(--accent-700);
}

.ed-chg.imported {
  background: var(--bg-2);
  color: var(--ink-2);
}

.ed-chg.gap {
  background: var(--warn-bg);
  color: var(--warn);
}

.ed-nav-actions {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ed-navbtn {
  text-align: left;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--accent-700);
  background: none;
  border: 0;
  padding: 6px 10px;
  border-radius: var(--radius);
  cursor: pointer;
  font-family: inherit;
}

.ed-navbtn:hover {
  background: var(--bg-2);
}

.ed-navbtn.muted {
  color: var(--muted);
  font-weight: 500;
}

.ed-summary {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.ed-summary .row {
  display: flex;
  justify-content: space-between;
  padding: 0 10px 4px;
  font-size: 12px;
  color: var(--muted);
}

.ed-summary .row b {
  font-variant-numeric: tabular-nums;
  color: var(--ink-2);
}

.ed-summary .row b.modified {
  color: var(--warn);
}

.ed-summary .row b.new {
  color: var(--accent-700);
}

.ed-summary .row b.removed {
  color: var(--danger);
}

/* Załączniki mają w nawigatorze WŁASNĄ listę (ADR-112): numer jest gołą literą, więc
   kontekst musi nadać nagłówek bloku. Odstęp i kreska jak w `.ed-summary`, ale klasa jest
   własna – `.ed-summary` znaczy „blok liczników" i tak jest czytana przez testy ekranu. */
.ed-annexes {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.ed-annexes .rig-toc-lab {
  margin-bottom: 6px;
}

.ed-annexes .ed-nav-actions {
  margin-top: 6px;
}

.ed-annexes .muted {
  display: block;
  padding: 0 10px 4px;
}

/* ---------- ŚRODEK: nagłówek tożsamości ---------- */
.ed-head .ed-title {
  width: 100%;
  font-family: "Manrope", sans-serif;
  font-size: 26px;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.25;
  letter-spacing: -0.01em;
  margin: 6px 0 10px;
  border: 0;
  border-bottom: 1px dashed transparent;
  background: transparent;
  padding: 0;
  font-family: inherit;
}

.ed-head .ed-title:hover {
  border-bottom-color: var(--line-2);
}

.ed-head .ed-title:focus {
  outline: 0;
  border-bottom-color: var(--accent);
}

.ed-head .ed-chip {
  font-variant-numeric: tabular-nums;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius);
  padding: 1px 6px;
  font-weight: 600;
  margin-left: 4px;
}

.ed-head-note {
  font-size: 12px;
  color: var(--muted);
  margin: 12px 0 0;
  line-height: 1.5;
}

/* cel dokumentu */
.ed-cel {
  margin: 18px 0;
}

.ed-cel label {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 6px;
}

.ed-cel textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 9px 11px;
  font-size: 13px;
  color: var(--ink);
  background: #fff;
  font-family: inherit;
  line-height: 1.6;
  resize: vertical;
}

.ed-cel textarea:focus {
  outline: 0;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-100);
}

/* pole „Podsumowanie zmian" (augmentacja POL-08) — dotąd BEZ reguł: renderowało się
   systemowym stylem przeglądarki (etykieta sklejona z małą textarea; fix 2026-07-03).
   Układ i wygląd spójny z polem „Cel dokumentu". */
.ed-field {
  display: block;
  margin: 18px 0 0;
}

.ed-field .lab {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 6px;
}

.ed-field textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 9px 11px;
  font-size: 13px;
  color: var(--ink);
  background: #fff;
  font-family: inherit;
  line-height: 1.6;
  resize: vertical;
}

.ed-field textarea:focus {
  outline: 0;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-100);
}

/* typ zmiany */
.ed-changetype {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 26px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--bg-2);
}

.ed-changetype .lab {
  flex: 0 0 auto;
  padding-top: 1px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink-2);
}

.ed-changetype .ed-ct-opts {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

/* Typ zmiany stoi na kanonicznym `.ctrl-row` (rules.md §12.6) – hack `accent-color` na nagim
   radiu zszedł w paczce N5 planu naprawczego UX/UI (znalezisko A5). Zostaje typografia noty. */
.ed-changetype .ctrl-name i {
  color: var(--muted);
  font-style: normal;
  font-size: 11.5px;
}

/* ---------- sekcje: stany ---------- */
.ed-sec {
  padding: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  margin-bottom: 16px;
  background: #fff;
  scroll-margin-top: 78px;
}

.ed-sec.editing {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-100);
}

.ed-sec.locked {
  background: var(--bg-2);
}

.ed-sec-h {
  margin: 0;
  padding: 11px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.ed-sec.editing .ed-sec-h {
  background: var(--accent-50);
}

.ed-sec-h .grow {
  flex: 1;
}

.ed-sec-h h2 {
  font-size: 15px;
}

/* Karta „Obieg zatwierdzania" w railu (produkcyjny edytor, P-77): selecty osoba LUB rola. */
.wf-field {
  display: block;
  margin-bottom: 11px;
}

.wf-field .lab {
  display: block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 4px;
}

.wf-field .lab .req {
  color: #b42318;
}

.wf-field select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 7px 9px;
  font-size: 12.5px;
  color: var(--ink);
  background: #fff;
  font-family: inherit;
}

.wf-field select:focus {
  outline: 0;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-100);
}

.wf-field .hint {
  display: block;
  font-size: 11px;
  color: var(--muted);
  margin-top: 3px;
  line-height: 1.45;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}

/* Edytowalny tytuł sekcji (produkcyjny edytor, P-78): pusty contenteditable h2 musi być
   widoczny i klikalny (placeholder jak .ed-body); prototyp nie używa contenteditable h2. */
.ed-sec-h h2[contenteditable] {
  min-width: 140px;
  min-height: 1.2em;
  outline: 0;
}

.ed-sec-h h2[contenteditable=true] {
  box-shadow: inset 0 -1px 0 var(--accent-100);
}

.ed-sec-h h2[contenteditable]:empty::before {
  content: attr(data-placeholder);
  color: var(--muted);
  font-style: italic;
  font-weight: 500;
}

.ed-secbtn {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-700);
  background: none;
  border: 0;
  padding: 4px 8px;
  border-radius: var(--radius);
  cursor: pointer;
  font-family: inherit;
  flex: none;
}

.ed-secbtn:hover {
  background: #fff;
}

/* Usunięcie sekcji: barwa ostrzegawcza, bo treść ginie bez cofnięcia. Nie jest to
   akcja główna nagłówka – stoi za „Edytuj" i nadal wygląda jak przycisk tekstowy. */
.ed-secbtn.danger {
  color: var(--danger);
}

.ed-secbtn.danger:hover {
  background: var(--danger-bg);
}

.ed-sec.editing .ed-secbtn.danger {
  color: var(--danger);
}

.ed-sec.editing .ed-secbtn {
  color: var(--muted);
}

.ed-lock {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11.5px;
  color: var(--muted);
  flex: none;
}

.ed-lock .ico {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

/* toolbar — tylko gdy sekcja w trybie edycji */
.ed-toolbar {
  display: none;
  align-items: center;
  gap: 2px;
  padding: 7px 14px;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}

.ed-sec.editing .ed-toolbar {
  display: flex;
}

.ed-tbtn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 28px;
  height: 28px;
  justify-content: center;
  padding: 0 7px;
  border: 0;
  background: transparent;
  color: var(--ink-2);
  border-radius: var(--radius);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
}

.ed-tbtn:hover {
  background: var(--grey-bg);
  color: var(--ink);
}

.ed-tbtn .ico {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

.ed-tbtn.ai {
  color: var(--accent-700);
  font-size: 12px;
  font-weight: 600;
}

.ed-tbtn .grow {
  flex: 1;
}

.ed-tsep {
  width: 1px;
  height: 18px;
  background: var(--line);
  margin: 0 4px;
}

.ed-toolbar .grow {
  flex: 1;
}

/* ── klasyfikacja dokumentu (ADR-104) ──
   Pole stoi nad „Typem zmiany", bo jedno i drugie dotyczy całego dokumentu, nie sekcji. */
.ed-classification {
  margin: 0 0 18px;
}

.ed-classification select {
  width: 100%;
  max-width: 320px;
  height: 38px;
  padding: 0 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  background: #fff;
  color: var(--ink);
  font-family: inherit;
  font-size: 14px;
}

.ed-classification select:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.ed-classification-hint {
  margin: 6px 0 0;
  font-size: 12.5px;
  color: var(--muted);
  max-width: 62ch;
}

/* ── metryka dokumentu: wersja kandydat + data dokumentu (ADR-110) ──
   Dwie kolumny obok siebie, bo jedno i drugie jest tożsamością wersji wg kl. 7.5.2 a);
   przy wąskim ekranie schodzą pod siebie, żeby pole daty nie kurczyło się do nieczytelnej
   szerokości (kalendarz przeglądarki ma własne minimum). */
.ed-stamp {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px 18px;
  margin: 0 0 18px;
}

.ed-stamp-f label {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 6px;
}

.ed-stamp-f input {
  width: 100%;
  height: 38px;
  padding: 0 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  background: #fff;
  color: var(--ink);
  font-family: inherit;
  font-size: 14px;
}

/* Pole tylko do odczytu ma WYGLĄDAĆ na nieedytowalne – inaczej redaktor próbuje w nim pisać. */
.ed-stamp-f input[readonly] {
  background: var(--bg-2);
  color: var(--muted);
  cursor: default;
}

.ed-stamp-f input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.ed-stamp-f .hint {
  display: block;
  margin-top: 6px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--muted);
}

/* ── drugi rząd paska (ADR-103) ──
   Rząd 2 stoi WEWNĄTRZ .ed-toolbar (flex-wrap), bo „Dodaj sekcję" klonuje pasek
   przez outerHTML. Dlatego zajmuje całą szerokość i dostaje własną linię. */
.ed-trow2 {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-wrap: wrap;
  flex-basis: 100%;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed var(--line);
}

.ed-trow2[hidden] {
  display: none;
}

.ed-tbtn-more {
  font-weight: 600;
  letter-spacing: 0.04em;
}

.ed-tbtn.is-on {
  background: var(--accent-50);
  color: var(--accent-700);
  box-shadow: inset 0 0 0 1px var(--accent);
}

/* ── paleta wyróżnień ──
   Renderowana do body z position:fixed — nie ucieka z przodka z overflow ≠ visible
   (lekcja kebab-menu users-v2) i jest sprzątana w disconnect() kontrolera. */
.ed-hl-pop {
  position: fixed;
  z-index: 60;
  width: 214px;
  padding: 10px;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: var(--radius-lg);
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.16);
}

.ed-hl-pop[hidden] {
  display: none;
}

.ed-hl-label {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

/* Stan pusty to całe zdanie, nie etykieta – kapitaliki czytałyby się jak krzyk. */
.ed-hl-label.is-hint {
  text-transform: none;
  letter-spacing: 0;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ink-2);
}

.ed-hl-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 6px;
}

.ed-hl-sw {
  height: 26px;
  padding: 0;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  cursor: pointer;
}

.ed-hl-sw:hover {
  box-shadow: inset 0 0 0 2px var(--accent);
}

.ed-hl-none {
  width: 100%;
  height: 28px;
  margin-top: 8px;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  background: var(--bg-2);
  color: var(--ink-2);
  font-family: inherit;
  font-size: 12.5px;
  cursor: pointer;
}

.ed-hl-none:hover {
  color: var(--ink);
  border-color: var(--accent);
}

/* treść edytowalna */
.ed-body {
  padding: 16px;
}

.ed-sec.editing .ed-body {
  background: #fff;
}

.ed-body:focus {
  outline: 0;
}

.ed-body[contenteditable=true] {
  box-shadow: inset 0 0 0 1px var(--accent-100);
  border-radius: var(--radius);
}

.ed-body:empty::before {
  content: attr(data-placeholder);
  color: var(--muted);
  font-style: italic;
}

/* ---------- sugestia AI (neutralna + akcent, nie amber) ---------- */
.ed-ai {
  margin: 0 16px 16px;
  padding: 13px 15px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius);
}

.ed-ai-h {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--accent-700);
}

.ed-ai-h .ico {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

.ed-ai-h .conf {
  margin-left: auto;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
}

.ed-ai-basis {
  font-size: 11px;
  color: var(--muted);
  margin: 5px 0 8px;
}

.ed-ai p {
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.6;
  margin: 0 0 11px;
}

.ed-ai-act {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

/* treść sugestii (HTML zwrócony przez model) */
.ed-ai-text {
  font-size: 13px;
  color: var(--ink-1);
  line-height: 1.6;
  margin: 0 0 11px;
}

.ed-ai-text > :first-child {
  margin-top: 0;
}

.ed-ai-text > :last-child {
  margin-bottom: 0;
}

.ed-ai-text p {
  font-size: 13px;
  color: var(--ink-1);
  line-height: 1.6;
  margin: 0 0 8px;
}

.ed-ai-text ul,
.ed-ai-text ol {
  margin: 0 0 8px;
  padding-left: 18px;
}

.ed-ai-text li {
  margin: 2px 0;
}

.ed-ai-status {
  font-size: 12.5px;
  color: var(--muted);
  margin: 6px 0 10px;
}

/* Linia stanu podpowiedzi w sekcji: układ bierze `.rig-ai-line` (wspólny dla wszystkich miejsc
   podpowiedzi), tutaj zostaje samo wcięcie – ta sama krawędź tekstu co treść sekcji (`.ed-body`
   ma padding 16 px). Bez wcięcia komunikat i „Cofnij" byłyby dosunięte do ramki sekcji. */
.ed-ai-line {
  margin: 0 16px;
}

/* stan ładowania — subtelny puls akcentu */
.ed-ai.loading {
  border-left-color: var(--accent);
}

.ed-ai.loading .conf {
  animation: ed-ai-pulse 1.1s ease-in-out infinite;
}

@keyframes ed-ai-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
}
/* stan błędu — akcent ostrzegawczy bez krzykliwości */
.ed-ai.error {
  border-left-color: var(--danger, #c0492f);
  background: var(--bg-2);
}

.ed-ai.error .ed-ai-h {
  color: var(--danger, #c0492f);
}

/* ---------- PRAWA: sygnały + wskazówki ---------- */
.ed-signal + .ed-signal {
  margin-top: 11px;
  padding-top: 11px;
  border-top: 1px solid var(--line);
}

.ed-signal .t {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
}

.ed-signal .t .dot {
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  background: var(--warn);
  flex: none;
}

.ed-signal .m {
  font-size: 12px;
  color: var(--ink-2);
  margin-top: 3px;
  line-height: 1.45;
}

.ed-signal .s {
  font-size: 11px;
  color: var(--muted);
  margin-top: 3px;
}

.ed-tips p {
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.5;
  margin: 0 0 8px;
}

.ed-tips p:last-child {
  margin-bottom: 0;
}

/* ============================================================
   Wgraj istniejący dokument (Faza C) — strefa drop + mapowanie na wymagania.
   Upload to makieta; kolor niesie wyłącznie status (dopasowano / luka).
   ============================================================ */
.upl-drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 30px 20px;
  cursor: pointer;
  text-align: center;
  background: var(--bg-2);
  border: 1.5px dashed var(--line-2, #d6dee8);
  border-radius: var(--radius-lg);
  color: var(--ink-2);
  transition: border-color 0.14s, background 0.14s;
}

.upl-drop:hover {
  border-color: var(--accent);
  background: var(--accent-50);
}

.upl-drop-ico {
  width: 30px;
  height: 30px;
  color: var(--muted);
}

.upl-drop-t {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}

.upl-drop-s {
  font-size: 12px;
  color: var(--muted);
}

.upl-drop-done {
  display: none;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent-700);
}

/* Wariant bezczynny (N5, docs/rules.md §12.7): strefa opisuje docelowy zakres, ale wgrywania
   jeszcze nie ma – nie udaje więc klikalnej. Bez kursora „rączka" i bez podświetlenia na
   najechanie, bo obie te rzeczy obiecują reakcję, której nie będzie. Powód wyłączenia niesie
   komunikat „W przygotowaniu" pod strefą, nie sam wygląd. */
.upl-drop-inert {
  cursor: default;
  opacity: 0.7;
}

.upl-drop-inert:hover {
  border-color: var(--line-2, #d6dee8);
  background: var(--bg-2);
}

.upl-drop.is-done {
  border-style: solid;
  border-color: var(--accent);
  background: var(--accent-50);
  cursor: default;
}

.upl-drop.is-done .upl-drop-t,
.upl-drop.is-done .upl-drop-s {
  display: none;
}

.upl-drop.is-done .upl-drop-ico {
  color: var(--accent-700);
}

.upl-drop.is-done .upl-drop-done {
  display: block;
}

/* Pole pliku jest wizualnie ukryte, ale zostaje w drzewie fokusu – wybór otwiera
   `label.upl-drop` przez `for`, więc strefa działa bez JS. Klasa zastępuje inline styl
   powtarzany dotąd przy każdej strefie: jeden komponent = jedno miejsce prawdy. */
.upl-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

/* Wariant zwarty – kilka stref wgrania na jednym ekranie (dokumenty klienta audytu luki:
   sześć obszarów w siatce dwukolumnowej). Pełnowymiarowa strefa rozciągała tam ekran na
   trzy przewinięcia. Osobna klasa, żeby nie ruszyć wyglądu ekranów z jedną strefą. */
.upl-drop-sm {
  gap: 4px;
  padding: 16px 12px;
}

.upl-drop-sm .upl-drop-ico {
  width: 22px;
  height: 22px;
}

.upl-drop-sm .upl-drop-t {
  font-size: 13px;
}

.upl-file {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  margin-bottom: 16px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.upl-file .ico {
  width: 18px;
  height: 18px;
  color: var(--muted);
  flex: none;
}

.upl-file-n {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.upl-file-meta {
  margin-left: auto;
  font-size: 11.5px;
  color: var(--muted);
}

.upl-map {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.upl-map-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.upl-map-row.gap {
  background: var(--warn-bg);
  border-color: #f3c98b;
}

.upl-map-from {
  font-size: 12.5px;
  color: var(--ink-2);
  min-width: 0;
}

.upl-map-row.gap .upl-map-from {
  color: var(--warn);
  font-style: italic;
}

.upl-map-arr {
  width: 16px;
  height: 16px;
  color: var(--muted);
  justify-self: center;
}

.upl-map-to {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  min-width: 0;
}

.upl-map-row .pill {
  justify-self: end;
}

@media (max-width: 860px) {
  .upl-map-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .upl-map-arr {
    display: none;
  }
  .upl-map-row .pill {
    justify-self: start;
  }
}
/* ====== Znacznik „@" w treści dokumentu — paleta, chipy, popover ====== */
/* przycisk paska narzędzi otwierający paletę */
.ed-tbtn-at {
  font-weight: 700;
  color: var(--accent-700);
}

/* paleta akcji (floating, pozycjonowana z JS: position:fixed) */
.ed-cmd {
  z-index: 60;
  width: 320px;
  max-width: calc(100vw - 24px);
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 32px rgba(16, 24, 40, 0.16);
  padding: 6px;
  overflow: hidden;
}

.ed-cmd-item {
  display: grid;
  grid-template-columns: 20px 1fr;
  grid-template-rows: auto auto;
  column-gap: 8px;
  align-items: center;
  width: 100%;
  text-align: left;
  padding: 7px 9px;
  border: 0;
  background: transparent;
  border-radius: var(--radius);
  cursor: pointer;
}

.ed-cmd-item:hover,
.ed-cmd-item.active {
  background: var(--accent-50);
}

.ed-cmd-at {
  grid-row: 1/span 2;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: var(--accent-700);
  background: var(--accent-100);
  border-radius: var(--radius);
  font-size: 12px;
}

.ed-cmd-l {
  font-size: 13px;
  font-weight: 650;
  color: var(--ink);
}

.ed-cmd-d {
  grid-column: 2;
  font-size: 11.5px;
  color: var(--muted);
}

/* kod rejestrowy przy etykiecie kandydata (np. SZBI-004, A.8.5) */
.ed-cmd-code {
  margin-left: 6px;
  font-variant-numeric: tabular-nums;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent-700);
}

/* nagłówek grupy (moduł źródłowy trafienia federacji „@") */
.ed-cmd-grp {
  padding: 8px 9px 3px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}

.ed-cmd-grp:first-child {
  padding-top: 3px;
}

/* wiersz stanu palety: podpowiedź / „Szukam…" / „Brak dopasowań" */
.ed-cmd-empty {
  padding: 9px 10px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.45;
}

/* ---- chip wspomnienia „@" (ADR-075): <span> w edytorze, <a> w czytniku ---- */
.ed-mention {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  margin: 0 1px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius);
  cursor: pointer;
  white-space: normal;
}

a.ed-mention:hover {
  background: var(--accent-100);
}

/* cel usunięty/nieznany — chip zdegradowany, bez linku (kolor „usunięty") */
.ed-mention.is-missing {
  color: var(--muted);
  background: var(--bg-2);
  border-color: var(--line);
  border-style: dashed;
  text-decoration: line-through;
  cursor: default;
}

/* chip wyjątku w treści */
.ed-chip-wyj {
  display: inline;
  white-space: normal;
}

.ed-chip-wyj > a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 1px 8px;
  margin: 0 1px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  color: var(--warn);
  background: var(--warn-bg);
  border: 1px solid #f3c98b;
  border-radius: var(--radius);
}

.ed-chip-wyj > a:hover {
  background: #fde9cc;
}

.ed-chip-wyj .ico {
  width: 13px;
  height: 13px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

/* chip odsyłacza (kontrola/dokument/ryzyko/…) */
.ed-chip-ref > a {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  margin: 0 1px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius);
}

.ed-chip-ref > a:hover {
  background: var(--accent-100);
}

/* popover wyjątku — modal */
.ed-wyj-backdrop {
  position: fixed;
  inset: 0;
  z-index: 70;
  background: rgba(16, 24, 40, 0.42);
}

.ed-wyj {
  position: fixed;
  z-index: 71;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 560px;
  max-width: calc(100vw - 24px);
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 56px rgba(16, 24, 40, 0.26);
}

.ed-wyj-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--line);
}

.ed-wyj-kicker {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--accent-700);
  margin-bottom: 4px;
}

.ed-wyj-head h3 {
  font-size: 16px;
  font-weight: 700;
  color: var(--ink);
  margin: 0;
}

.ed-wyj-x {
  border: 0;
  background: transparent;
  font-size: 22px;
  line-height: 1;
  color: var(--muted);
  cursor: pointer;
  padding: 0 4px;
}

.ed-wyj-x:hover {
  color: var(--ink);
}

.ed-wyj-body {
  padding: 14px 18px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ed-wyj-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  border-top: 1px solid var(--line);
}

.ed-wyj-foot .grow {
  flex: 1;
}

.ed-wyj-f {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ed-wyj-f > span {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
}

.ed-wyj-f > span i {
  font-weight: 400;
  font-style: normal;
  color: var(--muted);
}

.ed-wyj-f input,
.ed-wyj-f textarea,
.ed-wyj-f select {
  width: 100%;
  padding: 8px 10px;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  background: #fff;
}

.ed-wyj-f input:focus,
.ed-wyj-f textarea:focus,
.ed-wyj-f select:focus {
  outline: 0;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-50);
}

.ed-wyj-grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.ed-wyj-grid3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
}

.ed-wyj-risk {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ed-wyj-risk legend {
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  padding: 0 4px;
}

.ed-wyj-modes {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.ed-wyj-modes label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: var(--ink-2);
}

.ed-wyj-modes input {
  accent-color: var(--accent);
}

.ed-wyj-err {
  padding: 9px 12px;
  font-size: 12.5px;
  color: var(--danger);
  background: var(--danger-bg);
  border: 1px solid #f3b4ad;
  border-radius: var(--radius);
}

.ed-wyj-note {
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
}

/* presety kadencji zadania cyklicznego (akcja „@zadanie-cykliczne", ADR-076) */
.ed-rec-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ed-rec-preset {
  padding: 6px 12px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  cursor: pointer;
}

.ed-rec-preset:hover {
  border-color: var(--accent);
  color: var(--accent-700);
}

.ed-rec-preset.active {
  color: #fff;
  background: var(--accent);
  border-color: var(--accent);
}

@media (max-width: 600px) {
  .ed-wyj-grid2,
  .ed-wyj-grid3 {
    grid-template-columns: 1fr;
  }
}
/* atrybut [hidden] musi wygrać z display:flex/fixed powyżej (specyficzność klasa+atrybut) */
.ed-cmd[hidden],
.ed-wyj[hidden],
.ed-wyj-backdrop[hidden] {
  display: none;
}

/* ============================================================
   _comments.scss — panel KOMENTARZY do wersji dokumentu SZBI
   (RIG-NIS2-043, ADR-078). Wspólny partial w railu edytora oraz na
   widoku czytelnika/obiegu (_comments_panel.html.twig). Estetyka
   clean-light; kolor niesie wyłącznie status (otwarty/rozwiązany).
   Chipy „@" korzystają ze stylu `.ed-mention` z _editor.scss.
   ============================================================ */
.pc-panel .pc-h {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pc-panel .pc-h .ico {
  width: 16px;
  height: 16px;
  color: var(--muted);
  flex: none;
}

.pc-openbadge {
  margin-left: auto;
  font-size: 11px;
  font-weight: 700;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: 9999px;
  padding: 1px 8px;
}

.pc-unavailable {
  font-size: 12px;
  color: var(--muted);
  margin: 10px 0 0;
}

.pc-filter {
  display: inline-flex;
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 3px;
  margin: 10px 0 12px;
}

.pc-filter button {
  border: none;
  background: none;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  padding: 5px 11px;
  border-radius: 4px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.pc-filter button.on {
  background: var(--white);
  color: var(--ink);
  box-shadow: var(--shadow);
}

.pc-filter .c {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--muted);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 9999px;
  padding: 0 5px;
  min-width: 16px;
  text-align: center;
}

.pc-filter button.on .c {
  color: var(--accent-700);
  background: var(--accent-50);
  border-color: var(--accent-100);
}

.pc-list {
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.pc-list[data-filter=open] .pc-cmt[data-status=resolved] {
  display: none;
}

.pc-cmt {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 11px 12px;
  background: var(--white);
}

.pc-cmt[data-status=resolved] {
  background: var(--bg-2);
  border-style: dashed;
}

.pc-top {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 7px;
}

.pc-av {
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  background: var(--accent-100);
  color: var(--accent-700);
  display: grid;
  place-items: center;
  font-size: 10.5px;
  font-weight: 700;
  flex: none;
}

.pc-who {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  min-width: 0;
}

.pc-who b {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
}

.pc-when {
  margin-left: auto;
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}

.pc-body {
  font-size: 13px;
  color: var(--ink-2);
  margin: 0 0 9px;
  overflow-wrap: anywhere;
}

.pc-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.pc-st {
  font-size: 10.5px;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 9999px;
}

.pc-st.is-open {
  background: var(--warn-bg);
  color: var(--warn);
}

.pc-st.is-done {
  background: var(--ok-bg);
  color: var(--ok);
}

.pc-toggle-form {
  display: inline;
  margin: 0;
}

.pc-lnk {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-700);
  cursor: pointer;
  background: none;
  border: none;
  font-family: inherit;
  padding: 0;
}

.pc-lnk:hover {
  text-decoration: underline;
}

.pc-lnk.mut {
  color: var(--muted);
}

.pc-lnk.mut[disabled] {
  cursor: default;
  opacity: 0.6;
  text-decoration: none;
}

.pc-empty {
  color: var(--muted);
  font-size: 12.5px;
  text-align: center;
  padding: 18px 10px;
  margin: 0;
}

.pc-composer {
  position: relative;
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 13px;
}

.pc-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.pc-error {
  font-size: 12px;
  font-weight: 600;
  color: var(--warn);
  background: var(--warn-bg);
  border-radius: var(--radius);
  padding: 7px 10px;
  margin: 0 0 9px;
}

.pc-editor {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 9px 11px;
  font-family: inherit;
  font-size: 13px;
  color: var(--ink);
  min-height: 64px;
  outline: none;
}

.pc-editor:empty::before {
  content: attr(data-placeholder);
  color: var(--muted);
}

.pc-editor:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-50);
}

.pc-composer-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 9px;
}

.pc-hint {
  font-size: 11.5px;
  color: var(--muted);
}

.pc-composer-foot .btn {
  margin-left: auto;
}

/* ============================================================
   _audit.scss — Audyt wewnętrzny (kl. 9.2), pełnoekranowy kokpit.
   Port bogatego modułu v1 (audit-program + audit-przewodnik) do
   clean-light: program (KPI + postęp + lista ze stanami) nad
   kokpitem 3-kolumnowym aktywnego audytu (agenda ze stanami ·
   bieżący krok · szyna dowodów). Tryb wg stanu audytu:
   przygotowanie / wykonanie / przegląd.
   Kolor niesie WYŁĄCZNIE status (clean-light). Zaokrąglenia 6/8 px.
   ============================================================ */
/* ---------- KPI: wariant 6-kolumnowy programu ---------- */
.rig-kpis.k6 {
  grid-template-columns: repeat(6, 1fr);
}

@media (max-width: 1180px) {
  .rig-kpis.k6 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 720px) {
  .rig-kpis.k6 {
    grid-template-columns: repeat(2, 1fr);
  }
}
/* ---------- oś czasu programu (wykres Gantta) ---------- */
.aud-gantt-ttl {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 14px;
}

.aud-gantt {
  --gantt-lab: 92px;
}

.gantt-head,
.gantt-row {
  display: flex;
  align-items: center;
}

.gantt-head {
  margin-bottom: 6px;
}

.gantt-rowlab {
  width: var(--gantt-lab);
  flex: none;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.gantt-track {
  position: relative;
  flex: 1;
  min-width: 0;
}

/* siatka pionowa (12 miesięcy) jako tło ścieżki — spójna w nagłówku i wierszach */
.gantt-row .gantt-track {
  background-image: linear-gradient(to right, var(--line) 0 1px, transparent 1px);
  background-size: 8.3333333333% 100%;
}

.gantt-head .gantt-track {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
}

.gantt-mon {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--muted);
  text-align: center;
}

.gantt-body {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px 0;
}

.gantt-row {
  height: 24px;
}

.gantt-bar {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: 18px;
  min-width: 8px;
  border-radius: 5px;
  display: block;
  cursor: pointer;
  transition: filter 0.12s, box-shadow 0.12s;
}

.gantt-bar:hover {
  filter: brightness(0.94);
  box-shadow: 0 0 0 3px var(--accent-100);
}

.gantt-bar.g-ok {
  background: var(--ok);
}

.gantt-bar.g-warn {
  background: var(--warn);
}

.gantt-bar.g-todo {
  background: var(--line-2);
}

/* znacznik „dziś" — pionowa linia przez wszystkie wiersze */
.gantt-today {
  position: absolute;
  top: -2px;
  bottom: -2px;
  width: 0;
  border-left: 2px dashed var(--accent);
  pointer-events: none;
}

.gantt-today i {
  position: absolute;
  top: -3px;
  left: -4px;
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  background: var(--accent);
}

.gantt-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 11.5px;
  color: var(--muted);
}

.gantt-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.gantt-legend i {
  width: 12px;
  height: 8px;
  border-radius: 3px;
  flex: none;
}

.gantt-legend .g-ok {
  background: var(--ok);
}

.gantt-legend .g-warn {
  background: var(--warn);
}

.gantt-legend .g-todo {
  background: var(--line-2);
}

.gantt-legend .now-lab {
  margin-left: auto;
}

/* ---------- lista audytów programu (pełna szerokość) ---------- */
.aud-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.aud-table thead th {
  text-align: left;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  padding: 0 14px 9px;
  border-bottom: 1px solid var(--line);
}

.aud-table tbody td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}

.aud-table tbody tr {
  cursor: pointer;
  transition: background 0.12s;
}

.aud-table tbody tr:hover {
  background: var(--bg-2);
}

.aud-table tbody tr.active {
  background: var(--accent-50);
}

.aud-table tbody tr.active td:first-child {
  box-shadow: inset 3px 0 0 var(--accent);
}

.aud-table tbody tr:last-child td {
  border-bottom: 0;
}

.aud-table .code {
  font-weight: 700;
  color: var(--accent-700);
  white-space: nowrap;
}

.aud-table .code small {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
  margin-top: 2px;
}

.aud-table .sub {
  color: var(--muted);
}

.aud-table .mono {
  font-variant-numeric: tabular-nums;
  color: var(--ink-2);
  white-space: nowrap;
}

.aud-table .open {
  color: var(--accent);
  font-weight: 600;
  white-space: nowrap;
}

/* ---------- karta-kokpit pojedynczego audytu ---------- */
.aud-backbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.aud-cockpit {
  scroll-margin-top: 70px;
}

.aud-cockpit-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.aud-cockpit-head .ttl {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.aud-cockpit-head h2 {
  font-size: 17px;
  font-weight: 800;
}

.aud-cockpit-head .meta {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
  line-height: 1.5;
  max-width: 90ch;
}

.aud-mode {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-radius: var(--radius);
  padding: 3px 9px;
  border: 1px solid;
}

.aud-mode.info {
  background: var(--info-bg);
  color: var(--info);
  border-color: #c7d7f5;
}

.aud-mode.warn {
  background: var(--warn-bg);
  color: var(--warn);
  border-color: #f6dcae;
}

.aud-mode.accent,
.aud-mode.ok {
  background: var(--ok-bg);
  color: var(--ok);
  border-color: #bbe7cd;
}

.aud-banner {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 12px;
  line-height: 1.55;
  border: 1px solid;
  border-radius: var(--radius-lg);
  padding: 11px 14px;
  margin-bottom: 16px;
}

.aud-banner svg {
  width: 16px;
  height: 16px;
  flex: none;
  margin-top: 1px;
}

.aud-banner.info {
  background: var(--accent-50);
  border-color: var(--accent-100);
  color: #0b4a48;
}

.aud-banner.warn {
  background: var(--warn-bg);
  border-color: #f6dcae;
  color: #7a3a06;
}

.aud-banner.ok {
  background: var(--ok-bg);
  border-color: #bbe7cd;
  color: #0a5b38;
}

/* siatka 3-kolumnowa: agenda · krok · szyna dowodów */
.aud-grid {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 300px;
  gap: 18px;
  align-items: start;
}

@media (max-width: 1180px) {
  .aud-grid {
    grid-template-columns: 220px minmax(0, 1fr);
  }
  .aud-grid .aud-rail {
    grid-column: 1/-1;
  }
}
@media (max-width: 820px) {
  .aud-grid {
    grid-template-columns: 1fr;
  }
  .aud-grid .aud-agenda {
    grid-column: 1/-1;
  }
}
.aud-col {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.aud-col.sticky {
  position: sticky;
  top: 14px;
}

.aud-col-hd {
  padding: 13px 15px 0;
}

.aud-col-hd h3 {
  font-size: 13px;
  font-weight: 700;
}

.aud-col-hd .note {
  font-size: 11px;
  color: var(--muted);
  margin-top: 3px;
}

/* agenda (lewa) */
.aud-agenda .ag-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 15px 8px;
}

.aud-agenda .ag-top h3 {
  font-size: 13px;
  font-weight: 700;
}

.aud-agenda .ag-top .cnt {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
}

.aud-agenda .ag-bar {
  height: 6px;
  border-radius: 9999px;
  background: var(--grey-bg);
  margin: 0 15px 8px;
  overflow: hidden;
}

.aud-agenda .ag-bar > span {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 9999px;
}

.aud-aglist {
  padding: 4px 8px 10px;
}

.aud-agitem {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 9px;
  border-radius: var(--radius);
  font-size: 12px;
  color: var(--ink-2);
  border: 1px solid transparent;
  transition: background 0.12s;
}

.aud-agitem:hover {
  background: var(--bg-2);
}

.aud-agitem.active {
  background: var(--accent-50);
  border-color: var(--accent-100);
  font-weight: 700;
  color: var(--accent-700);
}

.aud-agitem .lbl {
  min-width: 0;
}

.aud-dot {
  width: 19px;
  height: 19px;
  border-radius: 9999px;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
}

.aud-dot.done {
  background: var(--accent);
  color: #fff;
}

.aud-dot.done svg {
  width: 11px;
  height: 11px;
}

.aud-dot.active {
  background: #fff;
  border: 2px solid var(--accent);
  color: var(--accent);
}

.aud-dot.todo {
  background: #fff;
  border: 2px solid var(--line-2);
  color: var(--muted);
}

.aud-agfoot {
  padding: 9px 15px 13px;
  border-top: 1px solid var(--line);
  font-size: 11px;
  color: var(--muted);
  line-height: 1.5;
}

/* krok aktywny (środek) */
.aud-step {
  padding: 16px 18px 18px;
}

.aud-step .kicker {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.aud-step .kicker .step-no {
  font-size: 10.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--accent);
}

.aud-step h3 {
  font-size: 16px;
  font-weight: 800;
}

.aud-step .step-meta {
  font-size: 12px;
  color: var(--muted);
  margin: 4px 0 14px;
  line-height: 1.5;
}

.aud-q {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
  padding: 13px 15px;
}

.aud-q + .aud-q {
  margin-top: 10px;
}

.aud-q .q-row {
  display: flex;
  gap: 9px;
  align-items: flex-start;
}

.aud-q .q-no {
  color: var(--accent);
  font-weight: 800;
  font-size: 13px;
  flex: none;
}

.aud-q .q-txt {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
  line-height: 1.5;
}

.aud-q .q-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: 9px;
}

.aud-q .q-find {
  margin-top: 9px;
  padding: 8px 10px;
  border-radius: var(--radius);
  font-size: 11.5px;
  line-height: 1.5;
  background: var(--warn-bg);
  border: 1px solid #f6dcae;
  color: #7a3a06;
}

.aud-q .q-find b {
  font-weight: 700;
}

.aud-points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.aud-points li {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.5;
}

.aud-points li svg {
  width: 15px;
  height: 15px;
  color: var(--accent);
  flex: none;
  margin-top: 2px;
}

/* ocena / notatka */
.aud-assess {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.aud-assess .ttl {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 8px;
}

.aud-rate {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.aud-rate .r {
  width: 36px;
  height: 36px;
  border-radius: 9999px;
  border: 1.5px solid var(--line);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
}

/* N7.2 (docs/rules.md §12.7): pigułki oceny kroku to dziś martwe znaczniki – kliknięcie
   nie zapisuje niczego. Dopóki zapisu nie ma, nie wolno ich reklamować kursorem „ręka":
   kursor „nie wolno" + wygaszenie mówią prawdę. Kolor nie jest jedynym nośnikiem –
   przy sekcji stoi callout „W przygotowaniu". */
.aud-rate[aria-disabled=true] .r {
  cursor: not-allowed;
  opacity: 0.55;
}

.aud-rate .r.ok {
  color: var(--ok);
  border-color: #bbe7cd;
}

.aud-rate .r.obs {
  color: var(--warn);
  border-color: #f6dcae;
}

.aud-rate .r.nc {
  color: var(--danger);
  border-color: #f3c9c9;
}

.aud-rate .r.na {
  color: var(--muted);
}

.aud-note {
  width: 100%;
  font-family: inherit;
  font-size: 12.5px;
  color: var(--ink);
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 9px 11px;
  line-height: 1.5;
}

.aud-note:focus {
  outline: 0;
  border-color: var(--accent);
}

/* Notatka bez zapisu jest `disabled` – wygląd musi to potwierdzać (wariant N1.6
   `.oe-field ...:disabled` z `_screens.scss`, tu powtórzony dla klasy `.aud-note`). */
.aud-note:disabled {
  background: var(--grey-bg);
  color: var(--muted);
  border-color: var(--line);
  cursor: not-allowed;
  resize: none;
}

.aud-note:disabled::placeholder {
  color: var(--muted);
  opacity: 0.7;
}

.aud-orgnote {
  font-size: 12px;
  color: var(--muted);
  font-style: italic;
}

/* przyciski (toolbar programu + nawigacja kroków) */
.aud-btn {
  font-size: 12.5px;
  font-weight: 600;
  border-radius: var(--radius);
  padding: 8px 14px;
  border: 1px solid var(--line);
  color: var(--ink-2);
  background: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}

.aud-btn:hover {
  border-color: var(--line-2);
}

.aud-btn svg {
  width: 15px;
  height: 15px;
}

.aud-btn.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.aud-btn.primary:hover {
  background: var(--accent-700);
}

.aud-btn.muted {
  color: var(--line-2);
  cursor: default;
  border-style: dashed;
}

/* toolbar nad listą audytów */
.aud-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.aud-toolbar h3 {
  font-size: 14px;
  font-weight: 700;
}

.aud-toolbar .sub {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 2px;
}

.aud-toolbar .acts {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* nawigacja kroków */
.aud-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  flex-wrap: wrap;
}

/* szyna dowodów (prawa) */
.aud-rail {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.aud-ev {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  transition: border-color 0.12s, background 0.12s;
}

.aud-ev:hover {
  border-color: var(--accent-200, #8fc6c0);
  background: var(--bg-2);
}

.aud-ev svg {
  width: 15px;
  height: 15px;
  color: var(--muted);
  flex: none;
  margin-top: 1px;
}

.aud-ev .et {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.35;
}

.aud-ev .em {
  font-size: 11px;
  color: var(--muted);
  margin-top: 1px;
}

.aud-evlist {
  padding: 4px 13px 14px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.aud-hint {
  border: 1px solid #f6dcae;
  background: var(--warn-bg);
  border-radius: var(--radius-lg);
  padding: 12px 14px;
}

.aud-hint .hh {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}

.aud-hint .hh svg {
  width: 15px;
  height: 15px;
  color: var(--warn);
}

.aud-hint .hh h3 {
  font-size: 12.5px;
  font-weight: 700;
  color: #7a3a06;
}

.aud-hint p {
  font-size: 12px;
  color: #7a3a06;
  line-height: 1.55;
  margin: 0;
}

/* źródła normatywne (tagi) + klauzula */
.src {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 9px;
  font-weight: 800;
  border-radius: 4px;
  padding: 2px 6px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border: 1px solid;
}

.src-iso {
  background: var(--accent-50);
  border-color: var(--accent-100);
  color: #1f5848;
}

.src-nis2 {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #3730a3;
}

.src-rodo {
  background: #fdf2f8;
  border-color: #fbcfe8;
  color: #9d174d;
}

.src-dora {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #9a3412;
}

.kl {
  font-family: ui-monospace, monospace;
  font-size: 10px;
  font-weight: 700;
  color: #28705c;
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: 4px;
  padding: 1px 5px;
}

/* ---------- formularz „Nowy audyt" ---------- */
.aud-typecards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}

@media (max-width: 820px) {
  .aud-typecards {
    grid-template-columns: 1fr;
  }
}
.aud-typecard {
  text-align: left;
  cursor: pointer;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 13px 15px;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.aud-typecard:hover {
  border-color: var(--line-2);
}

.aud-typecard.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-100);
}

.aud-typecard .tt {
  display: block;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
}

.aud-typecard .td {
  display: block;
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 3px;
  line-height: 1.45;
}

.aud-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 16px 18px;
  margin-bottom: 16px;
}

.aud-card > h3 {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 4px;
}

.aud-card > .card-sub {
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 14px;
  line-height: 1.5;
}

/* zaznaczane „chipy" klauzul / grup kontroli */
.aud-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aud-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 7px 11px;
  font-size: 12.5px;
  color: var(--ink-2);
  cursor: pointer;
}

.aud-chip:hover {
  border-color: var(--line-2);
}

.aud-chip input {
  accent-color: var(--accent);
  width: 14px;
  height: 14px;
}

.aud-chip b {
  color: var(--ink);
  font-weight: 700;
}

.aud-chip .n {
  margin-left: 4px;
  font-size: 11px;
  color: var(--muted);
}

.aud-annex {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

@media (max-width: 720px) {
  .aud-annex {
    grid-template-columns: 1fr;
  }
}
.aud-annex .aud-chip {
  justify-content: flex-start;
}

.aud-annex .aud-chip .grow {
  flex: 1;
}

/* sugerowani audytowani (z danych) */
.aud-sugg {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.aud-sugg-row {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 11px 13px;
}

.aud-sugg-row .av {
  width: 34px;
  height: 34px;
  border-radius: 9999px;
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 11px;
  font-weight: 700;
  display: grid;
  place-items: center;
  flex: none;
}

.aud-sugg-row .nm {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.aud-sugg-row .ro {
  font-size: 11.5px;
  color: var(--muted);
}

.aud-sugg-row .ob {
  font-size: 11.5px;
  color: var(--ink-2);
  margin-top: 3px;
  line-height: 1.45;
}

.aud-sugg-row .srcline {
  display: inline-block;
  font-size: 10.5px;
  color: var(--muted);
  background: var(--grey-bg);
  border-radius: 4px;
  padding: 1px 6px;
  margin-top: 5px;
}

/* Namiar normatywny wzoru audytu: na kaflu katalogu, w legendzie sekcji formularza i przy
   nagłówku planu w kokpicie. Jeden znacznik, jeden wygląd – etykieta nie klei się z tytułem. */
.aud-typecard .srcline,
.aud-card > h3 .srcline,
fieldset > legend .srcline,
.sec-title .srcline,
.rig-card > h3 .srcline {
  display: inline-block;
  font-weight: 400;
  font-size: 10.5px;
  color: var(--muted);
  background: var(--grey-bg);
  border-radius: 4px;
  padding: 1px 6px;
}

.aud-typecard .srcline {
  margin-top: 9px;
}

fieldset > legend .srcline,
.sec-title .srcline,
.rig-card > h3 .srcline,
.aud-card > h3 .srcline {
  margin-left: 8px;
}

/* kamienie milowe (audyt certyfikacyjny) */
.aud-stones {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.aud-stone {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 11px 13px;
}

.aud-stone input[type=checkbox] {
  accent-color: var(--accent);
  width: 15px;
  height: 15px;
  flex: none;
}

.aud-stone .info {
  flex: 1;
  min-width: 14rem;
}

.aud-stone .st {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.aud-stone .sd {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 2px;
}

.aud-stone .dates {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.aud-stone .dates label {
  display: flex;
  flex-direction: column;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  gap: 3px;
}

.aud-stone .dates input[type=date] {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 6px 8px;
  font-size: 12px;
  font-family: inherit;
  color: var(--ink);
}

.aud-stone .days {
  font-size: 11px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--grey-bg);
  border-radius: 9999px;
  padding: 3px 9px;
  align-self: flex-end;
}

/* numer punktu w szablonie własnym (8 pkt) */
.aud-stepno {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 9999px;
  background: var(--accent);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  margin-right: 6px;
}

/* przycisk-link „usuń" w wierszu sugestii */
.aud-xbtn {
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 2px;
  line-height: 0;
}

.aud-xbtn:hover {
  color: var(--danger);
}

.aud-xbtn svg {
  width: 16px;
  height: 16px;
}

/* ---------- tryb Przegląd (audyt zakończony, read-only) ---------- */
.aud-review {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
  align-items: start;
}

@media (max-width: 980px) {
  .aud-review {
    grid-template-columns: 1fr;
  }
}
.aud-rev-meta {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  padding: 16px 18px;
}

@media (max-width: 720px) {
  .aud-rev-meta {
    grid-template-columns: repeat(2, 1fr);
  }
}
.aud-rev-meta .k {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 3px;
}

.aud-rev-meta .v {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.aud-rev-meta .vs {
  font-size: 11px;
  color: var(--muted);
  margin-top: 1px;
}

.aud-rev-bar {
  height: 14px;
  border-radius: 9999px;
  overflow: hidden;
  display: flex;
  margin: 6px 0 12px;
}

.aud-rev-bar > span {
  display: block;
  height: 100%;
}

.aud-rev-bar .s-ok {
  background: var(--ok);
}

.aud-rev-bar .s-part {
  background: var(--warn);
}

.aud-rev-bar .s-nc {
  background: var(--danger);
}

.aud-rev-bar .s-na {
  background: var(--line-2);
}

.aud-rev-leg {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 11.5px;
  color: var(--ink-2);
}

.aud-rev-leg span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.aud-rev-leg i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  flex: none;
}

.aud-find-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 13px;
  border-radius: var(--radius-lg);
  border: 1px solid;
  font-size: 12.5px;
}

.aud-find-row + .aud-find-row {
  margin-top: 9px;
}

.aud-find-row.nc {
  background: var(--danger-bg);
  border-color: #f3c9c9;
}

.aud-find-row.obs {
  background: var(--info-bg);
  border-color: #c7d7f5;
}

.aud-find-row .ff {
  flex: 1;
}

.aud-find-row .ft {
  font-weight: 700;
}

.aud-find-row .fd {
  color: var(--ink-2);
  margin-top: 2px;
}

.aud-find-row .fs {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  white-space: nowrap;
}

.aud-find-row .fs.closed {
  color: var(--ok);
}

/* ============================================================
   Cykl życia dokumentu (Faza D) — Zatwierdzanie + Zapoznanie.
   Oba ekrany dzielą powłokę czytnika (rig-reader); tu tylko warstwa
   statusu/akcji. Kolor niesie wyłącznie status; max rounded-lg; ikony mono SVG.
   ============================================================ */
/* --- wejścia do etapów cyklu życia z karty „Obieg i akceptacje" (czytnik) --- */
.rig-rail-links {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.rig-rail-links a {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-700);
}

.rig-rail-links a:hover {
  text-decoration: underline;
}

/* --- wspólne: znacznik zmienionej sekcji --- */
.lc-chg {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-radius: 9999px;
  padding: 2px 7px;
  flex: none;
  line-height: 1.5;
  background: var(--warn-bg);
  color: var(--warn);
}

.rig-toc-link .lc-chg {
  margin-left: auto;
}

.lc-sec-changed {
  box-shadow: inset 3px 0 0 var(--warn);
}

.lc-bar-status {
  display: inline-flex;
  align-items: center;
}

.lc-summary {
  margin-bottom: 22px;
}

/* ============================================================
   Zatwierdzanie — oś obiegu + panel decyzji
   ============================================================ */
.lc-chain {
  list-style: none;
  margin: 0 0 4px;
  padding: 0;
}

.lc-step {
  display: grid;
  grid-template-columns: 26px 1fr;
  gap: 10px;
  position: relative;
  padding-bottom: 16px;
}

.lc-step:last-child {
  padding-bottom: 0;
}

/* pionowy łącznik między krokami */
.lc-step:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 26px;
  bottom: 0;
  width: 2px;
  background: var(--line);
}

.lc-step--done:not(:last-child)::before {
  background: var(--ok);
}

.lc-step-dot {
  width: 26px;
  height: 26px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  border: 1.5px solid var(--line-2);
  background: #fff;
  color: var(--muted);
  z-index: 1;
}

.lc-step-dot .ico {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.5;
}

.lc-step--done .lc-step-dot {
  background: var(--ok-bg);
  border-color: var(--ok);
  color: var(--ok);
}

.lc-step--active .lc-step-dot {
  background: var(--accent-50);
  border-color: var(--accent);
  color: var(--accent-700);
  box-shadow: 0 0 0 3px var(--accent-100);
}

.lc-step-body .r {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.lc-step-body .p {
  font-size: 12px;
  color: var(--ink-2);
  margin-top: 1px;
}

.lc-step-body .st {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}

.lc-step--active .lc-step-body .st {
  color: var(--warn);
}

/* uwagi z ostatniej decyzji zatwierdzającego (jedyny utrwalony ślad decyzji) */
.lc-decision-comment {
  margin-top: 14px;
  font-size: 12.5px;
}

.lc-decision {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.lc-dec {
  width: 100%;
  justify-content: center;
}

.lc-dec--approve {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.lc-dec--approve:hover {
  background: var(--accent-700);
  border-color: var(--accent-700);
}

.lc-dec--changes {
  background: #fff;
  border-color: var(--line-2);
  color: var(--warn);
}

.lc-dec--changes:hover {
  background: var(--warn-bg);
}

.lc-dec--reject {
  background: #fff;
  border-color: var(--line-2);
  color: var(--danger);
}

.lc-dec--reject:hover {
  background: var(--danger-bg);
}

.lc-decision-note {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.5;
  margin: 4px 0 0;
}

/* ============================================================
   Zapoznanie — zmiany, termin, potwierdzenie
   ============================================================ */
/* baner „co się zmieniło" */
.ack-changed {
  margin-bottom: 20px;
}

/* konto bez osoby w katalogu — potwierdzenie niedostępne */
.ack-no-person {
  margin-top: 20px;
}

.ack-changed ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.ack-changed li {
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.6;
}

/* termin */
.ack-deadline {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ack-deadline .ico {
  width: 18px;
  height: 18px;
  color: var(--warn);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  flex: none;
}

.ack-deadline-d {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.ack-deadline-s {
  font-size: 11.5px;
  color: var(--warn);
}

/* sekcja potwierdzenia */
.ack-confirm {
  margin-top: 8px;
  padding: 22px;
  border: 1px solid var(--accent-100);
  border-radius: var(--radius-lg);
  background: var(--accent-50);
}

.ack-confirm h3 {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 4px;
}

.ack-confirm p {
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.55;
  margin: 0 0 14px;
}

.ack-confirm-btn {
  font-size: 14px;
  padding: 11px 20px;
}

.ack-confirmed {
  margin-top: 8px;
  padding: 22px;
  border: 1px solid var(--ok);
  border-radius: var(--radius-lg);
  background: var(--ok-bg);
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.ack-confirmed .ico {
  width: 26px;
  height: 26px;
  color: var(--ok);
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  flex: none;
}

.ack-confirmed h3 {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 2px;
}

.ack-confirmed .m {
  font-size: 12.5px;
  color: var(--ink-2);
}

.ack-confirmed .t {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 2px;
}

.ack-confirmed .next {
  margin-top: 10px;
}

/* postęp kampanii */
.ack-camp {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.ack-camp-row {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
}

.ack-camp-dot {
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10.5px;
  font-weight: 700;
  flex: none;
  border: 1.5px solid var(--line-2);
  background: #fff;
  color: var(--muted);
}

.ack-camp-dot .ico {
  width: 11px;
  height: 11px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.5;
}

.ack-camp-row.done .ack-camp-dot {
  background: var(--ok-bg);
  border-color: var(--ok);
  color: var(--ok);
}

.ack-camp-row.current .ack-camp-dot {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.ack-camp-name {
  color: var(--ink-2);
  min-width: 0;
}

.ack-camp-row.current .ack-camp-name {
  color: var(--ink);
  font-weight: 600;
}

.ack-camp-when {
  margin-left: auto;
  font-size: 11px;
  white-space: nowrap;
}

.ack-camp-row.done .ack-camp-when {
  color: var(--ok);
}

.ack-camp-row.current .ack-camp-when {
  color: var(--warn);
}

.ack-camp-bar {
  height: 6px;
  background: var(--line);
  border-radius: 9999px;
  overflow: hidden;
}

.ack-camp-bar i {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 9999px;
}

.ack-camp-sub {
  font-size: 11px;
  color: var(--muted);
  margin-top: 6px;
}

/* ============================================================
   Ekran decyzji (P-28) — formularz komentarza + stan wynikowy
   ============================================================ */
.lc-decision-screen {
  max-width: 880px;
}

.lc-decision-form {
  margin: 0 0 22px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
}

.lc-decision-form .oe-field {
  margin-bottom: 0;
}

.lc-decision-form .oe-actions {
  margin-top: 16px;
}

/* podgląd zmienionych sekcji */
.lc-prev h3 {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 12px;
}

.lc-prev-sec {
  padding: 14px 0;
  border-top: 1px solid var(--line);
}

.lc-prev-sec:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.lc-prev-sec .rig-sec-h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.lc-prev-sec .rig-sec-h .n {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
}

.lc-prev-sec .rig-sec-h h2 {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  margin: 0;
}

/* stan wynikowy */
.lc-result {
  padding: 28px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  background: #fff;
  text-align: center;
}

.lc-result-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 9999px;
  margin-bottom: 14px;
}

.lc-result-icon .ico {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.lc-result h2 {
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 6px;
}

.lc-result p {
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.6;
  margin: 0 auto 18px;
  max-width: 560px;
}

.lc-result-links {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}

.lc-result--approve {
  border-color: var(--ok);
  background: var(--ok-bg);
}

.lc-result--approve .lc-result-icon {
  background: var(--ok);
  color: #fff;
}

.lc-result--changes .lc-result-icon {
  background: var(--warn-bg);
  color: var(--warn);
}

.lc-result--reject .lc-result-icon {
  background: var(--danger-bg);
  color: var(--danger);
}

/* ============================================================
   _risk-analytics.scss – zakładka „Analityka" w module Ryzyko (/risks).
   Widżety analityczne (mapa cieplna 5×5, rozkład, donut, przekrój, trend)
   na tokenach v2 (_tokens.scss). Wszystko pod .rig-analytics, żeby generyczne
   nazwy klas (card, kpi, grid, b, cell…) nie kolidowały z globalnymi v2.
   Źródło wizualne: public/propozycje/analityka-ryzyka-2026-06-17 (zaakceptowane).
   ============================================================ */
.rig-analytics {
  /* poziomy ryzyka (DAPR-ISMS-006 §7.4) + szarość — lokalnie, niezależnie od globalnych */
  --lvl-low: #067647;
  --lvl-low-bg: #e7f8ef;
  --lvl-med: #a16207;
  --lvl-med-bg: #fef7e0;
  --lvl-high: #c2410c;
  --lvl-high-bg: #ffeee3;
  --lvl-crit: #9f1239;
  --lvl-crit-bg: #fce7ec;
  --grey: #475467;
  /* pasek sterowania */
  /* KPI */
  /* grid kart */
  /* badge poziomu */
  /* mapa cieplna 5×5 */
  /* słupki rozkładu */
  /* donut postępowania */
  /* wg domeny */
  /* top-N lista */
  /* słupki właściciele / annex */
  /* przekrój / pivot */
  /* trend */
  /* nota */
}
.rig-analytics .ctrl {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 11px 14px;
  box-shadow: var(--shadow);
  margin-bottom: 16px;
}
.rig-analytics .ctrl .grp {
  display: flex;
  align-items: center;
  gap: 8px;
}
.rig-analytics .ctrl .lab {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.rig-analytics .ctrl .sp {
  flex: 1;
}
.rig-analytics .pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.rig-analytics .pillf {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 12px;
  cursor: pointer;
}
.rig-analytics .pillf .n {
  color: var(--muted);
}
.rig-analytics .pillf.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.rig-analytics .pillf.active .n {
  color: rgba(255, 255, 255, 0.82);
}
.rig-analytics .seg {
  display: inline-flex;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  overflow: hidden;
  background: #fff;
}
.rig-analytics .seg button {
  border: 0;
  background: #fff;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  padding: 7px 13px;
  cursor: pointer;
}
.rig-analytics .seg button + button {
  border-left: 1px solid var(--line);
}
.rig-analytics .seg button.active {
  background: var(--accent);
  color: #fff;
}
.rig-analytics .sel {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 6px 11px;
  background: #fff;
  font-family: inherit;
  cursor: pointer;
}
.rig-analytics .kpis {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}
.rig-analytics .kpi {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 14px 15px;
  box-shadow: var(--shadow);
}
.rig-analytics .kpi .lab {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--muted);
}
.rig-analytics .kpi .val {
  font-size: 26px;
  font-weight: 800;
  color: var(--accent);
  margin-top: 5px;
  line-height: 1;
  letter-spacing: -0.02em;
  font-family: "Manrope", "Inter", sans-serif;
}
.rig-analytics .kpi .val.warn {
  color: var(--warn);
}
.rig-analytics .kpi .val.crit {
  color: var(--lvl-crit);
}
.rig-analytics .kpi .val.ok {
  color: var(--ok);
}
.rig-analytics .kpi .hint {
  font-size: 11px;
  color: var(--muted);
  margin-top: 6px;
  line-height: 1.4;
}
.rig-analytics .grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}
.rig-analytics .card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 16px 17px;
  min-width: 0;
}
.rig-analytics .span7 {
  grid-column: span 7;
}
.rig-analytics .span5 {
  grid-column: span 5;
}
.rig-analytics .span6 {
  grid-column: span 6;
}
.rig-analytics .span4 {
  grid-column: span 4;
}
.rig-analytics .span8 {
  grid-column: span 8;
}
.rig-analytics .span12 {
  grid-column: span 12;
}
.rig-analytics .card-h {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 14px;
}
.rig-analytics .card-h h3 {
  font-size: 15px;
  font-weight: 800;
}
.rig-analytics .card-h .sub {
  font-size: 11.5px;
  color: var(--muted);
}
.rig-analytics .card-h .sp {
  flex: 1;
}
.rig-analytics .card-h .tag {
  font-size: 11px;
  font-weight: 700;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: 999px;
  padding: 3px 9px;
}
.rig-analytics .b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 700;
  border-radius: 999px;
  padding: 3px 9px;
  white-space: nowrap;
}
.rig-analytics .b::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
  flex: none;
}
.rig-analytics .b.low {
  background: var(--lvl-low-bg);
  color: var(--lvl-low);
}
.rig-analytics .b.med {
  background: var(--lvl-med-bg);
  color: var(--lvl-med);
}
.rig-analytics .b.high {
  background: var(--lvl-high-bg);
  color: var(--lvl-high);
}
.rig-analytics .b.crit {
  background: var(--lvl-crit-bg);
  color: var(--lvl-crit);
}
.rig-analytics .b.muted {
  background: var(--grey-bg);
  color: var(--grey);
}
.rig-analytics .b.muted::before {
  display: none;
}
.rig-analytics .heat-wrap {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  flex-wrap: wrap;
}
.rig-analytics .heat-frame {
  display: flex;
  gap: 8px;
  flex: 1;
  min-width: 360px;
}
.rig-analytics .axisK {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-align: center;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  padding-bottom: 22px;
}
.rig-analytics .heat-main {
  flex: 1;
  min-width: 0;
}
.rig-analytics .heat-grid {
  display: grid;
  grid-template-columns: 24px repeat(5, 1fr);
  gap: 5px;
}
.rig-analytics .heat-grid .colh {
  font-size: 11px;
  font-weight: 700;
  color: var(--ink-2);
  text-align: center;
  padding-bottom: 2px;
}
.rig-analytics .heat-grid .rowh {
  font-size: 11px;
  font-weight: 700;
  color: var(--ink-2);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 3px;
}
.rig-analytics .cell {
  position: relative;
  border-radius: var(--radius);
  aspect-ratio: 1.5/1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: default;
  border: 1px solid rgba(0, 0, 0, 0.04);
  transition: transform 0.08s;
}
.rig-analytics .cell:hover {
  transform: scale(1.04);
  z-index: 2;
  box-shadow: var(--shadow);
}
.rig-analytics .cell .cnt {
  font-size: 14px;
  font-weight: 800;
  font-family: "Manrope", "Inter", sans-serif;
  line-height: 1;
}
.rig-analytics .cell .r {
  font-size: 9.5px;
  font-weight: 600;
  opacity: 0.8;
  margin-top: 2px;
}
.rig-analytics .cell.l-low {
  background: #d6f0e0;
  color: #06502f;
}
.rig-analytics .cell.l-med {
  background: #fbe8bf;
  color: #7a4d06;
}
.rig-analytics .cell.l-high {
  background: #fbd3be;
  color: #922f0a;
}
.rig-analytics .cell.l-crit {
  background: #f4b6c4;
  color: #7c0f2e;
}
.rig-analytics .heat-axisP {
  text-align: center;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  padding: 6px 0 0 24px;
}
.rig-analytics .heat-side {
  flex: none;
  width: 188px;
  font-size: 12px;
}
.rig-analytics .heat-side .thr {
  border: 1px dashed var(--lvl-high);
  background: var(--lvl-high-bg);
  color: var(--lvl-high);
  border-radius: var(--radius);
  padding: 8px 10px;
  font-weight: 600;
  font-size: 11.5px;
  line-height: 1.45;
  margin-bottom: 12px;
}
.rig-analytics .leg-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  color: var(--ink-2);
}
.rig-analytics .leg-row .sw {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  flex: none;
}
.rig-analytics .leg-row .sw.l-low {
  background: #d6f0e0;
}
.rig-analytics .leg-row .sw.l-med {
  background: #fbe8bf;
}
.rig-analytics .leg-row .sw.l-high {
  background: #fbd3be;
}
.rig-analytics .leg-row .sw.l-crit {
  background: #f4b6c4;
}
.rig-analytics .leg-row b {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
}
.rig-analytics .dist {
  display: flex;
  flex-direction: column;
  gap: 13px;
}
.rig-analytics .dist .row .top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 5px;
}
.rig-analytics .dist .row .nm {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
}
.rig-analytics .dist .row .vv {
  font-size: 12px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.rig-analytics .dist .row .vv b {
  color: var(--ink);
  font-weight: 700;
  margin-right: 5px;
}
.rig-analytics .track {
  height: 9px;
  border-radius: 999px;
  background: var(--grey-bg);
  overflow: hidden;
}
.rig-analytics .track i {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.rig-analytics .track i.low {
  background: var(--lvl-low);
}
.rig-analytics .track i.med {
  background: var(--lvl-med);
}
.rig-analytics .track i.high {
  background: var(--lvl-high);
}
.rig-analytics .track i.crit {
  background: var(--lvl-crit);
}
.rig-analytics .donut-wrap {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.rig-analytics .donut {
  flex: none;
}
.rig-analytics .dleg {
  flex: 1;
  min-width: 160px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.rig-analytics .dleg .r {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
}
.rig-analytics .dleg .dot {
  width: 11px;
  height: 11px;
  border-radius: 3px;
  flex: none;
}
.rig-analytics .dleg .nm {
  color: var(--ink-2);
  font-weight: 600;
}
.rig-analytics .dleg .pc {
  margin-left: auto;
  font-weight: 700;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.rig-analytics .dleg .ct {
  color: var(--muted);
  font-size: 11.5px;
  font-variant-numeric: tabular-nums;
  width: 54px;
  text-align: right;
}
.rig-analytics .dom-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.rig-analytics .dom {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 13px 14px;
  background: var(--bg-2);
}
.rig-analytics .dom .tt {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  font-size: 13.5px;
  font-family: "Manrope", "Inter", sans-serif;
}
.rig-analytics .dom .tt .chip {
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  border-radius: 4px;
  padding: 2px 6px;
}
.rig-analytics .dom .big {
  font-size: 22px;
  font-weight: 800;
  font-family: "Manrope", "Inter", sans-serif;
  margin: 9px 0 2px;
  letter-spacing: -0.02em;
}
.rig-analytics .dom .ml {
  display: flex;
  justify-content: space-between;
  font-size: 11.5px;
  color: var(--muted);
  padding: 3px 0;
  border-top: 1px solid var(--line);
  margin-top: 7px;
}
.rig-analytics .dom .ml b {
  color: var(--ink-2);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.rig-analytics .topn {
  display: flex;
  flex-direction: column;
}
.rig-analytics .tn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}
.rig-analytics .tn:first-child {
  border-top: 0;
}
.rig-analytics a.tn {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
.rig-analytics a.tn:hover .nm {
  color: var(--accent-700);
}
.rig-analytics .tn .rk {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: var(--grey-bg);
  color: var(--ink-2);
  font-size: 11px;
  font-weight: 800;
  display: grid;
  place-items: center;
  flex: none;
  font-family: "Manrope", "Inter", sans-serif;
}
.rig-analytics .tn .meta {
  flex: 1;
  min-width: 0;
}
.rig-analytics .tn .nm {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rig-analytics .tn .sub {
  font-size: 11.5px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rig-analytics .tn .code {
  font-size: 10.5px;
  font-weight: 800;
  color: var(--accent-700);
  font-variant-numeric: tabular-nums;
}
.rig-analytics .tn .pk {
  font-size: 11.5px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.rig-analytics .tn .pk b {
  color: var(--ink);
  font-weight: 700;
}
.rig-analytics .hbars {
  display: flex;
  flex-direction: column;
  gap: 11px;
}
.rig-analytics .hbar {
  display: grid;
  grid-template-columns: 150px 1fr 42px;
  align-items: center;
  gap: 10px;
}
.rig-analytics .hbar .nm {
  font-size: 12.5px;
  color: var(--ink-2);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rig-analytics .hbar .bk {
  height: 18px;
  border-radius: var(--radius);
  background: var(--grey-bg);
  overflow: hidden;
}
.rig-analytics .hbar .bk i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--accent-700));
  border-radius: var(--radius);
}
.rig-analytics .hbar .bk i.warn {
  background: linear-gradient(90deg, #e08a3c, var(--warn));
}
.rig-analytics .hbar .vv {
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.rig-analytics .pivot-ctrl {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  padding: 12px 14px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  margin-bottom: 14px;
}
.rig-analytics .pivot-ctrl .f {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.rig-analytics .pivot-ctrl .f .lab {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.rig-analytics .pivot-ctrl .arrow {
  align-self: flex-end;
  color: var(--muted);
  padding-bottom: 8px;
}
.rig-analytics .xtab {
  width: 100%;
  border-collapse: separate;
  border-spacing: 4px;
  font-size: 12.5px;
}
.rig-analytics .xtab th {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  padding: 5px 8px;
  text-align: center;
}
.rig-analytics .xtab th.rh {
  text-align: left;
}
.rig-analytics .xtab td.rh {
  font-weight: 600;
  color: var(--ink-2);
  white-space: nowrap;
  padding-right: 8px;
}
.rig-analytics .xtab td.c {
  text-align: center;
  border-radius: var(--radius);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  padding: 9px 8px;
  color: #0b3b34;
}
.rig-analytics .xtab td.sum {
  font-weight: 800;
  color: var(--ink);
  background: var(--grey-bg);
  border-radius: var(--radius);
  text-align: center;
  padding: 9px 8px;
  font-variant-numeric: tabular-nums;
}
.rig-analytics .dimlist {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.rig-analytics .dimlist .d {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink-2);
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 10px;
}
.rig-analytics .dimlist .d.on {
  background: var(--accent-50);
  border-color: var(--accent-100);
  color: var(--accent-700);
}
.rig-analytics .trend svg {
  width: 100%;
  height: auto;
  display: block;
}
.rig-analytics .trend .xlab {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--muted);
  margin-top: 6px;
  font-variant-numeric: tabular-nums;
}
.rig-analytics .note {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: var(--radius-lg);
  padding: 15px 17px;
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.6;
  box-shadow: var(--shadow);
}
.rig-analytics .note.info {
  background: var(--accent-50);
  border-color: var(--accent-100);
  color: #0b4a48;
}
.rig-analytics .note h4 {
  margin: 0 0 7px;
  font-size: 13px;
  font-weight: 800;
  color: var(--ink);
}
.rig-analytics .note ul {
  margin: 8px 0 0;
  padding-left: 18px;
}
.rig-analytics .note li {
  margin: 3px 0;
}
@media (max-width: 1080px) {
  .rig-analytics .kpis {
    grid-template-columns: repeat(3, 1fr);
  }
  .rig-analytics .span7,
  .rig-analytics .span5,
  .rig-analytics .span6,
  .rig-analytics .span4,
  .rig-analytics .span8 {
    grid-column: span 12;
  }
  .rig-analytics .dom-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .rig-analytics .kpis {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ============================================================
   _pulpit.scss – Pulpit KONFIGUROWALNY (/dashboard).
   Tryb edycji + biblioteka widgetów + przeciąganie + układy ról.
   Scoped pod .rig-pulpit (zero kolizji z innymi ekranami v2).
   Reuse istniejących pigułek (.pill) i miernika (.rig-meter); reszta tu.
   ============================================================ */
.rig-pulpit {
  /* poziomy ryzyka — kolory pasków/komórek (pigułki = .pill.lvl-*) */
  --lvl-low: #067647;
  --lvl-med: #a16207;
  --lvl-high: #c2410c;
  --lvl-crit: #9f1239;
  /* ---------- nagłówek + narzędzia ---------- */
  /* ---------- pasek trybu personalizacji ---------- */
  /* ---------- tryb edycji (klasa na kontenerze) ---------- */
  /* ---------- siatka 12-kolumnowa ---------- */
  /* ---------- kafel (widget) ---------- */
  /* chrome trybu edycji */
  /* kafelek „Dodaj widget" */
  /* ---------- prymitywy treści ---------- */
  /* stan „brak danych" kafla (#DB-11) — sąsiad pusty/rzucił, isms_ niezbudowany lub karta-link soon */
  /* paski (frameworki / pomiary / rozkład) */
  /* mapa cieplna – liczba kolumn = rozmiar skali P skonfigurowanej metodyki
     (--pw-heat-cols ustawia szablon z danych; 5 to fallback prototypu) */
  /* donut */
  /* dowody — świeżość */
  /* ---------- katalog widgetów (INLINE, w flow — drawery OUT, delta N13/P-71) ---------- */
  /* Renderowany w normalnym przepływie dokumentu: bez position:fixed, translateX, scrim/backdrop.
     Widoczny wyłącznie w trybie personalizacji (`.editing`) po rozwinięciu (klasa `is-open`). */
  /* przełącznik */
  /* zwężenie — kolaps siatki */
}
.rig-pulpit.rig-head,
.rig-pulpit .pulpit-head {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
}
.rig-pulpit .pulpit-head .tt {
  flex: 1;
  min-width: 240px;
}
.rig-pulpit .pulpit-tools {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.rig-pulpit .pulpit-view-tools {
  display: flex;
  align-items: center;
  gap: 10px;
}
.rig-pulpit .pulpit-edit-tools {
  display: none;
  align-items: center;
  gap: 10px;
}
.rig-pulpit .pbtn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  border-radius: var(--radius);
  padding: 8px 14px;
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
}
.rig-pulpit .pbtn svg {
  width: 15px;
  height: 15px;
  flex: none;
}
.rig-pulpit .pbtn.primary {
  background: var(--accent);
  color: #fff;
}
.rig-pulpit .pbtn.primary:hover {
  background: var(--accent-700);
}
.rig-pulpit .pbtn.ghost {
  background: var(--white);
  color: var(--ink);
  border-color: var(--line-2);
}
.rig-pulpit .pbtn.ghost:hover {
  background: var(--bg-2);
}
.rig-pulpit .pulpit-editbar {
  display: none;
  align-items: center;
  gap: 12px;
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius-lg);
  padding: 10px 14px;
  margin-bottom: 16px;
  font-size: 12.5px;
  color: var(--accent-700);
}
.rig-pulpit .pulpit-editbar svg {
  width: 16px;
  height: 16px;
  flex: none;
  color: var(--accent);
}
.rig-pulpit .pulpit-editbar b {
  font-weight: 700;
}
.rig-pulpit.editing {
  /* katalog widgetów INLINE — widoczny dopiero po rozwinięciu (klasa `is-open`) w trybie personalizacji */
}
.rig-pulpit.editing .pulpit-view-tools {
  display: none;
}
.rig-pulpit.editing .pulpit-edit-tools {
  display: flex;
}
.rig-pulpit.editing .pulpit-editbar {
  display: flex;
}
.rig-pulpit.editing .pw-add {
  display: flex;
}
.rig-pulpit.editing .pw {
  border-style: dashed;
  border-color: var(--line-2);
}
.rig-pulpit.editing .pw:hover {
  border-color: var(--accent-100);
  box-shadow: 0 0 0 3px var(--accent-50);
}
.rig-pulpit.editing .pw-grip,
.rig-pulpit.editing .pw-chrome {
  display: flex;
}
.rig-pulpit.editing .pulpit-lib-inline.is-open {
  display: block;
}
.rig-pulpit .pw-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}
.rig-pulpit .span3 {
  grid-column: span 3;
}
.rig-pulpit .span4 {
  grid-column: span 4;
}
.rig-pulpit .span5 {
  grid-column: span 5;
}
.rig-pulpit .span6 {
  grid-column: span 6;
}
.rig-pulpit .span7 {
  grid-column: span 7;
}
.rig-pulpit .span8 {
  grid-column: span 8;
}
.rig-pulpit .span12 {
  grid-column: span 12;
}
.rig-pulpit .pw {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 15px 16px;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
}
.rig-pulpit .pw[hidden] {
  display: none;
}
.rig-pulpit .pw.dragging {
  opacity: 0.4;
}
.rig-pulpit .pw.drop-before {
  box-shadow: -4px 0 0 0 var(--accent);
}
.rig-pulpit .pw.drop-after {
  box-shadow: 4px 0 0 0 var(--accent);
}
.rig-pulpit .pw-h {
  display: flex;
  align-items: baseline;
  gap: 9px;
  margin-bottom: 11px;
}
.rig-pulpit .pw-h .kick {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}
.rig-pulpit .pw-h h3 {
  font-size: 14.5px;
  font-weight: 800;
  color: var(--ink);
  margin: 0;
}
.rig-pulpit .pw-h .sp {
  flex: 1;
}
.rig-pulpit .pw-h .go {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.rig-pulpit .pw-h .go svg {
  width: 13px;
  height: 13px;
}
.rig-pulpit .pw-grip {
  display: none;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 28px;
  height: 26px;
  cursor: grab;
  align-items: center;
  justify-content: center;
  color: #b3bac6;
  background: var(--white);
  border: 1px solid var(--line-2);
  border-radius: var(--radius-lg) 0 var(--radius) 0;
  z-index: 3;
}
.rig-pulpit .pw-grip svg {
  width: 15px;
  height: 15px;
}
.rig-pulpit .pw-chrome {
  display: none;
  position: absolute;
  top: -1px;
  right: -1px;
  align-items: center;
  gap: 2px;
  background: var(--white);
  border: 1px solid var(--line-2);
  border-radius: 0 var(--radius-lg) 0 var(--radius);
  padding: 3px 4px;
  z-index: 3;
}
.rig-pulpit .pw-ib {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: var(--radius);
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.rig-pulpit .pw-ib svg {
  width: 15px;
  height: 15px;
}
.rig-pulpit .pw-ib:hover {
  background: var(--grey-bg);
  color: var(--ink);
}
.rig-pulpit .pw-ib.rm:hover {
  background: var(--danger-bg);
  color: var(--danger);
}
.rig-pulpit .pw-add {
  display: none;
  grid-column: span 4;
  border: 2px dashed var(--line-2);
  border-radius: var(--radius-lg);
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 96px;
}
.rig-pulpit .pw-add svg {
  width: 16px;
  height: 16px;
}
.rig-pulpit .pw-add:hover {
  border-color: var(--accent);
  color: var(--accent-700);
  background: var(--accent-50);
}
.rig-pulpit .pw-kpi .val {
  font-size: 30px;
  font-weight: 800;
  color: var(--accent);
  line-height: 1;
  letter-spacing: -0.02em;
  font-family: "Manrope", sans-serif;
  margin-top: auto;
}
.rig-pulpit .pw-kpi .val.ok {
  color: var(--ok);
}
.rig-pulpit .pw-kpi .val.warn {
  color: var(--warn);
}
.rig-pulpit .pw-kpi .val.crit {
  color: var(--lvl-crit);
}
.rig-pulpit .pw-kpi .val.pw-date {
  font-size: 24px;
}
.rig-pulpit .pw-kpi .hint {
  font-size: 11px;
  color: var(--muted);
  margin-top: 7px;
  line-height: 1.4;
}
.rig-pulpit .pw-lead {
  font-size: 12.5px;
  color: var(--ink-2);
  margin: 0;
  line-height: 1.5;
}
.rig-pulpit .pw-meter-full {
  margin-top: 12px;
  min-width: 0;
}
.rig-pulpit .pw-note {
  font-size: 11.5px;
  color: var(--muted);
  margin: 10px 0 0;
}
.rig-pulpit .pw-empty {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 14px 2px;
}
.rig-pulpit .pw-empty-t {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  margin: 0;
}
.rig-pulpit .pw-empty-s {
  font-size: 11.5px;
  color: var(--muted);
  margin: 0;
}
.rig-pulpit .pw-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.rig-pulpit .pw-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
}
.rig-pulpit .pw-list li .t {
  flex: 1;
  color: var(--ink);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rig-pulpit .pw-list li .t .code {
  color: var(--muted);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.rig-pulpit .pw-list li .d {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-size: 11.5px;
}
.rig-pulpit .pw-rows {
  display: flex;
  flex-direction: column;
}
.rig-pulpit .pw-rows .r {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  font-size: 12.5px;
}
.rig-pulpit .pw-rows .r:first-child {
  border-top: 0;
}
.rig-pulpit .pw-rows .r .t {
  flex: 1;
  min-width: 0;
}
.rig-pulpit .pw-rows .r .t a {
  color: var(--ink);
}
.rig-pulpit .pw-rows .r .t a:hover {
  color: var(--accent);
}
.rig-pulpit .pw-rows .r .t .sub {
  font-size: 11px;
  color: var(--muted);
}
.rig-pulpit .pw-rows .r .d {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.rig-pulpit .pw-gauge {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.rig-pulpit .pw-gauge .row .top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
  margin-bottom: 5px;
}
.rig-pulpit .pw-gauge .nm {
  font-weight: 600;
  color: var(--ink);
}
.rig-pulpit .pw-gauge .vv {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.rig-pulpit .pw-gauge .bar {
  height: 8px;
  border-radius: 9999px;
  background: var(--grey-bg);
  overflow: hidden;
}
.rig-pulpit .pw-gauge .bar i {
  display: block;
  height: 100%;
  border-radius: 9999px;
  background: var(--accent);
}
.rig-pulpit .pw-gauge .bar i.acc {
  background: var(--accent);
}
.rig-pulpit .pw-gauge .bar i.med {
  background: var(--lvl-med);
}
.rig-pulpit .pw-gauge .bar i.lvl-low {
  background: var(--lvl-low);
}
.rig-pulpit .pw-gauge .bar i.lvl-med {
  background: var(--lvl-med);
}
.rig-pulpit .pw-gauge .bar i.lvl-high {
  background: var(--lvl-high);
}
.rig-pulpit .pw-gauge .bar i.lvl-crit {
  background: var(--lvl-crit);
}
.rig-pulpit .pw-heat {
  display: grid;
  grid-template-columns: repeat(var(--pw-heat-cols, 5), 1fr);
  gap: 4px;
}
.rig-pulpit .pw-heat .hc {
  aspect-ratio: 1.6/1;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  font-family: "Manrope", sans-serif;
  border: 1px solid rgba(0, 0, 0, 0.04);
}
.rig-pulpit .pw-heat .hc.l-low {
  background: #d6f0e0;
  color: #06502f;
}
.rig-pulpit .pw-heat .hc.l-med {
  background: #fbe8bf;
  color: #7a4d06;
}
.rig-pulpit .pw-heat .hc.l-high {
  background: #fbd3be;
  color: #922f0a;
}
.rig-pulpit .pw-heat .hc.l-crit {
  background: #f4b6c4;
  color: #7c0f2e;
}
.rig-pulpit .pw-heat .hc.z {
  background: var(--bg-2);
  color: #c2c7cf;
  font-weight: 600;
}
.rig-pulpit .pw-heat-cap {
  display: flex;
  justify-content: space-between;
  font-size: 10.5px;
  color: var(--muted);
  margin-top: 7px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.rig-pulpit .pw-donut {
  display: flex;
  align-items: center;
  gap: 16px;
}
.rig-pulpit .pw-dleg {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
  font-size: 12px;
}
.rig-pulpit .pw-dleg .r {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink-2);
}
.rig-pulpit .pw-dleg .dot {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  flex: none;
}
.rig-pulpit .pw-dleg b {
  margin-left: auto;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.rig-pulpit .pw-fresh {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 10px;
}
.rig-pulpit .pw-fresh .val {
  font-size: 26px;
  font-weight: 800;
  color: var(--ok);
  font-family: "Manrope", sans-serif;
  line-height: 1;
}
.rig-pulpit .pw-fresh .lbl {
  font-size: 11.5px;
  color: var(--muted);
}
.rig-pulpit .pulpit-lib-inline {
  display: none;
  margin-top: 16px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.rig-pulpit .lib-h {
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--line);
  position: relative;
}
.rig-pulpit .lib-h h2 {
  font-size: 17px;
  font-weight: 800;
  color: var(--ink);
}
.rig-pulpit .lib-h p {
  font-size: 12px;
  color: var(--muted);
  margin: 5px 0 0;
  line-height: 1.5;
}
.rig-pulpit .lib-x {
  position: absolute;
  top: 14px;
  right: 16px;
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  border-radius: var(--radius);
}
.rig-pulpit .lib-x svg {
  width: 16px;
  height: 16px;
}
.rig-pulpit .lib-x:hover {
  background: var(--grey-bg);
  color: var(--ink);
}
.rig-pulpit .lib-body {
  max-height: 460px;
  overflow-y: auto;
  padding: 8px 16px 16px;
}
.rig-pulpit .lib-grp {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  padding: 16px 4px 7px;
}
.rig-pulpit .lib-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  margin-bottom: 7px;
  background: var(--white);
  cursor: pointer;
}
.rig-pulpit .lib-item.on {
  border-color: var(--accent-100);
  background: var(--accent-50);
}
.rig-pulpit .lib-item .gd {
  color: #c2c7cf;
  flex: none;
}
.rig-pulpit .lib-item .gd svg {
  width: 14px;
  height: 14px;
  display: block;
}
.rig-pulpit .lib-item .info {
  flex: 1;
  min-width: 0;
}
.rig-pulpit .lib-item .info .nm {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  display: block;
}
.rig-pulpit .lib-item .info .ds {
  font-size: 11px;
  color: var(--muted);
  margin-top: 1px;
  display: block;
}
.rig-pulpit .lib-item .szb {
  font-size: 10px;
  font-weight: 700;
  color: var(--ink-2);
  background: var(--grey-bg);
  border-radius: 9999px;
  padding: 2px 7px;
  flex: none;
}
.rig-pulpit .sw {
  position: relative;
  width: 38px;
  height: 22px;
  flex: none;
  cursor: pointer;
}
.rig-pulpit .sw input {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}
.rig-pulpit .sw .tr {
  position: absolute;
  inset: 0;
  background: #cdd3dc;
  border-radius: 9999px;
  transition: 0.15s;
}
.rig-pulpit .sw .kn {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 9999px;
  transition: 0.15s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.rig-pulpit .sw input:checked + .tr {
  background: var(--accent);
}
.rig-pulpit .sw input:checked + .tr + .kn {
  transform: translateX(16px);
}
.rig-pulpit .lib-foot {
  border-top: 1px solid var(--line);
  padding: 13px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.rig-pulpit .lib-foot .cnt {
  font-size: 12px;
  color: var(--muted);
}
@media (max-width: 1100px) {
  .rig-pulpit .span3,
  .rig-pulpit .span4,
  .rig-pulpit .span5 {
    grid-column: span 6;
  }
  .rig-pulpit .span7,
  .rig-pulpit .span8 {
    grid-column: span 12;
  }
  .rig-pulpit .pw-add {
    grid-column: span 6;
  }
}

/* mini-toast (dołączany do <body>, poza kontenerem) */
.pulpit-toast {
  position: fixed;
  left: 50%;
  bottom: 26px;
  transform: translateX(-50%);
  background: var(--ink);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 10px 18px;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  z-index: 60;
  opacity: 0;
  transition: opacity 0.18s;
  pointer-events: none;
}

.pulpit-toast.on {
  opacity: 1;
}

/*
 * Szkolenia v2 — Kreator szkolenia (6 kroków) + dedykowana karta typu aktywności.
 * Styl clean-light. Kolor niesie wyłącznie status; typy/akcenty neutralne.
 * Komponenty: .kr-* (kreator), .tp-* (karta typu).
 */
/* ---------- Kreator: układ rail + treść ---------- */
.kr {
  display: grid;
  grid-template-columns: 248px 1fr;
  gap: 22px;
  align-items: start;
}

@media (max-width: 900px) {
  .kr {
    grid-template-columns: 1fr;
  }
}
.kr-rail {
  position: sticky;
  top: 16px;
}

.kr-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.kr-step {
  width: 100%;
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: var(--radius);
  background: none;
  text-align: left;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}

.kr-step:hover {
  background: var(--bg-2);
}

.kr-step.active {
  background: var(--accent-50);
  border-color: var(--accent-100);
}

.kr-step-n {
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border: 1px solid var(--line-2);
  background: var(--white);
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  flex: none;
}

.kr-step.active .kr-step-n {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.kr-step-tx {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  min-width: 0;
}

.kr-step-tx .r {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-2);
}

.kr-step-tx .w {
  font-size: 11px;
  color: var(--muted);
}

.kr-step.active .kr-step-tx .r {
  color: var(--accent-700);
}

/* ---------- Kreator: panele ---------- */
.kr-panel {
  animation: none;
}

.kr-ph {
  margin-bottom: 14px;
}

.kr-ph h2 {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  margin: 0;
}

.kr-ph p {
  font-size: 12.5px;
  color: var(--muted);
  margin: 3px 0 0;
  line-height: 1.5;
}

.kr-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

/* ---------- Typy aktywności (krok 1 + nawigacja) ---------- */
.kr-types {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

@media (max-width: 680px) {
  .kr-types {
    grid-template-columns: 1fr;
  }
}
.kr-type {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 11px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--white);
  text-decoration: none;
  transition: border-color 0.12s, box-shadow 0.12s, background 0.12s;
}

.kr-type:hover {
  border-color: var(--rig-200);
  box-shadow: var(--shadow);
}

.kr-type.sel {
  border-color: var(--accent);
  background: var(--accent-50);
  box-shadow: 0 0 0 1px var(--accent);
}

.kr-type-ic {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  background: var(--grey-bg);
  color: var(--ink-2);
  flex: none;
}

.kr-type.sel .kr-type-ic {
  background: var(--white);
  color: var(--accent-700);
}

.kr-type-ic .ico {
  width: 19px;
  height: 19px;
}

.kr-type-tx .r {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  display: flex;
  align-items: center;
  gap: 6px;
}

.kr-type-tx .p {
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
  line-height: 1.45;
}

.kr-type-tx .lnk {
  font-size: 11.5px;
  color: var(--accent-700);
  margin-top: 7px;
  display: inline-block;
}

.kr-flag {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--accent-700);
  background: var(--white);
  border: 1px solid var(--accent-100);
  border-radius: 9999px;
  padding: 1px 7px;
}

/* ---------- Listy opcji (obowiązki, odbiorcy, harmonogram) ---------- */
.kr-group {
  margin-bottom: 16px;
}

.kr-group:last-child {
  margin-bottom: 0;
}

.kr-group-h {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ink-2);
  margin-bottom: 8px;
}

.kr-opts {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.kr-opt {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
  font-size: 13px;
  color: var(--ink-2);
}

.kr-opt.dim {
  background: var(--bg-2);
  color: var(--muted);
}

.kr-opt input {
  margin: 0;
  accent-color: var(--accent);
  width: 16px;
  height: 16px;
}

.kr-opt .ot {
  min-width: 0;
}

.kr-opt .ot .r {
  color: var(--ink);
  font-weight: 500;
}

.kr-opt .ot .cite {
  font-size: 11.5px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.kr-opt .oc {
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}

.kr-recur {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}

@media (max-width: 680px) {
  .kr-recur {
    grid-template-columns: 1fr;
  }
}
.kr-recur .kr-opt {
  grid-template-columns: 18px 1fr;
}

/* ---------- Podsumowanie ---------- */
.kr-sum {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 0;
}

.kr-sum dt {
  padding: 9px 0;
  font-size: 12.5px;
  color: var(--muted);
  border-top: 1px solid var(--line);
}

.kr-sum dd {
  padding: 9px 0;
  margin: 0;
  font-size: 13px;
  color: var(--ink);
  font-weight: 500;
  border-top: 1px solid var(--line);
}

.kr-sum dt:first-of-type,
.kr-sum dd:first-of-type {
  border-top: none;
}

/* ---------- Karta typu aktywności ---------- */
.tp-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 18px;
  align-items: start;
}

@media (max-width: 860px) {
  .tp-grid {
    grid-template-columns: 1fr;
  }
}
.tp-setup {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tp-setup li {
  padding: 11px 0;
  border-top: 1px solid var(--line);
}

.tp-setup li:first-child {
  border-top: none;
  padding-top: 0;
}

.tp-setup .l {
  font-size: 12px;
  color: var(--muted);
}

.tp-setup .v {
  font-size: 13px;
  color: var(--ink);
  margin-top: 2px;
  line-height: 1.45;
}

.tp-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: tps;
}

.tp-step {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 10px;
  padding-bottom: 12px;
}

.tp-step:last-child {
  padding-bottom: 0;
}

.tp-step::before {
  counter-increment: tps;
  content: counter(tps);
  width: 22px;
  height: 22px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 11px;
  font-weight: 700;
  flex: none;
}

.tp-step .s {
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.45;
}

.tp-cta {
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 13px;
  border-radius: var(--radius);
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 12.5px;
  font-weight: 600;
}

.tp-others {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.tp-chip {
  font-size: 12px;
  color: var(--ink-2);
  padding: 5px 11px;
  border: 1px solid var(--line);
  border-radius: 9999px;
  background: var(--white);
  text-decoration: none;
}

.tp-chip:hover {
  border-color: var(--line-2);
  background: var(--bg-2);
}

.tp-chip.cur {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* ============================================================
   _settings.scss — ekran „Ustawienia" (v2, uproszczony 2026-06-19).
   Wszystko scoped pod .set, by uniknąć kolizji (.sw istnieje też w _pulpit).
   Zasada: proste domyślnie, głębia na żądanie (rozwijane <details>).
   ============================================================ */
.set {
  max-width: 920px;
  /* ---------- ikony ---------- */
  /* ---------- grupa sekcji ---------- */
  /* ---------- karta ustawień ---------- */
  /* ---------- wiersz ustawienia ---------- */
  /* ---------- przełącznik (switch) ---------- */
  /* ---------- select ---------- */
  /* ---------- badge statusu (kropka — sygnatura clean-light) ---------- */
  /* ---------- wiersz rozwijany (głębia na żądanie) ---------- */
  /* ---------- mini-tabela w rozwijanym bloku ---------- */
  /* ---------- sub-wiersz (klucz → wartość/kontrolka) ---------- */
  /* ---------- link do innego modułu ---------- */
  /* ---------- pasek wykorzystania ---------- */
  /* ---------- pola formularza (AI) ---------- */
  /* ---------- podglad konta (read-only) ---------- */
  /* ---------- awatar ---------- */
  /* ---------- pigulka „wkrotce" (na wierszu ustawienia) ---------- */
  /* ---------- karta „O platformie" (tu mieszka wersja, ADR-033) ---------- */
  /* ---------- dziennik zmian ---------- */
  /* Punkt podrzędny wpisu wydania (wcięta lista w CHANGELOG.md): wcięcie i mniejsza,
     neutralna kropka odróżniają go od punktu głównego. Wariant w arkuszu, nie wcięcie
     w atrybucie style – inaczej odstęp rozjeżdża się przy zmianie skali typografii. */
}
.set svg.ico {
  width: 16px;
  height: 16px;
  flex: none;
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.set .glab {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  margin: 26px 2px 10px;
}
.set .glab:first-of-type {
  margin-top: 4px;
}
.set .scard {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  margin-bottom: 16px;
}
.set .scard > .ch {
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 10px;
}
.set .scard > .ch .ico {
  color: var(--muted);
}
.set .scard > .ch h3 {
  font-size: 14px;
  font-weight: 700;
  margin: 0;
}
.set .scard > .ch .who {
  margin-left: auto;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--muted);
  background: var(--grey-bg);
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.set .srow {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
}
.set .srow:last-child {
  border-bottom: 0;
}
.set .srow .meta {
  min-width: 0;
}
.set .srow .meta .t {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
}
.set .srow .meta .d {
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
  line-height: 1.5;
}
.set .srow .ctl {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
}
.set .srow .val {
  font-size: 13px;
  color: var(--ink-2);
  font-weight: 600;
}
.set form > .srow:first-of-type {
  border-top: 0;
}
.set .sw {
  position: relative;
  width: 38px;
  height: 22px;
  flex: none;
  cursor: pointer;
  display: inline-block;
}
.set .sw input {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}
.set .sw .tr {
  position: absolute;
  inset: 0;
  background: var(--line-2);
  border-radius: 999px;
  transition: 0.15s;
  pointer-events: none;
}
.set .sw .tr::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 999px;
  transition: 0.15s;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.25);
}
.set .sw input:checked + .tr {
  background: var(--accent);
}
.set .sw input:checked + .tr::after {
  transform: translateX(16px);
}
.set .sel {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 7px 30px 7px 11px;
  font-family: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center;
}
.set .b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 600;
  border-radius: 999px;
  padding: 3px 9px;
}
.set .b::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
  flex: none;
}
.set .b.ok {
  background: var(--ok-bg);
  color: var(--ok);
}
.set .b.warn {
  background: var(--warn-bg);
  color: var(--warn);
}
.set .b.muted {
  background: var(--grey-bg);
  color: var(--grey);
}
.set .b.muted::before {
  display: none;
}
.set details.ex {
  border-bottom: 1px solid var(--line);
}
.set details.ex:last-child {
  border-bottom: 0;
}
.set details.ex > summary {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 13px 16px;
  cursor: pointer;
  list-style: none;
}
.set details.ex > summary::-webkit-details-marker {
  display: none;
}
.set details.ex > summary:hover {
  background: #fbfcfe;
}
.set details.ex > summary .meta .t {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
}
.set details.ex > summary .meta .d {
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}
.set details.ex > summary .chev {
  margin-left: auto;
  color: var(--muted);
  transition: 0.15s;
  flex: none;
}
.set details.ex[open] > summary .chev {
  transform: rotate(90deg);
}
.set details.ex .body {
  padding: 2px 16px 16px;
}
.set .mtbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  margin-top: 6px;
}
.set .mtbl th {
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  padding: 7px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
  white-space: nowrap;
}
.set .mtbl td {
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-2);
  vertical-align: middle;
}
.set .mtbl tr:last-child td {
  border-bottom: 0;
}
.set .mtbl .nm {
  font-weight: 600;
  color: var(--ink);
}
.set .subrow {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.set .subrow:last-child {
  border-bottom: 0;
}
.set .subrow .t {
  font-weight: 500;
  color: var(--ink-2);
}
.set .subrow .ctl {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
}
.set .subrow .v {
  font-weight: 700;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.set .xrow {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  color: inherit;
}
.set .xrow:last-child {
  border-bottom: 0;
}
.set .xrow:hover {
  background: #fbfcfe;
}
.set .xrow .ico {
  color: var(--muted);
}
.set .xrow .meta .t {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
}
.set .xrow .meta .d {
  font-size: 12px;
  color: var(--muted);
  margin-top: 1px;
}
.set .xrow .arr {
  margin-left: auto;
  color: var(--accent-700);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
}
.set .xrow .arr .arrico {
  width: 14px;
  height: 14px;
}
.set .meter {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 150px;
}
.set .meter .bar {
  flex: 1;
  height: 8px;
  border-radius: 999px;
  background: var(--grey-bg);
  overflow: hidden;
}
.set .meter .bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--accent);
}
.set .meter .bar i.warn {
  background: var(--warn);
}
.set .meter .pct {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.set .field textarea {
  width: 100%;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 9px 11px;
  font-family: inherit;
  font-size: 13px;
  color: var(--ink);
  resize: vertical;
}
.set .envhint {
  font-size: 11.5px;
  color: var(--muted);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.set .envhint .ico {
  width: 14px;
  height: 14px;
}
.set .envhint .mono {
  background: var(--grey-bg);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
}
.set .envhint .pillkey {
  font-size: 11px;
  font-weight: 600;
  border-radius: 999px;
  padding: 2px 8px;
}
.set .envhint .pillkey.ok {
  background: var(--ok-bg);
  color: var(--ok);
}
.set .envhint .pillkey.bad {
  background: var(--danger-bg);
  color: var(--danger);
}
.set .acct {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 15px 16px;
}
.set .acct .acct-meta {
  min-width: 0;
}
.set .acct .acct-nm {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}
.set .acct .acct-ro {
  font-size: 12.5px;
  color: var(--muted);
}
.set .acct .tag {
  margin-left: auto;
  flex: none;
  font-size: 11px;
  font-weight: 600;
  color: var(--ok);
  background: var(--ok-bg);
  border: 1px solid #bbe9cf;
  padding: 2px 9px;
  border-radius: 999px;
}
.set .av {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.set .av.lg {
  width: 40px;
  height: 40px;
  font-size: 14px;
}
.set .soon {
  margin-left: auto;
  flex: none;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--warn);
  background: var(--warn-bg);
  border: 1px solid #fadca5;
  padding: 3px 8px;
  border-radius: 999px;
}
.set .about {
  background: var(--white);
  border: 1px solid var(--accent);
  border-radius: var(--radius-lg);
  box-shadow: 0 0 0 3px rgba(10, 112, 110, 0.1), var(--shadow);
  padding: 18px 20px;
  margin-bottom: 16px;
}
.set .about .about-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.set .about .about-name {
  font-size: 15.5px;
  font-weight: 700;
  color: var(--ink);
}
.set .about .about-ico {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: var(--accent);
  stroke-width: 1.6;
  opacity: 0.8;
  flex: none;
}
.set .about .chip {
  display: inline-block;
  margin-top: 7px;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent-700);
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  padding: 2px 9px;
  border-radius: 999px;
}
.set .about .kv {
  margin: 15px 0 0;
  padding: 13px 0 0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 8px;
}
.set .about .kv > div {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 10px;
  align-items: baseline;
}
.set .about .kv dt {
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}
.set .about .kv dd {
  margin: 0;
  color: var(--ink);
  font-size: 13px;
}
.set .about .kv .mono {
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.set .about .about-foot {
  margin-top: 15px;
}
.set .scard.log h3 .mono {
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-variant-numeric: tabular-nums;
}
.set .log-body {
  padding: 12px 16px 14px;
}
.set .log-sec {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--accent-700);
  margin: 10px 0 6px;
}
.set .log-sec:first-child {
  margin-top: 0;
}
.set .log-item {
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.55;
  padding-left: 16px;
  position: relative;
  margin-bottom: 4px;
}
.set .log-item::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 8px;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: var(--accent);
}
.set .log-item-sub {
  margin-left: 18px;
  font-size: 12.5px;
}
.set .log-item-sub::before {
  width: 4px;
  height: 4px;
  background: var(--muted);
}

/* ============================================================
   Użytkownicy v2 — lista kont (/settings/users). Poza scope .set:
   ekran korzysta z prymitywów modułu (.rig-head, .rig-kpis, .rig-tbl,
   .rig-filters, .rig-search, .pill). Tu tylko pasek narzędzi, karta
   tabeli z overflow: visible (kebab-dropdown nie może być przycięty),
   awatar wiersza, kebab-menu (.rig-menu) i paginacja.
   ============================================================ */
.rig-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.usr-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 16px 0 12px;
}

.usr-tools {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  flex-wrap: wrap;
}

.usr-sel {
  font: inherit;
  font-size: 12.5px;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 7px 10px;
  cursor: pointer;
}

.usr-sel:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.usr-tablecard {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: visible;
}

/* Prymityw .rig-tablewrap daje overflow-x: auto (poziomy scroll wąskich tabel).
   Ponieważ overflow na jednej osi wymusza clipping drugiej, wrapper przycinał
   rozwinięty kebab-dropdown w pionie (menu akcji ucinane przy dolnych wierszach).
   Ta tabela mieści się bez poziomego scrolla, więc przywracamy overflow: visible –
   dropdown ograniczają wtedy tylko krawędzie okna (obsługiwane przez flip „opens-up"). */
.usr-tablecard .rig-tablewrap {
  overflow: visible;
}

.usr-rowav {
  display: flex;
  align-items: center;
  gap: 10px;
}

.usr-av {
  flex: none;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--accent-50);
  color: var(--accent-700);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.usr-av.off {
  background: var(--bg-2);
  color: var(--muted);
}

.usr-uname {
  font-weight: 600;
  color: var(--ink);
}

.usr-usub {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 1px;
}

.usr-usub.is-muted {
  font-style: italic;
}

.usr-actions-cell {
  text-align: right;
  white-space: nowrap;
}

/* Kebab — natywne menu akcji wiersza (details/summary, bez JS). Renderowane
   w karcie z overflow: visible, więc rozwinięta lista nie jest przycinana. */
.rig-menu {
  position: relative;
  display: inline-block;
}

.rig-menu > summary {
  list-style: none;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: var(--radius);
  border: 1px solid transparent;
  color: var(--ink-2);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  user-select: none;
}

.rig-menu > summary::-webkit-details-marker {
  display: none;
}

.rig-menu > summary::marker {
  content: "";
}

.rig-menu > summary:hover,
.rig-menu[open] > summary {
  background: var(--bg-2);
  border-color: var(--line);
}

.rig-menu > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.rig-menu-list {
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 30;
  min-width: 232px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
  padding: 5px;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

/* Flip w górę dla wierszy przy dole listy (klasę nadaje kontroler rig-menu po pomiarze). */
.rig-menu.opens-up > .rig-menu-list {
  top: auto;
  bottom: calc(100% + 4px);
}

.rig-menu-list form {
  margin: 0;
}

.rig-menu-item {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  background: none;
  border-radius: 5px;
  font: inherit;
  font-size: 12.5px;
  color: var(--ink);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.rig-menu-item:hover {
  background: var(--bg-2);
}

.rig-menu-item.danger {
  color: var(--danger);
}

.rig-menu-item.danger:hover {
  background: var(--danger-bg);
}

.rig-menu-item.is-disabled {
  color: var(--muted);
  cursor: default;
  opacity: 0.75;
}

.rig-menu-item.is-disabled:hover {
  background: none;
}

.rig-menu-sep {
  height: 1px;
  background: var(--line);
  margin: 4px 2px;
}

.usr-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  font-size: 12.5px;
  color: var(--muted);
}

.usr-pager b {
  color: var(--ink);
  font-weight: 700;
}

.usr-pg {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.usr-pgbtn {
  display: inline-grid;
  place-items: center;
  min-width: 30px;
  height: 30px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  color: var(--ink-2);
  font: inherit;
  font-size: 14px;
  text-decoration: none;
  cursor: pointer;
}

.usr-pgbtn:hover {
  border-color: var(--line-2);
}

.usr-pgbtn.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

/* ============================================================
   Wsparcie AI — panel miejsc użycia (/settings/ai, ADR-093). Poza scope .set
   (wzór ekranu „Użytkownicy"): ekran korzysta z prymitywów modułu (.rig-head,
   .rig-callout, .rig-list, .rig-tbl, .mono). Tu tylko dwa komponenty własne:
   blok stanu bramy (read-only) i PRZEŁĄCZNIK.

   Przełącznik jest osobną klasą, a nie `.sw` z bloku `.set`: tamten jest scoped
   pod `.set`, bo nazwa `.sw` koliduje z próbką koloru w `_pulpit`. Tutaj kontrolką
   jest PRZYCISK w formularzu (`aria-pressed`), nie checkbox — dzięki temu zmiana
   idzie POST-em bez JS, a stan czyta czytnik ekranu z jednego atrybutu.
   ============================================================ */
/* ---- Blok stanu bramy: informacja operatora, świadomie BEZ kontrolki ---- */
.ai-state {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border-left: 4px solid var(--ok);
  margin-bottom: 18px;
}

.ai-state .ico {
  flex: none;
  width: 18px;
  height: 18px;
  color: var(--ok);
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Brama nieskonfigurowana: akcent neutralny i blok wygaszony. Przełączniki miejsc
   ZOSTAJĄ czynne — administrator decyduje zawczasu, niezależnie od operatora. */
.ai-state.off {
  border-left-color: var(--line-2);
  opacity: 0.55;
}

.ai-state.off .ico {
  color: var(--muted);
}

/* ---- Przełącznik (przycisk formularza, stan w aria-pressed) ---- */
.ai-sw {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}

.ai-sw-track {
  position: relative;
  flex: none;
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: var(--line-2);
  transition: 0.15s;
}

.ai-sw-track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.25);
  transition: 0.15s;
}

.ai-sw[aria-pressed=true] .ai-sw-track {
  background: var(--accent);
}

.ai-sw[aria-pressed=true] .ai-sw-track::after {
  transform: translateX(16px);
}

.ai-sw:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: var(--radius);
}

/* Wyłącznik globalny leży: przełączniki miejsc są ZABLOKOWANE, ale pokazują
   swój własny stan (nadrzędność globalnego to nie wyzerowanie decyzji). */
.ai-sw[disabled] {
  cursor: default;
  opacity: 0.45;
}

/* ---- Komórki liczbowe i klucz akcji pod nazwą pola ---- */
.ai-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.ai-cell-state {
  text-align: center;
}

.ai-action {
  display: block;
  margin-top: 2px;
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--muted);
}

.ai-swrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}

/* ============================================================
   _nis2.scss — NIS2 / KSC: kreator kwalifikacji + rejestracja S46.
   Clean-light. Kolor wyłącznie jako sygnał statusu kwalifikacji.
   ============================================================ */
/* ---- Werdykt kwalifikacji ---- */
.nis2-verdict {
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-2);
  border-radius: var(--radius-lg);
  background: var(--white);
  box-shadow: var(--shadow);
  padding: 18px 20px;
  margin-bottom: 8px;
}

.nis2-verdict-hd {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.nis2-verdict-kicker {
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.nis2-verdict-status {
  font-family: Manrope, Inter, sans-serif;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.15;
  margin-top: 2px;
  color: var(--ink);
}

.nis2-verdict-legal {
  font-size: 12.5px;
  color: var(--ink-2);
  margin-top: 4px;
}

.nis2-verdict-sup {
  flex: none;
  text-align: right;
}
.nis2-verdict-sup .lab {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.nis2-verdict-sup .val {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  margin-top: 2px;
}

.nis2-verdict-summary {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-2);
}

.nis2-verdict-note {
  margin: 12px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--muted);
}

.nis2-verdict-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.nis2-fact .k {
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  margin-bottom: 4px;
}
.nis2-fact .v {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}
.nis2-fact .s {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
  line-height: 1.45;
}

.nis2-verdict-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.nis2-verdict-cta .grow {
  flex: 1 1 auto;
}

/* status → akcent werdyktu */
.nis2-result--kluczowy {
  border-left-color: var(--danger);
}
.nis2-result--kluczowy .nis2-verdict-status {
  color: var(--danger);
}

.nis2-result--wazny {
  border-left-color: var(--warn);
}
.nis2-result--wazny .nis2-verdict-status {
  color: var(--warn);
}

.nis2-result--nie {
  border-left-color: var(--ok);
}
.nis2-result--nie .nis2-verdict-status {
  color: var(--ok);
}

.nis2-result--wymaga {
  border-left-color: var(--info);
}
.nis2-result--wymaga .nis2-verdict-status {
  color: var(--info);
}

/* ---- Listy pomocnicze ---- */
.nis2-tags {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.nis2-list {
  margin: 4px 0 0;
  padding-left: 18px;
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.5;
}

/* ---- Kreator ---- */
.nis2-stepper {
  list-style: none;
  margin: 0 0 20px;
  padding: 0 0 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  border-bottom: 1px solid var(--line);
}
.nis2-stepper button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: 9999px;
  padding: 6px 14px 6px 7px;
  font: inherit;
  font-size: 13px;
  color: var(--ink-2);
  cursor: pointer;
}
.nis2-stepper button .no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  background: var(--white);
  border: 1px solid var(--line-2);
  font-size: 11.5px;
  font-weight: 700;
  color: var(--muted);
}
.nis2-stepper button.active {
  background: var(--accent-50);
  border-color: var(--accent);
  color: var(--accent-700);
  font-weight: 600;
}
.nis2-stepper button.active .no {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--white);
}

.nis2-panel h3 {
  font-family: Manrope, Inter, sans-serif;
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--ink);
}

.nis2-radio {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
  max-width: 360px;
}
.nis2-radio label {
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px 12px;
  font-size: 14px;
  color: var(--ink);
  cursor: pointer;
}
.nis2-radio label:hover {
  border-color: var(--line-2);
}
.nis2-radio label:has(input:checked) {
  border-color: var(--accent);
  background: var(--accent-50);
}

.nis2-thresholds {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.nis2-group-label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 10px;
}

.nis2-checks {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 8px;
}

.nis2-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px 12px;
  cursor: pointer;
}
.nis2-check:hover {
  border-color: var(--line-2);
}
.nis2-check:has(input:checked) {
  border-color: var(--accent);
  background: var(--accent-50);
}
.nis2-check.is-partial:has(input:checked) {
  border-color: var(--info);
  background: var(--info-bg);
}
.nis2-check input {
  margin-top: 3px;
  flex: none;
}
.nis2-check .nis2-check-bd {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nis2-check .t {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.35;
}
.nis2-check .d {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.45;
}
.nis2-check .ref {
  font-weight: 500;
  color: var(--accent-700);
  font-size: 11.5px;
}

.nis2-step-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.nis2-step-nav .grow {
  flex: 1 1 auto;
}

/* ---- Rejestracja S46 ---- */
.nis2-regsum {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--white);
  box-shadow: var(--shadow);
  padding: 18px 20px;
}

.nis2-regsum-hd {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.nis2-regsum-org {
  font-family: Manrope, Inter, sans-serif;
  font-size: 19px;
  font-weight: 800;
  color: var(--ink);
  margin-top: 2px;
}

.nis2-regsum-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
  margin: 16px 0 18px;
}

.nis2-contacts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 8px;
}

.nis2-contact {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px 12px;
}
.nis2-contact .t {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
}
.nis2-contact .r {
  font-size: 11.5px;
  color: var(--accent-700);
  margin-top: 1px;
}
.nis2-contact .m {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
}

.nis2-contact-form {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin-bottom: 10px;
}
.nis2-contact-form .nis2-contact-no {
  font-size: 12px;
  font-weight: 700;
  color: var(--ink-2);
  margin-bottom: 8px;
}
.nis2-contact-form .nis2-contact-no .req {
  color: var(--danger);
  font-weight: 600;
  font-size: 11px;
}
.nis2-contact-form .nis2-contact-no .opt {
  color: var(--muted);
  font-weight: 500;
  font-size: 11px;
}

/* siatka 3-kolumnowa formularzy (NIP/KRS/REGON) */
.oe-grid3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 640px) {
  .oe-grid3 {
    grid-template-columns: 1fr;
  }
}

/* ===== Terminy i przypomnienia (tor Z1, prototyp nis2-z1-przypomnienia) ===== */
.nis2-kpi-tone-danger .val {
  color: var(--danger);
}

.nis2-kpi-tone-warn .val {
  color: var(--warn);
}

.nis2-kpi-tone-ok .val {
  color: var(--ok);
}

.nis2-hero {
  display: flex;
  gap: 16px;
  align-items: center;
  background: var(--danger-bg);
  border: 1px solid #f1bcb6;
  border-left: 4px solid var(--danger);
  border-radius: var(--radius);
  padding: 16px 18px;
  margin-bottom: 18px;
}
.nis2-hero .clock {
  flex: none;
  width: 70px;
  height: 70px;
  border-radius: var(--radius);
  background: #fff;
  border: 1px solid #f1bcb6;
  display: grid;
  place-items: center;
  text-align: center;
}
.nis2-hero .clock .n {
  font-family: "Manrope", "Inter", sans-serif;
  font-weight: 800;
  font-size: 26px;
  color: var(--danger);
  line-height: 1;
}
.nis2-hero .clock .u {
  font-size: 10px;
  color: var(--danger);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 2px;
}
.nis2-hero h3 {
  font-size: 15px;
  color: #7a1b12;
}
.nis2-hero p {
  margin: 5px 0 0;
  color: #7a1b12;
  font-size: 12.5px;
  max-width: 80ch;
}
.nis2-hero .cta {
  margin-left: auto;
  flex: none;
}
.nis2-hero .btn-danger {
  background: var(--danger);
  color: #fff;
  border: 0;
}

.nis2-feed {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.nis2-item {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px 16px;
  display: grid;
  grid-template-columns: 8px 1fr auto;
  gap: 14px;
  align-items: center;
}
.nis2-item.past {
  border-color: #f1bcb6;
}
.nis2-item .sev {
  width: 8px;
  align-self: stretch;
  border-radius: 6px;
  background: var(--line-2);
}
.nis2-item .sev.d {
  background: var(--danger);
}
.nis2-item .sev.w {
  background: var(--warn);
}
.nis2-item .sev.i {
  background: var(--info);
}
.nis2-item .sev.g {
  background: var(--ok);
}
.nis2-item .it-title {
  font-weight: 700;
  font-size: 14px;
}
.nis2-item .it-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin-top: 6px;
  align-items: center;
}
.nis2-item .zad {
  font-family: var(--mono, ui-monospace);
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  background: var(--grey-bg);
  padding: 2px 7px;
  border-radius: 6px;
}
.nis2-item .owner {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-2);
  font-size: 12.5px;
  font-weight: 600;
}
.nis2-item .owner .mini {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--accent-100);
  color: var(--accent-700);
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
}
.nis2-item .it-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  text-align: right;
}
.nis2-item .due {
  font-size: 12.5px;
  color: var(--ink-2);
}
.nis2-item .due b {
  color: var(--ink);
}
.nis2-item .count {
  font-family: "Manrope", "Inter", sans-serif;
  font-weight: 800;
  font-size: 13px;
  padding: 3px 9px;
  border-radius: 8px;
}
.nis2-item .count.d {
  background: var(--danger-bg);
  color: var(--danger);
}
.nis2-item .count.w {
  background: var(--warn-bg);
  color: var(--warn);
}
.nis2-item .count.i {
  background: var(--info-bg);
  color: var(--info);
}
.nis2-item .count.g {
  background: var(--ok-bg);
  color: var(--ok);
}
@media (max-width: 900px) {
  .nis2-item {
    grid-template-columns: 6px 1fr;
  }
  .nis2-item .it-right {
    grid-column: 2;
    align-items: flex-start;
    text-align: left;
  }
}

.nis2-pill-art {
  background: var(--accent-50);
  color: var(--accent-700);
}

.nis2-pill-cat-c {
  background: #efeafc;
  color: #5b21b6;
}

.nis2-pill-cat-b {
  background: #e8f3ff;
  color: #1849a9;
}

.nis2-pill-cat-j {
  background: #fef3e2;
  color: #b54708;
}

.rig-session {
  position: relative;
  display: inline-flex;
}

.rig-session__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  font-size: 11.5px;
  font-weight: 600;
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 9999px;
  cursor: pointer;
}
.rig-session__btn .ico {
  width: 14px;
  height: 14px;
}
.rig-session__btn:hover {
  background: rgba(255, 255, 255, 0.24);
}

.rig-session__dot {
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  background: #fff;
}

.rig-session__sep {
  height: 1px;
  background: var(--line);
  margin: 5px 4px;
}

.rig-session__menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 40;
  min-width: 244px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: 0 10px 28px rgba(16, 24, 40, 0.12);
}

.rig-session__status {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--muted);
  padding: 6px 10px 8px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 4px;
}

.rig-session__group {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 6px 10px 4px;
}

.rig-session__item {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 8px 10px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  background: transparent;
  border: 0;
  border-radius: var(--radius);
  cursor: pointer;
  text-align: left;
}
.rig-session__item .ico {
  width: 16px;
  height: 16px;
  color: var(--muted);
}
.rig-session__item:hover {
  background: var(--grey-bg, #f5f6f8);
}
.rig-session__item small {
  color: var(--muted);
  font-weight: 500;
}
.rig-session__item--danger {
  color: var(--danger);
}
.rig-session__item--danger .ico {
  color: var(--danger);
}
.rig-session__item--danger:hover {
  background: var(--danger-bg);
}
.rig-session__item--soon, .rig-session__item[disabled] {
  color: var(--muted);
  cursor: default;
}
.rig-session__item--soon:hover, .rig-session__item[disabled]:hover {
  background: transparent;
}

.rig-session__badge {
  margin-left: auto;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
  background: var(--grey-bg, #f5f6f8);
  border: 1px solid var(--line);
  padding: 1px 6px;
  border-radius: 4px;
}

.rig-session__form {
  margin: 0;
}

.rig-session__upload {
  display: none;
}

/* ============================================================
   _data-sources.scss – panel „Skąd te dane": provenance danych
   ekranu z manifestów modułów (ManifestRegistry).
   ============================================================ */
.proto-ds {
  position: relative;
}
.proto-ds__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.72rem;
  font-weight: 600;
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  padding: 0.25rem 0.6rem;
  border-radius: 0.4rem;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.proto-ds__btn::-webkit-details-marker {
  display: none;
}
.proto-ds__btn:hover {
  background: rgba(255, 255, 255, 0.24);
}
.proto-ds__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #34d399;
  display: inline-block;
}
.proto-ds[open] .proto-ds__btn {
  background: rgba(255, 255, 255, 0.28);
}
.proto-ds__pop {
  position: absolute;
  right: 0;
  top: calc(100% + 0.4rem);
  z-index: 60;
  width: 340px;
  max-width: 90vw;
  background: #fff;
  color: #0f172a;
  border: 1px solid #e2e8f0;
  border-radius: 0.6rem;
  box-shadow: 0 10px 30px rgba(2, 6, 23, 0.18);
  padding: 0.75rem 0.85rem;
  font-size: 0.74rem;
  line-height: 1.45;
}
.proto-ds__head {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.5rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid #f1f5f9;
}
.proto-ds__head code {
  background: #f1f5f9;
  padding: 0.05rem 0.3rem;
  border-radius: 0.25rem;
  font-size: 0.7rem;
}
.proto-ds__cat {
  margin-left: auto;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
}
.proto-ds__sec {
  margin: 0.35rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  align-items: baseline;
}
.proto-ds__sec code {
  background: #f0fdf4;
  color: #166534;
  padding: 0.05rem 0.3rem;
  border-radius: 0.25rem;
  font-size: 0.68rem;
}
.proto-ds__lbl {
  font-weight: 700;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  width: 100%;
  margin-bottom: 0.1rem;
}
.proto-ds__lbl--owns {
  color: #166534;
}
.proto-ds__lbl--reads {
  color: #1e40af;
}
.proto-ds__lbl--emits {
  color: #92400e;
}
.proto-ds__lbl--consumes {
  color: #7c3aed;
}
.proto-ds__tag {
  background: #eff6ff;
  color: #1e40af;
  padding: 0.05rem 0.35rem;
  border-radius: 0.25rem;
  font-size: 0.68rem;
}
.proto-ds__tag--ev {
  background: #fff7ed;
  color: #9a3412;
}
.proto-ds__foot {
  margin-top: 0.5rem;
  padding-top: 0.4rem;
  border-top: 1px solid #f1f5f9;
  color: #94a3b8;
  font-size: 0.62rem;
}

/* ============================================================
   _sod.scss — ekran „Rozdział obowiązków" (Organizacja, SoD, A.5.3).
   Macierz konfliktów: osie = role z katalogu, nagłówki kolumn pionowe
   (writing-mode), komórka ✕ = link kotwiczny do naruszenia / wpisu
   słownika (bez JS). Kolor niesie wyłącznie status (D3).
   ============================================================ */
.sod-matrix {
  border-collapse: collapse;
  /* Nagłówki wierszy: poziome, jak etykiety ról. */
  /* Nagłówki kolumn: pionowe (obrót o 180° dla czytelności od dołu). */
}
.sod-matrix td,
.sod-matrix th {
  text-align: center;
  padding: 7px 6px;
  font-size: 12px;
}
.sod-matrix th.sod-rowh {
  text-align: left;
  white-space: nowrap;
  text-transform: none;
  letter-spacing: 0;
  font-size: 12.5px;
  color: var(--ink);
  font-weight: 600;
}
.sod-matrix thead th {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  white-space: nowrap;
  text-transform: none;
  letter-spacing: 0;
  font-size: 11.5px;
  height: 120px;
  vertical-align: bottom;
  padding: 6px 4px;
  color: var(--ink);
  font-weight: 600;
}
.sod-matrix td {
  border: 1px solid var(--line);
  width: 44px;
  height: 34px;
}

.sod-cell-x {
  background: var(--danger-bg);
}
.sod-cell-x a {
  display: block;
  color: var(--danger);
  font-weight: 800;
  text-decoration: none;
}

.sod-cell-self {
  background: var(--grey-bg);
}

/* Legenda pod macierzą. */
.sod-legend {
  display: flex;
  gap: 18px;
  margin-top: 10px;
  font-size: 12px;
  color: var(--muted);
}
.sod-legend i {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  margin-right: 6px;
  vertical-align: -1px;
}

/* Kotwica z macierzy / podsumowania błędów podświetla wiersz docelowy. */
.sod-screen tr:target {
  background: var(--accent-50);
}

/* ============================================================
   _governance.scss — ekran „Organ zarządzający" (Organizacja, NIS2 art. 20).
   Reuse prymitywów: .rig-kpi, .rig-tbl, .pill, .oe-field/.oe-grid2/.oe-actions.
   Tu tylko: inline formularze dodawania pod tabelami (details .gov-add,
   formularz zatwierdzeń widoczny na stałe – kotwica #approval-form) oraz
   etykieta dowodu (.tag). Kolor niesie wyłącznie status (D3).
   ============================================================ */
.gov-add {
  border-top: 1px solid var(--line);
  padding: 12px 16px 16px;
  /* Nagłówek zwijanego formularza (summary) / stały tytuł formularza zatwierdzeń. */
}
.gov-add summary,
.gov-add .gov-add-title {
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--accent-700);
  list-style: none;
  user-select: none;
}
.gov-add summary::-webkit-details-marker {
  display: none;
}
.gov-add .gov-add-title {
  cursor: default;
  margin-bottom: 4px;
}
.gov-add form {
  margin-top: 12px;
}

/* Etykieta dowodu / podstawy (np. „DOW-097", „uchwała zarządu"). */
.gov-screen .tag {
  display: inline-block;
  font-size: 11.5px;
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px 7px;
  color: var(--ink);
  white-space: nowrap;
}

/* Kotwica z przycisku nagłówka podświetla formularz zatwierdzenia. */
.gov-add:target {
  background: var(--accent-50);
}

/* ============================================================
   _risk-methodology.scss – konfigurator metodyki ryzyka (ADR-042).
   Styl 1:1 z prototypem docs/prototypes/risk-konfigurator-metodyki.html,
   zscope'owany do .rig-methodology (tokeny z _tokens.scss).
   ============================================================ */
.rig-methodology {
  /* --- wybór rozmiaru skal (osobno P, osobno K) --- */
  /* --- profile startowe --- */
  /* --- skale --- */
  /* --- zakładki domen dla K --- */
  /*
   * Projekt treści domenowych (rozmiar bez przeglądu zespołu) – bursztyn, ten sam
   * język kolorów co strefa „Wysokie"/ostrzeżenia; znika, gdy klient wpisze swoje.
   */
  /* --- macierz --- */
  /* --- kontrast „dwa piątki" --- */
  /* --- przełącznik reguły (kanon `.ctrl-row`, rules.md §12.6) ---
     Hack `accent-color` na nagim checkboxie zszedł w paczce N5 planu naprawczego UX/UI
     (znalezisko A5): wiersz wyboru rysuje własny znacznik `.ctrl-check`, a etykieta obejmuje
     kontrolkę, więc klikalny jest cały wiersz. Zostaje tylko typografia dwuwierszowej treści. */
  /* --- strefy: pasek + suwaki --- */
  /*
    WIERSZ „krytyczne" jest ODCZYTEM, nie kontrolką: nie ma suwaka, bo jego górna granica to
    R maks. i wynika z trzech granic powyżej. Wyciszenie etykiety i wartości mówi to bez zdania.
    Dlaczego MODYFIKATOR na nośniku, a nie samo `.muted`: `.muted` z `_components.scss` ma wagę
    0,1,0 i przegrywa z dwiema regułami tego arkusza – `.band-slider label` (0,2,1) i
    `.band-slider .out` (0,3,0). Sama klasa `.muted` w znaczniku nie zmieniłaby nic, więc
    kolor musi wrócić przy tej samej ścieżce, wyżej o jedną klasę.
  */
  /* --- callouty o skutkach zapisu --- */
  /* --- pasek zapisu --- */
  /* --- modal wyboru przy zmianie liczby poziomów --- */
}
.rig-methodology .head-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.rig-methodology .sec-title {
  font-size: 15px;
  font-weight: 800;
  margin-bottom: 6px;
}
.rig-methodology .hint {
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}
.rig-methodology .mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.rig-methodology .dim {
  font-weight: 600;
  color: var(--muted);
}
.rig-methodology .cfg-grid {
  display: grid;
  grid-template-columns: minmax(420px, 1fr) minmax(420px, 1fr);
  gap: 16px;
  align-items: start;
}
@media (max-width: 1080px) {
  .rig-methodology .cfg-grid {
    grid-template-columns: 1fr;
  }
}
.rig-methodology .size-picker {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.rig-methodology .size-picker label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
}
.rig-methodology .size-picker select {
  border: 1px solid var(--line-2);
  border-radius: var(--radius-lg);
  padding: 6px 10px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  background: #fff;
}
.rig-methodology .size-picker select:focus {
  outline: 2px solid var(--accent-100);
  border-color: var(--rig-500);
}
.rig-methodology .size-picker .times {
  font-weight: 800;
  color: var(--muted);
}
.rig-methodology .profiles {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.rig-methodology .profile-chip {
  border: 1px solid var(--line-2);
  background: #fff;
  border-radius: 20px;
  padding: 6px 14px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  cursor: pointer;
  font-family: inherit;
}
.rig-methodology .profile-chip.active {
  background: var(--rig-500);
  border-color: var(--rig-500);
  color: #fff;
}
.rig-methodology .name-row {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 12px;
  align-items: center;
  margin-top: 12px;
}
.rig-methodology .name-row label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
}
.rig-methodology .name-row input {
  border: 1px solid var(--line-2);
  border-radius: var(--radius-lg);
  padding: 7px 10px;
  font: inherit;
  font-size: 13px;
  width: 100%;
  max-width: 340px;
}
.rig-methodology .name-row input[aria-invalid=true] {
  border-color: var(--danger);
}
.rig-methodology .scale-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.rig-methodology .scale-head .cnt {
  font-size: 12px;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.rig-methodology .scale-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.rig-methodology .scale-row {
  display: grid;
  grid-template-columns: 30px 168px 1fr 26px;
  gap: 8px;
  align-items: start;
}
.rig-methodology .scale-row.no-del {
  grid-template-columns: 30px 168px 1fr;
}
.rig-methodology .scale-row .val {
  width: 30px;
  height: 30px;
  border-radius: var(--radius-lg);
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 13px;
  background: var(--grey-bg);
  color: var(--ink-2);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.rig-methodology .scale-row input,
.rig-methodology .scale-row textarea {
  border: 1px solid var(--line-2);
  border-radius: var(--radius-lg);
  padding: 6px 9px;
  font: inherit;
  font-size: 12.5px;
  color: var(--ink);
  width: 100%;
  background: #fff;
}
.rig-methodology .scale-row textarea {
  resize: vertical;
  min-height: 48px;
  line-height: 1.35;
}
.rig-methodology .scale-row input:focus,
.rig-methodology .scale-row textarea:focus {
  outline: 2px solid var(--accent-100);
  border-color: var(--rig-500);
}
.rig-methodology .scale-row input[readonly] {
  background: var(--grey-bg);
  color: var(--ink-2);
}
.rig-methodology .scale-row .del {
  border: 0;
  background: none;
  color: var(--muted);
  cursor: pointer;
  padding: 4px;
  border-radius: var(--radius);
  line-height: 0;
  margin-top: 4px;
}
.rig-methodology .scale-row .del:hover {
  background: var(--danger-bg);
  color: var(--danger);
}
.rig-methodology .scale-add {
  margin-top: 8px;
  border: 1px dashed var(--line-2);
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 7px 12px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rig-600);
  cursor: pointer;
  width: 100%;
}
.rig-methodology .scale-add:hover {
  background: var(--accent-50);
}
.rig-methodology .scale-add:disabled {
  color: var(--muted);
  cursor: not-allowed;
  background: var(--grey-bg);
}
.rig-methodology .dom-tabs {
  display: flex;
  gap: 4px;
  margin: 10px 0;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}
.rig-methodology .dom-tab {
  border: 0;
  background: none;
  font: inherit;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--muted);
  padding: 7px 12px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.rig-methodology .dom-tab.active {
  color: var(--rig-700);
  border-bottom-color: var(--rig-500);
}
.rig-methodology .dom-note {
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 10px;
}
.rig-methodology .dom-note.draft {
  background: var(--warn-bg);
  border-left: 3px solid var(--warn);
  border-radius: var(--radius-lg);
  padding: 8px 10px;
  color: var(--warn);
}
.rig-methodology .dom-note .draft-mark {
  color: var(--warn);
}
.rig-methodology .scale-row.draft textarea {
  background: var(--warn-bg);
  border-color: var(--warn);
}
.rig-methodology .matrix-wrap {
  overflow-x: auto;
}
.rig-methodology .matrix {
  border-collapse: separate;
  border-spacing: 3px;
  margin: 0 auto;
}
.rig-methodology .matrix th {
  font-size: 10.5px;
  color: var(--muted);
  font-weight: 700;
  padding: 2px 4px;
  text-align: center;
}
.rig-methodology .matrix td {
  width: 40px;
  height: 34px;
  border-radius: 7px;
  text-align: center;
  font-weight: 800;
  font-size: 12.5px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  position: relative;
}
.rig-methodology .matrix td.z-low {
  background: var(--ok-bg);
  color: var(--ok);
}
.rig-methodology .matrix td.z-medium {
  background: var(--info-bg);
  color: var(--info);
}
.rig-methodology .matrix td.z-high {
  background: var(--warn-bg);
  color: var(--warn);
}
.rig-methodology .matrix td.z-critical {
  background: #fbdcd9;
  color: var(--danger);
}
.rig-methodology .matrix td.acc::after {
  content: "";
  position: absolute;
  right: 4px;
  top: 4px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--ok);
}
.rig-methodology .matrix td.click {
  cursor: pointer;
}
.rig-methodology .matrix td.click:hover {
  outline: 2px solid var(--rig-500);
  outline-offset: -2px;
}
.rig-methodology .matrix td.ov {
  box-shadow: inset 0 0 0 2px var(--ink-2);
}
.rig-methodology .matrix td.ov::before {
  content: "✎";
  position: absolute;
  left: 4px;
  top: 2px;
  font-size: 9px;
  color: var(--ink-2);
  font-family: "Inter", sans-serif;
}
.rig-methodology .matrix .axis-k {
  font-size: 11px;
  font-weight: 800;
  color: var(--ink-2);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.rig-methodology .axis-p-label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 11px;
  font-weight: 800;
  color: var(--ink-2);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-align: center;
}
.rig-methodology .matrix-meta {
  display: flex;
  gap: 14px;
  justify-content: center;
  margin-top: 10px;
  font-size: 12px;
  color: var(--muted);
  flex-wrap: wrap;
}
.rig-methodology .matrix-meta .dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 3px;
  margin-right: 5px;
  vertical-align: baseline;
  border: 1px solid var(--line-2);
}
.rig-methodology .contrast {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}
.rig-methodology .contrast .c-cell {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 11px 13px;
  border-left-width: 4px;
}
.rig-methodology .contrast .c-cell .pk {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 800;
  font-size: 13px;
}
.rig-methodology .contrast .c-cell p {
  margin: 3px 0 0;
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.45;
}
.rig-methodology .rule-row {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.rig-methodology .rule-row .ctrl-name b {
  display: block;
  font-size: 13px;
}
.rig-methodology .rule-row .ctrl-name span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
}
.rig-methodology .bands-strip {
  display: flex;
  height: 26px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin: 10px 0 4px;
  border: 1px solid var(--line);
}
.rig-methodology .bands-strip div {
  display: grid;
  place-items: center;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.03em;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}
.rig-methodology .bands-strip .b-low {
  background: var(--ok-bg);
  color: var(--ok);
}
.rig-methodology .bands-strip .b-medium {
  background: var(--info-bg);
  color: var(--info);
}
.rig-methodology .bands-strip .b-high {
  background: var(--warn-bg);
  color: var(--warn);
}
.rig-methodology .bands-strip .b-critical {
  background: #fbdcd9;
  color: var(--danger);
}
.rig-methodology .band-slider,
.rig-methodology .thr-row {
  display: grid;
  grid-template-columns: 190px 1fr 88px;
  gap: 12px;
  align-items: center;
  margin-top: 8px;
}
.rig-methodology .band-slider input[type=range],
.rig-methodology .thr-row input[type=range] {
  width: 100%;
  accent-color: var(--rig-500);
}
.rig-methodology .band-slider .out,
.rig-methodology .thr-row .out {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  color: var(--ink);
  text-align: right;
}
.rig-methodology .band-slider label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
}
.rig-methodology .band-slider label.muted,
.rig-methodology .band-slider .out.muted {
  color: var(--muted);
}
.rig-methodology .thr-row {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.rig-methodology .thr-row label {
  font-size: 12.5px;
  font-weight: 700;
}
.rig-methodology .thr-row input[type=range] {
  accent-color: var(--ok);
}
.rig-methodology .callout {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  border-radius: var(--radius-lg);
  padding: 13px 16px;
  margin-top: 14px;
  font-size: 12.5px;
}
.rig-methodology .callout .ico {
  margin-top: 1px;
  width: 16px;
  height: 16px;
  flex: none;
  stroke: currentcolor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.rig-methodology .callout h4 {
  font-size: 13px;
  margin: 0 0 3px;
}
.rig-methodology .callout p {
  margin: 0;
  line-height: 1.5;
}
.rig-methodology .callout.warn {
  background: var(--warn-bg);
  border: 1px solid #f4d9b0;
}
.rig-methodology .callout.warn .ico,
.rig-methodology .callout.warn h4 {
  color: var(--warn);
}
.rig-methodology .callout.warn p {
  color: #7a4a10;
}
.rig-methodology .callout.info {
  background: var(--info-bg);
  border: 1px solid #c7d7f9;
}
.rig-methodology .callout.info .ico,
.rig-methodology .callout.info h4 {
  color: var(--info);
}
.rig-methodology .callout.info p {
  color: #1d3f7a;
}
.rig-methodology .callout.err {
  background: var(--danger-bg);
  border: 1px solid #f2c3bf;
}
.rig-methodology .callout.err .ico,
.rig-methodology .callout.err h4 {
  color: var(--danger);
}
.rig-methodology .callout.err p {
  color: #8a1f16;
}
.rig-methodology .savebar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.rig-methodology .savebar .grow {
  flex: 1;
}
.rig-methodology .modal-bg {
  position: fixed;
  inset: 0;
  background: rgba(16, 24, 40, 0.45);
  display: none;
  place-items: center;
  z-index: 50;
}
.rig-methodology .modal-bg.open {
  display: grid;
}
.rig-methodology .modal {
  background: #fff;
  border-radius: 14px;
  max-width: 520px;
  width: calc(100% - 40px);
  padding: 22px 24px;
  box-shadow: 0 20px 60px rgba(16, 24, 40, 0.25);
}
.rig-methodology .modal h3 {
  font-size: 16px;
  font-weight: 800;
  margin: 0 0 6px;
}
.rig-methodology .modal > p {
  font-size: 13px;
  color: var(--ink-2);
  margin: 0 0 14px;
  line-height: 1.55;
}
.rig-methodology .modal .opts {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rig-methodology .modal .opt {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  border: 1px solid var(--line-2);
  border-radius: 10px;
  padding: 12px 14px;
  cursor: pointer;
  text-align: left;
  background: #fff;
  font: inherit;
}
.rig-methodology .modal .opt:hover {
  border-color: var(--rig-500);
  background: var(--accent-50);
}
.rig-methodology .modal .opt b {
  display: block;
  font-size: 13px;
}
.rig-methodology .modal .opt span {
  font-size: 12px;
  color: var(--muted);
}
.rig-methodology .modal .opt .tag {
  flex: none;
  margin-top: 2px;
}
.rig-methodology .modal-cancel {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  font-size: 12px;
  color: var(--rig-600);
  font-weight: 600;
  cursor: pointer;
}

/* ============================================================
   _risk-flow.scss – krok „Kontekst" flow ryzyka (karta aktywnej wersji
   metodyki, mini-macierz N×M) oraz oś czasu ocen per domena w karcie
   ryzyka. Styl 1:1 z prototypami docs/prototypes/risk-kontekst.html
   i risk-karta-historia.html (tokeny z _tokens.scss).
   ============================================================ */
.rig-risk-context .meth-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}
@media (max-width: 1080px) {
  .rig-risk-context .meth-grid {
    grid-template-columns: 1fr;
  }
}
.rig-risk-context .mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.rig-risk-context .meth-kv {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 4px 12px;
  font-size: 13px;
  margin: 0 0 6px;
}
.rig-risk-context .meth-kv dt {
  color: var(--muted);
  padding: 5px 0;
}
.rig-risk-context .meth-kv dd {
  margin: 0;
  padding: 5px 0;
  font-weight: 600;
}
.rig-risk-context details.scale-det {
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-top: 8px;
  /* Podpowiedź WCIŚNIĘTA w rozwinięty panel skali – nie stoi w kolumnie treści, tylko
     wewnątrz ramki, więc wcięcie poziome bierze na siebie (12 px, w jednej linii z
     `.k-chips` nad nią) i nie dokłada odstępu zewnętrznego. Selektor jest potomkiem,
     nie dzieckiem: akapit siedzi w panelu `data-risk-context-target="panel"`, więc `>`
     by go nie objął. */
}
.rig-risk-context details.scale-det summary {
  cursor: pointer;
  padding: 9px 12px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink-2);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.rig-risk-context details.scale-det summary::before {
  content: "▸";
  color: var(--muted);
  transition: transform 0.15s;
}
.rig-risk-context details.scale-det[open] summary::before {
  transform: rotate(90deg);
}
.rig-risk-context details.scale-det .rig-flow-hint {
  padding: 0 12px 8px;
  margin: 0;
}
.rig-risk-context details.scale-det table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid var(--line);
}
.rig-risk-context details.scale-det table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
  vertical-align: top;
}
.rig-risk-context details.scale-det table tr:last-child td {
  border-bottom: 0;
}
.rig-risk-context details.scale-det table td.lvl {
  width: 34px;
  font-weight: 800;
}
.rig-risk-context details.scale-det table td.lab {
  font-weight: 600;
  width: 170px;
}
.rig-risk-context details.scale-det table td.muted {
  color: var(--muted);
}
.rig-risk-context .k-chips {
  display: flex;
  gap: 6px;
  padding: 0 12px 8px;
  flex-wrap: wrap;
}
.rig-risk-context .k-chips .pill {
  cursor: pointer;
  border: 0;
  font-family: inherit;
}
.rig-risk-context .config-cta {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 11px 12px;
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--grey-bg);
}
.rig-risk-context .mini-matrix {
  padding: 10px 0 0;
  overflow-x: auto;
}
.rig-risk-context .matrix {
  border-collapse: separate;
  border-spacing: 2px;
  margin: 0 auto;
}
.rig-risk-context .matrix th {
  font-size: 10px;
  color: var(--muted);
  font-weight: 700;
  padding: 1px 3px;
  text-align: center;
  border: 0;
  text-transform: none;
  letter-spacing: 0;
}
.rig-risk-context .matrix td {
  width: 34px;
  height: 30px;
  border-radius: 6px;
  text-align: center;
  font-weight: 800;
  font-size: 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  border: 0;
  padding: 0;
}
.rig-risk-context .matrix td.z-low {
  background: var(--ok-bg);
  color: var(--ok);
}
.rig-risk-context .matrix td.z-medium {
  background: var(--info-bg);
  color: var(--info);
}
.rig-risk-context .matrix td.z-high {
  background: var(--warn-bg);
  color: var(--warn);
}
.rig-risk-context .matrix td.z-critical {
  background: #fbdcd9;
  color: var(--danger);
}

/* --- Karta ryzyka: oś czasu ocen per domena --- */
.rig-assess-tl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
  margin-top: 6px;
}
@media (max-width: 1080px) {
  .rig-assess-tl {
    grid-template-columns: 1fr;
  }
}
.rig-assess-tl .mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.rig-assess-tl .dom-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px 18px;
}
.rig-assess-tl .dom-card h3 {
  font-size: 13.5px;
  font-weight: 800;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.rig-assess-tl .tl {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  position: relative;
}
.rig-assess-tl .tl::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: var(--line);
}
.rig-assess-tl .tl li {
  position: relative;
  padding: 0 0 14px 30px;
}
.rig-assess-tl .tl li:last-child {
  padding-bottom: 0;
}
.rig-assess-tl .tl .dot {
  position: absolute;
  left: 3px;
  top: 4px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 3px solid var(--line-2);
  background: #fff;
}
.rig-assess-tl .tl li.current .dot {
  border-color: var(--rig-500);
  background: var(--rig-500);
}
.rig-assess-tl .tl li.stale .dot {
  border-color: var(--warn);
}
.rig-assess-tl .tl .when {
  font-size: 11.5px;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.rig-assess-tl .tl .what {
  font-size: 13px;
  margin: 3px 0 2px;
}
.rig-assess-tl .empty-dom {
  border: 1px dashed var(--line-2);
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 12.5px;
  color: var(--muted);
  margin-top: 10px;
  background: #fcfcfd;
}
.rig-assess-tl .empty-dom.is-stale {
  border-color: #f4d9b0;
  background: var(--warn-bg);
  color: #7a4a10;
}

/* ============================================================
   _activity-log.scss – ekran „Dziennik zdarzeń" (moduł UserActivityLog,
   ADR-041 etap C). Style scoped pod .ual, 1:1 z prototypem
   docs/prototypes/ual-dziennik-aktywnosci.html (tokeny rig-*).
   ============================================================ */
.ual .head-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.ual .head-cta {
  display: flex;
  gap: 8px;
  flex: none;
}
.ual .screen-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 16px;
}
.ual .screen-tab {
  padding: 8px 14px;
  font-weight: 600;
  font-size: 13px;
  border-radius: var(--radius);
  border: 1px solid var(--line-2);
  background: #fff;
  color: var(--ink-2);
}
.ual .screen-tab.active {
  background: var(--rig-500);
  border-color: var(--rig-500);
  color: #fff;
}
.ual .screen-tab.soon {
  color: var(--muted);
  cursor: default;
}
.ual .screen-tab.soon small {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.ual-lens {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: var(--accent-50);
  border: 1px solid var(--accent-100);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin: 0 0 16px;
}
.ual-lens .ico {
  color: var(--rig-600);
  flex: none;
  margin-top: 1px;
}
.ual-lens p {
  margin: 0;
  color: var(--rig-700);
  font-size: 12.5px;
}
.ual-lens p b {
  color: var(--rig-700);
}
.ual-lens.warn {
  background: var(--warn-bg);
  border-color: #f5d9ab;
}
.ual-lens.warn .ico {
  color: var(--warn);
}
.ual-lens.warn p,
.ual-lens.warn p b {
  color: #7a4708;
}
.ual-lens.danger {
  background: var(--danger-bg);
  border-color: #f0c4c0;
}
.ual-lens.danger .ico {
  color: var(--danger);
}
.ual-lens.danger p,
.ual-lens.danger p b {
  color: var(--danger);
}

.ual .rig-kpi.danger .val {
  color: var(--danger);
}

.ual .rig-kpi.warn .val {
  color: var(--warn);
}

.ual-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px 12px;
  margin-bottom: 14px;
}
.ual-filters select,
.ual-filters input {
  font: inherit;
  font-size: 12.5px;
  color: var(--ink);
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  padding: 6px 9px;
  background: #fff;
}
.ual-filters .lab {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
.ual-filters .toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  margin-left: auto;
  cursor: pointer;
}
.ual-filters .toggle input {
  accent-color: var(--rig-500);
}

.ual-cat-tabs {
  display: flex;
  gap: 6px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 2px;
  flex-wrap: wrap;
}
.ual-cat-tabs .tab {
  padding: 9px 12px;
  font-weight: 600;
  font-size: 13px;
  color: var(--muted);
  border-bottom: 2px solid transparent;
  cursor: pointer;
}
.ual-cat-tabs .tab .cnt {
  display: inline-block;
  min-width: 18px;
  padding: 0 5px;
  height: 18px;
  line-height: 18px;
  text-align: center;
  font-size: 11px;
  border-radius: 9px;
  background: var(--grey-bg, #f2f4f7);
  color: var(--ink-2);
  margin-left: 6px;
}
.ual-cat-tabs .tab.active {
  color: var(--ink);
  border-bottom-color: var(--rig-500);
}
.ual-cat-tabs .tab.active .cnt {
  background: var(--accent-100);
  color: var(--rig-700);
}

table.ual-log {
  margin-top: 14px;
}
table.ual-log tr.ual-entry {
  cursor: pointer;
}
table.ual-log tr.ual-entry:hover td {
  background: var(--bg-2);
}
table.ual-log tr.ual-entry.restore td {
  background: var(--warn-bg);
}
table.ual-log tr.ual-entry.restore:hover td {
  background: #fdecd3;
}
table.ual-log .when {
  white-space: nowrap;
  color: var(--ink-2);
}
table.ual-log .when b {
  color: var(--ink);
  font-weight: 700;
}
table.ual-log .badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 20px;
  white-space: nowrap;
}
table.ual-log .badge.auth {
  background: var(--info-bg, #eaf1ff);
  color: var(--info, #1849a9);
}
table.ual-log .badge.write {
  background: var(--accent-50);
  color: var(--rig-700);
}
table.ual-log .badge.backup {
  background: var(--warn-bg);
  color: var(--warn);
}
table.ual-log .badge.error {
  background: var(--danger-bg);
  color: var(--danger);
}
table.ual-log .badge.read {
  background: var(--grey-bg, #f2f4f7);
  color: var(--ink-2);
}
table.ual-log .badge.sys {
  background: #efeafc;
  color: #5b21b6;
}
table.ual-log .act {
  font-family: ui-monospace, sfmono-regular, Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--muted);
  display: block;
  margin-top: 3px;
}
table.ual-log .owner {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-2);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
}
table.ual-log .owner .mini {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--accent-100);
  color: var(--rig-700);
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
  flex: none;
}
table.ual-log .obj {
  font-weight: 600;
  color: var(--ink);
}
table.ual-log .obj small {
  display: block;
  color: var(--muted);
  font-weight: 500;
}
table.ual-log .ip {
  font-family: ui-monospace, sfmono-regular, Menlo, Consolas, monospace;
  font-size: 11.5px;
  color: var(--muted);
  white-space: nowrap;
}
table.ual-log .chev {
  color: var(--muted);
  transition: transform 0.15s;
  display: inline-block;
}
table.ual-log tr.open .chev {
  transform: rotate(90deg);
}
table.ual-log tr.ual-details td {
  background: var(--bg-2);
  padding: 12px 16px 14px;
}
table.ual-log .det {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
table.ual-log .det pre {
  margin: 0;
  background: var(--ink);
  color: var(--accent-100);
  font-family: ui-monospace, sfmono-regular, Menlo, Consolas, monospace;
  font-size: 11px;
  padding: 12px 14px;
  border-radius: 8px;
  overflow-x: auto;
  line-height: 1.6;
}
table.ual-log .det .meta {
  font-size: 12px;
  color: var(--ink-2);
}
table.ual-log .det .meta dl {
  margin: 0;
}
table.ual-log .det .meta dt {
  font-weight: 700;
  color: var(--muted);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 8px;
}
table.ual-log .det .meta dd {
  margin: 1px 0 0;
}
table.ual-log .det .meta dd.hash {
  font-family: ui-monospace, sfmono-regular, Menlo, Consolas, monospace;
  font-size: 10.5px;
  word-break: break-all;
  color: var(--muted);
}
table.ual-log .ual-empty {
  color: var(--muted);
  text-align: center;
  padding: 22px 12px;
}

.ual-restore-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: var(--warn-bg);
  border: 1px solid #f5d9ab;
  border-left: 4px solid var(--warn);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin: 14px 0 0;
}
.ual-restore-note .ico {
  color: var(--warn);
  flex: none;
  margin-top: 1px;
}
.ual-restore-note p {
  margin: 0;
  font-size: 12.5px;
  color: #7a4708;
}

.ual-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  font-size: 12.5px;
  color: var(--muted);
}
.ual-pagination .pages {
  display: flex;
  gap: 5px;
}
.ual-pagination .pg {
  min-width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: #fff;
  font-weight: 600;
  color: var(--ink-2);
}
.ual-pagination .pg.active {
  background: var(--rig-500);
  border-color: var(--rig-500);
  color: #fff;
}
.ual-pagination .pg.gap {
  border: 0;
  background: none;
}

.ual-foot-note {
  color: var(--muted);
  font-size: 12px;
  margin-top: 26px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

/* ------------------------------------------------------------
   Ekran „Aktywność" (etap D) – 1:1 z prototypem ual-aktywnosc.html:
   KPI (wariant ok + licznik „/ wszystkich"), karta wykresu godzinowego
   (cienkie słupki rig-500, tooltip), tabela użytkowników (pill modułów,
   status z kropką). Scoped pod .ual-stats / .ual-card / .ual-chart.
   ------------------------------------------------------------ */
.ual .rig-kpi.ok .val {
  color: var(--ok);
}

.ual-stats .rig-kpi .val .of {
  font-size: 14px;
  color: var(--muted);
}
.ual-stats .rig-kpi .val.txt {
  font-size: 17px;
  padding-top: 6px;
}

.ual-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px 18px;
  margin-bottom: 16px;
}
.ual-card h3 {
  font-size: 14px;
  margin: 0 0 2px;
}
.ual-card .sub {
  color: var(--muted);
  font-size: 12px;
  margin: 0 0 14px;
}

.ual-chart {
  position: relative;
}
.ual-chart.chart-wrap {
  padding-left: 46px;
}
.ual-chart .chart-grid {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 180px;
  border-bottom: 1px solid var(--line-2);
  position: relative;
}
.ual-chart .gl {
  position: absolute;
  left: 0;
  right: 0;
  border-top: 1px dashed var(--line);
  pointer-events: none;
}
.ual-chart .gl span {
  position: absolute;
  right: 100%;
  margin-right: 8px;
  top: -8px;
  font-size: 10.5px;
  color: var(--muted);
  white-space: nowrap;
}
.ual-chart .bar-col {
  flex: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 100%;
  cursor: pointer;
  position: relative;
}
.ual-chart .bar-col .bar {
  width: 70%;
  max-width: 26px;
  background: var(--rig-500);
  border-radius: 4px 4px 0 0;
  min-height: 2px;
  transition: background 0.12s;
}
.ual-chart .bar-col:hover .bar {
  background: var(--rig-700);
}
.ual-chart .bar-col.zero .bar {
  background: var(--line-2);
}
.ual-chart .x-labels {
  display: flex;
  gap: 2px;
  margin-top: 6px;
}
.ual-chart .x-labels span {
  flex: 1;
  text-align: center;
  font-size: 10.5px;
  color: var(--muted);
}
.ual-chart .tooltip {
  position: absolute;
  pointer-events: none;
  background: var(--ink);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  padding: 6px 9px;
  border-radius: 8px;
  transform: translate(-50%, -110%);
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.1s;
  z-index: 5;
}
.ual-chart .tooltip small {
  display: block;
  font-weight: 500;
  color: #cfd4dc;
}

table.ual-users th.num-col,
table.ual-users td.num-col {
  text-align: right;
}
table.ual-users .owner {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
}
table.ual-users .owner .mini {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--accent-100);
  color: var(--rig-700);
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
  flex: none;
}
table.ual-users .owner small {
  display: block;
  font-weight: 500;
  color: var(--muted);
}
table.ual-users .num {
  font-family: "Manrope", "Inter", sans-serif;
  font-weight: 700;
}
table.ual-users .pill {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
  background: var(--grey-bg, #f2f4f7);
  color: var(--ink-2);
  margin-right: 4px;
}
table.ual-users .st {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 20px;
}
table.ual-users .st .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentcolor;
}
table.ual-users .st.ok {
  background: var(--ok-bg, #e7f8ef);
  color: var(--ok);
}
table.ual-users .st.warn {
  background: var(--warn-bg);
  color: var(--warn);
}
table.ual-users .st.off {
  background: var(--grey-bg, #f2f4f7);
  color: var(--ink-2);
}

@media (max-width: 900px) {
  .ual .rig-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .ual .det {
    grid-template-columns: 1fr;
  }
  .ual-chart .x-labels span:nth-child(odd) {
    visibility: hidden;
  }
}
/* ============================================================
   _integration.scss – kreator konektora, Faza 1 (ADR-048):
   nagłówek panelu auth, pole sekretne z okiem, karta wyniku testu.
   Reużywa tokenów rig-* i klas .oe-field/.rig-callout/.rig-flow-card.
   ============================================================ */
/* Flash „w przygotowaniu" (stan Unavailable testu) – bursztynowy ton. */
.rig-flash.warn {
  background: var(--warn-bg);
  color: #7a3a06;
  border: 1px solid #f6dcae;
}

/* Nagłówek panelu uwierzytelniania (logo + tytuł + podtytuł). */
.rig-auth-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--line);
}
.rig-auth-head .rig-auth-logo {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 0.8rem;
  font-weight: 800;
  color: #fff;
  background: var(--rig-600);
  flex: none;
}
.rig-auth-head .rig-auth-titles {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.rig-auth-head .rig-auth-titles b {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--ink);
}
.rig-auth-head .rig-auth-titles small {
  font-size: 0.8rem;
  color: var(--muted);
}

/* Pole sekretne z przyciskiem podglądu wartości (Stimulus `intg-secret`). */
.rig-secret-wrap {
  position: relative;
  display: flex;
}
.rig-secret-wrap input {
  width: 100%;
  padding-right: 40px;
  font-family: ui-monospace, "SF Mono", monospace;
}
.rig-secret-wrap .rig-secret-eye {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  display: grid;
  place-items: center;
  border-radius: var(--radius);
}
.rig-secret-wrap .rig-secret-eye:hover {
  background: var(--grey-bg);
  color: var(--ink);
}

.rig-secret-configured {
  margin-bottom: 0.4rem;
}

/* Podświetlenie pola z błędem walidacji (422). */
.oe-field .is-invalid {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px #fde3e1;
}

/* Karta wyniku testu połączenia (krok 7) – trzy tony + stan „nietestowane". */
.rig-result {
  margin-top: 1rem;
  border-radius: var(--radius-lg);
  padding: 0.95rem 1rem;
  border: 1px solid var(--line);
  background: var(--bg-2);
  color: var(--ink-2);
}
.rig-result__body b {
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  margin-bottom: 0.2rem;
}
.rig-result__body p {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.55;
}
.rig-result--ok {
  background: var(--ok-bg);
  border-color: #bfe6cf;
  color: #08543a;
}
.rig-result--warn {
  background: var(--warn-bg);
  border-color: #f6dcae;
  color: #7a3a06;
}
.rig-result--danger {
  background: var(--danger-bg);
  border-color: #f3c9c9;
  color: #7f1d1d;
}

/* ============================================================
   _policy-bulk.scss – zbiorcze zatwierdzanie polityk (RIG-NIS2-049).
   Pasek akcji zbiorczej nad listą „Biblioteka", kolumna checkboxów
   oraz modal potwierdzenia. Kolor akcji = akcent marki; modal neutralny.
   ============================================================ */
/* Kolumna zaznaczenia – wąska, wyśrodkowana. */
.rig-bulk-col {
  width: 36px;
  text-align: center;
  vertical-align: middle;
}

/* Pasek akcji zbiorczej – widoczny po zaznaczeniu ≥1 (Stimulus przełącza [hidden]). */
.rig-bulkbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
  padding: 8px 12px;
  background: var(--accent-50);
  border: 1px solid var(--rig-200);
  border-radius: var(--radius-lg);
}

.rig-bulkbar[hidden] {
  display: none;
}

.rig-bulkbar-info {
  font-size: 13px;
  color: var(--ink-2);
}

.rig-bulkbar .grow {
  flex: 1;
}

/* Modal potwierdzenia + tło. */
.rig-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(16, 24, 40, 0.45);
  z-index: 70;
}

.rig-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(520px, 100vw - 32px);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 32px rgba(16, 24, 40, 0.18);
  z-index: 71;
}

.rig-modal[hidden],
.rig-modal-backdrop[hidden] {
  display: none;
}

.rig-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px 8px;
}

.rig-modal-head h3 {
  margin: 0;
  font-size: 16px;
}

.rig-modal-x {
  border: 0;
  background: none;
  font-size: 22px;
  line-height: 1;
  color: var(--muted);
  cursor: pointer;
}

.rig-modal-x:hover {
  color: var(--ink);
}

.rig-modal-body {
  padding: 0 18px 8px;
  font-size: 14px;
  color: var(--ink-2);
}

.rig-modal-count {
  margin: 10px 0 0;
  color: var(--ink);
}

.rig-modal-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px 16px;
  border-top: 1px solid var(--line);
}

.rig-modal-foot .grow {
  flex: 1;
}

/* ============================================================
   _policy-content.scss – wyróżnienia w treści polityki (ADR-103).

   Klasy `plc-hl-*` są zapisane w treści dokumentu, więc muszą działać w KAŻDYM
   kontekście, w którym ta treść jest renderowana: w polu edytowalnym, na ekranie
   dokumentu i zapoznania oraz na wydruku. PDF ma własny arkusz (pdf.html.twig) –
   parytet obu arkuszy z allowlistą pilnuje PolicyContentRenderParityTest.

   Zapisujemy KLASĘ, nie `style` – barwa wpisana w treść wypaliłaby wydruk
   (jednolita plama szarości) i uniemożliwiła zmianę palety bez migracji treści.
   ============================================================ */
.plc-hl-1,
.plc-hl-2,
.plc-hl-3,
.plc-hl-4,
.plc-hl-5,
.plc-hl-6 {
  padding: 0 2px;
  border-radius: 3px;
  color: var(--hl-ink);
  /* Barwa tła nie może być jedynym nośnikiem informacji (WCAG 1.4.1) – wyróżnienie
     niesie też krój tła i obwódka widoczna w druku, patrz blok @media print. */
  box-decoration-break: clone;
}

.plc-hl-1 {
  background: var(--hl-1);
}

.plc-hl-2 {
  background: var(--hl-2);
}

.plc-hl-3 {
  background: var(--hl-3);
}

.plc-hl-4 {
  background: var(--hl-4);
}

.plc-hl-5 {
  background: var(--hl-5);
}

.plc-hl-6 {
  background: var(--hl-6);
}

/* Wydruk z przeglądarki: drukarka mono zamienia sześć barw w jedną plamę, więc
   wyróżnienie dostaje kropkowaną linię – zostaje widoczne, choć traci rozróżnienie. */
@media print {
  .plc-hl-1,
  .plc-hl-2,
  .plc-hl-3,
  .plc-hl-4,
  .plc-hl-5,
  .plc-hl-6 {
    background: #ececec;
    color: #000;
    border-bottom: 1px dotted #444;
    print-color-adjust: exact;
  }
}
/* ============================================================
   _okdd-picker.scss – picker poziomu wpływu na osobę (zgł. RIG-NIS2-072)
   oraz karty ekranu edycji kryteriów (ADR-085, zgł. RIG-NIS2-071).
   Warstwę modala (`.rig-modal`, `.rig-modal-backdrop`) dziedziczymy
   z _policy-bulk.scss – tutaj wyłącznie szeroki wariant z tabelą.
   ============================================================ */
/* Picker: modal szerszy od potwierdzenia decyzji, tabela przewijana w pionie. */
.rig-okdd-modal {
  width: min(1080px, 100vw - 32px);
  max-height: calc(100vh - 64px);
  display: flex;
  flex-direction: column;
}

.rig-okdd-modal .rig-modal-body {
  overflow: auto;
}

.rig-okdd-context {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--muted);
}

.rig-okdd-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.rig-okdd-table th,
.rig-okdd-table td {
  border: 1px solid var(--line);
  padding: 0;
  vertical-align: top;
}

.rig-okdd-table thead th {
  padding: 6px 8px;
  text-align: left;
  background: var(--bg-2);
  font-size: 12px;
  position: sticky;
  top: 0;
  z-index: 1;
}

.rig-okdd-table tbody th {
  padding: 6px 8px;
  text-align: left;
  width: 180px;
  background: var(--bg-2);
  font-weight: 600;
}

/* Komórka poziomu = przycisk na całą szerokość (klik w dowolne miejsce opisu). */
.rig-okdd-cell {
  display: block;
  width: 100%;
  height: 100%;
  padding: 6px 8px;
  border: 0;
  background: none;
  font: inherit;
  color: var(--ink-2);
  text-align: left;
  cursor: pointer;
}

.rig-okdd-cell:hover,
.rig-okdd-cell:focus-visible {
  background: rgba(16, 24, 40, 0.06);
  color: var(--ink);
}

.rig-okdd-open {
  margin-top: 6px;
}

/* Ekran edycji kryteriów: nagłówek karty (nazwa + status + „przywróć domyślne"). */
.rig-okdd-card {
  margin-bottom: 16px;
}

.rig-okdd-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.rig-okdd-card-head h3 {
  margin: 0;
  font-size: 15px;
}

.rig-okdd-card-head .grow {
  flex: 1;
}

.rig-okdd-foot {
  display: flex;
  justify-content: flex-end;
  padding: 4px 0 24px;
}

/*
  Moduł Erm (ryzyko strategiczne ISO 31000, ADR-008): pasma apetytu (ADR-082),
  pasek 8 zasad, mapa procesu, panel komunikacji kl. 6.2, macierz P×K (strefy
  z metodyki – tony spójne z .pill), oś czasu ocen append-only, raport.
  Komponenty bazowe (.rig-*, .pill, .oe-*) pochodzą z _components; tu wyłącznie
  elementy swoiste dla ERM.
*/
.rig-head-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.rig-field-error {
  color: var(--danger);
  font-size: 12px;
  margin: 4px 0 0;
}

.rig-row-actions {
  white-space: nowrap;
  text-align: right;
}
.rig-row-actions form {
  display: inline;
}

.erm-appetite {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 4px 0 14px;
}
.erm-appetite .erm-appetite-note {
  grid-column: 1/-1;
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}

.erm-appetite-band {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 12px;
}
.erm-appetite-band b {
  font-size: 13px;
}
.erm-appetite-band span {
  color: var(--muted);
}
.erm-appetite-band.ok {
  border-left: 4px solid var(--ok);
}
.erm-appetite-band.warn {
  border-left: 4px solid var(--warn);
}
.erm-appetite-band.danger {
  border-left: 4px solid var(--danger);
}

.erm-principles {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}

.erm-process {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.erm-process-step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 14px 6px 6px;
  font-size: 12.5px;
  color: inherit;
  text-decoration: none;
}
.erm-process-step:hover {
  border-color: var(--accent);
}

.erm-process-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--accent-soft, rgba(10, 112, 110, 0.12));
  color: var(--accent);
  font-weight: 700;
  font-size: 11px;
}

.erm-comm {
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 14px 0;
}
.erm-comm .erm-comm-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.erm-comm .erm-comm-lead {
  color: var(--muted);
  font-size: 12px;
  margin: 0 0 8px;
}
.erm-comm .erm-comm-stakeholders {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.erm-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  margin: 6px 0;
}
.erm-check input[type=checkbox] {
  accent-color: var(--accent);
}

/* Odstęp pionowy urósł z 2 px, bo wybory stoją tu na kanonicznym `.ctrl-row` (ramka + padding),
   a nie na nagim checkboxie w linii tekstu (paczka N5 planu naprawczego UX/UI, znalezisko A5). */
.erm-treatments {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 16px;
  margin-bottom: 10px;
}

.erm-matrix {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 10px;
}

.erm-matrix-row {
  display: flex;
  gap: 4px;
}

.erm-matrix-cell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 32px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}
.erm-matrix-cell.tone-ok {
  background: rgba(31, 158, 111, 0.16);
  color: var(--ok);
}
.erm-matrix-cell.tone-info {
  background: rgba(59, 130, 197, 0.16);
  color: var(--info, #3b82c5);
}
.erm-matrix-cell.tone-warn {
  background: rgba(216, 155, 32, 0.18);
  color: var(--warn);
}
.erm-matrix-cell.tone-danger {
  background: rgba(199, 66, 68, 0.16);
  color: var(--danger);
}
.erm-matrix-cell.selected {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.erm-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px 18px;
  margin: 0;
}
.erm-summary dt {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: var(--muted);
  margin-bottom: 2px;
}
.erm-summary dd {
  margin: 0;
}

.erm-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
}

.erm-timeline-entry {
  border-left: 2px solid var(--line);
  padding: 0 0 14px 14px;
  position: relative;
}
.erm-timeline-entry::before {
  content: "";
  position: absolute;
  left: -5px;
  top: 4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
}
.erm-timeline-entry .erm-timeline-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  margin-bottom: 4px;
}
.erm-timeline-entry .erm-timeline-body {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.erm-timeline-entry p {
  margin: 6px 0 0;
  font-size: 12.5px;
}

/* Jak w `.erm-treatments`: sekcje raportu to dziś kanoniczne `.ctrl-row`, więc odstęp pionowy
   musi zmieścić ramkę wiersza (paczka N5 planu naprawczego UX/UI, znalezisko A5). */
.erm-report-config {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-bottom: 8px;
}

.erm-report-preview {
  margin-top: 16px;
}

.erm-signature {
  margin-top: 32px;
  font-size: 12px;
  color: var(--muted);
}
.erm-signature .erm-signature-line {
  display: block;
  border-top: 1px solid var(--muted);
  margin-bottom: 4px;
  width: 80%;
}

/*
  Moduł Qms (jakość ISO 9001): mapa procesów w trzech warstwach (kl. 4.4),
  checklista walidacji z numerem klauzuli i wskaźnik zawężenia listy.
  Komponenty bazowe (.rig-*, .pill, .oe-*) pochodzą z _components; tu wyłącznie
  elementy swoiste dla map i kart procesów. Kopia okrojona z arkusza prototypu jakości
  (prototyp = specyfikacja UI); sekcje zwolnień 8.6/8.7 dojdą ze swoimi ekranami.
*/
/* ---------- pasek KPI: wariant 5-kolumnowy (wykaz 7.5) ---------- */
/* Pięć kafli w siatce 4-kolumnowej zostawia piąty samotny w drugim rzędzie,
   z pustką na trzy czwarte szerokości. Modyfikator `k5` zawęża kolumny tylko
   tam, gdzie kafli jest pięć – ekrany z czterema kaflami zostają przy siatce
   bazowej. Progi zawijania te same, co w `.rig-kpis.k6` programu audytu. */
.rig-kpis.k5 {
  grid-template-columns: repeat(5, 1fr);
}

@media (max-width: 1180px) {
  .rig-kpis.k5 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 720px) {
  .rig-kpis.k5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
/* ---------- wskaźnik zawężenia listy (ekran otwarty z kafla KPI) ---------- */
.rig-list-top.qms-narrow {
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--grey-bg);
}

.rig-list-top.qms-narrow .muted {
  font-size: 12.5px;
}

/* ---------- mapa procesów: warstwy i kafle (kl. 4.4) ---------- */
.qms-map {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
}

.qms-lane {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
}

.qms-lane--management {
  border-left: 3px solid var(--info);
}

.qms-lane--core {
  border-left: 3px solid var(--accent);
}

.qms-lane--support {
  border-left: 3px solid var(--muted);
}

.qms-lane-h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.qms-flow {
  margin: 0 0 8px;
  font-size: 11.5px;
  color: var(--muted);
}

.qms-boxes {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.qms-box {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: inherit;
  text-decoration: none;
}

.qms-box:hover {
  border-color: var(--accent);
  box-shadow: 0 1px 4px rgba(10, 112, 110, 0.12);
}

.qms-box--gap {
  border-style: dashed;
  border-color: var(--warn);
}

.qms-box-code {
  font-size: 10.5px;
  color: var(--muted);
}

.qms-box-name {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.qms-box-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 5px;
}

.qms-box-gap {
  margin-top: 6px;
  font-size: 11px;
  line-height: 1.45;
  color: var(--warn);
}

/* ---------- checklista statusu (walidacje z numerem klauzuli) ---------- */
.qms-checks {
  display: flex;
  flex-direction: column;
}

.qms-check {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  line-height: 1.45;
}

.qms-check:last-child {
  border-bottom: 0;
}

.qms-check .box {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  margin-top: 1px;
  border: 1.5px solid var(--line-2);
  border-radius: 4px;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}

.qms-check .box.on {
  border-color: var(--ok);
  background: var(--ok);
}

.qms-check .box.no {
  border-color: var(--danger);
  background: var(--danger);
}

/* ---------- decyzje 4.3 o możliwości zastosowania (zakres-qms.4) ---------- */
.qms-disp {
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
}

.qms-disp:last-child {
  border-bottom: 0;
}

.qms-disp-h {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 2px;
}

.qms-disp-req {
  margin-top: 3px;
  color: var(--ink-2);
  font-size: 11.5px;
  line-height: 1.45;
}

/* ---------- cele jakościowe (6.2) ---------- */
/* Pasek stanu zakomunikowania planu (cele-jakosciowe.5) – ten sam wzorzec,
   co pasek decyzji w prototypie, żeby oba paski wyglądały tak samo. */
.qms-savebar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--grey-bg);
  font-size: 12.5px;
}

.qms-savebar .grow {
  flex: 1;
}

.qms-savebar strong {
  display: block;
  font-size: 13px;
}

/* Tony wypełnienia miernika postępu celu (na ścieżce / zagrożony). */
.rig-meter .bar i.ok {
  background: var(--ok);
}

.rig-meter .bar i.danger {
  background: var(--danger);
}

/* ---------- wymagania klienta (8.2) ---------- */
/* Lista brakujących punktów przeglądu blokujących zobowiązanie
   (wymagania-klienta.4) – wzorzec z żywego prototypu jakości. */
.qms-blockers {
  margin: 5px 0 0;
  padding-left: 18px;
  color: var(--danger);
  line-height: 1.5;
}

/* ---------- zwolnienie wyrobu (8.6) ---------- */
/* Powód blokady jako wiersz rozwijający tabelę kolejki zwolnień
   (zwolnienie.1/.3) – wzorzec z żywego prototypu jakości. */
.qms-rowreason {
  padding-top: 0;
  color: var(--danger);
  font-size: 12px;
  line-height: 1.5;
}

/*
  Ekran wejściowy „Analiza ryzyka" (ADR-117): elementy obrazkowych wersji zakładki „Poznaj"
  (makiety docs/prototypes/tryb-klasyczny/00b|00c|00d). Komponenty bazowe (.rig-card, .pill,
  .rig-table, .rig-grid) pochodzą z _components – tu wyłącznie to, czego system jeszcze nie ma:
  anatomia policzonego ryzyka, rozwidlenie ścieżki, podglądowa siatka metodyki, mapa
  pozycjonująca tryby i kafle wyjścia.

  BARWY TRYBÓW to skala KATEGORYCZNA WYKRESU, nie status. Kanon systemu (kolor = wyłącznie
  status, kategorie = szary) dotyczy chromu interfejsu: plakietek, przycisków, wierszy list.
  Mapa pozycjonująca jest wizualizacją danych – bez rozróżnialnych odcieni cztery punkty
  nie dają się odczytać. Zestaw jest zamknięty (cztery tryby), odcienie mają rozsunięte
  jasności i przechodzą sprawdzenie rozróżnialności przy zaburzeniach widzenia barw,
  a każdy punkt ma etykietę tekstową WPROST przy sobie – barwa nie jest jedynym nośnikiem.
*/
.rig-analysis-center {
  --m-scenario: #067647;
  --m-hybrid: #b54708;
  --m-asset: #7e22ce;
  --m-classic: #1849a9;
  /* --- anatomia jednego policzonego ryzyka --- */
  /* --- rozwidlenie ścieżki w kroku 2 --- */
  /* --- podglądowa siatka metodyki --- */
  /* --- pasek gotowości danych --- */
  /* --- mapa pozycjonująca tryby --- */
  /* --- słownik sześciu pojęć --- */
  /* --- linijki skal --- */
  /* --- kalkulator poglądowy --- */
  /* --- trzy soczewki obszarów --- */
  /* --- lej --- */
  /* --- wersja per tryb: fakty o trybie, wymagania, znacznik części wspólnej --- */
  /* --- kafle wyjścia --- */
}
.rig-analysis-center .sec-title .pill {
  margin-left: 8px;
  vertical-align: middle;
}
.rig-analysis-center .anat {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 4px 0 14px;
}
.rig-analysis-center .anat-src {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .anat-src .role {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
}
.rig-analysis-center .anat-src .from {
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .anat-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
}
.rig-analysis-center .anat-flow .fbox {
  display: flex;
  flex: 1 1 150px;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
}
.rig-analysis-center .anat-flow .fbox .k {
  font-size: 11.5px;
  color: var(--muted);
}
.rig-analysis-center .anat-flow .fbox .v {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 22px;
  font-weight: 800;
  color: var(--ink);
}
.rig-analysis-center .anat-flow .fbox .s {
  font-size: 12px;
  color: var(--ink-2);
}
.rig-analysis-center .anat-flow .op {
  align-self: center;
  font-size: 18px;
  font-weight: 700;
  color: var(--muted);
}
.rig-analysis-center .anat-flow .fbox.res {
  border-width: 2px;
}
.rig-analysis-center .anat-flow .fbox.res.ok {
  border-color: var(--ok);
  background: var(--ok-bg);
}
.rig-analysis-center .anat-flow .fbox.res.info {
  border-color: var(--info);
  background: var(--info-bg);
}
.rig-analysis-center .anat-flow .fbox.res.warn {
  border-color: var(--warn);
  background: var(--warn-bg);
}
.rig-analysis-center .anat-flow .fbox.res.danger {
  border-color: var(--danger);
  background: var(--danger-bg);
}
.rig-analysis-center .branches {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
}
.rig-analysis-center .branches .branch {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--line-2);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .branches .branch.m-scenario {
  border-top-color: var(--m-scenario);
}
.rig-analysis-center .branches .branch.m-asset {
  border-top-color: var(--m-asset);
}
.rig-analysis-center .branches .branch.m-hybrid {
  border-top-color: var(--m-hybrid);
}
.rig-analysis-center .branches .branch.m-classic {
  border-top-color: var(--m-classic);
}
.rig-analysis-center .branches .branch.is-on {
  background: var(--white);
  box-shadow: var(--shadow);
}
.rig-analysis-center .branches .branch .nm {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
}
.rig-analysis-center .branches .branch .ds {
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .merge {
  margin: 12px 0 0;
  text-align: center;
  font-size: 12.5px;
  color: var(--muted);
}
.rig-analysis-center .matrix-wrap {
  overflow-x: auto;
  margin: 8px 0;
}
.rig-analysis-center .matrix {
  border-collapse: separate;
  border-spacing: 3px;
}
.rig-analysis-center .matrix caption {
  caption-side: bottom;
  padding-top: 8px;
  font-size: 12px;
  color: var(--muted);
  text-align: left;
}
.rig-analysis-center .matrix th {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  padding: 2px 6px;
  text-align: center;
  white-space: nowrap;
}
.rig-analysis-center .matrix th.k-lab,
.rig-analysis-center .matrix th.axis {
  text-align: right;
}
.rig-analysis-center .matrix th.axis {
  color: var(--accent-700);
}
.rig-analysis-center .matrix td.cell {
  width: 44px;
  height: 34px;
  border-radius: 7px;
  text-align: center;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  font-weight: 800;
}
.rig-analysis-center .matrix td.z-low {
  background: var(--ok-bg);
  color: var(--ok);
}
.rig-analysis-center .matrix td.z-medium {
  background: var(--info-bg);
  color: var(--info);
}
.rig-analysis-center .matrix td.z-high {
  background: var(--warn-bg);
  color: var(--warn);
}
.rig-analysis-center .matrix td.z-critical {
  background: #fbdcd9;
  color: var(--danger);
}
.rig-analysis-center .matrix td.is-example {
  outline: 3px solid var(--ink);
  outline-offset: -3px;
}
.rig-analysis-center .num {
  font-weight: 800;
  margin-right: 8px;
}
.rig-analysis-center .mode-map {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 16px;
  align-items: start;
}
.rig-analysis-center .mode-map svg {
  width: 100%;
  height: auto;
}
.rig-analysis-center .mode-map .grid-lines line {
  stroke: var(--line);
  stroke-width: 1;
}
.rig-analysis-center .mode-map .grid-lines line.dash {
  stroke-dasharray: 3 4;
}
.rig-analysis-center .mode-map text.axis {
  font-size: 11px;
  fill: var(--muted);
}
.rig-analysis-center .mode-map .point circle {
  stroke: var(--white);
  stroke-width: 2;
}
.rig-analysis-center .mode-map .point text.lab {
  font-size: 12.5px;
  font-weight: 600;
  fill: var(--ink);
}
.rig-analysis-center .mode-map .point text.sub {
  font-size: 11px;
  fill: var(--muted);
}
.rig-analysis-center .mode-map .point.m-scenario circle {
  fill: var(--m-scenario);
}
.rig-analysis-center .mode-map .point.m-asset circle {
  fill: var(--m-asset);
}
.rig-analysis-center .mode-map .point.m-hybrid circle {
  fill: var(--m-hybrid);
}
.rig-analysis-center .mode-map .point.m-classic circle {
  fill: var(--m-classic);
}
.rig-analysis-center .mode-legend {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.rig-analysis-center .mode-legend li {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 4px 8px;
  align-items: center;
}
.rig-analysis-center .mode-legend .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--line-2);
}
.rig-analysis-center .mode-legend li.m-scenario .dot {
  background: var(--m-scenario);
}
.rig-analysis-center .mode-legend li.m-asset .dot {
  background: var(--m-asset);
}
.rig-analysis-center .mode-legend li.m-hybrid .dot {
  background: var(--m-hybrid);
}
.rig-analysis-center .mode-legend li.m-classic .dot {
  background: var(--m-classic);
}
.rig-analysis-center .mode-legend .nm {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}
.rig-analysis-center .mode-legend .ds {
  grid-column: 2;
  font-size: 12px;
  color: var(--ink-2);
}
.rig-analysis-center .glossary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 4px 0 0;
}
.rig-analysis-center .glossary .term {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .glossary dt {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 4px;
}
.rig-analysis-center .glossary dd {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
}
.rig-analysis-center .glossary .def {
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .glossary .ex {
  font-size: 12.5px;
  color: var(--accent-700);
}
.rig-analysis-center .ruler {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
}
.rig-analysis-center .ruler li {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 2px 8px;
  align-items: baseline;
  padding: 6px 8px;
  border-left: 3px solid var(--line-2);
  background: var(--bg-2);
}
.rig-analysis-center .ruler .lvl {
  font-weight: 800;
  color: var(--muted);
  text-align: right;
}
.rig-analysis-center .ruler .lab {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}
.rig-analysis-center .ruler .dsc {
  grid-column: 2;
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .calc {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
}
.rig-analysis-center .calc .sliders {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.rig-analysis-center .calc .fld {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  align-items: center;
}
.rig-analysis-center .calc .fld label {
  grid-column: 1/-1;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
}
.rig-analysis-center .calc .fld input[type=range] {
  width: 100%;
  accent-color: var(--accent);
}
.rig-analysis-center .calc .fld .out {
  min-width: 52px;
  font-weight: 800;
  text-align: right;
  color: var(--ink);
}
.rig-analysis-center .calc .formula {
  margin: 0;
  font-size: 12.5px;
  color: var(--muted);
}
.rig-analysis-center .calc .outcome {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  grid-column: 1;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .calc .outcome .k {
  font-size: 12px;
  color: var(--muted);
}
.rig-analysis-center .calc .outcome .v {
  font-size: 24px;
  font-weight: 800;
  color: var(--ink);
}
.rig-analysis-center .calc .matrix-wrap {
  grid-column: 2;
  grid-row: 1/span 2;
  margin: 0;
}
.rig-analysis-center .event {
  margin: 4px 0 12px;
  padding: 8px 12px;
  border-left: 3px solid var(--accent);
  background: var(--accent-50);
  font-size: 13px;
  color: var(--ink);
}
.rig-analysis-center .lens {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .lens .nm {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
}
.rig-analysis-center .lens .q {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--accent-700);
}
.rig-analysis-center .lens .ds {
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .funnel {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 4px 0 12px;
  padding: 0;
  list-style: none;
  counter-reset: funnel;
}
.rig-analysis-center .funnel li {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 10px;
  align-items: baseline;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .funnel li[data-step=possible] {
  border-color: var(--warn);
  background: var(--warn-bg);
}
.rig-analysis-center .funnel li[data-step=risks] {
  border-color: var(--ok);
  background: var(--ok-bg);
}
.rig-analysis-center .funnel .v {
  font-size: 17px;
  font-weight: 800;
  text-align: right;
  color: var(--ink);
}
.rig-analysis-center .funnel .lab {
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .mode-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 4px 0 0;
}
.rig-analysis-center .mode-facts .fact {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .mode-facts dt {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  margin: 0 0 4px;
}
.rig-analysis-center .mode-facts dd {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .req-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
}
.rig-analysis-center .req-list li {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  font-size: 12.5px;
  color: var(--ink-2);
}
.rig-analysis-center .out-tile {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-2);
}
.rig-analysis-center .out-tile .nm {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
}
.rig-analysis-center .out-tile .ds {
  font-size: 12.5px;
  color: var(--ink-2);
}

@media (max-width: 900px) {
  .rig-analysis-center .anat,
  .rig-analysis-center .branches {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .rig-analysis-center .mode-map,
  .rig-analysis-center .glossary,
  .rig-analysis-center .mode-facts {
    grid-template-columns: 1fr;
  }
  .rig-analysis-center .calc {
    grid-template-columns: 1fr;
  }
  .rig-analysis-center .calc .matrix-wrap,
  .rig-analysis-center .calc .outcome {
    grid-column: 1;
    grid-row: auto;
  }
}
/* ============================================================
   _classic-matrix.scss – macierz powiązań trybu klasycznego (ADR-124).
   Makieta: docs/prototypes/tryb-klasyczny/03-macierz.html (komponenty `.tw`,
   `.mx`, `.cellmenu`, `.hintbar`, `.pick` przepisane na tokeny `--rig-*`).

   KOLIZJA NAZWY ROZSTRZYGNIĘTA WŁASNYM PREFIKSEM `rig-lmx-`. W arkuszu istnieje
   już `.rig-matrix` (`_screens.scss`, reguły `.theme` i `td.dash`) – to macierz
   NAKŁADAJĄCYCH SIĘ WYMAGAŃ z biblioteki frameworków, która dziedziczy cały
   wygląd z `.rig-tbl`: szeroki padding komórki, nagłówki wersalikami, brak
   przypiętej kolumny. Macierz powiązań potrzebuje dokładnie odwrotnego: komórki
   33 px bez paddingu, przypiętej pierwszej kolumny i tła niosącego wartość.
   Rozszerzanie `.rig-matrix` psułoby tamten ekran przy każdej takiej regule,
   dlatego powiązania dostają własny komponent, a `.rig-matrix` zostaje bez zmian.

   Odcień komórki jest POZYCJĄ W SKALI (`.rig-lmx-i1`…`.rig-lmx-i5`), nie samą
   wartością: metodyka dopuszcza 3–10 poziomów (ADR-042), a makieta rysuje pięć
   odcieni. Przy domyślnej skali pięciostopniowej odcień równa się wartości.
   ============================================================ */
.rig-lmx {
  /* Blok zawierający dla menu komórki – menu jest pozycjonowane wobec ekranu,
     nie wobec przewijanej w poziomie siatki. */
  position: relative;
}

/* ---------- pasek filtrów i liczników ---------- */
/* Układ rzędu daje kanoniczny `.ctrl-bar`; tu wyłącznie zawężenie szukajek
   (domyślnie `.rig-search { flex: 1 }` rozpycha je na całą szerokość paska). */
.rig-lmx-bar .rig-search {
  flex: 0 1 220px;
  min-width: 190px;
}

.rig-lmx-count {
  font-size: 12.5px;
  color: var(--ink-2);
}

/* ---------- siatka ---------- */
/* Ramka i tło pojemnika: `.rig-tablewrap` daje wyłącznie przewijanie w poziomie. */
.rig-lmx-wrap {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
}

.rig-lmx-grid {
  border-collapse: collapse;
  font-size: 12px;
}

.rig-lmx-grid th,
.rig-lmx-grid td {
  border: 1px solid var(--line);
  text-align: center;
  height: 33px;
  min-width: 76px;
  padding: 0;
}

.rig-lmx-grid th {
  background: var(--bg-2);
  color: var(--ink);
  font-weight: 600;
  font-size: 11.4px;
  padding: 6px 7px;
  line-height: 1.25;
  vertical-align: bottom;
}

/* Narożnik niesie DWIE linie („Zagrożenia →" / „Aktywa ↓") z jednego klucza
   tłumaczenia ze znakiem nowej linii – stąd `pre-line` zamiast `<br>` i `|raw`. */
.rig-lmx-grid th.corner {
  background: var(--accent-50);
  color: var(--accent-700);
  text-align: left;
  min-width: 172px;
  vertical-align: middle;
  white-space: pre-line;
}

/* Nazwa wiersza zostaje na ekranie przy przewijaniu w prawo – bez tego przy 35
   kolumnach nie wiadomo, którego aktywa dotyczy komórka. */
.rig-lmx-grid th.rowh {
  background: var(--white);
  text-align: left;
  padding: 6px 9px;
  font-weight: 500;
  font-size: 12px;
  min-width: 172px;
  position: sticky;
  left: 0;
  box-shadow: 1px 0 0 var(--line);
  white-space: nowrap;
  vertical-align: middle;
}

/* ---------- komórka ---------- */
.rig-lmx-cell {
  display: block;
  height: 100%;
  line-height: 33px;
  font-weight: 600;
  cursor: pointer;
}

.rig-lmx-cell:hover,
.rig-lmx-cell:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

/* Pięć odcieni skali – 1:1 z makietą (rampa marki od `--rig-50` do `--rig-600`). */
.rig-lmx-i1 {
  background: var(--rig-50);
  color: var(--rig-700);
}

.rig-lmx-i2 {
  background: var(--rig-100);
  color: var(--rig-700);
}

.rig-lmx-i3 {
  background: var(--rig-200);
  color: var(--rig-900);
}

.rig-lmx-i4 {
  background: var(--rig-400);
  color: var(--white);
}

.rig-lmx-i5 {
  background: var(--rig-600);
  color: var(--white);
}

/* UZUPEŁNIENIE LUKI MAKIETY: makieta pokazuje wyłącznie ekran prawdopodobieństwa,
   więc nie ma odcienia dla komórki logicznej („tak") ani dla kierunku
   oddziaływania. Dobrane z tej samej rampy: powiązanie istnieje = jasny akcent,
   „usuwa podatność" (mocniejszy skutek niż „ogranicza") = akcent nasycony. */
.rig-lmx-on {
  background: var(--rig-100);
  color: var(--rig-700);
}

.rig-lmx-on-strong {
  background: var(--rig-400);
  color: var(--white);
}

.rig-lmx-v0 {
  background: transparent;
}

/* ---------- menu dwukliku ---------- */
.rig-lmx-menu {
  position: absolute;
  z-index: 60;
  min-width: 150px;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  box-shadow: 0 8px 22px rgba(16, 24, 40, 0.18);
}

.rig-lmx-menu button {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 7px 12px;
  border: 0;
  background: none;
  font-family: inherit;
  font-size: 13px;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.rig-lmx-menu button:hover,
.rig-lmx-menu button:focus-visible {
  background: var(--accent-50);
}

/* ---------- próbka koloru (menu i legenda) ---------- */
.rig-lmx-swatch {
  flex: none;
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 3px;
}

.rig-lmx-swatch.rig-lmx-v0 {
  border: 1px solid var(--line-2);
  background: var(--white);
}

/* ---------- legenda ---------- */
.rig-lmx-legend {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin: 11px 0 0;
  font-size: 12.5px;
  color: var(--ink-2);
}

.rig-lmx-legend > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* ---------- okienko wyboru danych ---------- */
/* Szeroki wariant modala – wzór `.rig-okdd-modal` z `_okdd-picker.scss`: warstwę
   modala dziedziczymy z `_policy-bulk.scss`, tutaj wyłącznie szerokość i
   przewijanie treści (dwie listy słownikowe obok siebie). */
.rig-lmx-modal {
  width: min(880px, 100vw - 32px);
  max-height: calc(100vh - 64px);
  display: flex;
  flex-direction: column;
}

.rig-lmx-modal .rig-modal-body {
  overflow: auto;
}

.rig-lmx-modal .rig-modal-body h4 {
  margin: 0 0 7px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted);
}

.rig-lmx-modal .rig-search {
  margin-bottom: 7px;
  max-width: none;
}

.rig-lmx-bulkfield {
  margin-top: 12px;
}

/* ============================================================
   _classic-links.scss – ekran „Zarządzanie powiązaniami" trybu klasycznego
   (ADR-124). Makieta: docs/prototypes/tryb-klasyczny/02-powiazania.html
   (komponenty `.gnode`, `.glink`, `.grid-graf` przepisane na tokeny `--rig-*`).

   Karta zamiast rysunku grafu: makieta rysuje osiem węzłów słowników, z czego
   trzy należą do warstw, których w tej fazie nie ma. Krawędź jest tu KARTĄ
   z tą samą funkcją (licznik + klik w macierz), a układ skaluje się do ośmiu
   rodzajów bez przebudowy siatki. Uzasadnienie pełne w szablonie.

   Prymitywy bazowe (`.rig-card`, `.rig-callout`, `.rig-modal-*`, `.oe-field`,
   `.ctrl-list` / `.ctrl-row`, `.btn`) pochodzą z `_components` i `_screens` –
   tutaj wyłącznie to, czego kanon nie ma.
   ============================================================ */
/* ---------- siatka krawędzi ---------- */
.rig-lgraf {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
  margin: 12px 0 14px;
}

/* Karta krawędzi – ramka węzła słownika z makiety (`.gnode`: obramowanie
   `--rig-300` i cień karty), przeniesiona na całą krawędź. */
.rig-lgraf-edge {
  display: flex;
  flex-direction: column;
  gap: 7px;
  background: var(--white);
  border: 1px solid var(--rig-300);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 12px 14px;
}

/* Zero, które ZATRZYMUJE generator – jedyne miejsce z czerwienią na tym ekranie
   (specyfikacja ekran 02: „licznik zero przy powiązaniu wymaganym w aktywnym
   trybie"). Makieta koloruje każde zero; czerwień na rodzaju, którego nikt jeszcze
   nie potrzebuje, uczyłaby ignorowania koloru. */
.rig-lgraf-edge.blocking {
  border-color: var(--danger);
  background: var(--danger-bg);
}

/* ---------- para słowników ---------- */
.rig-lgraf-pair {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

/* Nazwa słownika – węzeł `.gnode` z makiety w wersji śródliniowej. */
.rig-lgraf-node {
  font-weight: 600;
  font-size: 13.5px;
  color: var(--ink);
}

.rig-lgraf-x {
  font-size: 13px;
  color: var(--muted);
}

/* ---------- licznik wpisanych powiązań ---------- */
/* Pigułka `.glink` z makiety: `border-radius: 999px`, tło `--grey-bg`,
   obramowanie `--line-2`. Klik prowadzi do macierzy tego rodzaju. */
.rig-lgraf-count {
  align-self: flex-start;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  background: var(--grey-bg);
  border: 1px solid var(--line-2);
  border-radius: 999px;
  padding: 4px 12px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  white-space: nowrap;
  text-decoration: none;
}

.rig-lgraf-count b {
  font-size: 15px;
  color: var(--ink);
}

.rig-lgraf-count:hover,
.rig-lgraf-count:focus-visible {
  background: var(--accent-50);
  border-color: var(--accent-100);
  color: var(--accent-700);
}

.rig-lgraf-count:hover b,
.rig-lgraf-count:focus-visible b {
  color: var(--accent-700);
}

/* SAMO zero jest NEUTRALNE, tylko wygaszone: „nikt jeszcze nie wpisał" nie jest
   usterką. Kolor ostrzegawczy dokłada dopiero karta z modyfikatorem `blocking`. */
.rig-lgraf-count.zero {
  color: var(--muted);
}

.rig-lgraf-count.zero b {
  color: var(--muted);
}

/* Brak tokenu na przygaszony odcień obramowania w tonie ostrzeżenia – ta sama
   wartość co w kanonicznym `.rig-callout.danger`, żeby oba trzymały jeden ton. */
.rig-lgraf-edge.blocking .rig-lgraf-count {
  background: var(--white);
  border-color: #f3c9c9;
  color: var(--danger);
}

.rig-lgraf-edge.blocking .rig-lgraf-count b {
  color: var(--danger);
}

/* ---------- opisy krawędzi ---------- */
.rig-lgraf-what {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-2);
  line-height: 1.5;
}

.rig-lgraf-cell,
.rig-lgraf-note {
  margin: 0;
  font-size: 12px;
  color: var(--muted);
}

.rig-lgraf-cell b {
  color: var(--ink-2);
}

.rig-lgraf-note.blocking {
  font-weight: 600;
  color: var(--danger);
}

/* ---------- baner blokady ---------- */
.rig-lgraf-blocked {
  margin-bottom: 14px;
}

/* ---------- okienko importu ---------- */
/* Szeroki wariant modala – warstwę (`.rig-modal`, `.rig-modal-backdrop`)
   dziedziczymy z `_policy-bulk.scss`, tutaj wyłącznie szerokość z makiety
   (`max-width: 700px`) i przewijanie treści. */
.rig-lgraf-modal {
  width: min(700px, 100vw - 32px);
  max-height: calc(100vh - 64px);
  display: flex;
  flex-direction: column;
}

.rig-lgraf-modal .rig-modal-body {
  overflow: auto;
}

.rig-lgraf-downloads {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 9px;
}

/* Wiersze wyboru trybu nie potrzebują przewijania – dwie pozycje na krzyż. */
.rig-lgraf-mode .ctrl-list {
  max-height: none;
}

/* ============================================================
   _classic-chain.scss – łańcuch priorytetów ciągłości działania trybu klasycznego
   (ADR-127 decyzja 7): produkt → czynność przetwarzania → aktywo wspierające.

   Ekran jest DRZEWEM trzech poziomów, a nie listą: karta produktu zawiera karty
   czynności, a te tabelę aktywów. Arkusz ma `.rig-card` (poziom pierwszy) i nie ma
   niczego dla poziomu zagnieżdżonego – doklejanie tu `.rig-card` dałoby cień
   i obramowanie w obramowaniu, czyli układ, w którym nie widać, co czego jest
   częścią. Dlatego jeden własny komponent: ramka lżejsza, bez cienia, z lewą
   krawędzią wskazującą przynależność.

   Prefiks `rig-cch-` (classic continuity chain) po wzorze `.rig-lmx-` z macierzy:
   nazwy bez prefiksu w tym arkuszu należą do komponentów wspólnych i rozszerzanie
   ich psułoby ekrany, które ich używają.
   ============================================================ */
.rig-cch-node {
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius);
  padding: 12px 14px;
}

/* Tabela aktywów siedzi wewnątrz węzła czynności – bez własnego tła, żeby dwa
   poziomy zagnieżdżenia nie dawały trzech odcieni szarości. */
.rig-cch-node .rig-tbl {
  background: transparent;
}

/* Lista luk w komunikacie ostrzegawczym: bez odstępu zewnętrznego (callout już go ma), ale
   z wcięciem, żeby punktory nie wychodziły za jego krawędź. Wiersz przy wierszu, bez rozpychania
   na całą wysokość. */
.rig-cch-gaps {
  margin: 6px 0 0;
  padding-left: 18px;
}

.rig-cch-gaps li + li {
  margin-top: 4px;
}

/* Nagłówek karty objaśniającej: tytuł i plakietka w jednym wierszu, plakietka do prawej.
   Karty ciągłości mają tytuł ORAZ plakietkę stanu („luka ciągłości", „awaria w środę o 10:00"),
   a `.rig-card` sam z siebie takiego wiersza nie ma. */
.rig-cch-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.rig-cch-head h2 {
  font-family: Manrope, sans-serif;
  font-size: 16px;
  margin: 0;
}

/* ── Schemat trzech poziomów łańcucha (produkt → czynność → aktywo) ──
   Trzy pudełka i dwie strzałki. Na wąskim ekranie kolumny padają jeden pod drugi, a strzałki
   znikają: strzałka w dół między pudełkami niosłaby inną informację niż strzałka w prawo. */
.rig-cch-ladder {
  display: grid;
  grid-template-columns: 1fr 40px 1fr 40px 1fr;
  gap: 10px;
  align-items: stretch;
}
@media (max-width: 900px) {
  .rig-cch-ladder {
    grid-template-columns: 1fr;
  }
}

.rig-cch-lvl {
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
}
.rig-cch-lvl .rl {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 4px;
}
.rig-cch-lvl p {
  margin: 0;
  font-size: 13px;
  color: var(--ink-2);
}

.rig-cch-arrow {
  display: grid;
  place-items: center;
  font-size: 20px;
  color: var(--accent);
}
@media (max-width: 900px) {
  .rig-cch-arrow {
    display: none;
  }
}

/* ── Linijka czasu karty pary (prefiks `rig-cpt-`: classic pair timeline) ──
   Wymaganie czynności i próg z karty aktywa na JEDNEJ osi. Tło biegnie od zielonego do czerwonego,
   bo im dalej w prawo, tym dłuższa przerwa; zakreskowany odcinek to luka między wymaganiem
   a zdolnością. Pozycje znaczników liczy `ContinuityTimeline` i podaje w procentach – dlatego
   `left` jest w szablonie, a nie tutaj. */
.rig-cpt-ruler {
  position: relative;
  height: 64px;
  margin: 6px 0 30px;
  background: linear-gradient(to right, var(--ok-bg), var(--warn-bg) 55%, var(--danger-bg));
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.rig-cpt-mark {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--ink);
}

/* Odcinek luki jest ZAKRESKOWANY, nie tylko przybarwiony: sam odcień 16% ginie na tle gradientu,
   a tekst obok mówi wprost „zakreskowany odcinek". Ukośne kreski czytają się jako „tego czasu nie
   mamy" niezależnie od tego, w którym miejscu gradientu odcinek wypadnie. */
.rig-cpt-gap {
  position: absolute;
  top: 0;
  bottom: 0;
  background: repeating-linear-gradient(45deg, rgba(180, 35, 24, 0.3) 0 3px, rgba(180, 35, 24, 0) 3px 10px);
  border-left: 1px dashed var(--danger);
  border-right: 1px dashed var(--danger);
}

.rig-cpt-lab {
  position: absolute;
  top: 6px;
  font-size: 11.5px;
  font-weight: 600;
  background: var(--white);
  border: 1px solid var(--line-2);
  border-radius: 999px;
  padding: 2px 8px;
  white-space: nowrap;
  /* Druga etykieta niżej – dwie liczby blisko siebie nie mogą nachodzić na siebie w jednym wierszu. */
}
.rig-cpt-lab.down {
  top: 34px;
}

.rig-cpt-tick {
  position: absolute;
  bottom: -20px;
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}

/* Zakotwiczenie etykiety: przy krawędzi trzyma się jej, w środku jest wyśrodkowana. Bez tego
   znacznik przy samym zerze (kwadrans wobec dwóch dób) wyprowadzałby etykietę za linijkę. */
.rig-cpt-start {
  transform: none;
}

.rig-cpt-center {
  transform: translateX(-50%);
}

.rig-cpt-end {
  transform: translateX(-100%);
}

/* ── Słownik czterech pojęć: pojęcie po lewej, zdanie po prawej ── */
.rig-cpt-voc {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 9px 14px;
  margin: 0;
}
@media (max-width: 760px) {
  .rig-cpt-voc {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}
.rig-cpt-voc dt {
  font-family: Manrope, sans-serif;
  font-weight: 600;
  font-size: 13px;
}
.rig-cpt-voc dt span {
  display: block;
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: 11.5px;
  color: var(--muted);
}
.rig-cpt-voc dd {
  margin: 0;
  font-size: 13px;
  color: var(--ink-2);
}
.rig-cpt-voc dd + dt {
  margin-top: 4px;
}

/* Tabela z całymi zdaniami: `.rig-tbl` trzyma komórki w jednym wierszu (`nowrap`), co przy zdaniu
   rozpycha poziome przewijanie na całą szerokość ekranu. Ta klasa pozwala zdaniu się zawinąć. */
.rig-cpt-wrap {
  table-layout: fixed;
}
.rig-cpt-wrap th,
.rig-cpt-wrap td {
  white-space: normal;
}
.rig-cpt-wrap th:first-child,
.rig-cpt-wrap td:first-child {
  width: 26%;
}
.rig-cpt-wrap th:nth-child(2),
.rig-cpt-wrap td:nth-child(2) {
  width: 22%;
}

/*
  Układ ekranów SŁOWNIKOWYCH modułu ryzyka: zagrożenia (ADR-129), produkty i usługi, katalog
  klas podatności. Wszystkie trzy mają ten sam kształt – nagłówek z wyjściami, zwijany formularz
  nad listą, lista z filtrem i akcjami w wierszu.

  Plik powstał w 0.87.0 jako `_risk-threats.scss` dla dwóch ekranów słownika zagrożeń, które
  urodziły się BEZ ani jednej deklaracji wyglądu w atrybucie. Migracja toru C (ADR-130 decyzja 3)
  przeniosła na te same klasy dwa kolejne ekrany, więc nazwa pliku przestała opisywać zawartość –
  stąd `_risk-screens`. Klasy były od początku nazwane ogólnie (`rig-` zamiast `zagrozenia-`)
  właśnie z myślą o tym kroku.

  Komponenty bazowe (.rig-head, .rig-callout, .pill, .oe-*, .rig-tbl, .rig-dense) pochodzą
  z _components / _layout; tu wyłącznie to, czego tam nie ma.

  Plik ma DWIE części. Pierwsza – komponenty ekranu słownikowego (niżej). Druga – WARSTWA
  POMOCNIKÓW pod `.rig-body` (koniec pliku, wydanie W4): odstępy, wiersze w linii, wyrównania
  kolumn. Pomocniki są nazwane ogólnie i nie należą do ryzyka – gdy weźmie je drugi moduł,
  przenoszą się do `_components.scss` bez zmiany nazw.

  Budżet wyglądu w atrybutach pilnuje `InlineStyleBudgetTest` – stała schodzi razem z migracją.
*/
/* Nagłówek ekranu: opis po lewej, wyjścia po prawej. `.rig-head-actions` niesie _erm. */
.rig-head-split {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.rig-head-split > .rig-head-actions {
  flex: none;
}

/* Kod pozycji pod tytułem karty – bliżej tytułu niż akapit prowadzący. */
.rig-head-code {
  margin: 2px 0 6px;
}

/* Formularz zwijany nad listą: zapis nowej pozycji albo edycja wskazanej. */
.rig-formcard {
  margin: 18px 0;
}

.rig-formcard > summary {
  cursor: pointer;
  font-weight: 700;
  font-family: "Manrope", "Inter", sans-serif;
}

.rig-formcard > form {
  margin-top: 14px;
}

/* Podnagłówek grupy pól w formularzu (np. „Wielkości odtworzeniowe" na karcie produktu). */
.rig-formcard h3 {
  font-family: "Manrope", "Inter", sans-serif;
  font-size: 15px;
  margin: 18px 0 8px;
}

/* Akapit wprowadzający pod nagłówkiem – odstęp do pierwszej treści, nie do nagłówka.
   Do 0.88.0 reguła stała pod `.rig-formcard`, więc ten sam akapit w karcie objaśniającej
   musiał nieść odstęp w atrybucie. Rola jest ta sama w obu miejscach, dlatego selektor
   jest jeden i bez zakresu; wagi 0,2,0 wystarcza, żeby wygrać z `.rig-card p { margin: 0 }`. */
.hint.lead {
  margin: 0 0 10px;
}

/* Wartość zamiast pola – kod jest trwałym identyfikatorem i edycja go nie rusza (ADR-024).
   Wyrównanie w pionie do sąsiedniego pola formularza, żeby dwie kolumny nie „skakały". */
.rig-locked-value {
  padding: 7px 0;
}

/* Pole liczbowe formularza (modyfikator zagrożenia, wielkość odtworzeniowa).
   Kolumna liczbowa tabeli to `.rig-num` – niżej, w warstwie pomocników. */
.rig-num-input {
  max-width: 96px;
  text-align: right;
}

/* Zestaw pigułek w komórce (źródła zagrożenia, wielkości odtworzeniowe pary) – węższy odstęp
   niż w pasku filtra. Wariant `.wide` dla pigułek z treścią („RTO: 240 min"), które przy odstępie
   4 px zlewają się w jeden ciąg. */
.rig-pillrow {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.rig-pillrow.wide {
  gap: 6px;
}

/* Ostrzeżenie przy wierszu – ustalenie analizy, nie błąd wpisu (ADR-127 decyzja 9), więc ton
   ostrzegawczy, nie błędu. Odpowiednik `.rig-field-error` z _erm dla drugiego tonu. */
.rig-field-warning {
  color: var(--warn);
  font-size: 12px;
  margin: 4px 0 0;
}

/* Akcje wiersza, które muszą się zawijać: edycja + karta + wycofanie + usunięcie.
   `.rig-row-actions` z _erm trzyma je w jednej linii – tu jest ich za dużo. */
.rig-cell-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.rig-cell-actions form {
  display: inline;
}

/* Komunikat nad listą (odmowa usunięcia, 422) i nota pod listą. */
.rig-callout.before-list {
  margin-bottom: 18px;
}

.rig-callout.after-list {
  margin-top: 16px;
}

/* Podpowiedź pod listą – odstęp od tabeli, nie od akapitu. */
.hint.after-list {
  margin: 10px 0 0;
}

/*
  Wiersz „brak wyników" listy klienckiej (`v2-list`). Do 0.85.0 stan początkowy niósł
  `style="display:none"` w każdym szablonie – wygląd w atrybucie, którego strażnik budżetu
  nie odróżnia od wyglądu ozdobnego. Kontroler nadal steruje `style.display` (zgodność wstecz
  z szablonami, które ten atrybut mają), a DODATKOWO przełącza klasę `is-empty-shown`:
  szablon bez atrybutu startuje ukryty stąd.
*/
tr[data-v2-list-target=empty]:not(.is-empty-shown) {
  display: none;
}

/*
  ============================================================================
  WARSTWA POMOCNIKÓW (tor C, ADR-130 decyzja 3)
  ============================================================================

  Zejście z wyglądu w atrybutach na dwudziestu ekranach ryzyka nie da się zrobić samymi
  komponentami: większość deklaracji nie jest „nowym komponentem", a jednym odstępem, jednym
  wierszem w linii albo jednym wyrównaniem kolumny. Stąd druga część arkusza – nazwy OGÓLNE
  (`rig-`, nigdy `lancuch-`), bez nazwy ekranu, składalne między sobą: `rig-stacked-top rig-flush`
  zamiast trzeciej klasy na kombinację dwóch, które już są.

  DLACZEGO POD `.rig-body`: pomocnik z jedną klasą (waga 0,1,0) przegrywa z regułą komponentu,
  która doprecyzowuje element – `.rig-card p { margin: 0 }` ma 0,1,1, a `.rig-tbl thead th
  { text-align: left }` aż 0,1,2. Właśnie dlatego `class="rig-num"` na NAGŁÓWKU kolumny liczbowej
  do 0.88.0 nie działał: komórki stały wyrównane do prawej, a nazwa kolumny nad nimi do lewej
  (`klasyczny/produkty`, `zagrozenia/katalog`, `zagrozenia/modyfikatory`, `podatnosci/katalog`).
  Opakowanie `.rig-body` – jest w `module/layout.html.twig`, więc na każdym ekranie modułu – daje
  pomocnikom 0,2,0: dość, żeby wygrać z komponentem, i za mało, żeby wygrać z modyfikatorem
  postawionym na klasie nośnika (`.rig-callout.before-list`, `.hint.lead`). Bez `!important`,
  którego cała warstwa aplikacji używa raz, w regule druku.

  ODSTĘPY MAJĄ TRZY WARTOŚCI, NIE DZIESIĘĆ. Stan zastany niósł trzy stopnie dolne (14, 16, 18 px)
  i siedem górnych (6, 8, 10, 12, 14, 16, 18 px) – to osad z kilkunastu ekranów pisanych osobno,
  nie system. Zostają: 16 px (odstęp bloku), 10 px (blok przyklejony do tego, co nad nim) i 0.
  Kilkanaście bloków przesunie się o 2 px, kilka o 4 – to świadoma, jednorazowa cena jednego
  systemu wizualnego. Ten sam rachunek dla odstępu w wierszu: 6 / 8 / 10 / 14 px zamiast siedmiu
  wartości, każda zastana wartość trafia w stopień odległy o najwyżej 2 px.

  Odstępy o WŁASNEJ nazwie roli zostają tam, gdzie były, i mają pierwszeństwo przed pomocnikiem:
  `.rig-callout.before-list` / `.after-list`, `.hint.lead` / `.hint.after-list`.
*/
.rig-body {
  /* ── Odstęp bloku. Dwie osie, trzy wartości, wszystko składalne. ── */
  /* Blok przyklejony do tego, co nad nim: podpowiedź pod polem, tabela pod nagłówkiem grupy. */
  /*
    Dopisek PRZYKLEJONY do treści nad sobą: akapit pod nagłówkiem banera, zdanie pod tytułem
    bloku. Czwarty stopień odstępu (4 px) obok trzech z osi górnej istnieje dlatego, że tu
    odstęp nie ROZDZIELA dwóch bloków, a wiąże dwie linijki w jedną wypowiedź – 10 px z
    `.rig-stacked-top-sm` czyta się jako osobny akapit i wychodzi poza obwiednię ±2 px, którą
    trzyma reszta normalizacji. Dwa niezależne przebiegi tego wydania zostawiły te deklaracje
    w atrybucie właśnie z tego powodu.
  */
  /*
    ── Wiersz w linii: ikona i tekst, przycisk i przycisk, wartość i pigułka. ──
    Baza jest tym, czego szablony chciały najczęściej (do środka, zawija się, odstęp 10 px);
    modyfikatory zmieniają po jednej rzeczy, więc nie trzeba nowej klasy na każdą kombinację.
    `.rig-pillrow` (odstęp 4/6 px) zostaje osobno – zestaw pigułek w komórce nie jest wierszem
    układu, tylko treścią, i nie ma się wyrównywać do środka.
  */
  /* Wiersz W ZDANIU (nazwa i jej pigułki wewnątrz `<summary>`) – nie łamie akapitu. */
  /* Nazwa i pigułka o różnych rozmiarach czcionki – równa linia pisma, nie równe środki. */
  /* Kolumna wyrównana do prawej (licznik i pigułka stanu przy krawędzi nagłówka).
     MUSI stać po `.column`: obie reguły ustawiają `align-items` przy tej samej wadze. */
  /* Element, który nie ma się zwężać, gdy sąsiad rośnie: pasek wyjść, ikona przy zdaniu. */
  /*
    ── Pasek wyniku ──
    Jedna liczba wyliczona przez ekran (ryzyko po uwzględnieniu zabezpieczeń, suma wag)
    z podpisem obok. Wyodrębniony z tła, bo to ODPOWIEDŹ ekranu, a nie kolejne pole formularza;
    nie jest kartą, bo nie ma własnego tytułu ani nagłówka.
  */
  /*
    ── Wartość liczbowa do przeczytania z odległości ──
    Krój o stałej szerokości znaku, żeby dwie wartości pod sobą (przed i po zabezpieczeniach)
    dały się porównać wzrokiem bez czytania. Rozmiar jest modyfikatorem, bo ta sama wartość
    raz stoi w pasku wyniku (22 px), raz jest jedyną liczbą na ekranie (28 px), a raz siedzi
    w zdaniu i ma zostać przy rozmiarze zdania (sama baza).
  */
  /* Wartość WYNIKOWA (po przeliczeniu) – zieleń marki odróżnia ją od wartości wejściowych. */
  /* Podpis nad wartością albo obok niej – mniejszy od treści, ale to nadal treść, nie szum
     (dlatego `--ink-2`, a nie `--muted` jak `.muted`). */
  /* Akapit będący ETYKIETĄ bloku, nie zdaniem: „Wynik", „Wybrana metoda". */
  /* Tytuł karty bez nadtytułu – krój nagłówkowy systemu (Manrope), stopień niżej niż `h1`
     ekranu. `.rig-cch-head h2` robi to samo w karcie z plakietką stanu. */
  /* Nazwa pozycji w gęstym wierszu (produkt w podsumowaniu łańcucha) – krój nagłówkowy
     wyciąga ją z ciągu pigułek obok, bez zmiany rozmiaru. */
  /* Odnośnik, który jest wyjściem z ekranu, a nie słowem w zdaniu. */
  /* Ikona przy zdaniu: zieleń marki i zakaz zwężania – ikona zwężona przestaje być ikoną. */
  /* Znak rozdzielający dwie wartości w jednym wierszu („·", „→") – ma być widoczny, ale nie
     ma być czytany jako treść. */
  /*
    ── Wyrównanie treści ──
    Jedna deklaracja, dwie nazwy z RÓŻNYMI rolami: `.rig-num` mówi „to jest kolumna liczbowa"
    (nazwa domenowa, w użyciu od 0.87.0), `.rig-right` – „ta treść stoi u prawej krawędzi"
    i trafia na akapity, które liczbą nie są. Zapis w jednej regule, żeby nie dały się rozjechać.
  */
  /* Wyśrodkowanie treści: komórka tabeli (kolumna oceny, wyniku bramki) ALBO akapit – podpis
     pod obiektem, który sam stoi wyśrodkowany, np. legenda pod mini-macierzą. Jedna nazwa na
     oba przypadki z rozmysłem: druga klasa robiąca `text-align: center` byłaby dokładnie tym
     dublowaniem, przed którym broni to wydanie. */
  /* Wartość w wyśrodkowanej kolumnie, która jest ODCZYTEM, nie tłem (ocena, wynik bramki). */
  /* Kolumna z nazwą pozycji w szerokiej tabeli – bez dolnej granicy zwęża się do jednego słowa
     na wiersz i tabela robi się wyższa niż ekran. */
  /* Kolumna etykiet w tabeli dwukolumnowej (nazwa parametru | wartość). */
  /* Pole wyboru, które nie ma się rozciągać na szerokość formularza: filtr nad listą
     (wąskie) i wybór pozycji ze słownika (szerokie, bo nazwy są długie). */
  /* Lista, która jest ukrytym układem – kroki metodyki numeruje własna reguła, nie przeglądarka. */
  /* Lista wypunktowana WEWNĄTRZ bloku (luki w callout) – bez odstępu zewnętrznego, bo blok
     już go ma, ale z wcięciem, żeby punktory nie wychodziły za krawędź. */
  /* Blok w przygotowaniu albo poglądowy: widoczny, ale wyraźnie nie „na teraz". */
  /* Opakowanie techniczne (pętla Twiga) w siatce – dzieci mają trafić wprost do siatki
     rodzica, bo inaczej cała pętla staje się jedną komórką. */
  /* Formularz jednego przycisku w wierszu tabeli – bez tego łamie wiersz. */
  /* Karta odniesienia, która ma zostać na widoku, gdy formularz obok jest dłuższy od ekranu. */
}
.rig-body .rig-stacked {
  margin-bottom: 16px;
}
.rig-body .rig-stacked-top {
  margin-top: 16px;
}
.rig-body .rig-stacked-sm {
  margin-bottom: 10px;
}
.rig-body .rig-stacked-top-sm {
  margin-top: 10px;
}
.rig-body .rig-flush {
  margin-bottom: 0;
}
.rig-body .rig-flush-top {
  margin-top: 0;
}
.rig-body .rig-subnote {
  margin: 4px 0 0;
}
.rig-body .rig-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.rig-body .rig-row.inline {
  display: inline-flex;
}
.rig-body .rig-row.snug {
  gap: 6px;
}
.rig-body .rig-row.tight {
  gap: 8px;
}
.rig-body .rig-row.wide {
  gap: 14px;
}
.rig-body .rig-row.baseline {
  align-items: baseline;
}
.rig-body .rig-row.start {
  align-items: flex-start;
}
.rig-body .rig-row.between {
  justify-content: space-between;
}
.rig-body .rig-row.center {
  justify-content: center;
}
.rig-body .rig-row.column {
  flex-direction: column;
  align-items: stretch;
}
.rig-body .rig-row.to-right {
  align-items: flex-end;
}
.rig-body .rig-grow {
  flex: 1;
}
.rig-body .rig-flexnone {
  flex: none;
}
.rig-body .rig-resultbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  padding: 14px 16px;
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.rig-body .rig-monoval {
  font-family: ui-monospace, monospace;
  font-weight: 800;
  color: var(--ink);
}
.rig-body .rig-monoval.big {
  font-size: 22px;
}
.rig-body .rig-monoval.xl {
  font-size: 28px;
}
.rig-body .rig-monoval.accent {
  color: var(--accent-700);
}
.rig-body .rig-minilabel {
  font-size: 12px;
  color: var(--ink-2);
}
.rig-body .rig-minilabel.lg {
  font-size: 13px;
}
.rig-body .rig-strongline {
  font-weight: 600;
  color: var(--ink);
  margin: 0;
}
.rig-body .rig-cardtitle {
  font-family: "Manrope", "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 4px;
}
.rig-body .rig-name {
  font-family: "Manrope", "Inter", sans-serif;
}
.rig-body .rig-link-strong {
  font-weight: 600;
}
.rig-body .rig-link-strong.accent {
  color: var(--accent-700);
}
.rig-body .rig-link-strong.warn {
  color: var(--warn);
  font-weight: 700;
}
.rig-body .rig-ico-accent {
  color: var(--accent-700);
  flex: none;
}
.rig-body .rig-sep {
  color: var(--line-2);
}
.rig-body .rig-num,
.rig-body .rig-right {
  text-align: right;
}
.rig-body .rig-ctr {
  text-align: center;
}
.rig-body .rig-ctr.strong,
.rig-body .rig-num.strong {
  font-weight: 700;
}
.rig-body .rig-col-wide {
  min-width: 180px;
}
.rig-body .rig-col-label {
  width: 38%;
}
.rig-body .rig-field-narrow {
  max-width: 200px;
}
.rig-body .rig-field-wide {
  max-width: 380px;
}
.rig-body .rig-plainlist {
  list-style: none;
  margin: 0;
  padding: 0;
}
.rig-body .rig-bullets {
  margin: 0;
  padding-left: 18px;
}
.rig-body .rig-nowrap {
  white-space: nowrap;
}
.rig-body .rig-dimmed {
  opacity: 0.75;
}
.rig-body .rig-contents {
  display: contents;
}
.rig-body .rig-block {
  display: block;
}
.rig-body .rig-inline {
  display: inline;
}
.rig-body .rig-inline-block {
  display: inline-block;
}
.rig-body .rig-sticky-card {
  position: sticky;
  top: 12px;
}

/*# sourceMappingURL=app-7d1043473d.output.css.map */