/* NH.kartaWynikow — „Karta wyników kliniki” (Panel admina → Wyniki, Tablica zarządcza PDCA). Tylko tokeny (tokens.css). */
.nh-kw [hidden] { display: none; }   /* .nh-kw-drill ma display:grid — bez tego ukryta lista osób zostawała pustym polem (Tablica zarządcza, 12.10) */
.nh-kw { display: grid; gap: var(--space-4); font-family: var(--nh-font-body, var(--nh-font-head)); color: var(--nh-text); }
.nh-kw-bar-top { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
.nh-kw-seg { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--nh-line); border-radius: 999px; background: var(--nh-surface); }
.nh-kw-seg button { border: 0; background: transparent; color: var(--nh-text-2); padding: 6px 14px; border-radius: 999px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.nh-kw-seg button[aria-pressed="true"] { background: var(--nh-navy); color: var(--nh-text-on-dark); }
.nh-kw-asof { font-size: 12.5px; color: var(--nh-text-muted); }
.nh-kw-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
/* (12.10) Tygodnie (8, zakres dat pod słupkiem): na wąskim ekranie rysunek nie maleje poniżej czytelnej szerokości — przewija się w bok */
.nh-kw-scroll { overflow-x: auto; }
.nh-kw-chart.is-w { min-width: 440px; }
.nh-kw-card { background: var(--nh-surface); border: 1px solid var(--nh-line); border-radius: var(--radius-md); padding: var(--space-4) var(--space-5); display: grid; gap: var(--space-3); min-width: 0; }
.nh-kw-t { font-family: var(--nh-font-head); font-size: 15px; font-weight: 700; color: var(--nh-text); display: flex; align-items: center; gap: var(--space-2); }
.nh-kw-i { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--nh-line); font-size: 11px; font-weight: 700; color: var(--nh-text-2); cursor: help; }
.nh-kw-sub { font-size: 13px; color: var(--nh-text-muted); }
.nh-kw-meta { font-size: 13px; color: var(--nh-text-muted); }
.nh-kw-kpi { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-3); }
.nh-kw-kpi b { font-family: var(--nh-font-head); font-size: 32px; line-height: 1; font-weight: 700; color: var(--nh-text); font-variant-numeric: tabular-nums; }
.nh-kw-kpi > span { font-size: 13px; color: var(--nh-text-2); }
.nh-kw-kpi .nh-kw-tok { color: var(--nh-text-muted); }
.nh-kw-chip { display: inline-flex; padding: 2px var(--space-2); border-radius: 999px; font-size: 12.5px; font-weight: 600; background: var(--nh-chip-bg); color: var(--nh-text-2); }
.nh-kw-chip.is-up { background: var(--nh-ok-bg); color: var(--nh-ok-text); }
.nh-kw-chip.is-down { background: var(--nh-miss-bg); color: var(--nh-miss-text); }
.nh-kw-chart { width: 100%; height: auto; display: block; overflow: visible; }
.nh-kw-chart text { font-family: var(--nh-font-head); }
.nh-kw-ax { font-size: 11px; fill: var(--nh-text-muted); }
.nh-kw-val { font-size: 11.5px; font-weight: 700; fill: var(--nh-text); }
.nh-kw-grid { stroke: var(--nh-line-soft); stroke-width: 1; }
.nh-kw-base { stroke: var(--nh-line); stroke-width: 1; }
.nh-kw-hit { cursor: pointer; outline: none; }
.nh-kw-hitbox { fill: transparent; }
.nh-kw-hit:hover .nh-kw-hitbox, .nh-kw-hit:focus-visible .nh-kw-hitbox, .nh-kw-hit.is-sel .nh-kw-hitbox { fill: var(--nh-field); }
.nh-kw-bar { fill: var(--nh-accent); }
.nh-kw-hit.is-tok .nh-kw-bar { fill: color-mix(in srgb, var(--nh-accent) 22%, var(--nh-surface)); stroke: var(--nh-accent); stroke-width: 1.5; stroke-dasharray: 4 3; }
.nh-kw-hit.is-sel .nh-kw-bar { fill: var(--nh-navy); }
/* tygodnie: linia z kropkami (12.10 — wygląd jak wcześniej, z liczbą przy każdej kropce) */
.nh-kw-area { fill: color-mix(in srgb, var(--nh-accent) 14%, transparent); }
.nh-kw-line { fill: none; stroke: var(--nh-accent); stroke-width: 2.5; stroke-linejoin: round; }
.nh-kw-line.is-tok { stroke-dasharray: 4 4; }
.nh-kw-pt { fill: var(--nh-accent); }
.nh-kw-hit.is-sel .nh-kw-pt { fill: var(--nh-navy); }
/* (12.10) okresy z importu Medideska — przybliżone (NH.dataEra) */
.nh-kw-hit.is-md .nh-kw-bar, .nh-kw-hit.is-md .nh-kw-pt { fill: color-mix(in srgb, var(--nh-accent) 40%, var(--nh-surface)); }
.nh-kw-hit.is-md.is-sel .nh-kw-bar, .nh-kw-hit.is-md.is-sel .nh-kw-pt { fill: var(--nh-navy); }
.nh-kw-md { font-size: 12px; color: var(--nh-text-2); cursor: help; }
.nh-kw-drill { background: var(--nh-surface); border: 1px solid var(--nh-line); border-radius: var(--radius-md); padding: var(--space-4); display: grid; gap: var(--space-2); }
.nh-kw-close { margin-left: auto; border: 1px solid var(--nh-line); background: var(--nh-surface); color: var(--nh-text-2); border-radius: var(--radius-sm); width: 28px; height: 28px; cursor: pointer; font-size: 16px; line-height: 1; }
.nh-kw-list { list-style: none; margin: 0; padding: 0; display: grid; }
.nh-kw-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3); align-items: baseline; padding: var(--space-2) 0; border-bottom: 1px solid var(--nh-line-soft); font-size: 14px; }
.nh-kw-d { color: var(--nh-text-muted); font-variant-numeric: tabular-nums; }
.nh-kw-name { text-align: left; background: none; border: 0; padding: 0; font: inherit; font-weight: 600; color: var(--nh-text); min-width: 0; overflow-wrap: anywhere; }
button.nh-kw-name { color: var(--nh-accent); cursor: pointer; }
button.nh-kw-name:hover { text-decoration: underline; }
.nh-kw-o { color: var(--nh-text-2); font-size: 13px; min-width: 0; }
@media (max-width: 760px) { .nh-kw-grid2 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .nh-kw-row { grid-template-columns: 1fr; gap: 2px; } }