/* ============================================================
   PROTOCOL launch: sdílený vizuální základ všech interních stránek
   Design systém „Režie" — vychází z Petrových 20 let před TV kamerou.
   Vkládá se na KAŽDOU interní stránku hned za /pnav.css:
     <link rel="stylesheet" href="/pnav.css">
     <link rel="stylesheet" href="/pstyle.css">
   Stránka pak přidává jen to, co je pro ni specifické.
   ⛔ Nepředefinovávej tady tokeny v inline <style> stránky.
   ============================================================ */

:root{
  --navy:#004591; --navy-deep:#002B5C; --gold:#FEC483; --gold-deep:#e0a252; --gold-ink:#8a6027;
  --cream:#FFF2E5; --paper:#fff; --ink:#0E2036; --muted:#5B6B7D;
  --line:#e8dccb; --line-soft:#f2e9dc;
  --ok:#17754f; --ok-bg:#e3f2ea;
  --wait:#8a6027; --wait-bg:#fdf3e2;
  --warn:#b4402c; --warn-bg:#fbe8e4;
  --mono:ui-monospace,"Cascadia Mono","SF Mono",Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans);background:var(--cream);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased}
.wrap{max-width:980px;margin:0 auto;padding:22px 16px 80px}
a{color:var(--navy)}
:focus-visible{outline:3px solid var(--navy);outline-offset:2px;border-radius:4px}
img{max-width:100%;height:auto}

.eyebrow{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
header.page h1{font-size:clamp(26px,4.5vw,38px);font-weight:800;color:var(--navy);letter-spacing:-.015em;line-height:1.12;margin-top:8px}
header.page .sub{font-size:16px;color:var(--muted);margin-top:10px;max-width:72ch}
header.page .sub b{color:var(--ink)}

.sec{margin-top:34px}
.sec-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.sec-head h2{font-size:20px;font-weight:800;color:var(--navy)}
.sec-head .note{font-size:14px;color:var(--muted)}
h3{font-size:16px;font-weight:800;color:var(--ink);margin-bottom:6px}

.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:20px 22px}
.card + .card{margin-top:12px}
.card.tight{padding:14px 16px}

/* ---------- stavový pruh: ✅ odsouhlaseno / ⏳ čeká / 🔴 chybí ----------
   Jedna komponenta pro všechny stránky. Tři rozklikávací řádky,
   každá položka v seznamu může být odkaz na konkrétní sekci stránky.
   Skupina 🔴 se nechává defaultně otevřená (open), pokud není prázdná.
   Markup:
     <div class="stav">
       <details class="sgrp ok"><summary><b class="n">13</b><span class="l">✅ odsouhlaseno</span><span class="chv">▾</span></summary><ul>…</ul></details>
       <details class="sgrp wait">…</details>
       <details class="sgrp miss" open>…</details>
     </div> */
.stav{background:var(--paper);border:1px solid var(--line);border-radius:18px;margin-top:18px;overflow:hidden}
.sgrp{border-top:1px solid var(--line-soft)}
.sgrp:first-child{border-top:0}
.sgrp > summary{
  cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;
  padding:11px 16px;min-height:44px;
}
.sgrp > summary::-webkit-details-marker{display:none}
.sgrp > summary .n{
  font-family:var(--mono);font-size:22px;font-weight:700;line-height:1;
  min-width:34px;text-align:right;font-variant-numeric:tabular-nums;
}
.sgrp > summary .l{font-size:14px;color:var(--ink);font-weight:600;letter-spacing:.02em}
.sgrp > summary .chv{margin-left:auto;color:var(--muted);font-size:12px;transition:transform .2s}
.sgrp[open] > summary .chv{transform:rotate(180deg)}
.sgrp.ok > summary .n{color:var(--ok)}
.sgrp.wait > summary .n{color:var(--wait)}
.sgrp.miss > summary .n{color:var(--warn)}
.sgrp.miss[open]{background:#fffcf9}
.sgrp > ul{list-style:none;margin:0;padding:2px 16px 12px 62px}
.sgrp > ul li{font-size:14px;margin:0;padding:5px 0;border-top:1px dashed var(--line-soft);line-height:1.5}
.sgrp > ul li:first-child{border-top:0}
.sgrp > ul a{color:var(--navy);text-decoration:none}
.sgrp > ul a:hover{text-decoration:underline}
.sgrp > ul a::after{content:" →";color:var(--gold-deep)}
@media(max-width:640px){.sgrp > ul{padding-left:16px}}

/* ---------- pravidlové karty (Meta compliance apod.) ---------- */
.rules{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:700px){.rules{grid-template-columns:1fr}}
.rule{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px 16px;font-size:14px}
.rule b{display:block;color:var(--warn);font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}

/* ---------- pole s návěštím (labelovaný odstavec v kartě) ---------- */
.fld{margin-bottom:14px}
.fld:last-child{margin-bottom:0}
.fld .lab{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:5px;display:block}
.fld p,.fld li{font-size:15px;line-height:1.55}

/* ---------- štítky ---------- */
.tag{display:inline-block;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.08em;
     text-transform:uppercase;padding:3px 8px;border-radius:999px;white-space:nowrap}
.tag.ok{background:var(--ok-bg);color:var(--ok)}
.tag.wait{background:var(--wait-bg);color:var(--wait)}
.tag.miss{background:var(--warn-bg);color:var(--warn)}
.tag.neutral{background:var(--line-soft);color:var(--muted)}

/* ---------- tabulky ---------- */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
table{border-collapse:collapse;width:100%;font-size:14.5px;min-width:520px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line-soft);vertical-align:top}
th{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
   color:var(--muted);background:#fffdf9;position:sticky;top:0}
tr:last-child td{border-bottom:0}
td.num{font-family:var(--mono);text-align:right;white-space:nowrap}

/* ---------- timecode osa (signature prvek) ---------- */
.osa{position:relative;margin-top:6px;padding-left:22px}
.osa::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--line)}
.osa-i{position:relative;padding:12px 0 12px 14px}
.osa-i::before{content:"";position:absolute;left:-21px;top:19px;width:11px;height:11px;border-radius:50%;
  background:var(--paper);border:2px solid var(--gold-deep)}
.osa-i.hard::before{background:var(--navy);border-color:var(--navy)}
.osa-i .tc{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--gold-ink);text-transform:uppercase}
.osa-i .tt{font-size:15.5px;font-weight:700;margin-top:2px}
.osa-i .dd{font-size:14.5px;color:var(--muted);margin-top:3px}

/* ---------- poznámkové bloky ---------- */
.note-box{border-left:3px solid var(--gold-deep);background:#fffdf9;border-radius:0 12px 12px 0;padding:12px 14px;margin-top:12px;font-size:15px}
.note-box.warn{border-left-color:var(--warn);background:var(--warn-bg)}
.note-box.ok{border-left-color:var(--ok);background:var(--ok-bg)}
.note-box b{color:var(--ink)}

/* ---------- zdroj čísla ---------- */
.src{font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.04em;margin-top:4px;display:block}

/* ---------- rozklikávací blok ---------- */
details.d{border:1px solid var(--line);border-radius:14px;background:var(--paper);margin-top:10px;overflow:hidden}
details.d > summary{cursor:pointer;padding:12px 16px;font-weight:700;font-size:15px;color:var(--navy);list-style:none}
details.d > summary::-webkit-details-marker{display:none}
details.d > summary::before{content:"▸ ";color:var(--gold-deep)}
details.d[open] > summary::before{content:"▾ "}
details.d > .dbody{padding:0 16px 16px}

footer.page{margin-top:46px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}

@media(max-width:640px){
  .wrap{padding:16px 12px 60px}
  .card{padding:16px 14px;border-radius:14px}
}