:root { --bg:#f5f6f8; --card:#fff; --ink:#1d2330; --muted:#667085; --line:#d9dde5; --accent:#0b5cab; --accent-soft:#e8f1fb; --bad:#b42318; --bad-soft:#fff1f0; --tap:44px; }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { scroll-padding-top: 120px; -webkit-text-size-adjust: 100%; }
body { margin:0; font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--ink); background:var(--bg); }
main { max-width:1000px; margin:0 auto; padding:16px; padding-left:max(16px, env(safe-area-inset-left)); padding-right:max(16px, env(safe-area-inset-right)); }
h1 { font-size:22px; margin:4px 0 12px; }

/* ---------- nagłówek */
.top { position:sticky; top:0; z-index:20; display:flex; justify-content:space-between; align-items:center; gap:8px;
       padding:8px 16px; padding-top:max(8px, env(safe-area-inset-top)); background:var(--card); border-bottom:1px solid var(--line); }
.brand { font-weight:700; color:var(--ink); text-decoration:none; font-size:17px; display:flex; align-items:center; gap:6px; min-height:var(--tap); }
.brand.back { color:var(--accent); font-size:18px; }
.logo { color:#d92d20; }
nav { display:flex; gap:8px; align-items:center; }
.inline { display:inline; margin:0; }

/* ---------- przyciski */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:var(--tap); padding:9px 16px;
       border:1px solid var(--accent); background:var(--accent); color:#fff; border-radius:10px; font:inherit; font-weight:500;
       cursor:pointer; text-decoration:none; white-space:nowrap; touch-action:manipulation; }
.btn:active { transform:scale(.97); }
.btn.ghost { background:#fff; color:var(--accent); }
.btn.danger { background:#fff; color:var(--bad); border-color:var(--bad); }
.btn.big { padding:12px 22px; font-weight:600; }
.small-btn { min-height:38px; padding:6px 12px; font-size:15px; }

/* ---------- karty / formularz */
.card { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px 16px; margin:0 0 12px; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px 16px; }
.fld { display:flex; flex-direction:column; justify-content:flex-end; gap:5px; font-size:14px; min-width:0; margin:0; }
.fld.wide { grid-column:1/-1; }
.lbl { color:#344054; font-weight:500; }
fieldset.fld { border:0; padding:0; }
fieldset.fld > legend { padding:0; margin-bottom:6px; }
small { color:var(--muted); }
input, select, textarea { font:inherit; font-size:16px; /* 16px = brak auto-zoomu na iPhone */
       min-height:var(--tap); padding:9px 12px; border:1px solid #c4cad4; border-radius:10px; background:#fff; width:100%; color:var(--ink); }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(11,92,171,.18); }
textarea { resize:vertical; min-height:96px; }
.inp { position:relative; display:block; }
.inp input { padding-right:62px; }
.unit { position:absolute; right:10px; top:50%; transform:translateY(-50%); font-style:normal; font-size:13px; color:var(--muted); pointer-events:none; }
.fld.bad input { border-color:var(--bad); background:var(--bad-soft); }
.fld.bad .lbl::after { content:" – wpisz liczbę"; color:var(--bad); font-weight:600; }

/* opcje jako „pigułki” – jedno dotknięcie zamiast listy rozwijanej */
.pillrow { display:flex; flex-wrap:wrap; gap:8px; }
.pill { position:relative; }
.pill input { position:absolute; opacity:0; width:1px; height:1px; min-height:0; }
.pill span { display:inline-flex; align-items:center; min-height:40px; padding:7px 14px; border:1px solid #c4cad4; border-radius:999px;
             background:#fff; cursor:pointer; font-size:15px; user-select:none; touch-action:manipulation; }
.pill input:checked + span { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600; }
.pill input:focus-visible + span { box-shadow:0 0 0 3px rgba(11,92,171,.3); }

/* sekcje zwijane */
details.sec { padding:0; overflow:hidden; scroll-margin-top:118px; }
details.sec > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:8px; min-height:52px; padding:12px 16px;
                        font-weight:700; font-size:17px; user-select:none; }
details.sec > summary::-webkit-details-marker { display:none; }
details.sec > summary::after { content:"›"; margin-left:auto; font-size:24px; line-height:1; color:var(--muted); transform:rotate(90deg); transition:transform .15s; }
details.sec:not([open]) > summary::after { transform:none; }
details.sec[open] > summary { border-bottom:1px solid var(--line); }
details.sec > .grid { padding:14px 16px 4px; }
summary .cnt { font-size:13px; font-weight:600; color:var(--accent); background:var(--accent-soft); border-radius:999px; padding:2px 8px; }
summary .cnt:empty { display:none; }
.sec-foot { padding:8px 16px 14px; display:flex; justify-content:flex-end; }
.live { margin:8px 16px 0; color:var(--accent); font-weight:600; }
.live:empty { display:none; }

/* szybka nawigacja po sekcjach */
.chips { position:sticky; top:61px; z-index:15; display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; margin:0 -16px 12px;
         padding:8px 16px; background:var(--bg); }
.chips::-webkit-scrollbar { display:none; }
.chips a { flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; min-height:36px; padding:6px 12px; border-radius:999px;
           border:1px solid var(--line); background:#fff; color:var(--ink); text-decoration:none; font-size:14px; white-space:nowrap; }
.chips a.has { border-color:var(--accent); }
.chips a .cnt { font-size:12px; color:#fff; background:var(--accent); border-radius:999px; padding:0 6px; }
.chips a .cnt:empty { display:none; }

/* dolny pasek zapisu */
.savebar, .actionbar { display:flex; gap:8px; align-items:center; }
.savebar { position:sticky; bottom:0; z-index:15; margin:12px -16px -16px; padding:10px 16px; padding-bottom:max(10px, env(safe-area-inset-bottom));
           background:rgba(255,255,255,.96); border-top:1px solid var(--line); backdrop-filter:blur(6px); }
.savebar .btn.big { flex:1; }
.actionbar { flex-wrap:wrap; margin:0 0 12px; }

/* ---------- lista badań */
.searchbar { display:flex; gap:8px; margin-bottom:8px; }
.searchbar input { border-radius:12px; }
.count { margin:4px 2px 8px; }
.studies { list-style:none; margin:0; padding:0; background:var(--card); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.studies li { display:flex; align-items:stretch; border-bottom:1px solid var(--line); }
.studies li:last-child { border-bottom:0; }
.study { flex:1; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; column-gap:10px; align-items:center;
         padding:12px 14px; min-height:60px; text-decoration:none; color:var(--ink); min-width:0; }
.study:active, .quick-edit:active { background:var(--accent-soft); }
.who { font-weight:600; font-size:17px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.when { grid-row:2; color:var(--muted); font-size:14px; }
.chev { grid-row:1/3; grid-column:2; font-size:24px; color:var(--muted); }
.quick-edit { display:flex; align-items:center; justify-content:center; width:56px; border-left:1px solid var(--line);
              color:var(--accent); text-decoration:none; font-size:20px; }
.empty { text-align:center; padding:32px 16px; }
.fab { display:none; }

/* ---------- pozostałe */
.flash { background:#fff4e5; border:1px solid #f5c26b; padding:10px 12px; border-radius:10px; margin-bottom:10px; }
.login { max-width:360px; margin:48px auto; display:flex; flex-direction:column; gap:12px; }
.login h1 { margin:0; }
.login label { display:flex; flex-direction:column; gap:5px; }
table { border-collapse:collapse; width:100%; background:var(--card); }
th, td { text-align:left; padding:7px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
.right { text-align:right; }
.muted { color:var(--muted); }
.small { font-size:13px; }
.report { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px 24px; }
.report h1 { font-size:21px; margin:0 0 12px; }
.report h2 { font-size:17px; margin:20px 0 6px; border-bottom:2px solid var(--ink); padding-bottom:2px; }
.meta th { width:150px; color:var(--muted); font-weight:600; }
.meas { max-width:560px; }
tr.abn td { background:var(--bad-soft); font-weight:600; }
.pre { white-space:pre-wrap; }
.sign { margin-top:36px; text-align:right; }
.danger-zone { margin:24px 0 8px; text-align:center; }

.hide-sm { }

/* ---------- telefon */
@media (max-width:700px) {
  .hide-sm { display:none !important; }
  main { padding:12px; }
  .top { padding-left:12px; padding-right:12px; }
  .grid { grid-template-columns:1fr 1fr; gap:12px 10px; }
  .grid .fld:not(.numf):not(.wide) { grid-column:1/-1; }
  .fld { font-size:13px; }
  .chips { margin:0 -12px 10px; padding:8px 12px; }
  .savebar { margin:12px -12px -12px; padding-left:12px; padding-right:12px; }
  .savebar { position:fixed; left:0; right:0; bottom:0; margin:0; }
  body.has-savebar main { padding-bottom:90px; }
  details.sec > .grid { padding:12px 12px 4px; }
  details.sec > summary { padding:12px; }
  .sec-foot { padding:8px 12px 12px; }
  .sec-foot .btn { width:100%; }
  .live { margin:8px 12px 0; }

  /* raport: akcje na dole ekranu, w zasięgu kciuka */
  .actionbar { position:fixed; left:0; right:0; bottom:0; z-index:15; margin:0; flex-wrap:nowrap; gap:6px; padding:8px 10px;
               padding-bottom:max(8px, env(safe-area-inset-bottom)); background:rgba(255,255,255,.96); border-top:1px solid var(--line);
               backdrop-filter:blur(6px); }
  .actionbar .btn { flex:1; padding:8px 6px; font-size:14px; min-width:0; }
  body.has-actionbar main { padding-bottom:84px; }
  .report { padding:14px; border-radius:12px; }
  .report h1 { font-size:18px; }
  .meta, .meta tbody { display:block; }
  .meta tr { display:grid; grid-template-columns:42% 1fr; }
  .meta th, .meta td { width:auto; padding:6px 4px; font-size:14px; }
  .meas td, .meas th { padding:6px 4px; font-size:14px; }

  /* lista: pływający przycisk „+” */
  body.has-fab .top .btn:not(.small-btn) { display:none; }
  .fab { display:flex; align-items:center; justify-content:center; position:fixed; right:18px; bottom:max(18px, env(safe-area-inset-bottom));
         width:60px; height:60px; border-radius:50%; background:var(--accent); color:#fff; font-size:32px; text-decoration:none;
         box-shadow:0 6px 18px rgba(11,92,171,.4); z-index:15; }
  body.has-fab main { padding-bottom:96px; }
}
@media (max-width:360px) {
  .grid { grid-template-columns:1fr; }
}

@media print {
  body { background:#fff; font-size:12pt; }
  .noprint, .top { display:none !important; }
  main { max-width:none; padding:0 !important; }
  .report { border:0; padding:0; }
  .meta { display:table; width:100%; }
  .meta tbody { display:table-row-group; }
  .meta tr { display:table-row; }
}

/* ---------- etapy badania */
.subhead { grid-column:1/-1; margin:6px 0 -4px; font-size:13px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.subhead:first-child { margin-top:0; }
details.stage1 > summary .sec-title::before { content:"①  "; color:var(--accent); }
details.stage2 > summary .sec-title::before { content:"②  "; color:#b54708; }
details.stage2 { border-left:4px solid #f79009; }
.screen { margin:14px 16px 4px; padding:12px 14px; border-radius:12px; border:1px solid var(--line); background:#f9fafb; }
.screen p { margin:0 0 6px; }
.screen ul { margin:0 0 6px; padding-left:20px; }
.screen ul:empty, .screen p:empty { display:none; }
.screen.st-normal { background:#ecfdf3; border-color:#75e0a7; }
.screen.st-normal .screen-status { color:#067647; }
.screen.st-abnormal { background:#fffaeb; border-color:#fec84b; }
.screen.st-abnormal .screen-status { color:#b54708; }
.screen .warn { color:var(--bad); font-weight:600; }
.expand-toggle { display:flex; align-items:center; gap:10px; min-height:var(--tap); margin-top:6px; padding:8px 12px; border:1px dashed var(--accent);
                 border-radius:10px; background:#fff; color:var(--accent); font-weight:600; cursor:pointer; }
.expand-toggle input { width:22px; height:22px; min-height:0; margin:0; flex:0 0 auto; accent-color:var(--accent); }
[hidden] { display:none !important; }
.badge { display:inline-block; font-size:12px; font-weight:600; border-radius:999px; padding:1px 8px; margin-left:6px; vertical-align:middle; }
.badge.st-normal { background:#ecfdf3; color:#067647; }
.badge.st-abnormal { background:#fffaeb; color:#b54708; }
.badge.st-incomplete { background:#f2f4f7; color:#475467; }
.status-box { border-radius:10px; padding:10px 12px; margin:0 0 12px; border:1px solid var(--line); }
.status-box.st-normal { background:#ecfdf3; border-color:#75e0a7; }
.status-box.st-abnormal { background:#fffaeb; border-color:#fec84b; }
.status-box.st-incomplete { background:#f2f4f7; }
.status-box p { margin:0; }
@media (max-width:700px) { .screen { margin:12px 12px 4px; } }
@media print { .status-box { border:1px solid #999; background:none; } }
.status-box .warn { color:var(--bad); font-weight:600; }
.screen ul.warn { list-style:none; padding-left:0; }
