:root{padding-top:env(safe-area-inset-top,0px)}
/* Písma hostovaná na našem serveru (SIL Open Font License 1.1, viz fonts/LICENSE-atkinson-hyperlegible.txt).
   Jen řezy, které web používá: Atkinson Hyperlegible 400 a 700. Ostatní soubory ve static/fonts se nenasazují. */
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(fonts/atkinson-hyperlegible-latin-ext-400-normal.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;
}
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(fonts/atkinson-hyperlegible-latin-400-normal.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: 'Atkinson Hyperlegible';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(fonts/atkinson-hyperlegible-latin-ext-700-normal.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;
}
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(fonts/atkinson-hyperlegible-latin-700-normal.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;
}

/* Kolik doplatím – vzhled pro seniory na mobilu.
   Zásady: základ písma 19 px, žádný text pod 16 px (--small), klikací prvky aspoň 48 px, jeden sloupec do 720 px,
   karty místo tabulek, kontrast textu aspoň 4,5:1, viditelný fokus. Jediné písmo: Atkinson Hyperlegible 400 a 700. */
:root {
  --bg: #F5F3EE;
  --surface: #FFFFFF;
  --ink: #16222D;
  --muted: #4B5967;
  --line: #D2D7DC;
  --edge: #6F7B88;
  --accent: #134CA8;
  --accent-ink: #FFFFFF;
  --accent-soft: #E3EBF9;
  --ok: #17663F;
  --ok-soft: #DFF1E6;
  --warn: #8A4A00;
  --warn-soft: #FBEACB;
  --crit: #A3182F;
  --crit-soft: #FAE1E5;
  --shadow: rgba(22, 34, 45, .16);
  --s1: #2468C8;
  --s2: #C4521C;
  --font: "Atkinson Hyperlegible", Verdana, "Segoe UI", system-ui, sans-serif;
  --small: .8422rem;   /* 16 px při základu 19 px */
  --lead: 1.12rem;
  --h1: clamp(1.9rem, 7.2vw, 2.6rem);
  --h2: 1.45rem;
  --h3: 1.16rem;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0E151B; --surface: #17212A; --ink: #E7EDF2; --muted: #A9B6C2; --line: #2F3E4A; --edge: #8494A3;
    --accent: #8FB1F5; --accent-ink: #0B1626; --accent-soft: #1B2A45;
    --ok: #6FD49C; --ok-soft: #12301F; --warn: #EDB763; --warn-soft: #3A2A0F; --crit: #F58A9A; --crit-soft: #3F1921;
    --shadow: rgba(0, 0, 0, .5); --s1: #6FA5F0; --s2: #EE8A55; color-scheme: dark;
  }
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { font-size: 118.75%; -webkit-text-size-adjust: 100%; scroll-padding-top: 12px; }
html.big { font-size: 137.5%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 400 1rem/1.55 var(--font);
  padding: 0 max(16px, env(safe-area-inset-right, 0px)) 40px max(16px, env(safe-area-inset-left, 0px));
  overflow-wrap: break-word;
}
.wrap { max-width: 720px; margin: 0 auto; min-width: 0; }
a { color: var(--accent); text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
a:hover { text-decoration-thickness: 3px; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; border-radius: 6px; }
h1, h2, h3, h4 { margin: 0; line-height: 1.15; font-weight: 700; text-wrap: balance; }
h1 { font-size: var(--h1); letter-spacing: -.01em; }
h2 { font-size: var(--h2); display: flex; align-items: center; gap: 10px; }
h3 { font-size: var(--h3); }
p { margin: 0; }
b, strong { font-weight: 700; }
.muted { color: var(--muted); }
.lead { font-size: var(--lead); }
.hint { font-size: var(--small); color: var(--muted); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ic { width: 1.3em; height: 1.3em; flex: 0 0 auto; color: var(--accent); }
h2 .ic.h { width: 1.15em; height: 1.15em; }
.ic.t { width: 44px; height: 44px; padding: 8px; border-radius: 12px; background: var(--accent-soft); }

/* přeskočit na obsah, pruh prototypu */
.skip { position: absolute; left: -9999px; top: 8px; z-index: 60; background: var(--surface); padding: 12px 18px; border-radius: 10px; font-weight: 700; }
.skip:focus { left: 16px; }
.proto { margin: 0 calc(-1 * max(16px, env(safe-area-inset-right, 0px))) 0 calc(-1 * max(16px, env(safe-area-inset-left, 0px)));
  background: var(--warn-soft); color: var(--ink); font-size: var(--small); }
.proto p { max-width: 720px; margin: 0 auto; padding: 8px max(16px, env(safe-area-inset-right, 0px)) 8px max(16px, env(safe-area-inset-left, 0px)); }

/* hlavička: značka, větší písmo, tři položky menu */
.site { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; align-items: center; padding: 10px 0 14px; border-bottom: 2px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; font-weight: 700; font-size: 1.16rem; color: var(--ink); text-decoration: none; justify-self: start; }
.brand-mark { width: 30px; height: 16px; border-radius: 8px; background: linear-gradient(90deg, var(--accent) 50%, var(--accent-soft) 50%); border: 2px solid var(--accent); flex: 0 0 auto; }
.textsize { min-height: 48px; padding: 4px 16px; border: 2px solid var(--accent); border-radius: 999px; background: var(--surface); color: var(--accent); font: 700 var(--small)/1.2 var(--font); cursor: pointer; }
.textsize[aria-pressed="true"] { background: var(--accent); color: var(--accent-ink); }
.site nav { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.site nav a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 6px 6px; border: 2px solid var(--line); border-radius: 12px;
  background: var(--surface); color: var(--ink); font-weight: 700; font-size: var(--small); line-height: 1.2; text-align: center; text-decoration: none; }
.site nav a:hover { border-color: var(--accent); }
.site nav a[aria-current] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
@media (min-width: 760px) {
  .site { grid-template-columns: auto minmax(0, 1fr) auto; }
  .site nav { grid-column: 2; grid-row: 1; justify-content: end; grid-template-columns: repeat(3, auto); }
  .site nav a { padding-inline: 16px; white-space: nowrap; }
  .textsize { grid-column: 3; }
}

main { display: grid; gap: 36px; padding-top: 14px; }
/* dlouhé názvy (Telmisartan/Hydrochlorothiazid, Perindopril Arginin/Indapamid/Amlodipin) se zalomí, místo aby roztáhly stránku */
main > *, section > *, .card > *, #odpoved > *, .a-jini > *, .supply > *, .s-list > *, .vyr > *, .vyr-top > * { min-width: 0; }
h1, h2, h3, h4, summary, .s-head, .vyr-top, .pil-body { overflow-wrap: anywhere; }
.drughead + .answer { margin-top: -14px; }
section { display: grid; gap: 14px; min-width: 0; scroll-margin-top: 12px; }
section > * { min-width: 0; }

/* tlačítka a odkazy jako tlačítka */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 10px 22px; border: 2px solid var(--accent); border-radius: 12px;
  background: var(--accent); color: var(--accent-ink); font: 700 1rem/1.2 var(--font); text-align: center; text-decoration: none; cursor: pointer; justify-self: start; }
.btn:hover { filter: brightness(1.12); }
.btn.ghost { background: var(--surface); color: var(--accent); }
.btn[aria-pressed="true"] { background: var(--ok-soft); color: var(--ok); border-color: var(--ok); }
button[disabled] { opacity: .6; cursor: progress; }
.more { display: inline-flex; align-items: center; min-height: 48px; max-width: 100%; font-weight: 700; overflow-wrap: anywhere; }
.more::after { content: "→"; margin-left: 8px; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; }
.card { background: var(--surface); border: 2px solid var(--line); border-radius: 16px; padding: 18px; }

/* štítky */
.chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.chip { display: inline-flex; align-items: center; min-height: 30px; padding: 2px 12px; border-radius: 999px; font-size: var(--small); font-weight: 700; line-height: 1.25; }
.chip.ok { background: var(--ok-soft); color: var(--ok); }
.chip.preruseno { background: var(--crit-soft); color: var(--crit); }
.chip.obnoveno, .chip.info { background: var(--accent-soft); color: var(--accent); }
.chip-s { font-size: var(--small); color: var(--muted); margin-left: 6px; }

/* drobečky a hlava stránky léku */
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; margin: -8px 0 -6px; font-size: var(--small); color: var(--muted); }
.crumbs a { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; color: var(--muted); }
.drughead { gap: 10px; }
.meta { display: flex; flex-wrap: wrap; font-size: var(--small); color: var(--muted); }
.meta span:not(:last-child)::after { content: "·"; margin: 0 8px; }
.meta b { color: var(--ink); }

/* „Váš lék: … změnit“ */
.volba { background: var(--accent-soft); border-radius: 14px; margin-top: 4px; }
.volba.jedna { padding: 12px 14px; }
.volba > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 56px; padding: 8px 14px; }
.volba > summary::-webkit-details-marker { display: none; }
.v-zmenit { color: var(--accent); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.v-in { display: grid; gap: 14px; padding: 4px 14px 16px; }
.v-sila { display: grid; gap: 6px; }
.v-sila h3 { font-size: 1rem; }
.v-bal { display: flex; flex-wrap: wrap; gap: 8px; }
.v-bal a { display: inline-flex; align-items: center; min-height: 48px; padding: 6px 18px; border: 2px solid var(--edge); border-radius: 999px; background: var(--surface); color: var(--ink); font-weight: 700; text-decoration: none; }
.v-bal a:hover { border-color: var(--accent); }
.v-bal a[aria-current] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }

/* odpověď: jedna věta a velké číslo */
.answer { border-top: 8px solid var(--accent); padding: 16px 18px 18px; gap: 12px; box-shadow: 0 14px 30px -24px var(--shadow); }
.answer > h2 { font-size: var(--small); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
#odpoved { display: grid; gap: 8px; }
.a-veta { font-size: var(--lead); }
.a-cislo { font-size: clamp(2.7rem, 15vw, 3.9rem); font-weight: 700; line-height: 1.05; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.a-cislo.nula { font-size: clamp(2rem, 11vw, 3.3rem); color: var(--ok); }
.a-pozn { font-size: var(--small); color: var(--muted); }
.a-ind { font-size: var(--small); color: var(--muted); }
.a-jini { display: grid; gap: 10px; margin-top: 6px; padding: 14px; border-radius: 12px; background: var(--bg); }
.a-jini.lev { background: var(--ok-soft); }
.a-v2 { font-size: var(--lead); }
.a-v2 b { white-space: nowrap; }
.a-akce { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.a-alt { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.a-alt li { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.a-alt a { display: flex; flex-direction: column; justify-content: center; min-height: 48px; flex: 1; min-width: 0; overflow-wrap: anywhere; color: var(--accent); }
.a-alt a b { font-size: var(--lead); }
.a-alt a span { font-size: var(--small); color: var(--muted); text-decoration: none; }
.a-alt-c { font-weight: 700; white-space: nowrap; text-align: right; }
.a-tip, .a-nti { flex-basis: 100%; font-size: var(--small); }
.a-nti { background: var(--warn-soft); border-radius: 10px; padding: 10px 12px; }
.a-mine { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; border-top: 2px dashed var(--line); padding-top: 14px; margin-top: 2px; }
.a-mine a { display: inline-flex; align-items: center; min-height: 48px; font-weight: 700; }

/* celoobrazovková karta do lékárny */
.overlay { position: fixed; inset: 0; z-index: 50; background: var(--surface); display: grid; place-items: center; overflow: auto;
  padding: calc(24px + env(safe-area-inset-top, 0px)) max(20px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) max(20px, env(safe-area-inset-left, 0px)); }
.ov-in { display: grid; gap: 20px; text-align: center; justify-items: center; max-width: 900px; }
.ov-k { font-size: clamp(1.3rem, 5.5vw, 2rem); }
.ov-big { font-size: clamp(2.1rem, 10vw, 4.4rem); line-height: 1.1; }
.ov-big b { color: var(--accent); overflow-wrap: anywhere; }
.ov-s { font-size: var(--lead); color: var(--muted); }
.ov-in .btn { justify-self: center; }
body.noscroll { overflow: hidden; }

/* dodávky */
.supply { display: grid; gap: 8px; padding: 14px 16px; background: var(--surface); border: 2px solid var(--line); border-left: 10px solid var(--ok); border-radius: 14px; }
.supply.part { border-left-color: var(--warn); }
.supply.out { border-left-color: var(--crit); }
.s-head { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: var(--h3); line-height: 1.25; }
.dot { width: 14px; height: 14px; border-radius: 50%; flex: 0 0 auto; background: var(--ok); }
.supply.part .dot { background: var(--warn); }
.supply.out .dot { background: var(--crit); }
.s-list { margin: 0; padding-left: 1.2em; display: grid; gap: 6px; }
.s-sily { display: grid; gap: 8px; }
.s-sily h3 { font-size: 1rem; }
.s-sily ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.s-sily li { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; }

/* rozbalovací bloky (leták, otázky, podrobnosti) */
.fold { background: var(--surface); border: 2px solid var(--line); border-radius: 12px; }
.fold > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 14px; font-weight: 700; }
.fold > summary::-webkit-details-marker { display: none; }
.fold > summary::after { content: ""; flex: 0 0 auto; width: 11px; height: 11px; margin: -4px 6px 0 auto; border-right: 3px solid var(--accent); border-bottom: 3px solid var(--accent); transform: rotate(45deg); }
.fold[open] > summary::after { transform: rotate(-135deg); margin-top: 6px; }
.fold > p, .fold-in, .fold > .kv, .fold > table { margin: 0 14px 14px; }
.fold > table { width: calc(100% - 28px); }
.fold-in { display: grid; gap: 10px; }
.folds { display: grid; gap: 8px; }
.fold.pod { background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; }
.fold.pod > summary { min-height: 48px; padding: 6px 0; font-size: var(--small); color: var(--accent); }
.fold.pod > .kv, .fold.pod > table { margin: 0 0 6px; }
.fold.pod > table.hours { width: auto; }
.kv { margin: 0; display: grid; }
.kv div { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; border-top: 1px solid var(--line); font-size: var(--small); }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.kv.stack div { display: grid; gap: 2px; }
.kv.stack dt { color: var(--ink); font-weight: 700; }
.kv.stack dd { text-align: left; color: var(--muted); }

/* příbalový leták */
.cn { width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; background: var(--accent-soft); color: var(--accent); }
.pil-body { display: grid; gap: 10px; margin: 0 14px 18px; line-height: 1.6; }
.pil-body ul { margin: 0; padding-left: 1.2em; display: grid; gap: 6px; }
.pil-body h4 { margin: 8px 0 0; font-size: 1rem; }
.pil-body h4.pil-inter { background: var(--warn-soft); padding: 4px 8px; border-radius: 6px; justify-self: start; }
.pil-src { font-size: var(--small); color: var(--muted); border-left: 4px solid var(--line); padding-left: 12px; }
.pil-pdf { display: grid; gap: 6px; }

/* balení přípravku jako karty */
.bals, .vyrs, .rows, .tools, .linklist, .azlist, .citylist, .pharms, .posts, .mine, .naseptavac ul { list-style: none; margin: 0; padding: 0; }
.bals { display: grid; gap: 12px; }
@media (min-width: 640px) { .bals { grid-template-columns: 1fr 1fr; } }
.bal { display: grid; gap: 6px; align-content: start; padding: 16px 16px 8px; background: var(--surface); border: 2px solid var(--line); border-radius: 16px; scroll-margin-top: 12px; }
.bal.akt { border-color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent); }
.bal h3 { font-size: var(--h3); }
.bal-dop { font-size: 1.5rem; font-weight: 700; line-height: 1.2; }
.bal-dop.nula { color: var(--ok); }
.bal-pu { font-size: var(--small); color: var(--muted); }

/* stejný lék od jiných výrobců: rozcestník podle názvů a karty */
.srov:not([hidden]) { display: grid; gap: 12px; }
.vknames { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.vknames li { min-width: 0; }
.vknames a { display: flex; flex-direction: column; justify-content: center; min-height: 48px; padding: 6px 14px; background: var(--surface); border: 2px solid var(--line); border-radius: 12px; overflow-wrap: anywhere; }
.vknames a:hover { border-color: var(--accent); }
.vknames small { font-size: var(--small); color: var(--muted); }
.vyrs { display: grid; gap: 12px; }
.vyr { display: grid; gap: 6px; padding: 12px 16px 8px; background: var(--surface); border: 2px solid var(--line); border-radius: 16px; }
.vyr.gone { background: transparent; }
.vyr-top { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; justify-content: space-between; }
.vyr-top h3 { font-size: 1.3rem; }
.vyr-top h3 a { display: inline-flex; align-items: center; min-height: 48px; }
.vyr-drz { font-size: var(--small); color: var(--muted); margin-top: -8px; }
.vyr-bal { list-style: none; margin: 0; padding: 0; }
.vyr-bal li { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 10px 0; border-top: 1px solid var(--line); }
.vb-c { display: grid; text-align: right; }
.vb-c b { font-size: 1.1rem; }
.vb-c b.nula { color: var(--ok); }
.vb-c small { font-size: var(--small); color: var(--muted); }
.vyr .more { border-top: 1px solid var(--line); }

/* hledání a našeptávač, řádky léků */
.hero { gap: 12px; }
.hledat { display: grid; gap: 8px; }
.hledat > label { font-weight: 700; font-size: var(--lead); }
.h-pole { position: relative; }
.h-pole .ic { position: absolute; left: 16px; top: 50%; width: 26px; height: 26px; margin-top: -13px; color: var(--muted); pointer-events: none; }
.h-pole input { width: 100%; min-height: 64px; padding: 10px 12px 10px 54px; border: 3px solid var(--accent); border-radius: 14px; background: var(--surface); color: var(--ink); font: 400 1.25rem/1.2 var(--font); }
.h-pole input::placeholder { color: var(--muted); opacity: 1; }
.naseptavac, .rows { background: var(--surface); border: 2px solid var(--line); border-radius: 14px; overflow: hidden; }
.naseptavac { border-color: var(--accent); }
.rows li + li, .naseptavac li + li { border-top: 1px solid var(--line); }
.rows a, .naseptavac a, .naseptavac button { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 14px; align-items: center; width: 100%; min-height: 64px; padding: 9px 14px;
  background: none; border: 0; color: var(--ink); font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.rows a:hover, .naseptavac a:hover, .naseptavac button:hover, .naseptavac a:focus-visible, .naseptavac button:focus-visible { background: var(--accent-soft); }
.naseptavac a:focus-visible, .naseptavac button:focus-visible, .rows a:focus-visible { outline-offset: -3px; }
.n-n { grid-column: 1; font-weight: 700; font-size: 1.08rem; line-height: 1.3; }
.n-s { grid-column: 1; font-size: var(--small); color: var(--muted); line-height: 1.35; }
.n-c { grid-column: 2; grid-row: 1 / span 2; font-weight: 700; text-align: right; white-space: nowrap; }
.n-c.nula { color: var(--ok); }
.n-info { padding: 10px 14px; font-size: var(--small); color: var(--muted); border-bottom: 1px solid var(--line); }
.n-nic { display: grid; gap: 8px; padding: 14px; }
.rows.gone a { grid-template-columns: minmax(0, 1fr); border-left: 8px solid var(--crit); }

/* dlaždice nástrojů a průvodců */
.tools { display: grid; gap: 10px; }
.tools a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 14px; align-items: center; height: 100%; min-height: 80px; padding: 14px; background: var(--surface); border: 2px solid var(--line); border-radius: 16px; color: var(--ink); text-decoration: none; }
.tools a:hover { border-color: var(--accent); }
.tools a .ic { grid-row: 1 / span 2; }
.tools b { font-size: 1.16rem; color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.tools span { grid-column: 2; font-size: var(--small); color: var(--muted); }
@media (min-width: 680px) {
  .tools { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tools a { grid-template-columns: 1fr; gap: 6px; align-content: start; }
  .tools a .ic { grid-row: auto; }
  .tools span { grid-column: 1; }
}
.linklist { display: grid; gap: 8px; }
.linklist a { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 14px; background: var(--surface); border: 2px solid var(--line); border-radius: 12px; color: var(--ink); text-decoration: none; }
.linklist a:hover { border-color: var(--accent); }
.linklist a > span { display: grid; gap: 2px; }
.linklist .muted { font-size: var(--small); }

/* ochranný limit */
.limits { display: grid; gap: 8px; }
.limit { display: grid; grid-template-columns: 6.2em minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px 14px; background: var(--surface); border: 2px solid var(--line); border-radius: 12px; }
.limit b { font-size: 1.3rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.limit span { font-size: var(--small); color: var(--muted); }

/* abecední seznam, obce */
.az { display: flex; flex-wrap: wrap; gap: 6px; }
.az a { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; padding: 0 8px; background: var(--surface); border: 2px solid var(--line); border-radius: 10px; font-weight: 700; text-decoration: none; }
.azlist, .citylist { display: grid; }
@media (min-width: 640px) { .azlist, .citylist { grid-template-columns: 1fr 1fr; column-gap: 24px; } }
.azlist a, .citylist a { display: flex; flex-wrap: wrap; align-items: baseline; align-content: center; gap: 0 10px; min-height: 52px; padding: 8px 2px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.azlist b, .citylist b { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.azlist span, .citylist span { font-size: var(--small); color: var(--muted); }

/* formuláře */
.field { display: grid; gap: 6px; }
.field label, fieldset.field legend { font-weight: 700; }
fieldset.field { border: 0; padding: 0; margin: 0; min-width: 0; }
fieldset.field legend { padding: 0; margin-bottom: 4px; }
select, input[type="number"], input[type="email"], input[type="text"], textarea {
  width: 100%; min-width: 0; min-height: 52px; padding: 10px 12px; border: 2px solid var(--edge); border-radius: 10px; background: var(--surface); color: var(--ink); font: inherit; }
textarea { resize: vertical; }
select:focus, input:focus, textarea:focus { border-color: var(--accent); }
.checks { display: grid; }
.checks.row { display: flex; flex-wrap: wrap; gap: 0 24px; }
.checks label { display: flex; gap: 12px; align-items: center; min-height: 48px; }
.checks input, .consent input { width: 24px; height: 24px; flex: 0 0 auto; accent-color: var(--accent); }
.consent { display: flex; gap: 12px; align-items: flex-start; font-size: var(--small); }
.consent.big { align-items: center; min-height: 48px; font-size: 1rem; font-weight: 700; }
.formmsg { font-size: var(--small); color: var(--ok); font-weight: 700; }
.watch { display: grid; gap: 12px; }
.watch form, .contact, .addpost form { display: grid; gap: 12px; }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.callout { background: var(--warn-soft); border-left: 6px solid var(--warn); border-radius: 0 12px 12px 0; padding: 12px 14px; }
.callout.sample { display: grid; gap: 10px; background: var(--accent-soft); border-left-color: var(--accent); }
.empty-box { display: grid; gap: 12px; padding: 16px; border: 2px dashed var(--edge); border-radius: 14px; color: var(--muted); }

/* kalkulačka a účtenka */
.calc { display: grid; gap: 18px; align-items: start; }
@media (min-width: 700px) { .calc { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.calc form { display: grid; gap: 14px; }
.dose { display: flex; gap: 8px; align-items: center; }
.dose input { max-width: 6em; text-align: center; }
.dose button { width: 52px; height: 52px; flex: 0 0 auto; border: 2px solid var(--edge); border-radius: 10px; background: var(--surface); color: var(--ink); font: 700 1.4rem/1 var(--font); cursor: pointer; }
.dose button:hover { border-color: var(--accent); color: var(--accent); }
.receipt { background: var(--surface); border: 2px solid var(--line); border-radius: 16px; padding: 16px 18px 18px; font-variant-numeric: tabular-nums; min-width: 0; }
.rh { text-align: center; text-transform: uppercase; letter-spacing: .06em; font-size: var(--small); color: var(--muted); padding-bottom: 10px; border-bottom: 2px dashed var(--line); }
.rname { font-size: var(--h3); font-weight: 700; text-align: center; padding: 10px 0 2px; }
.rsub { text-align: center; color: var(--muted); font-size: var(--small); padding-bottom: 10px; border-bottom: 2px dashed var(--line); }
.rl { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; }
.rl span:first-child { color: var(--muted); min-width: 0; }
.rl span:last-child { text-align: right; white-space: nowrap; font-weight: 700; }
.rl.stack { flex-direction: column; gap: 2px; }
.rl.stack span:last-child { text-align: left; white-space: normal; }
.rl.sep { border-top: 2px dashed var(--line); margin-top: 6px; padding-top: 12px; }
.rtotal { display: grid; gap: 2px; text-align: center; padding-top: 14px; margin-top: 8px; border-top: 3px solid var(--ink); }
.rtotal small { text-transform: uppercase; letter-spacing: .06em; font-size: var(--small); color: var(--muted); }
.rtotal strong { font-size: clamp(2rem, 9vw, 2.6rem); color: var(--ok); line-height: 1.1; }
.rtotal.zero strong { color: var(--ink); font-size: var(--h2); }
.rnote { margin-top: 12px; font-size: var(--small); color: var(--muted); }
.rnote.warn { color: var(--warn); font-weight: 700; }

/* příspěvky */
.tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.tab { min-height: 48px; padding: 6px 16px; border: 2px solid var(--edge); border-radius: 999px; background: var(--surface); color: var(--ink); font: 700 var(--small)/1.2 var(--font); cursor: pointer; }
.tab[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.posts { display: grid; gap: 10px; }
.post { display: grid; gap: 6px; padding: 14px 16px; background: var(--surface); border: 2px solid var(--line); border-radius: 14px; }
.p-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: var(--small); color: var(--muted); }
.p-fact { font-weight: 700; }
.p-ans { display: grid; gap: 4px; margin-top: 4px; padding-left: 12px; border-left: 4px solid var(--accent); }
.addpost { display: grid; gap: 12px; }
.addpost > summary { list-style: none; display: inline-flex; }
.addpost > summary::-webkit-details-marker { display: none; }
.addpost form { margin-top: 12px; padding: 16px; background: var(--surface); border: 2px solid var(--line); border-radius: 14px; }
.pf-group { display: grid; gap: 12px; }
.rules { font-size: var(--small); color: var(--muted); }
.rules b { color: var(--ink); }

/* průvodci a textové stránky */
.prose { gap: 12px; }
.prose ul { margin: 0; padding-left: 1.2em; display: grid; gap: 8px; }
.steps { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; counter-reset: s; }
.steps li { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr); gap: 12px; counter-increment: s; }
.steps li::before { content: counter(s); display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-weight: 700; font-size: var(--h3); }
.steps h3 { margin-bottom: 4px; }
.src { font-size: var(--small); }
.prose ul.src { list-style: none; padding: 0; gap: 0; }
.src a { display: inline-flex; align-items: center; min-height: 48px; }
.sys { padding-block: 24px; }

/* graf vývoje doplatku */
.legend { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: var(--small); color: var(--muted); }
.legend span { display: inline-flex; align-items: center; gap: 8px; }
.legend i { display: inline-block; width: 22px; height: 4px; border-radius: 2px; }
.legend .k1 { background: var(--s1); } .legend .k2 { background: var(--s2); }
.chartbox { position: relative; max-width: 440px; background: var(--surface); border: 2px solid var(--line); border-radius: 14px; padding: 8px 6px 2px; }
svg.hist { display: block; width: 100%; height: auto; overflow: visible; }
svg.hist .grid { stroke: var(--line); stroke-width: 1; }
svg.hist .ax { fill: var(--muted); font-size: 16px; font-family: var(--font); }
svg.hist .lbl { fill: var(--ink); font-size: 16px; font-weight: 700; font-family: var(--font); }
svg.hist path { fill: none; stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
svg.hist path.s1 { stroke: var(--s1); } svg.hist path.s2 { stroke: var(--s2); }
svg.hist circle { stroke: var(--surface); stroke-width: 2; }
svg.hist .m1 { fill: var(--s1); } svg.hist .m2 { fill: var(--s2); }
svg.hist .hit { fill: transparent; cursor: crosshair; }
svg.hist .cross { stroke: var(--muted); stroke-width: 1; }
.tip { position: absolute; top: 8px; z-index: 2; display: grid; gap: 2px; padding: 8px 12px; border-radius: 10px; background: var(--ink); color: var(--bg); font-size: var(--small); white-space: nowrap; pointer-events: none; }
.tip i { display: inline-block; width: 12px; height: 4px; border-radius: 2px; margin-right: 6px; vertical-align: middle; }
table { border-collapse: collapse; width: 100%; }
th, td { padding: 9px 8px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
th { font-size: var(--small); color: var(--muted); font-weight: 700; }
tr:last-child td { border-bottom: 0; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.small { font-size: var(--small); }

/* Moje léky */
.mine { display: grid; gap: 12px; }
.mine-it { display: grid; gap: 10px; min-width: 0; padding: 14px 16px; background: var(--surface); border: 2px solid var(--line); border-radius: 16px; }
.mi-top { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.mi-top h3 { font-size: 1.25rem; }
.mi-top h3 a { display: inline-flex; align-items: center; min-height: 48px; }
.mi-latka { font-size: var(--small); color: var(--muted); margin-top: -10px; }
.linkish { min-height: 48px; padding: 0 6px; background: none; border: 0; color: var(--crit); font: 700 var(--small)/1.2 var(--font); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.mi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mi-grid .field:first-child { grid-column: 1 / -1; }
.mi-grid label { font-size: var(--small); }
.mi-sum b { font-variant-numeric: tabular-nums; }
.mi-save b { color: var(--ok); }
.mi-warn { color: var(--warn); font-size: var(--small); font-weight: 700; }
.mi-left { font-size: var(--small); color: var(--muted); }
.mi-left.soon { color: var(--warn); font-weight: 700; }
.mine-add { display: grid; gap: 8px; border-style: dashed; border-color: var(--edge); }
.limitbox { display: grid; gap: 10px; align-content: start; }
.lim-big { font-size: var(--lead); }
.lim-big b { color: var(--accent); }
.plan-name { max-width: 340px; }
.plan { background: var(--surface); border: 2px solid var(--line); border-radius: 14px; padding: 14px; }
.plan-head { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; margin-bottom: 8px; }
.plan-head b { font-size: var(--h3); }
.plan-t td.num { text-align: center; }
.plan-t td:last-child { width: 38%; }
.plan-t input { min-height: 48px; padding: 6px 8px; }

/* lékárny */
.pharms { display: grid; gap: 10px; }
.pharm { display: grid; gap: 6px; padding: 14px 16px 6px; background: var(--surface); border: 2px solid var(--line); border-radius: 14px; }
.ph-top { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.ph-st { display: flex; align-items: center; gap: 10px; font-weight: 700; }
.pharm .dot { background: var(--edge); }
.pharm.is-open .dot { background: var(--ok); }
.pharm.is-open .ph-st { color: var(--ok); }
.pharm.closing .dot { background: var(--warn); }
.pharm.closing .ph-st { color: var(--warn); }
.ph-adr { color: var(--muted); }
.ph-akce { display: flex; flex-wrap: wrap; gap: 8px; }
.tel { display: inline-flex; align-items: center; min-height: 48px; padding: 6px 16px; background: var(--surface); border: 2px solid var(--accent); border-radius: 999px; font-weight: 700; text-decoration: none; }
.hours { width: auto; }
.hours th, .hours td { padding: 4px 16px 4px 0; border: 0; font-size: var(--small); color: var(--ink); }

/* patička */
.site-foot { display: grid; gap: 10px; margin-top: 48px; padding-top: 18px; border-top: 2px solid var(--line); font-size: var(--small); color: var(--muted); }
.f-rada { color: var(--ink); }
.f-odkazy { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 22px; }
.f-odkazy a { display: inline-flex; align-items: center; min-height: 48px; font-weight: 700; }

/* spodní lišta na stránce léku (jen mobil); stránka má dole místo, aby lišta nic nezakryla */
.lista { display: none; }
@media (max-width: 760px) {
  .lista { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
    background: var(--surface); border-top: 2px solid var(--line); padding-bottom: env(safe-area-inset-bottom, 0px); }
  .lista a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 60px; padding: 4px 2px;
    color: var(--ink); font-size: var(--small); font-weight: 700; line-height: 1.2; text-decoration: none; }
  .lista a:focus-visible { outline-offset: -3px; }
  .lista .ic { width: 22px; height: 22px; }
  body.s-listou { padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
  html { scroll-padding-bottom: 76px; }
}

@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

@media print {
  .site nav, .textsize, .lista, .skip, .site-foot .f-odkazy { display: none !important; }
  body { background: #fff; padding-bottom: 0 !important; }
  body.printing-plan * { visibility: hidden !important; }
  body.printing-plan #plan, body.printing-plan #plan * { visibility: visible !important; }
  body.printing-plan #plan { position: absolute; left: 0; top: 0; width: 100%; border: 0; }
  body.printing-plan #plan input { border: 0; }
}
