/* =====================================================================
   Kronika Václava Mináře — společná vrstva
   Jediný zdroj pravdy pro barvy, písmo a sdílené komponenty.
   Používají ji nahled.html i rodokmen.html; nic z toho se nesmí
   duplikovat v jednotlivých stránkách.
   ===================================================================== */

:root {
  /* papír a inkoust */
  --paper:#E8E6DD; --paper-deep:#DEDCD1; --card:#F1EFE8; --card-2:#E3E1D6;
  --ink:#1B1F22; --ink-soft:#4C5257; --ink-faint:#7B8186;
  --rule:#C3C1B4; --rule-soft:#D5D3C7;
  /* akcenty: indigo = doložené a přímá linie, madder = smrt a vdovství,
     ochre = nejistota a poznámka archiváře */
  --indigo:#2F5169; --indigo-soft:#7A95A9;
  --madder:#8C3A2B; --ochre:#8A6A22;

  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua","URW Palladio L",Georgia,serif;
  --slab:"Superclarendon","Bookman Old Style",Rockwell,"Roboto Slab",Georgia,serif;
  --sans:ui-sans-serif,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;

  --measure:34rem;
}

@media (prefers-color-scheme: dark) {
  :root { --paper:#13171A; --paper-deep:#0D1113; --card:#1A1F22; --card-2:#212729;
    --ink:#E2E4DE; --ink-soft:#A7AEAD; --ink-faint:#767C7E; --rule:#2E3538; --rule-soft:#232A2C;
    --indigo:#8FB6D0; --indigo-soft:#54718A; --madder:#D2836F; --ochre:#C6A75E; }
}
:root[data-theme="dark"] { --paper:#13171A; --paper-deep:#0D1113; --card:#1A1F22; --card-2:#212729;
  --ink:#E2E4DE; --ink-soft:#A7AEAD; --ink-faint:#767C7E; --rule:#2E3538; --rule-soft:#232A2C;
  --indigo:#8FB6D0; --indigo-soft:#54718A; --madder:#D2836F; --ochre:#C6A75E; }
:root[data-theme="light"] { --paper:#E8E6DD; --paper-deep:#DEDCD1; --card:#F1EFE8; --card-2:#E3E1D6;
  --ink:#1B1F22; --ink-soft:#4C5257; --ink-faint:#7B8186; --rule:#C3C1B4; --rule-soft:#D5D3C7;
  --indigo:#2F5169; --indigo-soft:#7A95A9; --madder:#8C3A2B; --ochre:#8A6A22; }

/* ---------------------------------------------------------- základ */

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--serif); line-height:1.64;
  -webkit-font-smoothing:antialiased;
}

em { font-style:italic; }
strong { font-weight:600; }
a { color:var(--indigo); }
a:focus-visible { outline:2px solid var(--indigo); outline-offset:3px; }
hr { border:none; border-top:1px solid var(--rule); margin:3.4rem 0 0; height:0; }

/* ------------------------------------------------------- hlavička */

.eyebrow { font-family:var(--mono); font-size:0.65rem; letter-spacing:0.22em;
           text-transform:uppercase; color:var(--ink-faint); }
h1 { font-family:var(--slab); font-weight:400; letter-spacing:-0.018em;
     line-height:1.02; margin:0; text-wrap:balance; }
.rule-double { border-bottom:3px double var(--ink); }

/* ---------------------------------------------- tabule a popisky */

.plate-hd { font-family:var(--mono); font-size:0.63rem; letter-spacing:0.15em;
            text-transform:uppercase; color:var(--ink-faint); margin-bottom:1.2rem; }
.plate-hd span { color:var(--indigo); }
.scroll { overflow-x:auto; padding-bottom:0.4rem; }
/* Na úzkém okně byla každá tabule skrytý vodorovný posuvník bez jakéhokoli
   náznaku. Nápověda se drží vlevo (sticky), takže je vidět i po posunutí. */
@media (max-width:820px) {
  .scroll { position:relative; }
  /* nápověda jen tam, kde obsah opravdu přetéká (třídu dává skript) */
  .scroll.lze::after { content:'\2192  tabulka pokračuje vpravo, posuňte ji';
                   display:block; position:sticky; left:0; width:max-content;
                   font-family:var(--mono); font-size:0.57rem; letter-spacing:0.06em;
                   color:var(--ink-faint); padding-top:0.45rem; }
}
.capt { font-size:0.85rem; color:var(--ink-soft); max-width:var(--measure); margin-top:1.1rem; }

/* ------------------------------------- pruhový graf (obě stránky)
   Jedna komponenta, jedny názvy tříd. Dřív existovala dvakrát:
   .brow/.btr/.bsg/.bax v kronice a .frow/.fbar/.fseg/.axis v rodokmenu.  */

.axis { position:relative; height:1.2rem; margin-bottom:0.35rem; }
.axis span { position:absolute; transform:translateX(-50%); font-family:var(--mono);
             font-size:0.58rem; color:var(--ink-faint); }
.frow { display:grid; grid-template-columns:var(--barlabel,12rem) 1fr; gap:0.7rem;
        align-items:center; padding:0.16rem 0; }
.frow .nm { font-size:0.8rem; text-align:right; color:var(--ink-soft);
            white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.frow.w .nm { color:var(--madder); }
.frow.key .nm { color:var(--indigo); font-weight:600; }
.fbar { position:relative; height:1.45rem; background:var(--paper-deep);
        border-top:1px solid var(--rule-soft); border-bottom:1px solid var(--rule-soft); }
.fseg { position:absolute; top:0.22rem; height:1rem; background:var(--indigo-soft);
        font-family:var(--mono); font-size:0.57rem; color:var(--paper); line-height:1rem;
        padding:0 0.35rem; white-space:nowrap; overflow:hidden; }
.fseg.widow { background:var(--madder); }
.fseg.minor { background:var(--ink-faint); }
.fseg.gone  { background:repeating-linear-gradient(45deg,
              var(--ink-faint) 0 3px, transparent 3px 6px); }
/* popisek se kreslí VEDLE pruhu, ne do něj — krátké úseky ho neunesou
   a ořezávaly se na "rolník, od jedna…" nebo "cizí" */
.flab { position:absolute; top:0.28rem; font-family:var(--mono); font-size:0.57rem;
        line-height:1rem; color:var(--ink-soft); white-space:nowrap; }
.frow.w .flab { color:var(--madder); }

/* ------------------------------------------------ značka jistoty */

.cert { display:inline-block; font-family:var(--mono); font-size:0.56rem;
        letter-spacing:0.1em; text-transform:uppercase; padding:0.08rem 0.35rem;
        border:1px solid currentColor; margin-left:0.5rem; vertical-align:0.18em; }
.cert.ok { color:var(--indigo); }
.cert.maybe { color:var(--ochre); }

/* ------------------------------------------------------- legenda */

.legend { display:flex; flex-wrap:wrap; gap:0.45rem 1.4rem; margin-top:1.3rem;
          font-family:var(--mono); font-size:0.61rem; color:var(--ink-faint); }
.legend span { display:flex; align-items:center; gap:0.4rem; }
.legend i { display:inline-block; width:0.85rem; height:0.85rem; flex:none;
            background:var(--card); border:1px solid var(--rule); }
.legend i.a { border-left:3px solid var(--indigo); }
.legend i.b { border-left:3px solid var(--madder); }
.legend i.c { background:var(--madder); border-color:var(--madder); }
.legend i.d { background:repeating-linear-gradient(45deg,
              var(--indigo-soft) 0 3px, transparent 3px 6px); }

/* ------------------------------------------------- přepínač témat */

.theme { position:fixed; right:0.9rem; bottom:0.9rem; z-index:50;
         font-family:var(--mono); font-size:0.62rem; letter-spacing:0.08em;
         background:var(--card); color:var(--ink-soft);
         border:1px solid var(--rule); padding:0.35rem 0.6rem; cursor:pointer; }
.theme:hover { border-color:var(--indigo); color:var(--indigo); }
.theme:focus-visible { outline:2px solid var(--indigo); outline-offset:2px; }
@media print { .theme { display:none; } }

/* -------------------------------------------------- odkrývání */

.reveal { opacity:0; transform:translateY(9px); transition:opacity .5s ease, transform .5s ease; }
.reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce) { .reveal { opacity:1; transform:none; transition:none; } }

/* ------------------------------------------------------------ tisk */

@media print {
  body { background:#fff; color:#000; background-image:none; font-size:11pt; }
  .reveal { opacity:1; transform:none; }
  a { color:#000; text-decoration:none; }
}
