/* =====================================================================
   Mobilise – The Playbook · webový pracovní sešit
   Písma: Lexend (nadpisy i text, SIL OFL) + Sentient (citáty, modlitby, verše; ITF Free Font License)
   Barvy podle tištěného sešitu: inkoustová modř, červená, hořčice, fialová
   ===================================================================== */

/* Lexend (SIL OFL) – nadpisy, výroky, text i rozhraní; nemá kurzívu */
@font-face { font-family: 'Lexend'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(pisma/lexend-latin.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; }
@font-face { font-family: 'Lexend'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(pisma/lexend-latin-ext.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; }

:root {
  --serif: 'Lexend', system-ui, sans-serif;   /* nadpisy, výroky */
  --sans: 'Lexend', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --citat: 'Sentient', Georgia, serif;   /* citáty, modlitby, verše */

  --inkoust: #16244f;      /* nejtmavší modř – text nadpisů, tahy ilustrací */
  --navy: #1f3c96;          /* značková modř */
  --text: #283049;
  --seda: #697089;
  --seda-svetla: #9aa0b4;
  --linka: #e4e2dc;
  --cervena: #d63a2f;
  --cervena-tmava: #ad2b22;
  --vinova: #7a2826;
  --modra: #2e5fc8;
  --modra-svetla: #dfe8fd;
  --horcice: #e3a92b;
  --horcice-svetla: #fbf0d4;
  --nachova: #7a4ea3;
  --nachova-svetla: #eee6f8;
  --papir: #fffdf8;
  --podklad: #f3f0e8;
  --papirek: #f9e7a5;

  /* plochy a odstíny, které se v tmavém režimu mění (html[data-rezim="tmavy"] na konci souboru) */
  --panel: #16244f;          /* tmavé pilulky, štítky, panel modlitby */
  --panel-hover: #1f3c96;
  --karta: #fff;             /* bílé karty na papíře */
  --tint: 22,36,79;          /* jemné podbarvení při najetí: rgba(var(--tint), .05) */
  --lista-pozadi: rgba(255,253,248,.86);
  --logo: #3e2926;
  --tecky: #b9b5aa;          /* tečkované řádky polí */
  --placeholder: #bdb9ae;
  --ramecek: #c9c4b7;
  --ramecek-pozadi: rgba(255,255,255,.5);
  --ramecek-kouc: #fcfaf5;
  --th: #f6f3eb;
  --poznamka: #f5f2ea;
  --zamysleni: #fde8e4;
  --svetla-strana: #f7f2e6;
  --vlna: #ecebef;
  --vlna-nachova: #e7e4f4;
  --horcice-text: #9a6a0b;
  --horcice-ikona: #b27b0e;

  --lista: 64px;
  --postranni: 312px;
  --sirka: 700px;
  --okraj: clamp(20px, 6vw, 88px);
  --radius: 22px;
  --stin: 0 1px 2px rgba(22,36,79,.06), 0 12px 32px -12px rgba(22,36,79,.18);
  --ease: cubic-bezier(.2,.7,.2,1);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--lista) + 16px); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }
body {
  margin: 0; background: var(--podklad); color: var(--text);
  font: 400 18px/1.65 var(--sans); font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility;
  font-feature-settings: 'ss01' 0;
}
img, svg { display: block; }
a { color: inherit; }
button, input, textarea, select { font: inherit; color: inherit; }
button, summary, .tl-soubor { cursor: pointer; }
::selection { background: #ffe29a; color: #16244f; }
:focus-visible { outline: 3px solid var(--horcice); outline-offset: 3px; border-radius: 6px; }
.neviditelne { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.preskocit { position: fixed; left: 12px; top: -80px; z-index: 60; background: var(--karta); padding: 10px 16px; border-radius: 10px; box-shadow: var(--stin); }
.preskocit:focus { top: 12px; }
.ilu { max-width: 100%; height: auto; }

/* ================================================================ lišta */
.lista {
  position: sticky; top: 0; z-index: 30; height: var(--lista);
  display: flex; align-items: center; gap: 14px; padding: 0 16px 0 20px;
  padding-left: max(20px, env(safe-area-inset-left));
  background: var(--lista-pozadi); color: var(--inkoust);
  -webkit-backdrop-filter: saturate(1.6) blur(14px); backdrop-filter: saturate(1.6) blur(14px);
  border-bottom: 1px solid rgba(var(--tint),.08);
}
.znacka { display: flex; align-items: center; gap: 10px; text-decoration: none; flex: 0 0 auto; }
.znacka-kruh { width: 30px; height: 30px; color: var(--cervena); }
.znacka-text { display: flex; flex-direction: column; font: 800 17px/1 var(--sans); letter-spacing: .02em; }
.znacka-text small { font: italic 500 13px/1 var(--serif); letter-spacing: 0; color: var(--seda); margin-top: 3px; }
.lista-misto { font-size: 14px; color: var(--seda); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 14px; border-left: 1px solid var(--linka); }
.lista-misto b { color: var(--inkoust); font-weight: 700; }
.lista-stav { margin-left: auto; font-size: 13px; color: var(--seda); white-space: nowrap; display: flex; align-items: center; gap: 6px; }
.lista-stav.ok::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #3aa35b; box-shadow: 0 0 0 3px rgba(58,163,91,.18); }
.lista-postup { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; }
.lista-postup span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--cervena), var(--horcice)); transition: width .15s linear; border-radius: 0 3px 3px 0; }

.nabidka { position: relative; }
.nabidka > summary, .tl-obsah {
  list-style: none; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px;
  border-radius: 999px; font: 700 14px/1 var(--sans); white-space: nowrap; border: 0;
  background: var(--panel); color: #fff; transition: background .2s var(--ease), transform .2s var(--ease);
}
.nabidka > summary:hover, .tl-obsah:hover { background: var(--panel-hover); }
.nabidka > summary::-webkit-details-marker { display: none; }
.tl-ikona svg { width: 18px; height: 18px; }
.tl-obsah { display: none; background: transparent; color: var(--inkoust); box-shadow: inset 0 0 0 1.5px rgba(var(--tint),.2); }
.tl-obsah:hover { background: rgba(var(--tint),.06); }
.nabidka-panel {
  position: absolute; right: 0; top: calc(100% + 12px); width: 300px; background: var(--karta); color: var(--text);
  border-radius: 18px; padding: 10px; box-shadow: 0 24px 60px -12px rgba(22,36,79,.35), 0 0 0 1px rgba(22,36,79,.06);
  animation: vyjed .22s var(--ease);
  max-height: calc(100vh - var(--lista) - 24px); max-height: calc(100dvh - var(--lista) - 24px);
  overflow-y: auto; overscroll-behavior: contain;   /* dlouhá nabídka se posouvá sama, lišta je přilepená */
}
@keyframes vyjed { from { opacity: 0; transform: translateY(-6px) scale(.98); } }
.nabidka-info { font-size: 13px; line-height: 1.5; color: var(--seda); margin: 6px 10px 10px; }
.nabidka-panel button, .tl-soubor {
  display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; background: none; border: 0;
  padding: 11px 12px; border-radius: 12px; font-size: 15px; font-weight: 600;
}
.nabidka-panel button svg, .tl-soubor svg { width: 18px; height: 18px; color: var(--seda); flex: 0 0 auto; }
.nabidka-panel button:hover, .tl-soubor:hover { background: rgba(var(--tint),.06); }
.nabidka-panel hr { border: 0; border-top: 1px solid var(--linka); margin: 6px 4px; }
.nebezpecne, .nabidka-panel .nebezpecne svg { color: var(--cervena-tmava) !important; }

/* ================================================================ rozvržení a obsah */
.rozvrzeni { display: grid; grid-template-columns: var(--postranni) minmax(0, 1fr); }
.postranni {
  position: sticky; top: var(--lista); height: calc(100vh - var(--lista)); height: calc(100dvh - var(--lista)); overflow-y: auto;
  background: var(--papir); border-right: 1px solid var(--linka); padding: 20px 14px 32px; font-size: 14.5px;
  overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--ramecek) transparent;
}
.obsah-zacatek { display: flex; align-items: center; gap: 10px; padding: 9px 12px; font-weight: 700; color: var(--inkoust); text-decoration: none; border-radius: 12px; }
.obsah-zacatek:hover { background: rgba(var(--tint),.05); }
.obsah-kruh { width: 18px; height: 18px; color: var(--cervena); }
.obsah-domu { width: 18px; height: 18px; color: var(--cervena); flex: none; }
.obsah-faze { margin-top: 8px; }
.obsah-faze > summary {
  display: flex; align-items: center; gap: 12px; list-style: none; padding: 10px 12px; border-radius: 14px;
}
.obsah-faze > summary::-webkit-details-marker { display: none; }
.obsah-faze > summary:hover { background: rgba(var(--tint),.05); }
.obsah-faze-cislo { font: italic 400 26px/1 var(--serif); color: var(--cervena); width: 34px; }
.obsah-faze-nazev { flex: 1; font: 700 19px/1.1 var(--serif); color: var(--inkoust); }
.obsah-faze-nazev small { display: block; font: 500 12.5px/1.3 var(--sans); color: var(--seda); margin-top: 3px; }
.postup { font-size: 11.5px; font-weight: 700; color: var(--seda); font-variant-numeric: tabular-nums; background: rgba(var(--tint),.06); padding: 3px 8px; border-radius: 999px; }
.postup:empty { display: none; }
.obsah-faze ol { list-style: none; margin: 4px 0 10px; padding: 0 0 0 10px; }
.obsah-faze a {
  display: flex; gap: 10px; align-items: baseline; padding: 6px 12px; border-radius: 10px; text-decoration: none; color: var(--text);
  line-height: 1.35; transition: background .15s;
}
.obsah-faze a:hover { background: rgba(var(--tint),.05); }
.obsah-faze a[aria-current] { background: var(--panel); color: #fff; }
.obsah-faze a[aria-current] .obsah-cislo { color: rgba(255,255,255,.7); }
.obsah-cislo { flex: 0 0 22px; color: var(--seda-svetla); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
.obsah-nazev { flex: 1; }
.obsah-tecka { width: 8px; height: 8px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--ramecek); flex: 0 0 auto; align-self: center; transition: .2s; }
.obsah-tecka.vyplneno { background: var(--horcice); box-shadow: none; }
.postranni-pozn { margin: 20px 12px 0; font-size: 12.5px; color: var(--seda); }
.zavoj { display: none; }
main { min-width: 0; }

/* ================================================================ titulní strana */
.titul {
  position: relative; overflow: hidden; background: #4a1214; color: #fff;
  padding: clamp(40px, 7vw, 96px) var(--okraj) clamp(40px, 5vw, 72px);
  background-image: radial-gradient(circle at 80% 15%, rgba(150,40,40,.55), transparent 55%), radial-gradient(circle at 10% 110%, rgba(20,6,8,.55), transparent 50%);
}
.titul-mrizka { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(24px, 4vw, 64px); align-items: center; max-width: 1180px; margin: 0 auto; }
.titul-znacka { display: flex; align-items: center; gap: 14px; margin: 0 0 clamp(24px, 4vw, 48px); }
.titul-kruh { width: 46px; height: 46px; color: var(--cervena); }
.titul-znacka span { font: 800 22px/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; display: flex; flex-direction: column; }
.titul-znacka small { font: italic 400 15px/1 var(--serif); text-transform: none; letter-spacing: 0; opacity: .75; margin-top: 6px; }
.titul h1 {
  font: 800 clamp(60px, 8.6vw, 136px)/.86 var(--serif); letter-spacing: -.018em; margin: 0;
}
.titul-the { display: block; font-style: italic; font-weight: 300; font-size: .42em; letter-spacing: -.005em; color: var(--horcice); margin-bottom: .06em; }
.titul-autor { font: italic 400 clamp(20px, 2.2vw, 28px)/1.2 var(--serif); margin: 18px 0 0; opacity: .85; }
.titul-perex { max-width: 34ch; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.55; color: rgba(255,255,255,.82); margin: 26px 0 0; }
.titul-perex em { font: italic 500 1.08em var(--serif); color: #fff; }
.titul-akce { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.tl-hlavni, .tl-vedlejsi {
  display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 26px; border-radius: 999px;
  font: 700 16px/1 var(--sans); text-decoration: none; transition: transform .2s var(--ease), background .2s, box-shadow .2s;
}
.tl-hlavni { background: var(--cervena); color: #fff; box-shadow: 0 10px 30px -10px rgba(214,58,47,.8); }
.tl-hlavni svg { width: 20px; height: 20px; transition: transform .2s var(--ease); }
.tl-hlavni:hover { transform: translateY(-2px); background: #e0453a; }
.tl-hlavni:hover svg { transform: translateX(3px); }
.tl-vedlejsi { color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.35); }
.tl-vedlejsi:hover { background: rgba(255,255,255,.08); }
.titul-obraz { position: relative; }
.titul-obraz .ilu { position: relative; width: 100%; max-width: 560px; margin: 0 auto; filter: drop-shadow(0 30px 40px rgba(0,0,0,.25)); }
.titul-slunce { position: absolute; inset: 6% 8% 18%; border-radius: 50%; background: var(--horcice); }

.karty-fazi { list-style: none; padding: 0; margin: clamp(40px, 6vw, 72px) auto 0; max-width: 1180px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.karta a {
  position: relative; display: flex; flex-direction: column; height: 100%; padding: 20px 20px 18px; border-radius: 20px;
  background: rgba(255,255,255,.06); text-decoration: none; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255,255,255,.1);
  transition: transform .3s var(--ease), background .3s;
}
.karta a:hover { transform: translateY(-4px); background: rgba(255,255,255,.1); }
.karta-cislo { font: italic 300 40px/1 var(--serif); color: var(--horcice); }
.karta-obraz { display: block; height: 110px; margin: 6px -6px 10px; }
.karta-obraz .ilu { width: 100%; height: 100%; object-fit: contain; }
.karta-nazev { font: 700 26px/1.1 var(--serif); }
.karta-pod { font-size: 13.5px; color: rgba(255,255,255,.65); margin-top: 4px; }
.karta-postup { display: block; height: 4px; border-radius: 4px; background: rgba(255,255,255,.12); margin-top: 16px; overflow: hidden; }
.karta-postup span { display: block; height: 100%; width: 0; background: var(--horcice); border-radius: 4px; transition: width .6s var(--ease); }
.titul-navod { max-width: 1180px; margin: 22px auto 0; font-size: 14.5px; color: rgba(255,255,255,.7); }
.titul-navod p { margin: 0; }
.titul-navod b { color: #fff; }

/* ================================================================ strana */
.strana {
  position: relative; background: var(--papir);
  padding: clamp(72px, 9vw, 120px) var(--okraj) clamp(56px, 7vw, 96px);
  border-bottom: 1px solid var(--linka);
}
.strana-vnitrek { max-width: var(--sirka); margin: 0 auto; position: relative; }
.strana-vnitrek::after { content: ''; display: block; clear: both; }
.strana-hlava { position: absolute; top: clamp(22px, 3vw, 34px); left: 0; right: 0; display: flex; align-items: center; gap: 16px; padding: 0 var(--okraj); pointer-events: none; }
.strana-cislo {
  font: italic 300 15px/1 var(--serif); color: var(--seda); letter-spacing: .02em;
  display: inline-flex; align-items: center; gap: 8px;
}
.strana-cislo::before { content: ''; width: 22px; height: 1.5px; background: currentColor; opacity: .5; }
.stitek {
  margin: 0; background: var(--panel); color: #fff; padding: 7px 14px; border-radius: 999px;
  font: 700 11.5px/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase;
  max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* typografie */
.strana p { margin: 0 0 1em; text-wrap: pretty; }
.strana h3 {
  font: 700 clamp(25px, 2.4vw, 32px)/1.16 var(--serif); color: var(--inkoust); margin: 1.6em 0 .5em;
  letter-spacing: -.005em; text-wrap: balance;
}
.strana h4 { font: 700 12.5px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--cervena); margin: 0 0 14px; }
.strana ul, .strana ol { margin: 0 0 1.2em; padding-left: 1.4em; }
.strana li { margin: .35em 0; padding-left: .2em; }
.strana ul { list-style: none; padding-left: 1.3em; }
.strana ul > li::before { content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--horcice); margin-left: -1.3em; margin-right: calc(1.3em - 7px); vertical-align: .18em; }
.strana ol > li::marker { color: var(--cervena); font: italic 600 1.05em var(--serif); }
.strana strong { font-weight: 700; color: var(--inkoust); }
.strana em { font-style: italic; }
.strana mark { background: linear-gradient(transparent 62%, rgba(227,169,43,.45) 0); color: inherit; }
.strana a { color: var(--navy); text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.strana-nadpis {
  font: 700 clamp(46px, 7vw, 96px)/.95 var(--serif); color: var(--inkoust); margin: 0 0 .45em;
  letter-spacing: -.015em; text-wrap: balance;
}
.podpis { font-size: 14px; color: var(--seda); font-weight: 500; }

/* ilustrace na straně */
.strana-ilu { float: right; width: min(40%, 280px); margin: -8px 0 16px 32px; shape-outside: margin-box; }
.strana-ilu-vlevo { float: left; margin: -8px 32px 16px 0; }
.strana-ilu-stred { float: none; width: min(100%, 460px); margin: 0 auto 32px; }
.strana-ilu-siroka { float: none; width: 100%; margin: 0 0 36px; }
.strana-ilu .ilu { width: 100%; }
.obrazek { margin: 28px auto; }
.obrazek .ilu { width: 100%; }
.obrazek-stred { width: min(100%, 460px); }
.obrazek-siroky { width: 100%; }
.obrazek-vpravo { float: right; width: min(38%, 240px); margin: 0 0 16px 28px; }
.obrazek-vlevo { float: left; width: min(38%, 240px); margin: 0 28px 16px 0; }
.obrazek-male { float: right; width: min(26%, 130px); margin: -10px 0 12px 24px; }

/* ================================================================ moduly */
.modul { position: relative; margin: 44px 0; clear: both; border-radius: var(--radius); }
.modul:first-child { margin-top: 0; }
.modul-hlava { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.modul-ikona { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; flex: 0 0 auto; }
.modul-ikona svg { width: 21px; height: 21px; }
.modul-stitek { font: 700 12.5px/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.modul-nadpis { margin-top: 0 !important; }

.modul-trenink .modul-ikona { background: var(--modra-svetla); color: var(--modra); }
.modul-trenink .modul-stitek { color: var(--modra); }

.modul-aktivita { background: var(--karta); padding: clamp(22px, 3vw, 34px); box-shadow: var(--stin); }
.modul-aktivita .modul-ikona { background: var(--horcice-svetla); color: var(--horcice-ikona); }
.modul-aktivita .modul-stitek { color: var(--horcice-text); }
.modul-aktivita h3:first-of-type { margin-top: .2em; }

.modul-reflexe { background: var(--nachova-svetla); padding: clamp(22px, 3vw, 34px); margin-top: 64px; }
.modul-reflexe .modul-ikona { background: var(--karta); color: var(--nachova); }
.modul-reflexe .modul-stitek { color: var(--nachova); }
.modul-postava { position: absolute; right: clamp(14px, 2vw, 26px); top: -40px; width: clamp(104px, 18%, 138px); margin: 0; }
.modul-reflexe > .modul-hlava, .modul-reflexe > .modul-telo > :first-child { margin-right: clamp(110px, 20%, 150px); }
.modul-postava .ilu { width: 100%; }
.modul-zamysleni { background: var(--zamysleni); }
.modul-zamysleni .modul-ikona { color: var(--cervena); }
.modul-zamysleni .modul-stitek { color: var(--cervena-tmava); }
.modul-vyzkum, .modul-ctenar { background: var(--horcice-svetla); }
.modul-vyzkum .modul-ikona, .modul-ctenar .modul-ikona { color: var(--horcice-ikona); }
.modul-vyzkum .modul-stitek, .modul-ctenar .modul-stitek { color: var(--horcice-text); }
.modul-telo { clear: none; }

.modul-modlitba { background: var(--panel); color: rgba(255,255,255,.88); padding: clamp(24px, 3.4vw, 40px); overflow: hidden; }
.modul-modlitba::after { content: ''; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(227,169,43,.55), transparent 65%); }
.modul-modlitba .modul-ikona { background: var(--horcice); color: #16244f; }
.modul-modlitba .modul-stitek { color: var(--horcice); }
.modul-modlitba p { font: italic 400 clamp(19px, 1.8vw, 22px)/1.55 var(--citat); position: relative; z-index: 1; }
.modul-modlitba strong { color: #fff; }

.otazka { position: relative; margin: 28px 0 14px; padding-left: 18px; border-left: 3px solid var(--cervena); }
.otazka-stitek { display: block; font: 700 12px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--cervena); margin-bottom: 4px; }
.otazka p { font: 600 clamp(20px, 1.9vw, 24px)/1.35 var(--serif); color: var(--inkoust); margin: 0 0 6px; }

/* citace */
.citat { position: relative; margin: 44px 0; padding: 0 0 0 clamp(52px, 6vw, 72px); clear: both; }
.citat::before {
  content: '“'; position: absolute; left: -4px; top: -.18em; font: 700 clamp(96px, 11vw, 140px)/1 var(--citat); color: var(--cervena);
}
.citat-zavorka { display: none; }
.citat blockquote { margin: 0; font: italic 400 clamp(23px, 2.5vw, 32px)/1.35 var(--citat); color: var(--nachova); letter-spacing: -.003em; text-wrap: pretty; }
.citat blockquote p { margin: 0 0 .5em; }
.citat figcaption { font: 600 14px/1.4 var(--sans); color: var(--seda); margin-top: 14px; display: flex; align-items: center; gap: 10px; }
.citat figcaption::before { content: ''; width: 28px; height: 1.5px; background: var(--cervena); }
.citat.modra blockquote { color: var(--navy); }
.citat.male blockquote, .citat.dlouhy blockquote { font-size: clamp(20px, 1.9vw, 23px); line-height: 1.45; }
.citat.dlouhy::before, .citat.male::before { font-size: clamp(72px, 8vw, 100px); }

/* ================================================================ barevné strany */
.pozadi-modra { background: #2e5fc8; }
.pozadi-vinova { background: #7a2826; }
.pozadi-cervena { background: var(--cervena); }
.pozadi-sediva { background: #5f7d96; }
.pozadi-nachova { background: #7a4ea3; }
.pozadi-svetla { background: var(--svetla-strana); }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) { color: rgba(255,255,255,.9); border-bottom-color: transparent; }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) :is(h2, h3, h4, .strana-nadpis, .strana-vnitrek > p strong) { color: #fff; }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) .strana-cislo { color: rgba(255,255,255,.7); }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) .stitek { background: #fff; color: #16244f; }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) > .strana-vnitrek > :is(p, ul, ol, .s-polem) { color: rgba(255,255,255,.9); }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) > .strana-vnitrek > .pole textarea { color: #fff; }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) > .strana-vnitrek .pole textarea::placeholder { color: rgba(255,255,255,.5); }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) > .strana-vnitrek > .pole textarea { background-image: radial-gradient(circle at 2px calc(2em - 3px), rgba(255,255,255,.55) 1.1px, transparent 1.6px); }
.pozadi-cervena .strana h3 { color: #fff; }
.pozadi-cervena .strana-vnitrek > p strong { color: #fff; }

/* velké výroky na celou stranu */
.typ-citat { display: flex; flex-direction: column; justify-content: center; min-height: min(88vh, 860px); overflow: hidden; }
.typ-citat .strana-vnitrek { width: 100%; max-width: 980px; }
.velky { margin: 0; position: relative; z-index: 1; }
.velky blockquote { margin: 0; }
.velky p {
  margin: 0; font: 700 clamp(30px, 5.2vw, 76px)/1.08 var(--serif); letter-spacing: -.02em; hyphens: auto; -webkit-hyphens: auto; color: #fff; text-wrap: balance;
}
.velky p strong { font-weight: 900; font-style: italic; color: #fff; }   /* písma bez kurzívy zůstanou rovná (font-synthesis-style: none) */
.velky figcaption { margin-top: 36px; font: 700 13px/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.75); display: flex; align-items: center; gap: 12px; }
.velky figcaption::before { content: ''; width: 36px; height: 2px; background: var(--horcice); }
.velky-ikona { width: 64px; height: 64px; color: #d8b9f5; margin-bottom: 28px; stroke-width: 1.4; }
.velky-veta p { line-height: 1.08; }
.velky-veta p:nth-child(odd) { font-weight: 800; }
.velky-obrys p { font: 900 clamp(32px, 9vw, 128px)/.95 var(--sans); text-transform: uppercase; letter-spacing: -.010em; color: transparent; -webkit-text-stroke: 2px #fff; text-align: center; font-style: normal; }
.velky-obrys p strong { color: var(--horcice); -webkit-text-stroke: 0; font-style: normal; }
.velky mark { background: none; color: inherit; text-decoration: underline; text-decoration-color: var(--horcice); text-decoration-thickness: .06em; text-underline-offset: .12em; }
.typ-citat.pozadi-vinova::before, .typ-citat.pozadi-modra::before, .typ-citat.pozadi-cervena::before, .typ-citat.pozadi-sediva::before {
  content: ''; position: absolute; right: -12vw; bottom: -30vw; width: 60vw; height: 60vw; border-radius: 50%;
  border: clamp(40px, 6vw, 90px) solid rgba(255,255,255,.06);
}
.oblouky::after { content: ''; position: absolute; right: -8vw; bottom: -20vw; width: 44vw; height: 44vw; border-radius: 50%; border: 18px solid rgba(255,255,255,.12); }

/* ================================================================ obálky fází */
.typ-obalka { padding: 0; min-height: min(100vh, 960px); display: flex; overflow: hidden; }
.typ-obalka.pozadi-modra { background: linear-gradient(160deg, #2350b8 0%, #2e5fc8 45%, #5588ea 100%); }
.obalka-mrizka { flex: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: end; gap: 24px; padding: clamp(48px, 7vw, 96px) var(--okraj) 0; max-width: 1320px; margin: 0 auto; width: 100%; }
.obalka-text { align-self: center; padding-bottom: clamp(32px, 6vw, 96px); color: #fff; }
.obalka-cislo {
  font: italic 200 clamp(90px, 14vw, 200px)/.8 var(--serif); margin: 0 0 12px; color: transparent;
  -webkit-text-stroke: 1.5px rgba(255,255,255,.55); letter-spacing: -.020em;
}
.obalka-nad { font: 700 13px/1.3 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--horcice); margin: 0 0 14px; }
.obalka-nadpis { font: 800 clamp(52px, 8vw, 118px)/.9 var(--serif); letter-spacing: -.020em; margin: 0; color: #fff; }
.obalka-nadpis span { display: block; font: italic 300 .34em/1.2 var(--serif); letter-spacing: -.005em; margin-top: .35em; color: rgba(255,255,255,.9); }
.strana .obalka-lekce { list-style: none; padding: 0; margin: 32px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.strana .obalka-lekce li { margin: 0; padding: 0; }
.strana .obalka-lekce li::before { display: none; }
.obalka-lekce a {
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 8px; border-radius: 999px; text-decoration: none;
  background: rgba(255,255,255,.12); color: #fff; font-size: 14.5px; font-weight: 600; transition: background .2s;
}
.obalka-lekce a:hover { background: rgba(255,255,255,.22); }
.obalka-lekce span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #fff; color: #16244f; font-size: 12.5px; font-weight: 800; }
.obalka-ilu { align-self: end; }
.obalka-ilu .ilu { width: 100%; max-height: 78vh; margin-left: auto; }

/* ================================================================ pole */
.pole { margin: 8px 0 26px; }
.pole textarea, .pole input {
  width: 100%; border: 0; border-radius: 0; background-color: transparent; color: var(--navy);
  font: 500 18px/2em var(--sans); caret-color: var(--cervena);
}
.pole textarea {
  display: block; resize: vertical; min-height: calc(4em + 12px); padding: 0 6px 12px; overflow: hidden;   /* pruh dole: úchyt pro zvětšení nesedí na tečkované lince */
  background-image: radial-gradient(circle at 2px calc(2em - 3px), var(--tecky) 1.1px, transparent 1.6px);
  background-size: 7px 2em; background-attachment: local; transition: background-color .2s;
}
.pole textarea::placeholder, .pole input::placeholder { color: var(--placeholder); font-style: italic; }
.pole textarea:focus, .pole input:focus { outline: none; background-color: rgba(227,169,43,.1); border-radius: 8px; }
.pole-radek { display: inline-block; min-width: 12em; margin: 0; flex: 1; }
.pole-radek input {
  padding: 0 6px; height: 2.2em;
  background-image: radial-gradient(circle at 2px calc(100% - 3px), var(--tecky) 1.1px, transparent 1.6px);
  background-size: 7px 100%;
}
.pole.ulozeno textarea, .pole.ulozeno input { animation: blik .9s var(--ease); }
@keyframes blik { 30% { background-color: rgba(58,163,91,.12); } }
.s-polem { margin: 0 0 14px; }
.s-polem > p { margin: 0 0 4px; }
.pole-popisek { font-weight: 700; color: var(--inkoust); margin: 14px 0 0 !important; }
.li-pole { margin: 12px 0 !important; }
.li-pole .li-text { display: block; }
.li-pole .pole { margin: 2px 0 10px; }
.strana :is(ol, ul) > .li-pole .pole-radek { display: block; }

.ramecek { border: 1.5px dashed var(--ramecek); border-radius: 18px; padding: 20px 22px 6px; margin: 16px 0 30px; background: var(--ramecek-pozadi); }
.ramecek .pole textarea { min-height: calc(6em + 12px); }
.box { border-radius: var(--radius); padding: clamp(20px, 3vw, 30px); margin: 28px 0; display: flow-root; }
.box-cervena { background: var(--cervena); color: #fff; }
.box-vinova { background: #7a2826; color: #fff; }
.box-modra { background: var(--karta); box-shadow: var(--stin); }
.box-modra > p:first-child { font: 700 12.5px/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--modra); margin-bottom: 10px; }
.box-modra strong { font: 600 clamp(20px, 2vw, 24px)/1.3 var(--serif); display: block; }
.box-horcice { background: var(--horcice-svetla); }
.box-oblak { padding: 0; }
.box-zvyrazneni { padding: 0 .55em; margin: 32px 0; }   /* místo pro okraje pruhu na plných řádcích */
.box-zvyrazneni p { display: inline; font: 700 clamp(22px, 2.4vw, 30px)/1.55 var(--serif); color: #fff; background: var(--panel); padding: .08em .35em; border-radius: 8px; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.box-hvezda { position: relative; padding: 0 0 0 56px; }
.box-hvezda::before { content: '✱'; position: absolute; left: 0; top: -4px; font: 400 40px/1 var(--sans); color: var(--cervena); }
.box-hvezda p { font: 500 clamp(19px, 1.8vw, 22px)/1.5 var(--serif); color: var(--inkoust); }
.box-hvezda strong { font-weight: 700; }
.box-verse { background: rgba(255,255,255,.14); margin-top: 40px; }
.box-verse p:first-child { font: 700 12.5px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; margin-bottom: 10px; color: rgba(255,255,255,.8); }
.box-verse strong { font: italic 500 clamp(21px, 2.1vw, 26px)/1.45 var(--citat); color: #fff; }

/* tabulky */
.tabulka-obal { overflow-x: auto; margin: 20px 0 30px; -webkit-overflow-scrolling: touch; border-radius: 16px; background: var(--karta); box-shadow: var(--stin); }
.strana table { border-collapse: collapse; width: 100%; font-size: 16px; }
.strana th { text-align: left; color: var(--inkoust); font: 700 12.5px/1.35 var(--sans); letter-spacing: .06em; text-transform: uppercase; background: var(--th); padding: 14px 16px; vertical-align: bottom; }
.strana td { border-top: 1px solid var(--linka); padding: 12px 16px; vertical-align: top; line-height: 1.5; }
.strana td .pole { margin: 0; }
.strana td .pole textarea { min-height: calc(2em + 12px); font-size: 16px; }
.strana td .pole-radek { display: block; min-width: 9em; }
.strana td .pole-bunka textarea { min-height: calc(2em + 12px); min-width: 9em; }

/* lepicí papírky */
.papirky { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 26px 22px; margin: 28px 0 12px; }
.papirek {
  position: relative; background: var(--papirek); padding: 18px 18px 8px; border-radius: 3px 3px 18px 3px;
  box-shadow: 0 16px 24px -16px rgba(90,64,0,.55), 0 2px 0 rgba(0,0,0,.03); transform: rotate(-1.6deg);
  transition: transform .3s var(--ease);
}
.papirek::before { content: ''; position: absolute; top: -10px; left: 50%; width: 70px; height: 22px; transform: translateX(-50%) rotate(-3deg); background: rgba(255,255,255,.55); box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.papirek:hover, .papirek:focus-within { transform: rotate(0) scale(1.02); }
.papirek-1 { transform: rotate(1.4deg) translateY(10px); background: #fbd8cf; }
.papirek-2 { transform: rotate(-.6deg) translateY(-4px); background: #d7e3fc; }
.papirek p { color: #16244f; font: 600 16px/1.3 var(--serif); margin: 0 0 8px; }
.papirek .pole textarea { color: #1f3c96; font-size: 16px; min-height: calc(8em + 12px); background-image: radial-gradient(circle at 2px calc(2em - 3px), rgba(22,36,79,.28) 1.1px, transparent 1.6px); }

/* koučování */
.koucovani { position: relative; margin: 8px 0 30px; }
.koucovani-zalozka {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--karta); border-radius: 20px 20px 0 0;
  padding: 14px 20px; margin-right: min(40%, 220px); position: relative; z-index: 1;
}
.koucovani-zalozka .modul-ikona { background: var(--horcice-svetla); color: var(--horcice-ikona); width: 36px; height: 36px; }
.koucovani-zalozka label { font: 700 12.5px/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--vinova); }
.koucovani-zalozka .pole-radek { min-width: 10em; }
.koucovani-list { background: var(--karta); border-radius: 0 24px 24px 24px; padding: clamp(24px, 3.4vw, 40px); box-shadow: 0 30px 60px -30px rgba(0,0,0,.45); color: var(--text); }
.koucovani-postava { float: right; width: clamp(100px, 22%, 160px); margin: -8px -8px 10px 16px; }
.koucovani-postava .ilu { width: 100%; }
.koucovani-nadpis { font: 700 clamp(28px, 3vw, 38px)/1.1 var(--serif) !important; color: var(--vinova) !important; margin: 0 0 18px !important; letter-spacing: -.010em; }
.koucovani-list strong { color: var(--inkoust) !important; }
.koucovani-list .ramecek { background: var(--ramecek-kouc); }

/* kresba */
.kresba-obal { margin: 20px 0 30px; clear: both; }
.kresba-zadani { font: 600 clamp(19px, 1.8vw, 22px)/1.35 var(--serif); color: var(--inkoust); margin-bottom: 12px !important; }
.pozadi-modra > .strana-vnitrek > .kresba-obal .kresba-zadani { color: #fff; }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) > .strana-vnitrek > .s-polem .pole-popisek { color: #fff; }
:is(.pozadi-modra, .pozadi-vinova, .pozadi-cervena, .pozadi-sediva, .pozadi-nachova) > .strana-vnitrek > .s-polem .pole textarea { color: #fff; background-image: radial-gradient(circle at 2px calc(2em - 3px), rgba(255,255,255,.55) 1.1px, transparent 1.6px); }
.kresba { margin: 0; position: relative; }
.kresba-plocha { position: relative; background: #fff; border-radius: 24px; overflow: hidden; touch-action: none; box-shadow: inset 0 0 0 2px var(--nachova), var(--stin); }
.kresba-plocha::after { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(circle, rgba(22,36,79,.09) 1px, transparent 1.5px); background-size: 22px 22px; }
.kresba canvas { position: relative; z-index: 1; display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; cursor: crosshair; touch-action: none; }
.kresba.tvar-vlna .kresba-plocha { box-shadow: inset 0 0 0 2px var(--modra), var(--stin); }
.kresba.tvar-oblak .kresba-plocha { border-radius: 42% 38% 44% 40% / 34% 30% 38% 36%; }
.kresba-nastroje { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 12px; }
.kresba-zvetsit {
  position: absolute; z-index: 2; top: 10px; right: 10px; display: grid; place-items: center; width: 38px; height: 38px; padding: 0;
  border: 0; border-radius: 12px; background: rgba(255,255,255,.9); color: #16244f; box-shadow: 0 0 0 1px rgba(22,36,79,.14), 0 4px 12px -4px rgba(22,36,79,.3);
  transition: transform .15s var(--ease), background .15s;
}
.kresba-zvetsit:hover { transform: scale(1.08); background: #fff; }
.kresba-zvetsit svg { width: 18px; height: 18px; }
.kresba-zvetsit .ikona-zmensit, .kresba.velka .kresba-zvetsit .ikona-zvetsit { display: none; }
.kresba.velka .kresba-zvetsit .ikona-zmensit { display: block; }
.kresba-otoc { display: none; }
/* zvětšená kresba v dialogu přes celou obrazovku; poměr 3 : 2 zůstává, plocha se vejde na šířku i výšku */
.kresba-okno {
  width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 16px;
  border: 0; background: transparent; color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
}
.kresba-okno::backdrop { background: rgba(10,14,30,.9); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.kresba-okno[open] { animation: kresba-okno .25s var(--ease); }
@keyframes kresba-okno { from { opacity: 0; transform: scale(.97); } }
.kresba-okno-nazev { margin: 0; max-width: min(100%, 1400px); font: 600 clamp(15px, 1.6vw, 19px)/1.3 var(--serif); color: rgba(255,255,255,.88); text-align: center; }
.kresba-okno-nazev:empty { display: none; }
.kresba.velka { width: min(100%, 1500px, calc((100dvh - 150px) * 1.5)); }
.kresba.velka .kresba-plocha { box-shadow: 0 20px 60px -20px rgba(0,0,0,.6); }
.kresba.velka .kresba-nastroje { margin-top: 12px; }
.kresba.velka .tl { background: rgba(255,255,255,.1); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.3); }
.kresba.velka .barva { border-color: #0c1122; }
.kresba.velka .barva[aria-pressed="true"] { box-shadow: 0 0 0 2.5px #fff; }
.kresba.velka .barva:not([aria-pressed="true"]) { box-shadow: 0 0 0 1.5px rgba(255,255,255,.35); }
/* nízká obrazovka (telefon na šířku): nástroje ve sloupci vedle plochy, bez nadpisu */
@media (max-height: 560px) and (orientation: landscape) {
  .kresba-okno { padding: 8px 12px; padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  .kresba-okno-nazev { display: none; }
  .kresba.velka { width: auto; display: flex; align-items: stretch; gap: 12px; }
  .kresba.velka .kresba-plocha { width: min(calc(100vw - 150px), calc((100dvh - 16px) * 1.5)); }
  .kresba.velka .kresba-nastroje { margin: 0; flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 8px; }
  .kresba.velka .kresba-nastroje .barvy { width: auto; margin: 0 0 auto; display: grid; grid-template-columns: repeat(2, 30px); gap: 8px; }
  .kresba.velka .tl { padding: 8px 10px; font-size: 13px; }
}
@media (orientation: portrait) and (max-width: 640px) {
  .kresba.velka .kresba-otoc { display: block; margin: 14px 0 0; text-align: center; font: 500 14px/1.4 var(--sans); color: rgba(255,255,255,.75); }
}
@media print { .kresba-zvetsit { display: none; } }
.kresba-nastroje .barvy { display: flex; gap: 8px; margin-right: auto; }
.barva { width: 30px; height: 30px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 1.5px rgba(var(--tint),.2); padding: 0; transition: transform .15s; }
.barva:hover { transform: scale(1.1); }
.barva[aria-pressed="true"] { box-shadow: 0 0 0 2.5px var(--inkoust); }
.tl { background: var(--karta); border: 0; box-shadow: inset 0 0 0 1.5px rgba(var(--tint),.18); border-radius: 999px; padding: 8px 16px; font: 600 14px/1 var(--sans); color: var(--inkoust); }
.tl:hover { box-shadow: inset 0 0 0 1.5px var(--inkoust); }
.tl:disabled { opacity: .45; cursor: default; }

/* schémata */
.schema { margin: 30px 0; }
.schema .ilu { width: 100%; }
.sloupce { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px 32px; }
.poznamka-redakce { font-size: 14px; color: var(--seda); background: var(--poznamka); border-radius: 12px; padding: 10px 14px; }

.paticka { padding: 56px var(--okraj) 72px; text-align: center; font-size: 14px; color: var(--seda); }
.paticka-kruh { width: 36px; height: 36px; color: var(--cervena); margin: 0 auto 14px; }
.paticka b { color: var(--inkoust); }
.paticka-zdroje { font-size: 12.5px; opacity: .8; }

/* ================================================================ responzivita */
@media (max-width: 1180px) {
  :root { --postranni: 280px; }
  .karty-fazi { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1024px) {
  :root { --postranni: 0px; }
  .rozvrzeni { display: block; }
  .tl-obsah { display: flex; }
  .postranni {
    position: fixed; top: var(--lista); left: 0; bottom: 0; width: min(88vw, 360px); height: auto; z-index: 25;
    transform: translateX(-102%); transition: transform .32s var(--ease); box-shadow: 20px 0 60px -20px rgba(22,36,79,.35);
  }
  body.menu-otevrene .postranni { transform: none; }
  .zavoj { display: block; position: fixed; inset: var(--lista) 0 0 0; z-index: 24; background: rgba(22,36,79,.35); opacity: 0; pointer-events: none; transition: opacity .3s; }
  body.menu-otevrene .zavoj { opacity: 1; pointer-events: auto; }
  body.menu-otevrene { overflow: hidden; }
  .lista-misto { display: none; }
}
@media (max-width: 860px) {
  .titul-mrizka { grid-template-columns: 1fr; }
  .titul-obraz { order: -1; max-width: 420px; width: 100%; margin: 0 auto -8px; }
  .obalka-mrizka { grid-template-columns: 1fr; padding-top: 56px; }
  .obalka-text { padding-bottom: 8px; }
  .obalka-ilu .ilu { max-height: 52vh; margin: 0 auto; }
  .typ-obalka { min-height: 0; }
}
@media (max-width: 640px) {
  :root { --lista: 58px; --radius: 18px; }
  body { font-size: 17px; }
  .lista { gap: 8px; padding-right: 10px; }
  .znacka-text small, .lista-stav, .tl-text { display: none; }
  .nabidka { margin-left: auto; }
  .nabidka > summary, .tl-obsah { width: 42px; padding: 0; justify-content: center; }
  .nabidka-panel { position: fixed; left: 10px; right: 10px; top: calc(var(--lista) + 8px); width: auto; }
  .karty-fazi { grid-template-columns: 1fr 1fr; gap: 10px; }
  .karta a { padding: 16px 14px 14px; }
  .karta-obraz { height: 76px; }
  .karta-nazev { font-size: 21px; }
  .karta-pod { font-size: 12px; }
  .strana { padding-top: 76px; }
  .strana-hlava { top: 22px; gap: 10px; }
  .strana-cislo::before { width: 12px; }
  .strana-ilu, .obrazek-vpravo, .obrazek-vlevo, .obrazek-male { float: none; width: auto; margin: 0 auto 22px; }
  .strana-ilu .ilu, .obrazek-vpravo .ilu, .obrazek-vlevo .ilu, .obrazek-male .ilu { width: auto; max-width: 70%; max-height: 300px; margin: 0 auto; }
  .strana-ilu-siroka .ilu { max-width: 100%; max-height: none; width: 100%; }
  .titul h1 { font-size: clamp(64px, 19vw, 96px); }
  .koucovani-postava { width: 96px; margin: -4px -4px 6px 10px; }
  .modul-postava { width: 88px; top: -34px; }
  .modul-reflexe > .modul-hlava, .modul-reflexe > .modul-telo > :first-child { margin-right: 84px; }
  .koucovani-zalozka { margin-right: 0; border-radius: 18px 18px 0 0; }
  .koucovani-list { border-radius: 0 0 20px 20px; }
  .citat { padding-left: 42px; }
  .papirek-1, .papirek-2 { transform: rotate(1deg); }
  .kresba-nastroje .barvy { width: 100%; }
  .strana td, .strana th { padding: 10px 12px; }
  .strana table { min-width: 520px; }
  .titul-akce a { flex: 1 1 auto; justify-content: center; }
}
@media (max-width: 380px) {
  .karty-fazi { grid-template-columns: 1fr; }
}

/* ================================================================ tisk */
.tisk-hodnota { display: none; }
@media print {
  @page { size: A4; margin: 14mm; }
  body { background: #fff; font-size: 11pt; }
  .lista, .postranni, .zavoj, .kresba-nastroje, .titul-akce, .karty-fazi, .preskocit, .paticka { display: none !important; }
  .rozvrzeni { display: block; }
  .titul { background: #fff !important; color: var(--inkoust); padding: 0; }
  .titul-perex, .titul-navod { color: var(--text); }
  .strana { padding: 0; border: 0; break-before: page; min-height: 0 !important; background: #fff !important; color: var(--text) !important; }
  .strana-hlava { position: static; padding: 0; margin-bottom: 10px; }
  .strana :is(h2, h3, h4, strong, p, li, figcaption, .strana-nadpis, .obalka-nadpis, .obalka-nadpis span) { color: var(--inkoust) !important; }
  .velky p { font-size: 28pt; }
  .obalka-cislo, .obalka-lekce { display: none; }
  .modul-modlitba { background: #fff; box-shadow: inset 0 0 0 1px #ccc; }
  .modul-aktivita, .tabulka-obal, .koucovani-list { box-shadow: none; border: 1px solid #ddd; }
  .pole textarea, .pole input { display: none; }
  .tisk-hodnota { display: block; white-space: pre-wrap; min-height: 2.2em; border-bottom: 1px dotted #999; padding: 4px 2px; color: var(--navy); }
  .pole-radek .tisk-hodnota { display: inline-block; min-width: 10em; }
  .stitek, .papirek, .kresba-plocha, .modul-reflexe, .box-zvyrazneni p { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* ================================================================ jemné objevování při čtení */
@media (prefers-reduced-motion: no-preference) {
  .animovat :is(.modul, .citat, .velky, .papirky, .schema, .obrazek, .strana-ilu, .koucovani, .obalka-ilu, .obalka-text) {
    opacity: 0; transform: translateY(18px); transition: opacity .7s var(--ease), transform .7s var(--ease);
  }
  .animovat :is(.modul, .citat, .velky, .papirky, .schema, .obrazek, .strana-ilu, .koucovani, .obalka-ilu, .obalka-text).videt { opacity: 1; transform: none; }
}
@media print { .animovat * { opacity: 1 !important; transform: none !important; } }

/* ================================================================ ilustrace (WebP z Gemini) */
img.ilu { height: auto; }
.obalka-ilu img.ilu { width: auto; max-width: 100%; max-height: min(78vh, 760px); margin: 0 auto; filter: drop-shadow(0 24px 40px rgba(10,20,60,.25)); }
.titul-obraz img.ilu { filter: drop-shadow(0 26px 36px rgba(0,0,0,.28)); }
.karta-obraz img.ilu { width: 100%; height: 100%; object-fit: contain; }
.obrazek-siroky { margin: 28px 0 36px; }
.obrazek-siroky img.ilu { width: 100%; }
.strana-ilu img.ilu { width: 100%; }
@media (max-width: 860px) { .obalka-ilu img.ilu { max-height: 46vh; } }

/* ================================================================ logo Mobilise */
.znacka-kruh { color: var(--logo); width: 34px; height: 34px; }
.obsah-kruh { color: var(--logo); }
.titul-znacka { margin-bottom: clamp(28px, 4vw, 44px); }
.titul-logo { width: auto; height: clamp(96px, 11vw, 132px); color: #fff; }
.paticka-logo { width: auto; height: 72px; color: var(--logo); margin: 0 auto 16px; }

/* ================================================================ infografiky */
/* dekorace přes celou stranu (@dekor) */
.strana-dekor { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.strana-dekor svg { width: 100%; height: 100%; display: block; }
.ma-dekor::before, .ma-dekor::after { display: none; }
.ma-dekor .strana-vnitrek { position: relative; z-index: 1; }
.ma-dekor .strana-hlava { z-index: 2; }
.typ-citat.nebe { background: linear-gradient(180deg, #132d7a 0%, #2553bd 58%, #3a6fd6 100%); }
.velky-otazka p { font-size: clamp(28px, 3.9vw, 54px); line-height: 1.12; text-align: center; font-weight: 400; color: #cfe0ff; }
.velky-otazka p strong { font-style: normal; font-weight: 700; color: #fff; }
.obrazek-let { margin: clamp(8px, 2vw, 20px) 0; }
.obrazek-let svg { width: 100%; height: auto; display: block; }

/* velká čísla s ikonami (::: cisla) */
.cisla { margin: 32px 0 20px; }
@media (min-width: 1280px) { .cisla { margin-inline: -80px; } }
.cisla-hlava, .cisla-radek { display: grid; grid-template-columns: repeat(var(--sloupcu), minmax(0, 1fr)); column-gap: 20px; }
.cisla-hlava > div { text-align: center; font: 700 14px/1.25 var(--sans); color: var(--cervena); }
.cisla-hlava .cisla-ikona svg { display: block; width: 58px; height: 58px; margin: 0 auto 10px; color: var(--navy); stroke-width: 1.25; }
.cisla-oddel { display: flex; align-items: center; gap: 14px; margin: 30px 0 12px; font: 600 13px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--navy); }
.cisla-oddel::before, .cisla-oddel::after { content: ''; flex: 1; height: 2px; background: var(--cervena); border-radius: 2px; }
.cisla-radek { margin: 0; }
.cisla-radek > div { text-align: center; min-width: 0; }
.cisla-radek dt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cisla-radek dd { margin: 0; font: 700 clamp(22px, 2.4vw, 32px)/1.15 var(--serif); letter-spacing: -.010em; color: var(--navy); white-space: nowrap; }

/* kruhy s ikonami (::: ikony) */
.strana .ikony { list-style: none; margin: 28px auto; padding: 0; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: clamp(10px, 3vw, 32px); max-width: calc(var(--n) * 150px); }
.strana .ikony li { margin: 0; padding: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; min-width: 0; }
.strana .ikony li::before { content: none; }
.ikony-kruh { width: min(100%, 116px); aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; color: #fff; --logo-akcent: #fff; box-shadow: 0 10px 24px -12px rgba(22,36,79,.45); }
.ikony-cervena .ikony-kruh { background: var(--cervena); }
.ikony-modra .ikony-kruh { background: #1f3c96; }
.ikony-kruh svg { width: 50%; height: 50%; stroke-width: 1.4; }
.ikony-kruh .ilu-logo-znak { width: 56%; height: 56%; }
.ikony-popis { font: 700 14px/1.25 var(--sans); color: var(--inkoust); }

/* pás s vlnitými okraji (box styl=vlna) */
.box-vlna, .box-vlna-nachova { position: relative; isolation: isolate; border-radius: 0; padding: clamp(56px, 7vw, 80px) 0; margin: 40px 0; }
.box-vlna::before, .box-vlna-nachova::before {
  content: ''; position: absolute; z-index: -1; top: 0; bottom: 0; left: -100vmax; right: -100vmax; background: var(--vlna);
  --vlna-h: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 30'%3E%3Cpath d='M0 30V15Q60 0 120 15T240 15V30Z'/%3E%3C/svg%3E");
  --vlna-d: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 30'%3E%3Cpath d='M0 0V15Q60 30 120 15T240 15V0Z'/%3E%3C/svg%3E");
  -webkit-mask: var(--vlna-h) top left / 240px 30px repeat-x, var(--vlna-d) bottom left / 240px 30px repeat-x, linear-gradient(#000 0 0) center / 100% calc(100% - 58px) no-repeat;
          mask: var(--vlna-h) top left / 240px 30px repeat-x, var(--vlna-d) bottom left / 240px 30px repeat-x, linear-gradient(#000 0 0) center / 100% calc(100% - 58px) no-repeat;
}
.box-vlna-nachova::before { background: var(--vlna-nachova); }
.strana:has(.box-vlna, .box-vlna-nachova) { overflow-x: clip; }
.box-vlna > :first-child, .box-vlna-nachova > :first-child { margin-top: 0; }
.box-vlna > :last-child, .box-vlna-nachova > :last-child { margin-bottom: 0; }
.box-vlna .box-zvyrazneni p { background: none; color: var(--inkoust); padding: 0; font-size: clamp(20px, 2.1vw, 26px); }
.box-vlna .citat { margin-bottom: 0; }

/* dva sloupce proti sobě (::: dvojice) */
.dvojice { margin: 8px 0 36px; }
.strana .dvojice ul { list-style: none; margin: 0; padding: 0; }
.strana .dvojice li { margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(16px, 4vw, 44px); }
.strana .dvojice li::before { content: none; }
.dvojice-hlava { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 12px; margin: 0 0 18px; }
.dvojice-sipka .dvojice-hlava { font: 700 clamp(34px, 4.6vw, 56px)/1 var(--serif); letter-spacing: -.015em; color: #fff; }
.dvojice .dvojice-hlava > svg.dvojice-ukazatel { width: clamp(80px, 12vw, 150px); height: auto; color: #ff8f84; }
.dvojice-sipka .dvojice-hlava { grid-template-columns: 1fr 1fr; column-gap: clamp(16px, 4vw, 44px); }
.dvojice-sipka .dvojice-hlava > span:first-child { grid-area: 1 / 1; }
.dvojice-sipka .dvojice-hlava > svg.dvojice-ukazatel { grid-area: 1 / 1; justify-self: end; width: clamp(64px, 9vw, 130px); margin-top: .15em; }
.dvojice-sipka .dvojice-hlava > span:last-child { grid-area: 1 / 2; }
.dvojice-sipka li { border-bottom: 2px solid rgba(255,255,255,.75); padding: 16px 0 10px !important; align-items: end; }
.dvojice-sipka .dvojice-a { font: 600 17px/1.35 var(--sans); color: rgba(255,255,255,.85); }
.dvojice-sipka .dvojice-b { font: 700 19px/1.3 var(--serif); color: #fff; }
.dvojice-protiklad .dvojice-hlava { font: 700 15px/1.25 var(--sans); color: var(--inkoust); }
.dvojice-protiklad .dvojice-hlava > span:last-child { text-align: right; }
.dvojice-vs { font: italic 400 22px/1 var(--serif); color: var(--cervena); }
.dvojice-protiklad li > span { padding: 5px 14px; font-size: 16px; line-height: 1.35; position: relative; }
.dvojice-protiklad .dvojice-a { border-left: 2px solid var(--cervena); }
.dvojice-protiklad .dvojice-b { border-right: 2px solid var(--cervena); text-align: right; }
.dvojice-protiklad li > span::before { content: ''; position: absolute; top: calc(5px + .7em); width: 9px; height: 2px; background: var(--cervena); }
.dvojice-protiklad .dvojice-a::before { left: 0; }
.dvojice-protiklad .dvojice-b::before { right: 0; }
.dvojice-protiklad li:first-child > span { padding-top: 0; }
.dvojice-protiklad li:first-child > span::before { top: .7em; }

@media (max-width: 640px) {
  .cisla-hlava { display: none; }
  .cisla-radek { grid-template-columns: 1fr 1fr; gap: 10px; }
  .cisla-radek > div { text-align: left; background: var(--karta); border: 1px solid var(--linka); border-radius: 14px; padding: 12px 14px; }
  .cisla-radek dt { position: static; width: auto; height: auto; clip: auto; white-space: normal; display: flex; align-items: center; gap: 8px; font: 700 12px/1.2 var(--sans); color: var(--cervena); margin-bottom: 6px; }
  .cisla-radek dt svg { width: 22px; height: 22px; flex: none; color: var(--navy); }
  .cisla-radek dd { font-size: 20px; }
  .cisla-oddel { margin-top: 26px; }
  .dvojice-protiklad li > span { font-size: 14px; padding-inline: 10px; }
  .dvojice-sipka .dvojice-a { font-size: 15px; }
  .dvojice-sipka .dvojice-b { font-size: 16px; }
  .obrazek-let { margin-inline: -8px; }
  .ikony-popis { font-size: 12.5px; }
}

/* odkaz místo QR kódu (::: odkaz) */
.odkaz-tlacitko { margin: 18px 0 26px; }
.odkaz-tlacitko a { display: inline-flex; align-items: center; gap: 12px; padding: 14px 20px; border-radius: 14px; background: var(--panel); color: #fff; font: 600 16px/1.3 var(--sans); text-decoration: none; box-shadow: var(--stin); transition: transform .15s, background-color .15s; }
.odkaz-tlacitko a:hover { background: var(--panel-hover); transform: translateY(-1px); }
.odkaz-tlacitko a:focus-visible { outline: 3px solid var(--horcice); outline-offset: 3px; }
.odkaz-tlacitko svg { width: 22px; height: 22px; flex: none; }
.odkaz-tlacitko svg:last-child { width: 18px; height: 18px; opacity: .7; }
@media print { .odkaz-tlacitko a::after { content: ' ' attr(href); font-size: 9pt; word-break: break-all; } }

/* nápis z obálky (grafika/titul-playbook.svg, nastroje/titul.py) */
.titul-napis { margin: 0; }
.titul-svg { display: block; width: min(100%, 600px); height: auto; }
.titul-autor { display: flex; align-items: center; gap: 16px; font: 600 clamp(17px, 1.6vw, 21px)/1.2 var(--sans); opacity: 1; margin-top: 26px; }
.titul-sipka { flex: 0 0 clamp(64px, 8vw, 110px); height: auto; color: #ff4d4f; }
.titul .tl-hlavni { background: #fff4ee; color: #5a1719; box-shadow: 0 10px 30px -12px rgba(0,0,0,.6); }
.titul .tl-hlavni:hover { background: #fff; }
.paticka-copy { font-weight: 600; }
@media print { .titul-svg { --titul-linka: #d63a2f; --titul-text: #16244f; } }

/* v liště jen znak Mobilise (M v kroužku) */
.znacka .znacka-kruh { width: 38px; height: 38px; }
.lista-misto { flex: 0 1 auto; min-width: 0; }

/* modlitba: postava uvnitř panelu (panel ořezává kvůli záři), text ji obtéká */
.modul-modlitba { display: flow-root; }
.modul-modlitba .modul-postava { position: relative; z-index: 1; float: right; top: auto; right: auto; width: clamp(92px, 16%, 128px); margin: -8px -6px 10px 20px; }
.modul-modlitba > .modul-hlava, .modul-modlitba > p { position: relative; z-index: 1; }
@media (max-width: 640px) { .modul-modlitba .modul-postava { width: 80px; margin: -6px -8px 6px 12px; } }

/* štítek je <p> – obecné okraje odstavců na stránce by posunuly vycentrování čísla strany */
.strana-hlava .stitek { margin: 0; }

/* časová osa (s. 7): na počítači popisky v obrázku, na telefonu pod ním jako text */
.schema-casova-osa ul { display: none; }
@media (min-width: 1280px) { .schema-casova-osa { margin-left: -120px; margin-right: -120px; } }
@media (max-width: 640px) {
  .schema-casova-osa .osa-texty { display: none; }
  .schema-casova-osa svg { margin: -19% 0 -4px; }
  .schema-casova-osa ul { display: block; margin-top: 8px; }
}

/* --- v obsahu: červená vlnovka přes celou šířku textu */
.vlnka { border: 0; height: 26px; margin: 48px 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 26'%3E%3Cpath d='M0 13Q30 -3 60 13T120 13' fill='none' stroke='%23d63a2f' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") left center / 120px 26px repeat-x; }

/* titulní strana jako obálka tištěného sešitu: vše na střed, bez ilustrace */
.titul-mrizka { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; max-width: 860px; }
.titul-text { display: flex; flex-direction: column; align-items: center; width: 100%; }
.titul-znacka { justify-content: center; margin-bottom: clamp(28px, 4vw, 48px); }
.titul-napis { width: 100%; }
.titul-svg { width: 100%; max-width: min(560px, 58vh); margin: 0 auto; }
.titul .titul-logo { height: clamp(76px, 7.5vw, 104px); }
.titul .titul-znacka { margin-bottom: clamp(20px, 3vw, 36px); }
.titul { padding-top: clamp(32px, 5vw, 64px); }
.titul-autor { justify-content: center; margin-top: clamp(20px, 3vw, 34px); }
.titul-perex { max-width: 44ch; margin-left: auto; margin-right: auto; }
.titul-akce { justify-content: center; }
.karty-fazi { margin-top: clamp(48px, 7vw, 88px); }
.titul-navod { text-align: center; }

/* načítací obrazovka (v hlavičce sesit.html): po načtení stylů obsah ukázat, obrazovku rozplynout */
body > :not(.nacitani) { visibility: visible; }
.nacitani { animation: nacitani-pryc .45s ease .25s forwards; }
.nacitani.skryto { opacity: 0; pointer-events: none; }
@keyframes nacitani-pryc { to { opacity: 0; visibility: hidden; } }
@media print { .nacitani { display: none !important; } }

/* „with Paul Bartlett“ se nesmí zalomit (flex by text stlačil na nejužší šířku) */
.titul-autor span { flex: none; white-space: nowrap; }
.titul-sipka { width: clamp(64px, 8vw, 110px); }

/* Lexend nemá kurzívu – nenechat prohlížeč dopočítat šikmé tvary */
html { font-synthesis-style: none; }

/* úzké telefony: dlouhá česká slova ve velkých výrocích se musí vejít (Lexend je široký) */
.velky p { overflow-wrap: break-word; }
@media (max-width: 380px) {
  .velky p { font-size: 27px; }
  .velky-obrys p { font-size: 30px; }
  .cisla-radek dd { font-size: 17px; }
  .ikony-popis { font-size: 11px; overflow-wrap: anywhere; }
}

/* Sentient (Indian Type Foundry, ITF Free Font License) – citáty, modlitby, verše */
@font-face { font-family: 'Sentient'; font-style: normal; font-weight: 200 700; font-display: swap; src: url(pisma/sentient.woff2) format('woff2'); }
@font-face { font-family: 'Sentient'; font-style: italic; font-weight: 200 700; font-display: swap; src: url(pisma/sentient-italic.woff2) format('woff2'); }

/* <obrysy> – vygenerováno nastroje/obrysy.py: statické řezy Lexendu bez překryvů pro text s obrysem */
@font-face { font-family: 'Lexend obrys vyrok'; font-weight: 100 900; font-style: normal; font-display: swap; src: url(pisma/obrys-vyrok-1.woff2) format('woff2'); unicode-range: U+41, U+C1, U+10C, U+10E, U+11A, U+147, U+158, U+160, U+164, U+16E, U+17D; }
@font-face { font-family: 'Lexend obrys vyrok'; font-weight: 100 900; font-style: normal; font-display: swap; src: url(pisma/obrys-vyrok.woff2) format('woff2'); unicode-range: U+21, U+22, U+26, U+27, U+28, U+29, U+2C, U+2D, U+2E, U+2F, U+3A, U+3B, U+3F, U+41, U+42, U+43, U+44, U+45, U+46, U+47, U+48, U+49, U+4A, U+4B, U+4C, U+4D, U+4E, U+4F, U+50, U+51, U+52, U+53, U+54, U+55, U+56, U+57, U+58, U+59, U+5A, U+C1, U+C9, U+CD, U+D3, U+DA, U+DD, U+2013, U+2014, U+201C, U+201D, U+201E, U+2026; }
@font-face { font-family: 'Lexend obrys cislo'; font-weight: 100 900; font-style: normal; font-display: swap; src: url(pisma/obrys-cislo.woff2) format('woff2'); unicode-range: U+30, U+31, U+32, U+33, U+34, U+35, U+36, U+37, U+38, U+39; }
.velky-obrys p { font-family: 'Lexend obrys vyrok', var(--sans); }
.obalka-cislo { font-family: 'Lexend obrys cislo', var(--serif) !important; }
/* </obrysy> */

/* ================================================================ tmavý režim (přepínač v liště, výchozí podle systému) */
.tl-rezim {
  display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--inkoust); box-shadow: inset 0 0 0 1.5px rgba(var(--tint),.2); transition: background .2s;
}
.tl-rezim:hover { background: rgba(var(--tint),.06); }
.tl-rezim svg { width: 19px; height: 19px; }
.tl-rezim .rezim-slunce, html[data-rezim="tmavy"] .tl-rezim .rezim-mesic { display: none; }
html[data-rezim="tmavy"] .tl-rezim .rezim-slunce { display: block; }
@media (max-width: 640px) { .tl-rezim { margin-left: auto; width: 42px; height: 42px; } .nabidka { margin-left: 0; } }
@media print { .tl-rezim, .tl-jazyk { display: none; } }
/* přepínač jazyka (CZ / EN) vedle přepínače režimu */
.tl-jazyk {
  display: grid; place-items: center; height: 40px; min-width: 40px; flex: 0 0 auto; padding: 0 10px; border: 0; border-radius: 999px;
  background: transparent; color: var(--inkoust); box-shadow: inset 0 0 0 1.5px rgba(var(--tint),.2);
  font: 700 12.5px/1 var(--sans); letter-spacing: .08em; transition: background .2s;
}
.tl-jazyk:hover { background: rgba(var(--tint),.06); }
@media (max-width: 640px) { .tl-jazyk { height: 42px; min-width: 42px; } }
/* přechod mezi režimy: kruh z tlačítka (animaci řídí sesit.js), ve starších prohlížečích závoj */
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
.rezim-zavoj { position: fixed; inset: 0; z-index: 900; pointer-events: none; opacity: 0; }
.tl-rezim svg { animation: rezim-ikona .5s var(--ease); }
@keyframes rezim-ikona { from { opacity: 0; transform: rotate(-90deg) scale(.6); } }

@media screen {
  html[data-rezim="tmavy"] {
    color-scheme: dark;
    --inkoust: #eef0f8; --navy: #9db7ff; --text: #cdd2e2; --seda: #98a0b9; --seda-svetla: #6b7390; --linka: #262f4e;
    --vinova: #f29a8f; --modra: #86a8f7; --nachova: #c9a9f0; --cervena-tmava: #ff7b70;
    --modra-svetla: rgba(46,95,200,.24); --horcice-svetla: #2a2419; --nachova-svetla: rgba(122,78,163,.22);
    --papir: #131a30; --podklad: #0c1122;
    --panel: #25366c; --panel-hover: #30458c; --karta: #1a2241; --tint: 255,255,255;
    --lista-pozadi: rgba(15,21,40,.86); --logo: #f4ebe8;
    --tecky: #4a5476; --placeholder: #5f6888; --ramecek: #3b4568; --ramecek-pozadi: rgba(255,255,255,.03); --ramecek-kouc: #151c35;
    --th: #212b4d; --poznamka: #1b2342; --zamysleni: rgba(214,58,47,.15); --svetla-strana: #171e37;
    --vlna: #1b2342; --vlna-nachova: #241e41; --horcice-text: #f0c35e; --horcice-ikona: #f0c35e;
    --stin: 0 1px 2px rgba(0,0,0,.3), 0 14px 34px -14px rgba(0,0,0,.7);
  }
  html[data-rezim="tmavy"] .modul-reflexe .modul-ikona { color: var(--nachova); }
  html[data-rezim="tmavy"] .nabidka-panel { box-shadow: 0 24px 60px -12px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.08); }
  html[data-rezim="tmavy"] .modul-modlitba { box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
  html[data-rezim="tmavy"] .kresba-plocha { box-shadow: inset 0 0 0 2px var(--nachova); }
  /* schémata: popisky ležící přímo na papíře zesvětlit, barevné plochy nechat */
  html[data-rezim="tmavy"] .schema-casova-osa [fill="#252d45"] { fill: var(--text); }
  html[data-rezim="tmavy"] .schema-casova-osa [stroke="#2548b0"] { stroke: #6f93f5; }
  html[data-rezim="tmavy"] .schema-casova-osa [fill="#d63a2f"] { fill: #ff7468; }
  html[data-rezim="tmavy"] :is(.schema-cyklus, .schema-semafor, .schema-spektrum) :is(text, tspan)[fill="#16244f"] { fill: var(--inkoust); }
  html[data-rezim="tmavy"] .schema-semafor :is(text, tspan)[fill="#283049"] { fill: var(--text); }
  html[data-rezim="tmavy"] .schema-spektrum :is(text, tspan)[fill="#9a6a0b"] { fill: var(--horcice-text); }
  html[data-rezim="tmavy"] .schema-spektrum :is(text, tspan)[fill="#2e5fc8"] { fill: var(--modra); }
  html[data-rezim="tmavy"] .schema-cyklus [stroke="#16244f"] { stroke: var(--seda); }
  html[data-rezim="tmavy"] .schema-cyklus path[fill="#16244f"] { fill: var(--seda); }
}