/* Jednotný vzhled oken po jednom (22. 10. 2026): ostré lemování 1 px, zaoblení 6 px a pastelové barvy jako dlaždice na úvodní obrazovce.
   Každé okno má vlastní blok podle ID, ať se zásah nedotkne ostatních oken. */

/* ── Poznámky (#notes-overlay): záložky Poznámky / Čekací listina / Kontakty ── */
html.compact-preview #notes-overlay .modal { border: 1px solid var(--ak-line) !important; border-radius: 6px !important; box-shadow: none !important; }
html.compact-preview #notes-overlay .modal .btn { font-family: inherit !important; border: 1px solid currentColor !important; border-radius: 6px !important; box-shadow: none !important; }
html.compact-preview #notes-overlay .note-item { border: 1px solid var(--ak-line) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface, #fff) !important; }
html.compact-preview #notes-overlay :is(#notes-tab-btn,#wl-tab-btn,#contacts-tab-btn) { min-height: 44px; font-weight: 700; }
html.compact-preview #notes-overlay #notes-tab-btn { background: var(--ak-qr-bg) !important; color: var(--ak-qr-fg) !important; }
html.compact-preview #notes-overlay #wl-tab-btn { background: var(--ak-health-bg) !important; color: var(--ak-health-fg) !important; }
html.compact-preview #notes-overlay #contacts-tab-btn { background: var(--ak-reminders-bg) !important; color: var(--ak-reminders-fg) !important; }
html.compact-preview #notes-overlay :is(#notes-tab-btn,#wl-tab-btn,#contacts-tab-btn).btn-primary { background: color-mix(in srgb, currentColor 12%, var(--ak-qr-bg)) !important; font-weight: 800; }
html.compact-preview #notes-overlay #notes-tab-content > .btn-primary { background: var(--ak-edit-bg) !important; color: var(--ak-edit-fg) !important; min-height: 44px; }
html.compact-preview #notes-overlay .modal-footer .btn { width: 100%; min-height: 44px; background: var(--ak-qr-bg) !important; color: var(--ak-qr-fg) !important; }
html.compact-preview #notes-overlay .modal :is(input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea) { border: 1px solid var(--ak-line) !important; border-radius: 6px !important; box-shadow: none !important; }

/* ── Rezervace (#reserved-list-modal): vystředěné okno, symetrické dlaždice ── */
html.compact-preview #reserved-list-modal { align-items: center !important; }
html.compact-preview #reserved-list-modal > div { border: 1px solid var(--ak-line) !important; border-radius: 6px !important; max-width: 560px !important; box-shadow: none !important; }
html.compact-preview #reserved-list-modal > div > div:first-child { display: flex; justify-content: center; background: var(--ak-reminders-bg); border-bottom: 1px solid var(--ak-reminders-fg) !important; padding: 14px 20px !important; border-radius: 0 !important; }
html.compact-preview #reserved-list-modal .rl-t { position: relative; color: var(--ak-reminders-fg) !important; }
html.compact-preview #reserved-list-modal .rl-t .rl-i { position: absolute; right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
html.compact-preview #reserved-list-modal .rl-t .rl-n { position: absolute; left: calc(100% + 6px); top: 50%; transform: translateY(-50%); font-size: 13px; font-weight: 700; border: 1px solid var(--ak-reminders-fg); border-radius: 6px; padding: 1px 7px; background: #fff; }
html.compact-preview #reserved-list-modal .rl-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px 0 4px; }
@media (max-width: 600px) { html.compact-preview #reserved-list-modal .rl-grid { grid-template-columns: 1fr; } }
html.compact-preview #reserved-list-modal .rl-item { border: 1px solid var(--ak-line); border-radius: 6px; padding: 12px; text-align: center; background: var(--surface, #fff); min-height: 44px; }
html.compact-preview #reserved-list-modal .rl-nm { position: relative; display: inline-block; font-weight: 800; font-size: 15px; }
html.compact-preview #reserved-list-modal .rl-nm .rl-ic { position: absolute; right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
html.compact-preview #reserved-list-modal .rl-nm .rl-dot { position: absolute; left: calc(100% + 6px); top: 50%; transform: translateY(-50%); width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--ak-line); }
html.compact-preview #reserved-list-modal .rl-sub { font-size: 12px; color: var(--text2); margin-top: 2px; }
html.compact-preview #reserved-list-modal > div > div:last-child { padding: 12px 20px !important; }
html.compact-preview #reserved-list-modal .btn { width: 100%; min-height: 44px; font-family: inherit !important; border: 1px solid currentColor !important; border-radius: 6px !important; background: var(--ak-qr-bg) !important; color: var(--ak-qr-fg) !important; box-shadow: none !important; }

/* ── Krytí a reprodukce (#mating-overview-overlay): symetrické, text vždy uprostřed, ikonky visí vedle textu ── */
html.compact-preview #mating-overview-overlay > div { border: 1px solid var(--ak-line) !important; border-radius: 6px !important; box-shadow: none !important; }
html.compact-preview #mating-overview-overlay :is([style*="border-radius:5px"],[style*="border-radius: 5px"],[style*="border-radius:8px"],[style*="border-radius: 8px"],[style*="border-radius:10px"],[style*="border-radius: 10px"],[style*="border-radius:12px"],[style*="border-radius: 12px"],[style*="border-radius:14px"],[style*="border-radius: 14px"],[style*="border-radius:16px"],[style*="border-radius: 16px"]) { border-radius: 6px !important; }
html.compact-preview #mating-overview-overlay [style*="box-shadow"] { box-shadow: none !important; }
html.compact-preview #mating-overview-overlay .btn { font-family: inherit !important; }
html.compact-preview #mating-overview-overlay #mating-overview-content :is([style*="padding:14px"],[style*="padding:10px 14px"])[style*="border-radius"] { border: 1px solid var(--ak-line) !important; }
/* záhlaví: nadpis uprostřed, logo vlevo a křížek vpravo zrcadlově */
html.compact-preview #mating-overview-overlay > div > div:first-child { position: relative; justify-content: center !important; text-align: center; min-height: 56px; }
html.compact-preview #mating-overview-overlay > div > div:first-child > div:first-child { position: static; justify-content: center; flex: 0 1 auto !important; }
html.compact-preview #mating-overview-overlay > div > div:first-child > div:first-child > div:first-child { position: absolute; left: 16px; top: 10px; }
html.compact-preview #mating-overview-overlay > div > div:first-child > button { position: absolute; right: 16px; top: 12px; border: 1px solid var(--ak-line) !important; }
/* tři stejné záložky v pastelových barvách; ikonka vlevo a počet vpravo od textu, text přesně uprostřed */
html.compact-preview #mating-overview-overlay > div > div:nth-child(2) { padding: 10px 16px !important; }
html.compact-preview #mating-overview-overlay > div > div:nth-child(2) > div { background: none !important; border: 0 !important; padding: 0 !important; gap: 6px !important; }
html.compact-preview #mating-overview-overlay :is(#tab-btn-pregnancy,#tab-btn-plans,#tab-btn-test) { display: grid !important; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 5px; min-height: 44px; padding: 6px 4px !important; border: 1px solid currentColor !important; border-radius: 6px !important; box-shadow: none !important; background-image: none !important; font-weight: 700 !important; }
html.compact-preview #mating-overview-overlay :is(#tab-btn-pregnancy,#tab-btn-plans,#tab-btn-test) > span:nth-child(1) { justify-self: end; }
html.compact-preview #mating-overview-overlay :is(#tab-btn-pregnancy,#tab-btn-plans,#tab-btn-test) > span:nth-child(2) { justify-self: center; text-align: center; }
html.compact-preview #mating-overview-overlay :is(#tab-btn-pregnancy,#tab-btn-plans,#tab-btn-test) > span:nth-child(3) { justify-self: start; }
html.compact-preview #mating-overview-overlay #tab-btn-pregnancy { background: var(--ak-mating-bg, var(--ak-reminders-bg)) !important; color: var(--ak-mating-fg, var(--ak-reminders-fg)) !important; }
html.compact-preview #mating-overview-overlay #tab-btn-plans { background: var(--ak-health-bg) !important; color: var(--ak-health-fg) !important; }
html.compact-preview #mating-overview-overlay #tab-btn-test { background: var(--ak-qr-bg) !important; color: var(--ak-qr-fg) !important; }
html.compact-preview #mating-overview-overlay :is(#tab-badge-preg,#tab-badge-plans,#tab-badge-test) { background: #fff !important; color: currentColor !important; border: 1px solid currentColor; }
/* nadpisy sekcí (Aktivní březost, Poslední krytí): ikonka vlevo, text uprostřed, počet vpravo */
html.compact-preview #mating-overview-overlay .mo-h { display: grid !important; grid-template-columns: 1fr auto 1fr; column-gap: 6px; width: 100%; }
html.compact-preview #mating-overview-overlay .mo-h > span:nth-child(1) { justify-self: end; }
html.compact-preview #mating-overview-overlay .mo-h > span:nth-child(3) { justify-self: start; }
html.compact-preview #mating-overview-overlay #mating-overview-content > div:has(> .mo-h) { justify-content: center !important; }
html.compact-preview #mating-overview-overlay :is(#mating-overview-content > div[style*="text-transform:uppercase"]) { display: grid; grid-template-columns: 1fr auto 1fr; column-gap: 6px; }
html.compact-preview #mating-overview-overlay #mating-overview-content > div[style*="text-transform:uppercase"] > .mo-ic { justify-self: end; }
html.compact-preview #mating-overview-overlay #mating-overview-content > div[style*="text-transform:uppercase"] > .mo-tx { justify-self: center; text-align: center; }
/* karta březosti: název uprostřed (ikonka vlevo), tři stejná tlačítka (ikonka vlevo od textu), pod sebou datum uprostřed */
html.compact-preview #mating-overview-overlay .mo-nm { position: relative; display: inline-block; }
html.compact-preview #mating-overview-overlay .mo-nm > .mo-ic { position: absolute; right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
html.compact-preview #mating-overview-overlay #mating-overview-content [style*="padding:14px"][style*="border-radius"] > div:first-child { flex-direction: column; justify-content: center !important; align-items: center; text-align: center; }
html.compact-preview #mating-overview-overlay #mating-overview-content [style*="padding:14px"][style*="border-radius"] > div:last-child { flex-direction: column !important; align-items: stretch !important; text-align: center; }
html.compact-preview #mating-overview-overlay #mating-overview-content [style*="padding:14px"][style*="border-radius"] > div:last-child > div { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px !important; }
html.compact-preview #mating-overview-overlay #mating-overview-content [style*="padding:14px"][style*="border-radius"] > div:last-child > div > .btn { min-height: 40px; border: 1px solid currentColor !important; background-image: none !important; box-shadow: none !important; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 5px; padding: 6px 4px !important; }
html.compact-preview #mating-overview-overlay .btn > .mo-ic { justify-self: end; }
html.compact-preview #mating-overview-overlay .btn > .mo-tx { justify-self: center; text-align: center; }
html.compact-preview #mating-overview-overlay #mating-overview-content .btn[style*="#10b981"] { background: var(--ak-health-bg) !important; color: var(--ak-health-fg) !important; }
/* spodní lišta: Hotovo přes celou šířku */
html.compact-preview #mating-overview-overlay > div > .modal-footer { justify-content: center !important; }
html.compact-preview #mating-overview-overlay > div > .modal-footer .btn { width: 100%; min-height: 44px; background: var(--ak-qr-bg) !important; color: var(--ak-qr-fg) !important; border: 1px solid currentColor !important; }
/* karta plánu a historie: tři stejná tlačítka, řádky historie vystředěné, popelnice uprostřed */
html.compact-preview #mating-overview-overlay #mating-overview-content div[style*="display:flex;gap:8px;margin-top:2px"] { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.compact-preview #mating-overview-overlay #mating-overview-content div[style*="display:flex;gap:8px;margin-top:2px"] > .btn { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 5px; min-height: 40px; padding: 6px 4px !important; border: 1px solid currentColor !important; }
html.compact-preview #mating-overview-overlay #mating-overview-content [style*="padding:14px"][style*="border-radius"] > div:last-child > div > .btn-danger { display: flex; justify-content: center; align-items: center; }
html.compact-preview #mating-overview-overlay #mating-overview-content div[style*="padding:10px 14px"][style*="border-radius"] { flex-direction: column; justify-content: center !important; align-items: center !important; text-align: center; }

/* ── Nový zdravotní záznam (#health-form-modal): nové rozložení má vlastní šířku (přebíjí pravidlo 480 px ze style.css) ── */
html.compact-preview #health-form-modal > .hf-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { html.compact-preview #health-form-modal > .hf-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }

/* ── Přidat krytí (#mating-form-overlay): nové rozložení má vlastní šířku (přebíjí starší pravidla oken) ── */
html.compact-preview #mating-form-overlay > .mf-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { html.compact-preview #mating-form-overlay > .mf-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }

/* ── Záznamy krytí (#mating-overlay): nové rozložení má vlastní šířku (přebíjí starší pravidla oken) ── */
html.compact-preview #mating-overlay > .ml-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { html.compact-preview #mating-overlay > .ml-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }

/* ── Odhad příštího cyklu (#cycle-predictor-overlay): nové rozložení má vlastní šířku (přebíjí starší pravidla oken) ── */
html.compact-preview #cycle-predictor-overlay > .cp-win, #cycle-predictor-overlay > .cp-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #cycle-predictor-overlay > .cp-win, html.compact-preview #cycle-predictor-overlay > .cp-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }

/* ── Hromadné přidání koťat (#bulk-pup-overlay): nové rozložení má vlastní šířku (přebíjí starší pravidla oken) ── */
html.compact-preview #bulk-pup-overlay > .bk-win, #bulk-pup-overlay > .bk-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #bulk-pup-overlay > .bk-win, html.compact-preview #bulk-pup-overlay > .bk-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }

/* ── Dohoda o krytí (#stud-agreement-overlay): nové rozložení má vlastní šířku (přebíjí starší pravidla oken) ── */
html.compact-preview #stud-agreement-overlay > .sa-win, #stud-agreement-overlay > .sa-win { width: 100% !important; max-width: 1280px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #stud-agreement-overlay > .sa-win, html.compact-preview #stud-agreement-overlay > .sa-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } html body #stud-agreement-overlay { padding: 6px !important; } html body #stud-agreement-overlay .sa-grid > .sa-ct:last-child:nth-child(odd) { grid-column: 1 / -1; } }

/* ── Přidat připomenutí (#reminder-form-modal): nové rozložení má vlastní šířku (přebíjí starší pravidla oken) ── */
html.compact-preview #reminder-form-modal > .rm-win, #reminder-form-modal > .rm-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #reminder-form-modal > .rm-win, html.compact-preview #reminder-form-modal > .rm-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }

/* ── Vrh (#litter-overlay): nové rozložení, schválený návrh 1 (22. 10. 2026) ── */
#litter-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --p-bg:#fdeaf0; --p-fg:#a02a5c; --o-bg:#ffe9d9; --o-fg:#9a4514; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #litter-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --p-bg:#3d1a2a; --p-fg:#f6b5cf; --o-bg:#40231a; --o-fg:#f0b48a; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
#litter-overlay .lt-win { width:100%; max-width:1320px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); box-sizing:border-box; }
#litter-overlay .lt-win * { box-sizing:border-box; }
#litter-overlay .lt-hd { position:relative; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); flex:0 0 auto; }
#litter-overlay .lt-ti { font-size:22px; font-weight:800; line-height:1.2; }
#litter-overlay .lt-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#litter-overlay .lt-bd { flex:1; min-height:0; display:grid; grid-template-columns:280px minmax(0,1fr); overflow:hidden; }
#litter-overlay .lt-side { padding:20px 24px; border-right:1px solid var(--xs); overflow-y:auto; background:var(--l-bg); }
#litter-overlay .lt-photo { width:100%; aspect-ratio:1; border:1px solid var(--xl); border-radius:6px; background-size:cover; background-position:center; background-color:var(--surface); display:flex; align-items:center; justify-content:center; font-size:48px; }
#litter-overlay .lt-name { font-size:20px; font-weight:800; text-align:center; margin:14px 0 2px; line-height:1.2; word-break:break-word; }
#litter-overlay .lt-age { text-align:center; font-size:13px; color:var(--xm); margin-bottom:14px; min-height:16px; }
#litter-overlay .lt-side > .lt-ct { margin-top:8px; }
#litter-overlay .lt-main { padding:16px 24px; overflow-y:auto; min-width:0; display:flex; flex-direction:column; gap:12px; }
#litter-overlay .lt-panel { padding:14px; border:1px solid var(--l-fg); border-radius:6px; background:var(--l-bg); }
#litter-overlay .lt-panel.g { border-color:var(--g-fg); background:var(--g-bg); }
#litter-overlay .lt-cap { font-size:16px; font-weight:800; text-align:center; margin:0 0 10px; }
#litter-overlay .lt-g2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
#litter-overlay .lt-g3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
#litter-overlay .lt-g4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
#litter-overlay .lt-full { grid-column:1 / -1; }
#litter-overlay .lt-ct { position:relative; border:1px solid; border-radius:6px; min-height:62px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:6px 8px; gap:3px; background:var(--surface); min-width:0; margin:0; }
#litter-overlay .lt-ct small { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; opacity:.9; line-height:1.15; }
#litter-overlay .lt-ct b { font-size:15px; font-weight:700; line-height:1.2; }
#litter-overlay .lt-ct input:not([type=checkbox]), #litter-overlay .lt-ct select, #litter-overlay .lt-ct textarea { display:block; width:100%; min-height:0; height:auto; padding:0; margin:0; border:0 !important; border-radius:0 !important; background:transparent !important; color:inherit; font:inherit; font-size:15px; font-weight:700; line-height:1.25; text-align:center; text-align-last:center; box-shadow:none !important; outline:none; overflow-wrap:anywhere; }
#litter-overlay .lt-ct textarea { resize:none; min-height:56px; text-align:center; font-weight:600; }
#litter-overlay .lt-ct select { appearance:none; -webkit-appearance:none; cursor:pointer; text-overflow:ellipsis; }
#litter-overlay .lt-ct ::placeholder { color:inherit; opacity:.5; font-weight:500; }
#litter-overlay .lt-ct #l-father-manual { margin-top:4px !important; border-top:1px dashed currentColor !important; padding-top:4px; }
#litter-overlay .lt-ct #l-gestation { -moz-appearance:textfield; }
#litter-overlay .lt-g { color:var(--g-fg); border-color:var(--g-fg); } #litter-overlay .lt-b { color:var(--b-fg); border-color:var(--b-fg); } #litter-overlay .lt-y { color:var(--y-fg); border-color:var(--y-fg); }
#litter-overlay .lt-p { color:var(--p-fg); border-color:var(--p-fg); } #litter-overlay .lt-o { color:var(--o-fg); border-color:var(--o-fg); } #litter-overlay .lt-l { color:var(--l-fg); border-color:var(--l-fg); } #litter-overlay .lt-w { color:var(--xi); border-color:var(--xl); }
#litter-overlay .lt-side > .lt-g, #litter-overlay .lt-ct.lt-g.lt-sg { background:var(--g-bg); }
#litter-overlay .lt-clr { position:absolute; right:4px; top:4px; width:28px; height:28px; min-height:0; padding:0; border:0; background:transparent; color:inherit; font-size:15px; opacity:.7; cursor:pointer; box-shadow:none; }
#litter-overlay .lt-clr:not([style*="none"]) { display:block; }
#litter-overlay .lt-bl { margin-top:10px; }
#litter-overlay .lt-note { margin-top:10px; padding:10px 14px; border:1px solid; border-radius:6px; display:flex; flex-direction:column; gap:4px; font-size:12.5px; line-height:1.4; }
#litter-overlay .lt-note b { font-size:13px; }
#litter-overlay .lt-warn { color:var(--p-fg); border-color:var(--p-fg); background:var(--p-bg); } #litter-overlay .lt-safe { color:var(--g-fg); border-color:var(--g-fg); background:var(--surface); }
#litter-overlay .lt-hint { margin-top:8px; font-size:11.5px; color:var(--xm); text-align:center; line-height:1.4; }
#litter-overlay .lt-rhd { display:flex; align-items:center; gap:12px; margin-bottom:8px; }
#litter-overlay #litter-reservations-list { color:var(--xi); }
#litter-overlay #litter-reservations-list > div[style*="border-top"] { border-top-color:var(--xs) !important; }
#litter-overlay .lt-ft { flex:0 0 auto; padding:12px 24px; border-top:1px solid var(--xs); display:flex; justify-content:center; gap:12px; background:var(--surface); }
#litter-overlay .lt-bt { width:210px; min-height:48px; padding:4px 8px; border:1px solid; border-radius:6px; font-family:inherit; font-size:15px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; line-height:1.15; }
#litter-overlay .lt-bt.s { background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)); color:var(--g-fg); border-color:var(--g-fg); font-weight:800; }
#litter-overlay .lt-bt.c { background:var(--b-bg); color:var(--b-fg); border-color:var(--b-fg); }
#litter-overlay .lt-bt.p { background:var(--p-bg); color:var(--p-fg); border-color:var(--p-fg); }
#litter-overlay .lt-bt.g { background:var(--g-bg); color:var(--g-fg); border-color:var(--g-fg); }
@media (max-width:820px) {
  #litter-overlay .lt-win { max-height:98vh; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
  #litter-overlay .lt-hd { padding:12px 60px 10px; }
  #litter-overlay .lt-ti { font-size:18px; }
  #litter-overlay .lt-bd { display:block; overflow-y:auto; }
  #litter-overlay .lt-side { display:grid; grid-template-columns:64px minmax(0,1fr); align-items:center; gap:4px 12px; padding:12px 14px; border-right:0; border-bottom:1px solid var(--xs); overflow:visible; }
  #litter-overlay .lt-photo { width:64px; height:64px; aspect-ratio:auto; font-size:28px; grid-row:1 / 3; }
  #litter-overlay .lt-sidetx { min-width:0; }
  #litter-overlay .lt-name { text-align:left; margin:0 0 2px; font-size:16px; }
  #litter-overlay .lt-age { text-align:left; margin:0; }
  #litter-overlay .lt-side > .lt-ct { display:none; }
  #litter-overlay .lt-main { padding:12px 14px; overflow:visible; }
  #litter-overlay .lt-g2, #litter-overlay .lt-g3, #litter-overlay .lt-g4 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  #litter-overlay .lt-ct input:not([type=checkbox]), #litter-overlay .lt-ct select, #litter-overlay .lt-ct textarea { font-size:14px; }
  #litter-overlay .lt-ft { padding:10px 14px 16px; gap:6px; }
  #litter-overlay .lt-bt { width:auto; flex:1; font-size:13px; }
}
#litter-overlay .lt-sw .lt-val { display:block; width:100%; font-size:15px; font-weight:700; line-height:1.25; text-align:center; overflow-wrap:anywhere; }
#litter-overlay .lt-sw > select { position:absolute; inset:0; width:100% !important; height:100% !important; opacity:0; cursor:pointer; z-index:1; }
#litter-overlay .lt-sw > #l-father-manual { position:relative; z-index:2; }
@media (max-width:820px) { #litter-overlay .lt-sw .lt-val { font-size:14px; } }

/* ── Karta koťátka (#pup-overlay): nové rozložení, schválený návrh 2 (22. 10. 2026) ── */
#pup-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --p-bg:#fdeaf0; --p-fg:#a02a5c; --o-bg:#ffe9d9; --o-fg:#9a4514; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #pup-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --p-bg:#3d1a2a; --p-fg:#f6b5cf; --o-bg:#40231a; --o-fg:#f0b48a; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
#pup-overlay .pt-win { width:100%; max-width:1320px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); box-sizing:border-box; }
#pup-overlay .pt-win * { box-sizing:border-box; }
#pup-overlay .pt-hd { position:relative; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); flex:0 0 auto; }
#pup-overlay .pt-ti { font-size:22px; font-weight:800; line-height:1.2; }
#pup-overlay .pt-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#pup-overlay .pt-bd { flex:1; min-height:0; display:grid; grid-template-columns:280px minmax(0,1fr); overflow:hidden; }
#pup-overlay .pt-side { padding:20px 24px; border-right:1px solid var(--xs); overflow-y:auto; background:var(--l-bg); }
#pup-overlay .pt-side #p-img-preview { width:100% !important; height:auto !important; aspect-ratio:1; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface); display:flex; align-items:center; justify-content:center; font-size:48px; overflow:hidden; cursor:pointer; }
#pup-overlay .pt-side #p-img-preview img { width:100%; height:100%; object-fit:cover; }
#pup-overlay .pt-name { font-size:20px; font-weight:800; text-align:center; margin:14px 0 2px; line-height:1.2; word-break:break-word; }
#pup-overlay .pt-age { text-align:center; font-size:13px; color:var(--xm); margin-bottom:14px; min-height:16px; }
#pup-overlay .pt-side > .pt-ct { margin-top:8px; }
#pup-overlay .pt-main { padding:16px 24px; overflow-y:auto; min-width:0; display:block; max-height:none; }
#pup-overlay .pt-panel { padding:14px; border:1px solid var(--l-fg); border-radius:6px; background:var(--l-bg); margin-bottom:12px; }
#pup-overlay .pt-panel.g { border-color:var(--g-fg); background:var(--g-bg); }
#pup-overlay .pt-cap { font-size:16px; font-weight:800; text-align:center; margin:0 0 10px; }
#pup-overlay .pt-g3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
#pup-overlay .pt-g6 { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
#pup-overlay .pt-full { grid-column:1 / -1; }
#pup-overlay .pt-hide { display:none !important; }
#pup-overlay .pt-ct { position:relative; border:1px solid; border-radius:6px; min-height:62px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:6px 8px; gap:3px; background:var(--surface); min-width:0; margin:0; }
#pup-overlay .pt-ct small { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; opacity:.9; line-height:1.15; margin:0; display:block; }
#pup-overlay .pt-ct b { font-size:15px; font-weight:700; line-height:1.2; overflow-wrap:anywhere; }
#pup-overlay .pt-ct input:not([type=checkbox]):not([type=hidden]), #pup-overlay .pt-ct select { display:block; width:100%; min-height:0; height:auto; padding:0; margin:0; border:0 !important; border-radius:0 !important; background:transparent !important; color:inherit; font:inherit; font-size:15px; font-weight:700; line-height:1.25; text-align:center; text-align-last:center; box-shadow:none !important; outline:none; overflow-wrap:anywhere; }
#pup-overlay .pt-ct ::placeholder { color:inherit; opacity:.5; font-weight:500; }
#pup-overlay .pt-ct #p-father-manual { margin-top:4px !important; border-top:1px dashed currentColor !important; padding-top:4px !important; position:relative; z-index:2; }
#pup-overlay .pt-sw .pt-val { display:block; width:100%; font-size:15px; font-weight:700; line-height:1.25; text-align:center; overflow-wrap:anywhere; }
#pup-overlay .pt-sw > select { position:absolute; inset:0; width:100% !important; height:100% !important; opacity:0; cursor:pointer; z-index:1; }
#pup-overlay .pt-clr { position:absolute; right:4px; top:4px; width:28px; height:28px; min-height:0; padding:0; border:0; background:transparent; color:inherit; font-size:15px; opacity:.7; cursor:pointer; box-shadow:none; }
#pup-overlay .pt-ct:has(.pt-clr) small { padding:0 20px; }
#pup-overlay .pt-cur .cur-dropdown { width:100%; }
#pup-overlay .pt-cur .cur-dropdown-btn { width:100%; min-height:0; padding:0; border:0 !important; background:transparent !important; color:inherit; font-weight:700; font-size:15px; display:flex; justify-content:center; gap:6px; box-shadow:none !important; }
#pup-overlay .pt-g { color:var(--g-fg); border-color:var(--g-fg); } #pup-overlay .pt-b { color:var(--b-fg); border-color:var(--b-fg); } #pup-overlay .pt-y { color:var(--y-fg); border-color:var(--y-fg); }
#pup-overlay .pt-p { color:var(--p-fg); border-color:var(--p-fg); } #pup-overlay .pt-o { color:var(--o-fg); border-color:var(--o-fg); } #pup-overlay .pt-l { color:var(--l-fg); border-color:var(--l-fg); }
#pup-overlay .pt-st { min-height:52px; padding:4px 6px; border:1px solid; border-radius:6px; font-family:inherit; font-size:14px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; line-height:1.15; overflow-wrap:anywhere; }
#pup-overlay .pt-st.pt-g { background:var(--g-bg); } #pup-overlay .pt-st.pt-y { background:var(--y-bg); } #pup-overlay .pt-st.pt-b { background:var(--b-bg); } #pup-overlay .pt-st.pt-p { background:var(--p-bg); } #pup-overlay .pt-st.pt-l { background:var(--l-bg); } #pup-overlay .pt-st.pt-o { background:var(--o-bg); }
#pup-overlay .pt-st.on { background:color-mix(in srgb,currentColor 24%,var(--surface)) !important; font-weight:800; }
#pup-overlay .pt-lbtns { display:flex; gap:10px; margin-top:10px; flex-wrap:wrap; }
#pup-overlay .pt-lbtns .pt-bt { width:auto; min-height:40px; padding:4px 16px; font-size:13px; }
#pup-overlay .pt-ft { flex:0 0 auto; padding:12px 24px; border-top:1px solid var(--xs); display:flex; justify-content:center; gap:12px; background:var(--surface); flex-wrap:wrap; }
#pup-overlay .pt-bt { width:210px; min-height:48px; padding:4px 8px; border:1px solid; border-radius:6px; font-family:inherit; font-size:15px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; line-height:1.15; }
#pup-overlay .pt-ft .pt-bt.l { width:270px; }
#pup-overlay .pt-bt { align-items:center; justify-content:center; }
#pup-overlay .pt-bt.s { background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)); color:var(--g-fg); border-color:var(--g-fg); font-weight:800; }
#pup-overlay .pt-bt.c, #pup-overlay .pt-bt.b { background:var(--b-bg); color:var(--b-fg); border-color:var(--b-fg); }
#pup-overlay .pt-bt.p { background:var(--p-bg); color:var(--p-fg); border-color:var(--p-fg); }
#pup-overlay .pt-bt.l { background:var(--l-bg); color:var(--l-fg); border-color:var(--l-fg); }
#pup-overlay .pt-bt.g { background:var(--g-bg); color:var(--g-fg); border-color:var(--g-fg); }
/* Záložky sekcí (js/pup-tabs.js) — stejný vzhled jako u profilu dospělé kočky */
html.compact-preview #pup-overlay.has-tabs .apple-sec-row { display: none !important; }
html.compact-preview #pup-overlay.has-tabs .apple-sec-group { border: 0 !important; background: none !important; box-shadow: none !important; overflow: visible; }
html.compact-preview #pup-overlay.has-tabs .apple-sec-content { border: 1px solid var(--l-fg); border-radius: 6px; margin-top: 8px; padding: 14px; background: var(--l-bg); }
html.compact-preview #pup-overlay .pup-tabs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; margin: 4px 0 4px; }
html.compact-preview #pup-overlay .pup-tab { grid-column: span 2; position: relative; display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 6px 4px; border: 1px solid var(--ct-fg) !important; border-radius: 6px !important; background: var(--ct-bg) !important; color: var(--ct-fg) !important; font-family: inherit; font-weight: 700; font-size: var(--ct-size, 13px); cursor: pointer; box-shadow: none !important; }
html.compact-preview #pup-overlay .pup-tab.on { background: color-mix(in srgb, var(--ct-fg) 22%, var(--ct-bg)) !important; font-weight: 800; }
html.compact-preview #pup-overlay .pup-tab .ct-tx { position: relative; white-space: nowrap; }
html.compact-preview #pup-overlay .pup-tab .ct-ic { position: absolute; right: calc(100% + 5px); top: 50%; transform: translateY(-50%); font-size: 14px; line-height: 1; }
html.compact-preview #pup-overlay .pup-tab .ct-dot { position: absolute; top: 5px; right: 5px; width: 7px; height: 7px; border-radius: 50%; background: #10b981; display: none; }
/* Pole uvnitř sekcí jako barevné dlaždice (popisek nahoře, hodnota uprostřed) */
#pup-overlay .apple-sec-content > .field, #pup-overlay .apple-sec-content > div > .field { --tf: var(--xl); margin: 0 0 10px; }
#pup-overlay .apple-sec-content .field:nth-child(6n+1) { --tf: var(--g-fg); } #pup-overlay .apple-sec-content .field:nth-child(6n+2) { --tf: var(--b-fg); } #pup-overlay .apple-sec-content .field:nth-child(6n+3) { --tf: var(--y-fg); }
#pup-overlay .apple-sec-content .field:nth-child(6n+4) { --tf: var(--p-fg); } #pup-overlay .apple-sec-content .field:nth-child(6n+5) { --tf: var(--l-fg); } #pup-overlay .apple-sec-content .field:nth-child(6n) { --tf: var(--o-fg); }
#pup-overlay .apple-sec-content .field:has(> input:not([type=checkbox]):not([type=hidden]), > select, > textarea) { border: 1px solid var(--tf); border-radius: 6px; background: var(--surface); padding: 6px 10px; color: var(--tf); }
#pup-overlay .apple-sec-content .field:has(> input:not([type=checkbox]):not([type=hidden]), > select, > textarea) > label { display: block; text-align: center; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--tf); margin: 0 0 3px; }
#pup-overlay .apple-sec-content .field > :is(input:not([type=checkbox]):not([type=hidden]), select, textarea) { width: 100%; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; min-height: 0; text-align: center; font-weight: 700; color: inherit; }
#pup-overlay .apple-sec-content .btn { border: 1px solid currentColor !important; border-radius: 6px !important; box-shadow: none !important; }
html.compact-preview #pup-overlay .apple-sec-content :is(#p-health-records,#p-weights,#p-feedings,#p-attachments):has(button) { border: 1px solid var(--xs); border-radius: 6px; overflow: hidden; background: var(--surface); }
@media (max-width:820px) {
  #pup-overlay .pt-win { max-height:98vh; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
  #pup-overlay .pt-hd { padding:12px 60px 10px; }
  #pup-overlay .pt-ti { font-size:18px; }
  #pup-overlay .pt-bd { display:block; overflow-y:auto; }
  #pup-overlay .pt-side { display:grid; grid-template-columns:64px minmax(0,1fr); align-items:center; gap:4px 12px; padding:12px 14px; border-right:0; border-bottom:1px solid var(--xs); }
  #pup-overlay .pt-side > div:first-child { grid-row:1 / 3; }
  #pup-overlay .pt-side #p-img-preview { width:64px !important; font-size:28px; }
  #pup-overlay .pt-sidetx { min-width:0; }
  #pup-overlay .pt-name { text-align:left; margin:0 0 2px; font-size:16px; }
  #pup-overlay .pt-age { text-align:left; margin:0; }
  #pup-overlay .pt-side > .pt-ct { display:none; }
  #pup-overlay .pt-main { padding:12px 14px; overflow:visible; }
  #pup-overlay .pt-g3 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  #pup-overlay .pt-g6 { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  #pup-overlay .pt-st { min-height:46px; font-size:13px; }
  #pup-overlay .pt-ct input:not([type=checkbox]):not([type=hidden]), #pup-overlay .pt-ct select, #pup-overlay .pt-sw .pt-val { font-size:14px; }
  #pup-overlay .pt-ft { padding:10px 14px 16px; gap:6px; }
  #pup-overlay .pt-bt, #pup-overlay .pt-ft .pt-bt.l { width:auto; flex:1 1 40%; font-size:13px; }
  html.compact-preview #pup-overlay .pup-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width:430px) { #pup-overlay .pt-g6 { grid-template-columns:repeat(2,minmax(0,1fr)); } }
/* Datumová pole v sekcích koťátka jako dlaždice (křížek mazání v rohu) */
#pup-overlay .apple-sec-content .field:has(.date-display) { position: relative; border: 1px solid var(--tf); border-radius: 6px; background: var(--surface); padding: 6px 10px; color: var(--tf); }
#pup-overlay .apple-sec-content .field:has(.date-display) > label { display: block; text-align: center; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--tf); margin: 0 0 3px; padding: 0 22px; }
#pup-overlay .apple-sec-content .field:has(.date-display) > div { display: block !important; }
#pup-overlay .apple-sec-content .field .date-display { display: block; width: 100%; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; min-height: 0; text-align: center; font-weight: 700; color: inherit; }
#pup-overlay .apple-sec-content .field:has(.date-display) > div > button { position: absolute; right: 4px; top: 4px; width: 28px; height: 28px; min-height: 0; padding: 0 !important; border: 0 !important; background: transparent !important; color: inherit !important; opacity: .7; }

/* ── Zdravotní záznam koťátka (#pup-health-form-modal): vlastní šířka (přebíjí starší pravidla oken) ── */
html.compact-preview #pup-health-form-modal > .hf-win, #pup-health-form-modal > .hf-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #pup-health-form-modal > .hf-win, html.compact-preview #pup-health-form-modal > .hf-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; height:98vh; height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }

/* ── Dokrmování koťátka (#pup-feeding-form-modal): vlastní šířka (přebíjí starší pravidla oken) ── */
html.compact-preview #pup-feeding-form-modal > .pf-win, #pup-feeding-form-modal > .pf-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #pup-feeding-form-modal > .pf-win, html.compact-preview #pup-feeding-form-modal > .pf-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }

/* ── Váha (#weight-overlay, sdílené koťátkem i kočkou): nové rozložení, schválený návrh 1 (22. 10. 2026) ── */
#weight-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --p-bg:#fdeaf0; --p-fg:#a02a5c; --o-bg:#ffe9d9; --o-fg:#9a4514; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #weight-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --p-bg:#3d1a2a; --p-fg:#f6b5cf; --o-bg:#40231a; --o-fg:#f0b48a; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
#weight-overlay .wt-win { width:100%; max-width:1140px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); box-sizing:border-box; }
#weight-overlay .wt-win * { box-sizing:border-box; }
#weight-overlay .wt-hd { position:relative; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); flex:0 0 auto; }
#weight-overlay .wt-ti { font-size:22px; font-weight:800; line-height:1.2; }
#weight-overlay .wt-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#weight-overlay .wt-bd { flex:1; min-height:0; display:grid; grid-template-columns:280px minmax(0,1fr); overflow:hidden; }
#weight-overlay .wt-side { padding:20px 24px; border-right:1px solid var(--xs); overflow-y:auto; background:var(--l-bg); }
#weight-overlay .wt-photo { width:100%; aspect-ratio:1; border:1px solid var(--xl); border-radius:6px; background-size:cover; background-position:center; background-color:var(--surface); display:flex; align-items:center; justify-content:center; font-size:48px; }
#weight-overlay .wt-name { font-size:20px; font-weight:800; text-align:center; margin:14px 0 2px; line-height:1.2; word-break:break-word; }
#weight-overlay .wt-age { text-align:center; font-size:13px; color:var(--xm); margin-bottom:14px; min-height:16px; }
#weight-overlay .wt-side > .wt-ct { margin-top:8px; }
#weight-overlay .wt-main { padding:20px 24px; overflow-y:auto; min-width:0; display:flex; flex-direction:column; gap:12px; max-height:none; }
#weight-overlay .wt-panel { padding:16px; border:1px solid var(--l-fg); border-radius:6px; background:var(--l-bg); }
#weight-overlay .wt-panel.g { border-color:var(--g-fg); background:var(--g-bg); }
#weight-overlay .wt-cap { font-size:16px; font-weight:800; text-align:center; margin:0 0 10px; }
#weight-overlay .wt-g2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
#weight-overlay .wt-ct { position:relative; border:1px solid; border-radius:6px; min-height:62px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:6px 8px; gap:3px; background:var(--surface); min-width:0; margin:0; }
#weight-overlay .wt-ct small { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; opacity:.9; line-height:1.15; margin:0; display:block; }
#weight-overlay .wt-ct b { font-size:15px; font-weight:700; line-height:1.2; }
#weight-overlay .wt-ct input { display:block; width:100%; min-height:0; height:auto; padding:0; margin:0; border:0 !important; border-radius:0 !important; background:transparent !important; color:inherit; font:inherit; font-size:15px; font-weight:700; line-height:1.25; text-align:center; box-shadow:none !important; outline:none; overflow-wrap:anywhere; }
#weight-overlay .wt-ct ::placeholder { color:inherit; opacity:.5; font-weight:500; }
#weight-overlay .wt-big { min-height:96px; } #weight-overlay .wt-big input { font-size:32px; font-weight:800; font-family:'Nunito',inherit; }
#weight-overlay .wt-g { color:var(--g-fg); border-color:var(--g-fg); } #weight-overlay .wt-b { color:var(--b-fg); border-color:var(--b-fg); }
#weight-overlay .wt-p { color:var(--p-fg); border-color:var(--p-fg); } #weight-overlay .wt-o { color:var(--o-fg); border-color:var(--o-fg); }
#weight-overlay .wt-clr { position:absolute; right:4px; top:4px; width:28px; height:28px; min-height:0; padding:0; border:0; background:transparent; color:inherit; font-size:15px; opacity:.7; cursor:pointer; box-shadow:none; }
#weight-overlay .wt-ct:has(.wt-clr) small { padding:0 20px; }
#weight-overlay .wt-q { min-height:48px; padding:4px 8px; border:1px solid; border-radius:6px; font-family:inherit; font-size:14px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; line-height:1.15; overflow-wrap:anywhere; }
#weight-overlay .wt-q.y { background:var(--y-bg); color:var(--y-fg); border-color:var(--y-fg); } #weight-overlay .wt-q.l { background:var(--l-bg); color:var(--l-fg); border-color:var(--l-fg); }
#weight-overlay .wt-ft { flex:0 0 auto; padding:12px 24px; border-top:1px solid var(--xs); display:flex; justify-content:center; gap:12px; background:var(--surface); }
#weight-overlay .wt-bt { width:210px; min-height:48px; padding:4px 8px; border:1px solid; border-radius:6px; font-family:inherit; font-size:15px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; line-height:1.15; }
#weight-overlay .wt-bt.s { background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)) !important; color:var(--g-fg) !important; border-color:var(--g-fg) !important; font-weight:800; }
#weight-overlay .wt-bt.c { background:var(--b-bg) !important; color:var(--b-fg) !important; border-color:var(--b-fg) !important; }
@media (max-width:820px) {
  #weight-overlay .wt-win { max-height:98vh; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
  #weight-overlay .wt-hd { padding:12px 60px 10px; }
  #weight-overlay .wt-ti { font-size:18px; }
  #weight-overlay .wt-bd { display:block; overflow-y:auto; }
  #weight-overlay .wt-side { display:grid; grid-template-columns:64px minmax(0,1fr); align-items:center; gap:4px 12px; padding:12px 14px; border-right:0; border-bottom:1px solid var(--xs); overflow:visible; }
  #weight-overlay .wt-photo { width:64px; height:64px; aspect-ratio:auto; font-size:28px; grid-row:1 / 3; }
  #weight-overlay .wt-name { text-align:left; margin:0 0 2px; font-size:16px; }
  #weight-overlay .wt-age { text-align:left; margin:0; }
  #weight-overlay .wt-side > .wt-ct { display:none !important; }
  #weight-overlay .wt-main { padding:12px 14px; overflow:visible; gap:10px; }
  #weight-overlay .wt-g2 { gap:8px; }
  #weight-overlay .wt-big { min-height:84px; }
  #weight-overlay .wt-ft { padding:10px 14px 16px; }
  #weight-overlay .wt-bt { width:auto; flex:1; }
}

/* ── Milníky koťátka (#milestones-modal): vlastní šířka (přebíjí starší pravidla oken) ── */
html.compact-preview #milestones-modal > .ms-win, #milestones-modal > .ms-win { width: 100% !important; max-width: 1140px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #milestones-modal > .ms-win, html.compact-preview #milestones-modal > .ms-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }

/* ── Výstavy koťátka (#pup-shows-modal): vlastní šířka (přebíjí starší pravidla oken) ── */
html.compact-preview #pup-shows-modal > .ps-win, #pup-shows-modal > .ps-win { width: 100% !important; max-width: 1320px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #pup-shows-modal > .ps-win, html.compact-preview #pup-shows-modal > .ps-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }

/* ── Přidat výsledek – výstava koťátka (#pup-show-form-modal): vlastní šířka (přebíjí starší pravidla oken) ── */
html.compact-preview #pup-show-form-modal > .sf-win, #pup-show-form-modal > .sf-win { width: 100% !important; max-width: 1320px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #pup-show-form-modal > .sf-win, html.compact-preview #pup-show-form-modal > .sf-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }

/* ── Výstavy vrhu (#litter-shows-modal): vlastní šířka (přebíjí starší pravidla oken) ── */
html.compact-preview #litter-shows-modal > .ls-win, #litter-shows-modal > .ls-win { width: 100% !important; max-width: 1320px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #litter-shows-modal > .ls-win, html.compact-preview #litter-shows-modal > .ls-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }

/* ── Přidat výsledek – výstava vrhu (#litter-show-form-modal): stejná šířka jako u koťátka ── */
html.compact-preview #litter-show-form-modal > .sf-win, #litter-show-form-modal > .sf-win { width: 100% !important; max-width: 1320px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border: 1px solid var(--xl) !important; border-radius: 6px !important; box-shadow: none !important; background: var(--surface) !important; }
@media (max-width: 820px) { #litter-show-form-modal > .sf-win, html.compact-preview #litter-show-form-modal > .sf-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }

/* ── Společný vzhled formulářových oken (.of-*, pomocník js/okno-form.js): fotka vlevo, podklady, dlaždice ── */
.of-modal { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --p-bg:#fdeaf0; --p-fg:#a02a5c; --o-bg:#ffe9d9; --o-fg:#9a4514; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark .of-modal { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --p-bg:#3d1a2a; --p-fg:#f6b5cf; --o-bg:#40231a; --o-fg:#f0b48a; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
.of-modal .of-win { width:100%; max-width:var(--ofw,1320px); max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); box-sizing:border-box; }
.of-modal .of-win * { box-sizing:border-box; }
.of-modal .of-hd { position:relative; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); flex:0 0 auto; }
.of-modal .of-ti { font-size:22px; font-weight:800; line-height:1.2; }
.of-modal .of-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
.of-modal .of-bd { flex:1; min-height:0; display:grid; grid-template-columns:280px minmax(0,1fr); overflow:hidden; }
.of-modal .of-side { padding:20px 24px; border-right:1px solid var(--xs); overflow-y:auto; background:var(--l-bg); }
.of-modal .of-photo { width:100%; aspect-ratio:1; border:1px solid var(--xl); border-radius:6px; background-size:cover; background-position:center; background-color:var(--surface); display:flex; align-items:center; justify-content:center; font-size:48px; }
.of-modal .of-name { font-size:20px; font-weight:800; text-align:center; margin:14px 0 2px; line-height:1.2; word-break:break-word; }
.of-modal .of-age { text-align:center; font-size:13px; color:var(--xm); margin-bottom:14px; min-height:16px; }
.of-modal .of-side > .of-ct { margin-top:8px; }
.of-modal .of-main { padding:16px 24px; overflow-y:auto; min-width:0; display:flex; flex-direction:column; gap:12px; }
.of-modal .of-panel { padding:14px; border:1px solid var(--l-fg); border-radius:6px; background:var(--l-bg); }
.of-modal .of-panel.g { border-color:var(--g-fg); background:var(--g-bg); }
.of-modal .of-cap { font-size:16px; font-weight:800; text-align:center; margin:0 0 10px; }
.of-modal .of-g2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.of-modal .of-g3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.of-modal .of-g5 { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }
.of-modal .of-gap { margin-top:10px; }
.of-modal .of-ct { position:relative; border:1px solid; border-radius:6px; min-height:62px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:6px 5px; gap:3px; background:var(--surface); min-width:0; margin:0; }
.of-modal .of-ct small { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; opacity:.9; line-height:1.15; margin:0; display:block; }
.of-modal .of-ct b { font-size:15px; font-weight:700; line-height:1.2; overflow-wrap:anywhere; }
.of-modal .of-ct input:not([type=checkbox]):not([type=radio]) { display:block; width:100%; min-height:0; height:auto; padding:0; margin:0; border:0 !important; border-radius:0 !important; background:transparent !important; color:inherit; font:inherit; font-size:15px; font-weight:700; line-height:1.25; text-align:center; box-shadow:none !important; outline:none; overflow-wrap:anywhere; }
.of-modal .of-ct textarea { display:block; width:100%; min-height:0; height:auto; padding:0; margin:0; border:0 !important; border-radius:0 !important; background:transparent !important; color:inherit; font:inherit; font-size:15px; font-weight:700; line-height:1.25; text-align:center; resize:none; overflow:hidden; overflow-wrap:anywhere; box-shadow:none !important; outline:none; }
.of-modal .of-ct ::placeholder { color:inherit; opacity:.5; font-weight:500; }
.of-modal .of-sw .of-val { display:block; width:100%; font-size:15px; font-weight:700; line-height:1.25; text-align:center; overflow-wrap:anywhere; }
.of-modal .of-sw > select { position:absolute; inset:0; width:100% !important; height:100% !important; opacity:0; cursor:pointer; z-index:1; }
.of-modal .of-g { color:var(--g-fg); border-color:var(--g-fg); } .of-modal .of-b { color:var(--b-fg); border-color:var(--b-fg); } .of-modal .of-y { color:var(--y-fg); border-color:var(--y-fg); }
.of-modal .of-p { color:var(--p-fg); border-color:var(--p-fg); } .of-modal .of-o { color:var(--o-fg); border-color:var(--o-fg); } .of-modal .of-l { color:var(--l-fg); border-color:var(--l-fg); } .of-modal .of-w { color:var(--xi); border-color:var(--xl); }
.of-modal .of-clr { position:absolute; right:4px; bottom:4px; width:28px; height:28px; min-height:0; padding:0; border:0; background:transparent; color:inherit; font-size:15px; opacity:.7; cursor:pointer; box-shadow:none; }
.of-modal label.of-tog { cursor:pointer; min-height:52px; }
.of-modal label.of-tog input { position:absolute; opacity:0; pointer-events:none; width:1px; height:1px; }
.of-modal label.of-tog.of-b { background:var(--b-bg); } .of-modal label.of-tog.of-y { background:var(--y-bg); } .of-modal label.of-tog.of-g { background:var(--g-bg); }
.of-modal label.of-tog.of-p { background:var(--p-bg); } .of-modal label.of-tog.of-l { background:var(--l-bg); }
.of-modal label.of-tog:has(input:checked) { background:color-mix(in srgb,currentColor 24%,var(--surface)); }
.of-modal label.of-tog:has(input:checked) b { font-weight:800; }
.of-modal .of-ft { flex:0 0 auto; padding:12px 24px; border-top:1px solid var(--xs); display:flex; justify-content:center; gap:12px; background:var(--surface); }
.of-modal .of-bt { width:210px; min-height:48px; padding:4px 8px; border:1px solid; border-radius:6px; font-family:inherit; font-size:15px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; line-height:1.15; }
.of-modal .of-bt.s { background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)); color:var(--g-fg); border-color:var(--g-fg); font-weight:800; }
/* Kontrast textu hlavního tlačítka (test 25. 10. 2026): ve světlém režimu text o 20 % tmavší (dřív 3,9 : 1, nově 4,9 : 1),
   v tmavém režimu podklad méně namíchaný (dřív 4,49 : 1, nově 5,2 : 1). Podklad ve světlém režimu se nemění. */
html:not(.dark) .of-modal .of-bt.s { color:color-mix(in srgb,var(--g-fg) 80%,#000); }
html.dark .of-modal .of-bt.s { background:color-mix(in srgb,var(--g-fg) 18%,var(--g-bg)); }
.of-modal .of-bt.c { background:var(--b-bg); color:var(--b-fg); border-color:var(--b-fg); }
@media (max-width:820px) {
.of-modal { padding:6px !important; }
.of-modal .of-win { max-height:98vh; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
.of-modal .of-hd { padding:12px 60px 10px; }
.of-modal .of-ti { font-size:18px; }
.of-modal .of-bd { display:block; overflow-y:auto; }
.of-modal .of-side { display:flex; align-items:center; gap:12px; padding:12px 14px; border-right:0; border-bottom:1px solid var(--xs); overflow:visible; }
.of-modal .of-photo { width:64px; height:64px; flex:0 0 64px; aspect-ratio:auto; font-size:28px; }
.of-modal .of-sidetx { flex:1; min-width:0; }
.of-modal .of-name { text-align:left; margin:0 0 2px; font-size:16px; }
.of-modal .of-age { text-align:left; margin:0; }
.of-modal .of-side > .of-ct { display:none; }
.of-modal .of-main { padding:12px 14px; overflow:visible; gap:10px; }
.of-modal .of-g3, .of-modal .of-g2 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.of-modal .of-g5 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.of-modal .of-full { grid-column:1 / -1; }
.of-modal .of-ct input:not([type=checkbox]):not([type=radio]), .of-modal .of-ct textarea, .of-modal .of-sw .of-val { font-size:14px; }
.of-modal .of-ft { padding:10px 14px 16px; }
.of-modal .of-bt { width:auto; flex:1; }
}

.of-modal .of-bd.nos { display:block; overflow-y:auto; }
.of-modal .of-bd.nos .of-main { overflow:visible; }
.of-modal .of-g4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.of-modal .of-g1 { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.of-modal .of-ct small + small { margin-top:-1px; }
.of-modal .of-note { font-size:12px; color:var(--xm); text-align:center; line-height:1.4; margin:2px 0 0; }
.of-modal .of-warn { border:1px solid var(--p-fg); background:var(--p-bg); color:var(--p-fg); border-radius:6px; padding:10px 14px; font-size:13px; font-weight:700; text-align:center; }
.of-modal.of-wrap { position:fixed; inset:0; z-index:2100; display:flex; align-items:center; justify-content:center; background:rgba(24,18,52,.6); padding:12px; }
.of-modal > .of-win, html.compact-preview .of-modal > .of-win { width:100% !important; max-width:var(--ofw,1320px) !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border:1px solid var(--xl) !important; border-radius:6px !important; box-shadow:none !important; background:var(--surface) !important; }
@media (max-width:820px) { .of-modal > .of-win, html.compact-preview .of-modal > .of-win { max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } .of-modal .of-g4 { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.of-modal .of-ct:has(.of-clr) input { padding:0 22px !important; text-overflow:clip; }
.of-modal .of-bt.d { background:var(--p-bg); color:var(--p-fg); border-color:var(--p-fg); }
.of-modal .of-chips { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); gap:6px; margin-top:10px; }
.of-modal .of-chip { min-height:44px; padding:4px 6px; text-align:center; line-height:1.15; overflow-wrap:anywhere; border:1px solid var(--b-fg); border-radius:6px; background:var(--b-bg); color:var(--b-fg); font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; box-shadow:none; }
.of-modal .of-act { display:flex; align-items:center; justify-content:center; width:100%; min-height:52px; padding:4px 10px; margin-top:10px; border:1px solid; border-radius:6px; font-family:inherit; font-size:14px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; line-height:1.2; }
.of-modal .of-act.of-b { background:var(--b-bg); color:var(--b-fg); border-color:var(--b-fg); } .of-modal .of-act.of-g { background:var(--g-bg); color:var(--g-fg); border-color:var(--g-fg); } .of-modal .of-act.of-l { background:var(--l-bg); color:var(--l-fg); border-color:var(--l-fg); } .of-modal .of-act.of-p { background:var(--p-bg); color:var(--p-fg); border-color:var(--p-fg); } .of-modal .of-act.of-y { background:var(--y-bg); color:var(--y-fg); border-color:var(--y-fg); } .of-modal .of-act.of-o { background:var(--o-bg); color:var(--o-fg); border-color:var(--o-fg); }
.of-modal .of-msg { font-size:15px; font-weight:700; line-height:1.4; text-align:center; padding:6px 4px 4px; overflow-wrap:anywhere; }
.of-modal .of-bd.nos .of-main { padding:16px 20px; }
.of-modal .of-g2 > .of-act, .of-modal .of-g3 > .of-act, .of-modal .of-g4 > .of-act { margin-top:0; }
.of-modal .of-sub { display:block; font-size:11px; font-weight:500; line-height:1.25; opacity:.85; text-align:center; overflow-wrap:anywhere; }
.of-modal .of-ct small:empty { display:none; }
/* Úzké telefony (≤ 430 px): menší vnitřní okraje a popisky, aby se vešla i nejdelší německá, švédská a ruská slova */
@media (max-width: 430px) {
.of-modal .of-main { padding:10px 8px !important; }
.of-modal .of-panel { padding:8px; }
.of-modal .of-ct { padding:6px 4px; }
.of-modal .of-ct small { font-size:9.5px; letter-spacing:.2px; }
.of-modal .of-sw .of-val { font-size:13px; }
}

/* PC: levý pruh s fotkou má kolem sebe bílý okraj (stejně jako pravý panel), telefon beze změny */
@media (min-width:821px) {
html body #litter-overlay .lt-side,
html body #pup-overlay .pt-side,
html body #weight-overlay .wt-side,
html body .of-modal .of-side,
html body #litter-shows-modal .ls-side,
html body #litter-show-form-modal .sf-side,
html body #pup-shows-modal .ps-side,
html body #pup-show-form-modal .sf-side,
html body #milestones-modal .ms-side,
html body #pup-feeding-form-modal .pf-side,
html body #stud-agreement-overlay .sa-side,
html body #reminder-form-modal .rm-side,
html body #bulk-pup-overlay .bk-side,
html body #mating-overlay .ml-side,
html body #mating-form-overlay .mf-side,
html body #cycle-predictor-overlay .cp-side,
html body #health-form-modal .hf-side,
html body #pup-health-form-modal .hf-side
{ margin:6px !important; border:1px solid var(--xl) !important; border-radius:6px !important; }
}
/* PC: mezery kolem pruhu a pravého panelu všude 6 px (pruh má margin 6, hlavní část padding 6 bez levého) */
@media (min-width:821px) {
html body #litter-overlay .lt-bd > :not([class$="-side"]),
html body #pup-overlay .pt-bd > :not([class$="-side"]),
html body #weight-overlay .wt-bd > :not([class$="-side"]),
html body .of-modal .of-bd:not(.nos) > :not([class$="-side"]),
html body #health-form-modal .hf-bd > :not([class$="-side"]),
html body #litter-shows-modal .ls-bd2 > :not([class$="-side"]),
html body #litter-show-form-modal .sf-bd > :not([class$="-side"]),
html body #pup-shows-modal .ps-bd2 > :not([class$="-side"]),
html body #pup-show-form-modal .sf-bd > :not([class$="-side"]),
html body #milestones-modal .ms-bd > :not([class$="-side"]),
html body #pup-health-form-modal .hf-bd > :not([class$="-side"]),
html body #pup-feeding-form-modal .pf-bd > :not([class$="-side"]),
html body #reminder-form-modal .rm-bd > :not([class$="-side"]),
html body #bulk-pup-overlay .bk-bd > :not([class$="-side"]),
html body #mating-overlay .ml-bd > :not([class$="-side"]),
html body #mating-form-overlay .mf-bd > :not([class$="-side"]),
html body #cycle-predictor-overlay .cp-bd > :not([class$="-side"]),
html body #stud-agreement-content > :not([class$="-side"])
{ padding:6px 6px 6px 0 !important; }
}
@media (max-width:820px) { .of-modal .of-chips { grid-auto-flow:row; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-columns:auto; } }
/* Stejně velké dlaždice v řadě po --n, nedotažená poslední řada je vystředěná */
.of-modal .of-gc { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.of-modal .of-gc > * { flex:0 0 calc((100% - (var(--n) - 1) * 10px) / var(--n)); min-width:0; }
@media (max-width:820px) { .of-modal .of-gc { gap:8px; --n:2 !important; } .of-modal .of-gc > * { flex-basis:calc((100% - 8px) / 2); } }
/* Dohoda o krytí, PC: dlaždice po čtyřech v řadě, nedotažená poslední řada je vystředěná */
@media (min-width:821px) {
html body #stud-agreement-overlay .sa-grid.c4 { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
html body #stud-agreement-overlay .sa-grid.c4 > * { flex:0 0 calc((100% - 24px) / 4); min-width:0; }
}
/* Telefon: dlaždice ve výběru kočky pod fotkou zůstává vidět (formulář Přidat výstavu) */
@media (max-width:820px) {
.of-modal .of-side:has(> .of-keep) { flex-wrap:wrap; }
.of-modal .of-side > .of-ct.of-keep { display:flex; flex:1 0 100%; margin-top:6px; }
}
/* Podklad pro přihlášku na výstavu: text ke zkopírování */
.of-modal .of-entry-text { display:block; width:100%; min-height:300px; box-sizing:border-box; padding:12px; border:1px solid var(--l-fg); border-radius:6px; background:var(--surface); color:var(--xi); font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12.5px; line-height:1.5; resize:none; }

/* ── Registrace vrhu (#litter-registration-overlay): nové okolí papírového formuláře (25. 10. 2026, návrh 2). Papír uvnitř (#litter-registration-content > div) se nemění, podle něj se dělá PDF a Word. ── */
#litter-registration-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; }
html.dark #litter-registration-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; }
html body #litter-registration-overlay .lr-win { max-width:1180px !important; width:96% !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; }
#litter-registration-overlay .lr-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); background:var(--surface); }
#litter-registration-overlay .lr-hd h2 { margin:0; font-size:22px; font-weight:800; color:var(--xi); line-height:1.2; }
#litter-registration-overlay .lr-sub { margin-top:3px; font-size:11.5px; color:var(--xm); }
#litter-registration-overlay .lr-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#litter-registration-overlay .lr-wrap { flex:1; min-height:0; display:flex; overflow:hidden; }
#litter-registration-overlay .lr-side { flex:0 0 250px; background:var(--l-bg); border-right:1px solid var(--xs); padding:6px; overflow-y:auto; }
#litter-registration-overlay .lr-pc { margin:6px; padding:12px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); text-align:center; }
#litter-registration-overlay .lr-pc small { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--xm); }
#litter-registration-overlay .lr-ph { height:120px; margin-top:6px; border:1px solid var(--xl); border-radius:6px; background-color:var(--l-bg); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; font-size:44px; color:var(--xi); }
#litter-registration-overlay .lr-pc b { display:block; margin-top:8px; font-size:15px; line-height:1.25; color:var(--xi); overflow-wrap:anywhere; }
#litter-registration-overlay .lr-body { flex:1; min-width:0; min-height:0; overflow-y:auto; background:var(--l-bg); padding:6px; }
html body #litter-registration-overlay #litter-registration-content { flex:none; overflow:visible !important; padding:16px !important; border:1px solid var(--xl); border-radius:6px; background:var(--surface) !important; }
#litter-registration-overlay .lr-ft { flex:0 0 auto; display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding:12px 16px; border-top:1px solid var(--xs); background:var(--surface); }
html body #litter-registration-overlay .lr-ft .btn { min-height:48px; min-width:130px; border:1px solid !important; border-radius:6px !important; font-weight:700 !important; box-shadow:none !important; }
html body #litter-registration-overlay .lr-ft .btn-close { background:#e6f0fd !important; color:#1f5fb0 !important; border-color:#1f5fb0 !important; }
html body #litter-registration-overlay .lr-ft .btn:nth-child(2) { background:#fff6d9 !important; color:#7a5a00 !important; border-color:#7a5a00 !important; }
html body #litter-registration-overlay .lr-ft .btn:nth-child(3) { background:var(--l-bg) !important; color:#5b2fb0 !important; border-color:#5b2fb0 !important; }
html body #litter-registration-overlay .lr-ft .btn-primary { background:#b2d6c8 !important; color:#0c5848 !important; border-color:#0f6e5a !important; }
html.dark body #litter-registration-overlay .lr-ft .btn-close { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
html.dark body #litter-registration-overlay .lr-ft .btn:nth-child(2) { background:#3b3210 !important; color:#f0d36a !important; border-color:#f0d36a !important; }
html.dark body #litter-registration-overlay .lr-ft .btn:nth-child(3) { color:#c1a8ff !important; border-color:#c1a8ff !important; }
html.dark body #litter-registration-overlay .lr-ft .btn-primary { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
@media (max-width:820px) {
html body #litter-registration-overlay .lr-win { width:100% !important; max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; }
#litter-registration-overlay .lr-hd { padding:12px 60px 10px; }
#litter-registration-overlay .lr-hd h2 { font-size:18px; }
#litter-registration-overlay .lr-wrap { flex-direction:column; overflow-y:auto; }
#litter-registration-overlay .lr-side { flex:0 0 auto; display:flex; border-right:0; border-bottom:1px solid var(--xs); overflow:visible; }
#litter-registration-overlay .lr-pc { flex:1; min-width:0; margin:3px; padding:8px; }
#litter-registration-overlay .lr-ph { height:44px; font-size:24px; }
#litter-registration-overlay .lr-body { flex:none; overflow:visible; }
html body #litter-registration-overlay .lr-ft .btn { flex:1 1 45%; min-width:0; }
}

/* ── Kupní a Rezervační smlouva: nové okolí papíru (25. 10. 2026, návrh 2). Papír (#…-agreement-content) se nemění, podle něj se dělá PDF a Word. ── */
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; }
html.dark :is(#purchase-agreement-overlay, #reservation-agreement-overlay) { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-win { max-width:1180px !important; width:96% !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 280px 14px; border-bottom:1px solid var(--xs); background:var(--surface); }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-hd h2 { margin:0; font-size:22px; font-weight:800; color:var(--xi); line-height:1.2; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tools { position:absolute; right:14px; top:50%; transform:translateY(-50%); display:flex; gap:8px; }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tpl { min-height:44px; padding:4px 12px; border:1px solid #5b2fb0 !important; border-radius:6px !important; background:var(--l-bg) !important; color:#5b2fb0 !important; font-size:13px !important; font-weight:700 !important; box-shadow:none !important; }
html.dark body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tpl { color:#c1a8ff !important; border-color:#c1a8ff !important; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-x { width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-wrap { flex:1; min-height:0; display:flex; overflow:hidden; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-side { flex:0 0 250px; background:var(--l-bg); border-right:1px solid var(--xs); padding:6px; overflow-y:auto; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-pc { margin:6px; padding:12px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); text-align:center; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-pc small { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--xm); }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ph { height:120px; margin-top:6px; border:1px solid var(--xl); border-radius:6px; background-color:var(--l-bg); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; font-size:44px; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tx b { display:block; margin-top:8px; font-size:15px; line-height:1.25; color:var(--xi); overflow-wrap:anywhere; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tx i { display:block; margin-top:2px; font-style:normal; font-size:12px; color:var(--xm); overflow-wrap:anywhere; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-body { flex:1; min-width:0; min-height:0; overflow-y:auto; background:var(--l-bg); padding:6px; }
html body :is(#purchase-agreement-content, #reservation-agreement-content) { flex:none; overflow:visible !important; padding:16px !important; border:1px solid var(--xl); border-radius:6px; background:var(--surface) !important; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft { flex:0 0 auto; display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding:12px 16px; border-top:1px solid var(--xs); background:var(--surface); }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn { min-height:48px; min-width:130px; border:1px solid !important; border-radius:6px !important; font-weight:700 !important; box-shadow:none !important; }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn-close { background:#e6f0fd !important; color:#1f5fb0 !important; border-color:#1f5fb0 !important; }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn:nth-child(2) { background:#fff6d9 !important; color:#7a5a00 !important; border-color:#7a5a00 !important; }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn:nth-child(3) { background:var(--l-bg) !important; color:#5b2fb0 !important; border-color:#5b2fb0 !important; }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn-primary { background:#b2d6c8 !important; color:#0c5848 !important; border-color:#0f6e5a !important; }
html.dark body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn-close { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
html.dark body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn:nth-child(2) { background:#3b3210 !important; color:#f0d36a !important; border-color:#f0d36a !important; }
html.dark body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn:nth-child(3) { color:#c1a8ff !important; border-color:#c1a8ff !important; }
html.dark body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn-primary { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
@media (max-width:820px) {
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-win { width:100% !important; max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-hd { padding:10px 14px; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-hd h2 { font-size:18px; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tools { position:static; transform:none; justify-content:center; margin-top:8px; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-wrap { flex-direction:column; overflow-y:auto; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-side { flex:0 0 auto; border-right:0; border-bottom:1px solid var(--xs); overflow:visible; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-pc { margin:3px; padding:8px; display:flex; align-items:center; gap:10px; text-align:left; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-pc small { display:none; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ph { height:44px; width:44px; flex:0 0 44px; margin:0; font-size:24px; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tx b { margin-top:0; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-body { flex:none; overflow:visible; }
html body :is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ft .btn { flex:1 1 45%; min-width:0; }
}
/* Šablony smluv: víceřádkové texty zarovnané doleva, popisek uprostřed */
.of-modal .of-ct.of-left { align-items:stretch; }
.of-modal .of-ct.of-left small { text-align:center; margin-bottom:4px; }
.of-modal .of-ct.of-left textarea { text-align:left; font-weight:600; font-size:14px; line-height:1.55; }
@media (max-width:820px) { .of-modal .of-g2.of-stack { grid-template-columns:minmax(0,1fr); } }
/* Zpětná vazba: volba typu jako dvě dlaždice (tlačítka), vybraná se ztmaví; prostřední tlačítko patičky (Obrázek) */
.of-modal button.of-ct.of-tile { cursor:pointer; font-family:inherit; width:100%; }
.of-modal button.of-ct.of-tile.of-y { background:var(--y-bg); }
.of-modal button.of-ct.of-tile.of-p { background:var(--p-bg); }
.of-modal button.of-ct.of-tile.of-on { background:color-mix(in srgb,currentColor 24%,var(--surface)); }
.of-modal button.of-ct.of-tile.of-on b { font-weight:800; }
.of-modal .of-bt.l { background:var(--l-bg); color:var(--l-fg); border-color:var(--l-fg); }
.of-modal #fb-message { min-height:110px; }

/* ── Hodnocení aplikace (#review-prompt-modal): hvězdy jako dlaždice od růžové po zelenou, jednotná tlačítka (25. 10. 2026, návrh 3) ── */
html body #review-prompt-modal > div { border:1px solid #3b2a7a !important; border-radius:6px !important; box-shadow:none !important; }
html.dark body #review-prompt-modal > div { border-color:#8f7fc8 !important; }
html body #review-prompt-modal .rv-x { position:absolute; right:10px; top:10px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid #3b2a7a; border-radius:6px; background:var(--surface,#fff); color:var(--text,#1a1814); font-size:15px; cursor:pointer; touch-action:manipulation; }
html.dark body #review-prompt-modal .rv-x { border-color:#8f7fc8; }
html body #review-prompt-modal #review-stars-row { display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px !important; }
html body #review-prompt-modal .rev-star-btn { filter:none !important; opacity:1 !important; border:1px solid !important; border-radius:6px !important; min-height:64px; font-size:30px !important; padding:0 !important; }
html body #review-prompt-modal .rev-star-btn:nth-child(1) { background:#fdeaf0 !important; border-color:#a02a5c !important; }
html body #review-prompt-modal .rev-star-btn:nth-child(2) { background:#ffe9d9 !important; border-color:#b4531a !important; }
html body #review-prompt-modal .rev-star-btn:nth-child(3) { background:#fff6d9 !important; border-color:#7a5a00 !important; }
html body #review-prompt-modal .rev-star-btn:nth-child(4) { background:#e6f0fd !important; border-color:#1f5fb0 !important; }
html body #review-prompt-modal .rev-star-btn:nth-child(5) { background:#e3f6ef !important; border-color:#0f6e5a !important; }
html.dark body #review-prompt-modal .rev-star-btn:nth-child(1) { background:#3d1a2a !important; border-color:#f2a0c0 !important; }
html.dark body #review-prompt-modal .rev-star-btn:nth-child(2) { background:#40231a !important; border-color:#f0b48a !important; }
html.dark body #review-prompt-modal .rev-star-btn:nth-child(3) { background:#3b3210 !important; border-color:#f0d36a !important; }
html.dark body #review-prompt-modal .rev-star-btn:nth-child(4) { background:#14283f !important; border-color:#8dbcf5 !important; }
html.dark body #review-prompt-modal .rev-star-btn:nth-child(5) { background:#16382f !important; border-color:#86dcc4 !important; }
html body #review-prompt-modal #review-btn-later, html body #review-prompt-modal #review-btn-done, html body #review-prompt-modal #review-low-close { display:flex !important; align-items:center; justify-content:center; width:100%; min-height:48px; margin-top:10px; border:1px solid #1f5fb0 !important; border-radius:6px !important; background:#e6f0fd !important; color:#1f5fb0 !important; font-weight:700 !important; font-size:14px !important; }
html body #review-prompt-modal #review-high-send, html body #review-prompt-modal #review-low-send { min-height:48px; border:1px solid #0f6e5a !important; border-radius:6px !important; background:#b2d6c8 !important; color:#0c5848 !important; font-weight:700 !important; box-shadow:none !important; }
html.dark body #review-prompt-modal #review-btn-later, html.dark body #review-prompt-modal #review-btn-done, html.dark body #review-prompt-modal #review-low-close { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
html.dark body #review-prompt-modal #review-high-send, html.dark body #review-prompt-modal #review-low-send { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
html body #review-prompt-modal textarea { border:1px solid #3b2a7a !important; border-radius:6px !important; min-height:90px; }
html.dark body #review-prompt-modal textarea { border-color:#8f7fc8 !important; }
/* Tlačítko hodnocení v obchodě po 4–5 hvězdách (26. 10. 2026): zlaté jako 3. hvězda, na počítači dvě vedle sebe */
html body #review-prompt-modal #review-store-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(0,1fr)); gap:6px; margin-bottom:12px; }
html body #review-prompt-modal .review-store-btn { display:flex; align-items:center; justify-content:center; text-align:center; min-height:56px; padding:8px 10px; border:1px solid #7a5a00; border-radius:6px; background:#fff6d9; color:#5c4300; font-family:inherit; font-size:15px; font-weight:800; cursor:pointer; touch-action:manipulation; }
html.dark body #review-prompt-modal .review-store-btn { background:#3b3210; border-color:#f0d36a; color:#f0d36a; }

/* ── Kalkulačka dávkování (#dosage-calc-modal): vlevo pacient a výsledek, vpravo předvolby a lék (25. 10. 2026, návrh 1) ── */
.of-modal .dc-win { display:flex; flex-direction:column; overflow:hidden; color:var(--xi); }
.of-modal .dc-sub { margin-top:2px; font-size:12px; color:var(--xm); }
.of-modal .dc-bd { flex:1; min-height:0; display:grid; grid-template-columns:320px minmax(0,1fr); overflow:hidden; }
.of-modal .dc-side { padding:6px; background:var(--l-bg); border-right:1px solid var(--xs); overflow-y:auto; display:flex; flex-direction:column; gap:12px; }
.of-modal .dc-main { padding:12px 16px; overflow-y:auto; min-width:0; display:flex; flex-direction:column; gap:12px; }
.of-modal .dc-chips { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; }
.of-modal .dc-chip { display:inline-flex; align-items:stretch; border:1px solid var(--y-fg); border-radius:6px; background:var(--y-bg); color:var(--y-fg); overflow:hidden; }
.of-modal .dc-chip-load { min-height:44px; padding:4px 12px; border:0; background:transparent; color:inherit; font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; gap:4px; }
.of-modal .dc-chip-del { width:36px; border:0; border-left:1px solid var(--y-fg); background:transparent; color:inherit; font-size:12px; cursor:pointer; }
.of-modal .dc-chip-custom { align-items:center; justify-content:center; min-height:44px; padding:4px 14px; border:1px dashed var(--xl); background:var(--surface); color:var(--xi); font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.of-modal label.of-ct.of-tile, .of-modal button.of-ct.of-tile { cursor:pointer; font-family:inherit; }
.of-modal label.of-ct.of-tile.of-b, .of-modal button.of-ct.of-tile.of-b { background:var(--b-bg); }
.of-modal label.of-ct.of-tile.of-l, .of-modal button.of-ct.of-tile.of-l { background:var(--l-bg); }
.of-modal .dc-on { background:color-mix(in srgb,currentColor 24%,var(--surface)) !important; }
.of-modal .dc-on b { font-weight:800; }
.of-modal .dc-units { gap:8px; }
.of-modal .dc-units .of-tile { min-height:62px; width:100%; }
.of-modal .dc-medrow .of-ct { margin:0; }
.of-modal .dc-res #dcalc-big-result { margin:6px 0; text-align:center; font-size:34px; font-weight:800; line-height:1.15; color:var(--g-fg); overflow-wrap:anywhere; }
.of-modal .dc-res #dcalc-detail-result { margin-bottom:10px; text-align:center; font-size:13px; line-height:1.5; color:var(--xm); overflow-wrap:anywhere; }
.of-modal .dc-res .of-act { margin-top:0; }
.of-modal .dc-par .of-act { margin-top:10px; }
@media (max-width:820px) {
.of-modal .dc-bd { display:flex; flex-direction:column; overflow-y:auto; gap:10px; padding:10px 12px; }
.of-modal .dc-side, .of-modal .dc-main { display:contents; }
.of-modal .dc-pac { order:1; } .of-modal .dc-pre { order:2; } .of-modal .dc-par { order:3; } .of-modal .dc-res { order:4; } .of-modal .dc-main > .of-note { order:5; }
}
.of-modal .dc-medrow .of-clr { width:40px; height:40px; right:2px; top:50%; bottom:auto; transform:translateY(-50%); font-size:18px; opacity:1; }
.of-modal .dc-medrow .of-ct:has(.of-clr) input { padding:0 44px !important; }

/* ── Prodejní kartička / Export (#export-overlay): záhlaví s křížkem, papír na světle fialovém podkladu (25. 10. 2026, návrh 1). Papír (#export-preview) a tisk beze změny. ── */
#export-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; }
html.dark #export-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; }
html body #export-overlay .exp-win { width:96% !important; max-width:1040px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex !important; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; }
#export-overlay .exp-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); background:var(--surface); }
#export-overlay .exp-ti { font-size:22px; font-weight:800; line-height:1.2; color:var(--xi); }
#export-overlay .exp-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
html body #export-overlay .exp-win .modal-body { background:var(--l-bg) !important; padding:6px !important; flex:1; min-height:0; overflow-y:auto !important; }
html body #export-overlay .exp-act { margin-bottom:6px !important; justify-content:center; }
html body #export-overlay .exp-act .btn { min-height:48px; padding:4px 16px; border:1px solid !important; border-radius:6px !important; font-weight:700 !important; box-shadow:none !important; }
html body #export-overlay .exp-act .btn-primary { background:#b2d6c8 !important; color:#0c5848 !important; border-color:#0f6e5a !important; }
html body #export-overlay .exp-act .btn:not(.btn-primary) { background:var(--l-bg) !important; color:#5b2fb0 !important; border-color:#5b2fb0 !important; }
html.dark body #export-overlay .exp-act .btn-primary { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
html.dark body #export-overlay .exp-act .btn:not(.btn-primary) { color:#c1a8ff !important; border-color:#c1a8ff !important; }
html body #export-overlay #export-preview { background:var(--surface); border:1px solid var(--xl); border-radius:6px; padding:16px; }
html body #export-overlay .exp-win .modal-footer { background:var(--surface) !important; border-top:1px solid var(--xs) !important; padding:12px 16px !important; justify-content:center; }
html body #export-overlay .exp-win .modal-footer .btn-close { min-height:48px; min-width:120px; border:1px solid #1f5fb0 !important; border-radius:6px !important; background:#e6f0fd !important; color:#1f5fb0 !important; font-weight:700 !important; }
html.dark body #export-overlay .exp-win .modal-footer .btn-close { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
@media (max-width:820px) {
html body #export-overlay .exp-win { width:100% !important; max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; }
#export-overlay .exp-hd { padding:12px 60px 10px; }
#export-overlay .exp-ti { font-size:18px; }
html body #export-overlay .exp-act .btn { flex:1 1 45%; min-width:0; }
html body #export-overlay #export-preview { padding:12px; }
}
#export-overlay .exp-hd { min-height:72px; display:flex; align-items:center; justify-content:center; box-sizing:border-box; }

/* ── Krycí list SCHK (#mating-cert-schk-overlay): nové okolí papírového formuláře (25. 10. 2026, návrh 2). Papír uvnitř (#mating-cert-schk-content > div) se nemění, podle něj se dělá PDF a Word. ── */
#mating-cert-schk-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; }
html.dark #mating-cert-schk-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; }
html body #mating-cert-schk-overlay .lr-win { max-width:1180px !important; width:96% !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; }
#mating-cert-schk-overlay .lr-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); background:var(--surface); }
#mating-cert-schk-overlay .lr-hd h2 { margin:0; font-size:22px; font-weight:800; color:var(--xi); line-height:1.2; }
#mating-cert-schk-overlay .lr-sub { margin-top:3px; font-size:11.5px; color:var(--xm); }
#mating-cert-schk-overlay .lr-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#mating-cert-schk-overlay .lr-wrap { flex:1; min-height:0; display:flex; overflow:hidden; }
#mating-cert-schk-overlay .lr-side { flex:0 0 250px; background:var(--l-bg); border-right:1px solid var(--xs); padding:6px; overflow-y:auto; }
#mating-cert-schk-overlay .lr-pc { margin:6px; padding:12px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); text-align:center; }
#mating-cert-schk-overlay .lr-pc small { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--xm); }
#mating-cert-schk-overlay .lr-ph { height:120px; margin-top:6px; border:1px solid var(--xl); border-radius:6px; background-color:var(--l-bg); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; font-size:44px; color:var(--xi); }
#mating-cert-schk-overlay .lr-pc b { display:block; margin-top:8px; font-size:15px; line-height:1.25; color:var(--xi); overflow-wrap:anywhere; }
#mating-cert-schk-overlay .lr-body { flex:1; min-width:0; min-height:0; overflow-y:auto; background:var(--l-bg); padding:6px; }
html body #mating-cert-schk-overlay #mating-cert-schk-content { flex:none; overflow:visible !important; padding:16px !important; border:1px solid var(--xl); border-radius:6px; background:var(--surface) !important; }
#mating-cert-schk-overlay .lr-ft { flex:0 0 auto; display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding:12px 16px; border-top:1px solid var(--xs); background:var(--surface); }
html body #mating-cert-schk-overlay .lr-ft .btn { min-height:48px; min-width:130px; border:1px solid !important; border-radius:6px !important; font-weight:700 !important; box-shadow:none !important; }
html body #mating-cert-schk-overlay .lr-ft .btn-close { background:#e6f0fd !important; color:#1f5fb0 !important; border-color:#1f5fb0 !important; }
html body #mating-cert-schk-overlay .lr-ft .btn:nth-child(2) { background:#fff6d9 !important; color:#7a5a00 !important; border-color:#7a5a00 !important; }
html body #mating-cert-schk-overlay .lr-ft .btn:nth-child(3):not(.btn-primary) { background:var(--l-bg) !important; color:#5b2fb0 !important; border-color:#5b2fb0 !important; }
html body #mating-cert-schk-overlay .lr-ft .btn-primary { background:#b2d6c8 !important; color:#0c5848 !important; border-color:#0f6e5a !important; }
html.dark body #mating-cert-schk-overlay .lr-ft .btn-close { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
html.dark body #mating-cert-schk-overlay .lr-ft .btn:nth-child(2) { background:#3b3210 !important; color:#f0d36a !important; border-color:#f0d36a !important; }
html.dark body #mating-cert-schk-overlay .lr-ft .btn:nth-child(3):not(.btn-primary) { color:#c1a8ff !important; border-color:#c1a8ff !important; }
html.dark body #mating-cert-schk-overlay .lr-ft .btn-primary { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
@media (max-width:820px) {
html body #mating-cert-schk-overlay .lr-win { width:100% !important; max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; }
#mating-cert-schk-overlay .lr-hd { padding:12px 60px 10px; }
#mating-cert-schk-overlay .lr-hd h2 { font-size:18px; }
#mating-cert-schk-overlay .lr-wrap { flex-direction:column; overflow-y:auto; }
#mating-cert-schk-overlay .lr-side { flex:0 0 auto; display:flex; border-right:0; border-bottom:1px solid var(--xs); overflow:visible; }
#mating-cert-schk-overlay .lr-pc { flex:1; min-width:0; margin:3px; padding:8px; }
#mating-cert-schk-overlay .lr-ph { height:44px; font-size:24px; }
#mating-cert-schk-overlay .lr-body { flex:none; overflow:visible; }
html body #mating-cert-schk-overlay .lr-ft .btn { flex:1 1 45%; min-width:0; }
}

/* Telefon: panel s rodiči / koťátkem = řádek se čtvercovou fotkou vlevo a jménem vedle (fotka se vejde celá, jméno se zalomí uvnitř dlaždice) */
@media (max-width:820px) {
:is(#litter-registration-overlay, #mating-cert-schk-overlay) .lr-side { flex-direction:column; }
:is(#litter-registration-overlay, #mating-cert-schk-overlay) .lr-pc { display:grid; grid-template-columns:64px minmax(0,1fr); grid-template-rows:auto auto; column-gap:10px; align-items:center; margin:3px; padding:8px; text-align:left; }
:is(#litter-registration-overlay, #mating-cert-schk-overlay) .lr-ph { grid-column:1; grid-row:1 / 3; width:64px; height:64px; margin:0; font-size:28px; }
:is(#litter-registration-overlay, #mating-cert-schk-overlay) .lr-pc small { grid-column:2; grid-row:1; align-self:end; text-align:left; }
:is(#litter-registration-overlay, #mating-cert-schk-overlay) .lr-pc b { grid-column:2; grid-row:2; align-self:start; margin-top:2px; text-align:left; font-size:15px; overflow-wrap:anywhere; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-pc { display:grid; grid-template-columns:64px minmax(0,1fr); grid-template-rows:auto auto; column-gap:10px; align-items:center; margin:3px; padding:8px; text-align:left; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-ph { grid-column:1; grid-row:1 / 3; width:64px; height:64px; flex:none; margin:0; font-size:28px; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-pc small { display:block; grid-column:2; grid-row:1; align-self:end; text-align:left; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tx { grid-column:2; grid-row:2; align-self:start; min-width:0; }
:is(#purchase-agreement-overlay, #reservation-agreement-overlay) .agr-tx b { margin-top:2px; text-align:left; overflow-wrap:anywhere; }
}

/* Dohoda o krytí: fotka kočky čtvercová (dřív široký pruh 1,5 a 1,8, ze kterého by se fotka useknula); na telefonu čtverec vlevo a jméno vedle, stejně jako ostatní okna */
html body #stud-agreement-overlay .sa-ph { aspect-ratio:1 !important; }
@media (max-width:820px) {
html body #stud-agreement-overlay .sa-side { grid-template-columns:minmax(0,1fr) !important; gap:6px !important; }
html body #stud-agreement-overlay .sa-side > div { display:grid; grid-template-columns:64px minmax(0,1fr); grid-template-rows:auto auto; column-gap:10px; align-items:center; min-width:0; border:1px solid var(--xl); border-radius:6px; background:var(--surface); padding:8px; }
html body #stud-agreement-overlay .sa-ph { grid-column:1; grid-row:1 / 3; width:64px !important; height:64px; aspect-ratio:auto !important; font-size:28px; }
html body #stud-agreement-overlay .sa-name { grid-column:2; grid-row:1; align-self:end; margin:0; text-align:left; font-size:15px; overflow-wrap:anywhere; }
html body #stud-agreement-overlay .sa-role { grid-column:2; grid-row:2; align-self:start; margin:2px 0 0; text-align:left; font-size:11px; }
}

/* ── Plán zdraví (#health-plan-overlay): záhlaví s křížkem, seznam na světle fialovém podkladu, položky s pruhem vlevo (25. 10. 2026, návrh 3) ── */
#health-plan-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; }
html.dark #health-plan-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; }
html body #health-plan-overlay .hp-win { width:96% !important; max-width:760px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; }
#health-plan-overlay .hp-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); background:var(--surface); min-height:72px; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; }
#health-plan-overlay .hp-hd h2 { margin:0; font-size:22px; font-weight:800; line-height:1.2; color:var(--xi); }
#health-plan-overlay .hp-sub { margin-top:2px; font-size:12px; color:var(--xm); }
#health-plan-overlay .hp-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#health-plan-overlay .hp-body { flex:1; min-height:0; overflow-y:auto; background:var(--l-bg); padding:6px; }
html body #health-plan-overlay #health-plan-content { background:var(--surface); border:1px solid var(--xl); border-radius:6px; padding:12px; }
#health-plan-overlay .hp-list { display:flex; flex-direction:column; gap:8px; }
#health-plan-overlay .hp-item { display:flex; align-items:center; gap:10px; padding:10px 10px 10px 12px; border:1px solid var(--xl); border-left-width:6px; border-radius:6px; }
#health-plan-overlay .hp-plan { background:#fff6d9; border-color:#7a5a00; }
#health-plan-overlay .hp-done { background:#e3f6ef; border-color:#0f6e5a; }
html.dark #health-plan-overlay .hp-plan { background:#3b3210; border-color:#f0d36a; }
html.dark #health-plan-overlay .hp-done { background:#16382f; border-color:#86dcc4; }
#health-plan-overlay .hp-main { flex:1; min-width:0; cursor:pointer; }
#health-plan-overlay .hp-line { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; }
#health-plan-overlay .hp-line strong { font-size:15px; line-height:1.25; color:var(--xi); overflow-wrap:anywhere; }
#health-plan-overlay .hp-state { padding:2px 8px; border:1px solid currentColor; border-radius:6px; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; }
#health-plan-overlay .hp-plan .hp-state { color:#7a5a00; } #health-plan-overlay .hp-done .hp-state { color:#0f6e5a; }
html.dark #health-plan-overlay .hp-plan .hp-state { color:#f0d36a; } html.dark #health-plan-overlay .hp-done .hp-state { color:#86dcc4; }
#health-plan-overlay .hp-meta { margin-top:3px; font-size:12.5px; color:var(--xm); overflow-wrap:anywhere; }
#health-plan-overlay .hp-btns { display:flex; gap:6px; flex:0 0 auto; }
html body #health-plan-overlay .hp-b { width:44px; height:44px; min-width:44px; min-height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; color:var(--xi) !important; font-size:18px; font-weight:700; box-shadow:none !important; }
html body #health-plan-overlay .hp-b.hp-del { color:#a02a5c !important; border-color:#a02a5c !important; }
#health-plan-overlay .hp-empty { text-align:center; padding:36px 16px; color:var(--xm); font-size:14px; }
#health-plan-overlay .hp-empty-ic { font-size:44px; margin-bottom:12px; }
#health-plan-overlay .hp-ft { flex:0 0 auto; display:flex; justify-content:center; gap:8px; padding:12px 16px; border-top:1px solid var(--xs); background:var(--surface); }
html body #health-plan-overlay .hp-ft .btn { min-height:48px; min-width:140px; border:1px solid !important; border-radius:6px !important; font-weight:700 !important; box-shadow:none !important; }
html body #health-plan-overlay .hp-ft .hp-close { background:#e6f0fd !important; color:#1f5fb0 !important; border-color:#1f5fb0 !important; }
html body #health-plan-overlay .hp-ft .btn-primary { background:#b2d6c8 !important; color:#0c5848 !important; border-color:#0f6e5a !important; }
html.dark body #health-plan-overlay .hp-ft .hp-close { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
html.dark body #health-plan-overlay .hp-ft .btn-primary { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
@media (max-width:820px) {
html body #health-plan-overlay .hp-win { width:100% !important; max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; }
#health-plan-overlay .hp-hd h2 { font-size:18px; }
html body #health-plan-overlay .hp-ft .btn { flex:1 1 45%; min-width:0; }
}

/* ── Prodejní kartička koťátka / Sdílet (#kitten-card-options-overlay): dva sloupce, podklady a dlaždice (25. 10. 2026) ── */
#kitten-card-options-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #kitten-card-options-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
html body #kitten-card-options-overlay .kc-win { width:96% !important; max-width:1100px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex !important; flex-direction:column; overflow:hidden !important; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; color:var(--xi); }
#kitten-card-options-overlay .kc-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; }
#kitten-card-options-overlay .kc-hd h2 { margin:0; font-size:22px; font-weight:800; line-height:1.2; color:var(--xi); }
#kitten-card-options-overlay .kc-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#kitten-card-options-overlay .kc-bd { flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); overflow:hidden; background:var(--l-bg); }
#kitten-card-options-overlay .kc-col { padding:6px; overflow-y:auto; display:flex; flex-direction:column; gap:12px; min-width:0; }
#kitten-card-options-overlay .kc-col + .kc-col { border-left:1px solid var(--xs); }
#kitten-card-options-overlay .kc-panel { padding:14px; border:1px solid var(--l-fg); border-radius:6px; background:var(--surface); }
#kitten-card-options-overlay .kc-panel.g { border-color:var(--g-fg); background:var(--g-bg); }
#kitten-card-options-overlay .kc-panel.y { border-color:var(--y-fg); background:var(--y-bg); }
#kitten-card-options-overlay .kc-cap { margin:0 0 10px; text-align:center; font-size:16px; font-weight:800; color:var(--xi); }
#kitten-card-options-overlay .kc-sub { margin:0 0 6px; text-align:center; font-size:12px; font-weight:700; color:var(--xi); }
#kitten-card-options-overlay .kc-panel .kc-sub:not(:first-child) { margin-top:12px; }
#kitten-card-options-overlay .kc-photos { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0 0 12px; }
#kitten-card-options-overlay .kc-ph { position:relative; width:72px; height:72px; border:3px solid transparent; border-radius:6px; overflow:hidden; cursor:pointer; flex:0 0 auto; box-shadow:0 0 0 1px var(--xl); }
#kitten-card-options-overlay .kc-ph img { width:100%; height:100%; object-fit:cover; display:block; }
#kitten-card-options-overlay .kc-ph-no { position:absolute; top:2px; right:2px; width:20px; height:20px; display:flex; align-items:center; justify-content:center; border-radius:6px; color:#fff; font-size:12px; font-weight:700; }
#kitten-card-options-overlay #kc-photo-adjust { color:var(--xi); }
#kitten-card-options-overlay #kc-photo-adjust > div:first-child { text-align:center; }
#kitten-card-options-overlay #kc-photo-adjust > div + div { justify-content:center; }
#kitten-card-options-overlay .kc-colors { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 0 4px; }
#kitten-card-options-overlay .kc-sw { width:44px; height:44px; border:2px solid var(--xs); border-radius:6px; cursor:pointer; flex:0 0 auto; }
#kitten-card-options-overlay .kc-sw-on { border:3px solid var(--xi); box-shadow:0 0 0 2px var(--surface) inset; }
#kitten-card-options-overlay .kc-templates { display:flex; gap:8px; }
html body #kitten-card-options-overlay .kc-tp { flex:1; min-height:48px; min-width:0; padding:4px 6px; border:1px solid var(--l-fg) !important; border-radius:6px !important; background:var(--surface); color:var(--l-fg); font-size:14px !important; font-weight:700 !important; box-shadow:none !important; overflow-wrap:anywhere; line-height:1.15; }
#kitten-card-options-overlay .kc-togs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0 0 10px; }
#kitten-card-options-overlay .kc-tog { position:relative; display:flex; align-items:center; justify-content:center; min-height:56px; padding:4px 8px; border:1px solid var(--l-fg); border-radius:6px; background:var(--l-bg); color:var(--l-fg); text-align:center; cursor:pointer; margin:0; }
#kitten-card-options-overlay .kc-tog input { position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
#kitten-card-options-overlay .kc-tog b { font-size:14px; line-height:1.2; overflow-wrap:anywhere; }
#kitten-card-options-overlay .kc-tog:has(input:checked) { background:color-mix(in srgb,currentColor 24%,var(--surface)); }
#kitten-card-options-overlay .kc-tog:has(input:checked) b { font-weight:800; }
#kitten-card-options-overlay .kc-win textarea, #kitten-card-options-overlay .kc-win input[type=text] { display:block; width:100%; box-sizing:border-box; padding:10px 12px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); font-family:inherit; font-size:15px; line-height:1.4; }
#kitten-card-options-overlay .kc-win textarea { min-height:70px; resize:vertical; }
#kitten-card-options-overlay #kc-banner-text { margin:0 0 4px; }
#kitten-card-options-overlay .kc-ft { flex:0 0 auto; display:flex; justify-content:center; gap:8px; padding:12px 16px; border-top:1px solid var(--xs); background:var(--surface); }
html body #kitten-card-options-overlay .kc-ft .btn { min-height:48px; min-width:160px; padding:4px 16px; border:1px solid !important; border-radius:6px !important; font-weight:700 !important; box-shadow:none !important; }
html body #kitten-card-options-overlay .kc-ft .kc-cancel { background:var(--b-bg) !important; color:var(--b-fg) !important; border-color:var(--b-fg) !important; }
html body #kitten-card-options-overlay .kc-ft .kc-make { background:#b2d6c8 !important; color:#0c5848 !important; border-color:#0f6e5a !important; }
html.dark body #kitten-card-options-overlay .kc-ft .kc-make { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
/* Vybraná šablona má plochu v barvě kartičky a bílé písmo; v tmavém režimu ho obecné pravidlo tlačítek přebarvilo na světle fialové (2,8 : 1, test 25. 10. 2026). */
html.dark body #kitten-card-options-overlay .kc-tp.kc-tp-on { color:#fff !important; }
@media (max-width:820px) {
html body #kitten-card-options-overlay .kc-win { width:100% !important; max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; }
#kitten-card-options-overlay .kc-hd h2 { font-size:18px; }
#kitten-card-options-overlay .kc-bd { display:flex; flex-direction:column; overflow-y:auto; }
#kitten-card-options-overlay .kc-col { overflow:visible; flex:none; }
#kitten-card-options-overlay .kc-col + .kc-col { border-left:0; }
html body #kitten-card-options-overlay .kc-ft .btn { flex:1; min-width:0; }
}

/* Výšky oken v dvh: na iPhonu v aplikaci okno odsazuje výřez displeje a lišta (.overlay padding safe-area) –
   výška se proto omezí i na zbylé místo (27. 10. 2026); na PC a v prohlížeči jsou safe-area 0, výška beze změny. */
/* ── Rodokmen (#pedigree-overlay): záhlaví s křížkem, pruh pohledu nahoře (jazyk, zoom, generace), akce dole (Načíst rodokmen, PDF, Zavřít); strom beze změny (25. 10. 2026, návrh 3) ── */
#pedigree-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; }
html.dark #pedigree-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; }
html body #pedigree-overlay .ped-win { width:96% !important; max-width:1100px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex !important; flex-direction:column; overflow:hidden !important; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; }
#pedigree-overlay .ped-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; }
html body #pedigree-overlay #pedigree-modal-title { margin:0; font-size:22px; font-weight:800; line-height:1.2; color:var(--xi); white-space:normal; max-width:100%; overflow-wrap:anywhere; }
#pedigree-overlay .ped-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#pedigree-overlay .ped-strip { flex:0 0 auto; display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:center; padding:8px 6px; background:var(--l-bg); border-bottom:1px solid var(--xs); }
#pedigree-overlay .ped-strip > * { margin:0 !important; }
html body #pedigree-overlay #ped-lang-pill-btn { height:44px !important; min-width:44px; padding:0 12px !important; border:1px solid #1f5fb0 !important; border-radius:6px !important; background:#e6f0fd !important; color:#1f5fb0 !important; font-size:13px !important; font-weight:700; }
html body #pedigree-overlay .ped-zoom-group { height:44px; background:var(--surface) !important; border:1px solid #5b2fb0 !important; border-radius:6px !important; padding:0 4px !important; }
html body #pedigree-overlay .ped-zoom-group .btn { height:40px !important; min-width:40px; border-radius:6px !important; font-size:15px !important; }
html body #pedigree-overlay .ped-gen-group { height:44px; background:#fff6d9 !important; border:1px solid #7a5a00 !important; border-radius:6px !important; padding:0 10px !important; }
html body #pedigree-overlay .ped-gen-group select { height:36px; border-radius:6px !important; font-size:14px !important; }
html body #pedigree-overlay #pedigree-content { flex:1; min-height:0; overflow:auto; padding:24px; background:var(--l-bg); cursor:grab; user-select:none; border:1px solid var(--xl); border-radius:6px; margin:6px; }
#pedigree-overlay .ped-ft { flex:0 0 auto; display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding:12px 16px; border-top:1px solid var(--xs); background:var(--surface); }
html body #pedigree-overlay #pedigree-import-btn { height:48px !important; min-width:200px; padding:0 14px !important; border:1px solid #5b2fb0 !important; border-radius:6px !important; background:var(--l-bg) !important; color:#5b2fb0 !important; font-weight:700 !important; font-size:13px !important; box-shadow:none !important; white-space:nowrap; }
html body #pedigree-overlay #pedigree-pdf-btn { height:48px !important; min-width:140px; padding:0 16px !important; border:1px solid #0f6e5a !important; border-radius:6px !important; background:#b2d6c8 !important; color:#0c5848 !important; font-weight:700 !important; font-size:13px !important; box-shadow:none !important; }
html body #pedigree-overlay .ped-close { width:auto !important; min-width:140px; min-height:48px; border:1px solid #1f5fb0 !important; border-radius:6px !important; background:#e6f0fd !important; color:#1f5fb0 !important; font-weight:700 !important; box-shadow:none !important; }
html body #pedigree-overlay #pedigree-import-dd { top:auto !important; bottom:calc(100% + 4px) !important; left:0 !important; right:auto !important; }
html.dark body #pedigree-overlay #ped-lang-pill-btn { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
html.dark body #pedigree-overlay .ped-gen-group { background:#3b3210 !important; border-color:#f0d36a !important; }
html.dark body #pedigree-overlay #pedigree-pdf-btn { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
html.dark body #pedigree-overlay .ped-close { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
html.dark body #pedigree-overlay #pedigree-import-btn { color:#c1a8ff !important; border-color:#c1a8ff !important; }
@media (max-width:820px) {
html body #pedigree-overlay .ped-win { width:100% !important; max-height:98vh !important; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; }
html body #pedigree-overlay #pedigree-modal-title { font-size:17px; }
html body #pedigree-overlay #pedigree-content { padding:12px; }
html body #pedigree-overlay #pedigree-import-btn { min-width:0; white-space:normal; }
html body #pedigree-overlay .ped-ft > * { flex:1 1 auto; }
html body #pedigree-overlay .ped-close, html body #pedigree-overlay #pedigree-pdf-btn { min-width:0; }
}
html body #pedigree-overlay .ped-gen-group select { height:36px !important; min-width:56px; }

/* ── Obnovit ze zálohy (#restore-modal): okno uprostřed, jedna záloha = jeden řádek (25. 10. 2026, návrh 3) ── */
#restore-modal { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #restore-modal { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
#restore-modal.rs-wrap { position:fixed; inset:0; z-index:4000; display:flex; align-items:center; justify-content:center; padding:12px; box-sizing:border-box; background:rgba(24,18,52,.6); }
#restore-modal .rs-win { width:100%; max-width:760px; height:min(88vh,860px); max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); }
#restore-modal .rs-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; }
#restore-modal .rs-hd h2 { margin:0; font-size:22px; font-weight:800; line-height:1.2; color:var(--xi); }
#restore-modal .rs-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#restore-modal .rs-tabs { display:flex; gap:8px; padding:8px 6px 0; background:var(--l-bg); flex:0 0 auto; }
html body #restore-modal .rs-tabs button { flex:1; min-height:48px; padding:4px 6px; border:1px solid var(--l-fg) !important; border-radius:6px !important; background:var(--surface) !important; color:var(--l-fg) !important; font-size:14px !important; font-weight:700 !important; box-shadow:none !important; }
html body #restore-modal .rs-tabs button.btn-primary { background:color-mix(in srgb,var(--l-fg) 24%,var(--surface)) !important; }
#restore-modal .rs-list { flex:1; min-height:0; overflow-y:auto; padding:6px; background:var(--l-bg); }
#restore-modal .rs-wait { text-align:center; color:var(--xm); padding:24px; }
html body #restore-modal #backup-bulk-bar { background:var(--surface) !important; border:1px solid var(--l-fg) !important; border-radius:6px !important; min-height:52px; box-sizing:border-box; }
html body #restore-modal .backup-card { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:6px 10px; padding:8px 10px; margin-bottom:6px; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; }
html body #restore-modal .backup-card-top, html body #restore-modal .backup-card-bottom { padding:0 !important; margin:0 !important; border:0 !important; }
html body #restore-modal .backup-card-bottom { display:flex; align-items:center; gap:6px; }
html body #restore-modal .backup-restore-btn { min-height:48px; padding:0 14px; border:1px solid #0f6e5a !important; border-radius:6px !important; background:#b2d6c8 !important; color:#0c5848 !important; font-weight:700 !important; box-shadow:none !important; }
html body #restore-modal .backup-tool-btn { width:48px; height:48px; min-width:48px; border:1px solid var(--l-fg) !important; border-radius:6px !important; background:var(--l-bg) !important; box-shadow:none !important; }
html body #restore-modal .backup-tool-btn.del { border-color:#a02a5c !important; background:#fdeaf0 !important; }
html body #restore-modal .backup-badge { padding:3px 8px; border-radius:6px !important; font-weight:700; }
html body #restore-modal .backup-badge-manual { background:#e6f0fd !important; color:#1f5fb0 !important; border:1px solid #1f5fb0 !important; }
html body #restore-modal .backup-badge-auto { background:var(--l-bg) !important; color:var(--l-fg) !important; border:1px solid var(--l-fg) !important; }
#restore-modal .backup-item-checkbox, #restore-modal #backup-select-all { width:24px !important; height:24px !important; }
html.dark body #restore-modal .backup-restore-btn { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
html.dark body #restore-modal .backup-tool-btn.del { background:#3d1a2a !important; border-color:#f2a0c0 !important; }
html.dark body #restore-modal .backup-badge-manual { background:#14283f !important; color:#8dbcf5 !important; border-color:#8dbcf5 !important; }
@media (max-width:820px) {
#restore-modal.rs-wrap { padding:6px; }
#restore-modal .rs-win { height:96vh; height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
#restore-modal .rs-hd h2 { font-size:18px; }
html body #restore-modal .backup-card { grid-template-columns:minmax(0,1fr); }
}
#restore-modal .rs-hd h2 { min-width:0; max-width:100%; overflow-wrap:anywhere; }
html body #restore-modal .backup-card-bottom { flex-wrap:wrap; min-width:0; }
html body #restore-modal .backup-restore-btn { flex:1 1 auto; min-width:0; }
html body #restore-modal .backup-card-tools { display:flex; gap:6px; flex:0 0 auto; margin-left:auto; }
@media (max-width:820px) {
html body #restore-modal .backup-tool-btn { width:44px; height:44px; min-width:44px; }
html body #restore-modal .backup-card-bottom { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px; }
}

/* Rodný list – okno „co zahrnout?“ (návrh 3, 25. 10. 2026) */
#kitten-cert-modal.kcert-wrap { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --l-bg:#efe9ff; --l-fg:#5b2fb0; position:fixed; inset:0; z-index:2000; display:flex; align-items:center; justify-content:center; padding:12px; box-sizing:border-box; background:rgba(24,18,52,.6); }
html.dark #kitten-cert-modal.kcert-wrap { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
#kitten-cert-modal .kcert-win { width:100%; max-width:640px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); }
#kitten-cert-modal .kcert-hd { position:relative; flex:0 0 auto; text-align:center; padding:14px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; }
#kitten-cert-modal .kcert-hd h2 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); min-width:0; max-width:100%; overflow-wrap:anywhere; }
#kitten-cert-modal .kcert-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#kitten-cert-modal .kcert-bd { flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px; background:var(--l-bg); display:grid; grid-template-columns:1fr 1fr; gap:6px; align-items:start; }
#kitten-cert-modal .kcert-g { display:grid; gap:6px; padding:6px; border:1px solid; border-radius:6px; min-width:0; }
#kitten-cert-modal .kcert-g.a { background:var(--g-bg); border-color:var(--g-fg); }
#kitten-cert-modal .kcert-g.b { background:var(--y-bg); border-color:var(--y-fg); }
#kitten-cert-modal .kcert-g h4 { margin:0; padding:4px 0; text-align:center; font-size:13px; font-weight:800; color:var(--xi); }
#kitten-cert-modal .kcert-t { display:flex; align-items:center; gap:8px; min-height:52px; padding:0 10px; box-sizing:border-box; min-width:0; border:1px solid var(--l-fg); border-radius:6px; background:var(--surface); color:var(--xi); font-size:15px; font-weight:700; cursor:pointer; }
#kitten-cert-modal .kcert-t i { font-style:normal; font-size:20px; width:26px; text-align:center; flex:0 0 auto; }
#kitten-cert-modal .kcert-t .kcert-l { flex:1 1 auto; min-width:0; overflow-wrap:anywhere; line-height:1.2; }
#kitten-cert-modal .kcert-t small { flex:0 1 auto; font-weight:400; font-size:11px; color:var(--xm); text-align:right; line-height:1.15; }
#kitten-cert-modal .kcert-t input { width:22px; height:22px; flex:0 0 auto; margin:0; }
#kitten-cert-modal .kcert-t:has(input:checked) { background:color-mix(in srgb,var(--l-fg) 18%,var(--surface)); }
#kitten-cert-modal .kcert-t.off { opacity:.45; border-style:dashed; cursor:default; }
#kitten-cert-modal .kcert-ft { flex:0 0 auto; display:flex; gap:6px; padding:6px; border-top:1px solid var(--xs); background:var(--surface); }
html body #kitten-cert-modal .kcert-ft button { flex:1; min-height:48px; border-radius:6px !important; font-weight:700; box-shadow:none !important; padding:4px 8px; }
html body #kitten-cert-modal .kcert-ft .kcert-cancel { border:1px solid var(--l-fg) !important; background:var(--surface) !important; color:var(--l-fg) !important; }
html body #kitten-cert-modal .kcert-ft #cert-create-btn { flex:2; border:1px solid var(--g-fg) !important; background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)) !important; color:var(--g-fg) !important; }
@media (max-width:820px) { #kitten-cert-modal.kcert-wrap { padding:6px; } #kitten-cert-modal .kcert-bd { grid-template-columns:1fr; } #kitten-cert-modal .kcert-hd h2 { font-size:18px; } }

/* Březostní kalendář (#pregnancy-calendar-overlay): tři dlaždice nahoře, týdny v mřížce 3×3, záznamy dole (25. 10. 2026, návrh 3) */
#pregnancy-calendar-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #pregnancy-calendar-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
html body #pregnancy-calendar-overlay.pc-wrap { padding:12px; box-sizing:border-box; }
html body #pregnancy-calendar-overlay .pc-win { width:100% !important; max-width:1100px !important; height:min(94vh,860px) !important; max-height:94vh !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; color:var(--xi); }
#pregnancy-calendar-overlay .pc-hd { position:relative; flex:0 0 auto; text-align:center; padding:12px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; }
#pregnancy-calendar-overlay .pc-hd h2 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); min-width:0; max-width:100%; overflow-wrap:anywhere; }
#pregnancy-calendar-overlay .pc-sub { margin-top:2px; font-size:12px; color:var(--xm); }
#pregnancy-calendar-overlay .pc-sub:empty { display:none; }
#pregnancy-calendar-overlay .pc-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#pregnancy-calendar-overlay .pc-bd { flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px; background:var(--l-bg); display:grid; gap:6px; align-content:start; }
#pregnancy-calendar-overlay .pc-info { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
#pregnancy-calendar-overlay .pc-i { border:1px solid var(--l-fg); border-radius:6px; background:var(--surface); padding:8px; text-align:center; min-height:56px; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; min-width:0; }
#pregnancy-calendar-overlay .pc-i small { font-size:11px; color:var(--xm); }
#pregnancy-calendar-overlay .pc-i b { font-size:14px; color:var(--xi); overflow-wrap:anywhere; }
#pregnancy-calendar-overlay .pc-i b span { font-weight:400; }
#pregnancy-calendar-overlay .pc-bar { height:8px; border-radius:6px; background:var(--xs); margin-top:5px; overflow:hidden; }
#pregnancy-calendar-overlay .pc-bar i { display:block; height:100%; background:var(--g-fg); }
#pregnancy-calendar-overlay .pc-g { display:grid; gap:6px; border:1px solid; border-radius:6px; padding:6px; align-content:start; min-width:0; }
#pregnancy-calendar-overlay .pc-g h4 { margin:0; text-align:center; font-size:13px; font-weight:800; color:var(--xi); padding:4px 0; }
#pregnancy-calendar-overlay .pc-g.a { background:var(--g-bg); border-color:var(--g-fg); }
#pregnancy-calendar-overlay .pc-g.b { background:var(--y-bg); border-color:var(--y-fg); }
#pregnancy-calendar-overlay .pc-w3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
#pregnancy-calendar-overlay .pc-w { border:1px solid var(--y-fg); border-radius:6px; background:var(--surface); padding:8px 10px; font-size:12px; color:var(--xi); line-height:1.4; min-width:0; }
#pregnancy-calendar-overlay .pc-w h5 { margin:0 0 4px; font-size:13px; display:flex; flex-wrap:wrap; gap:4px 6px; align-items:center; }
#pregnancy-calendar-overlay .pc-w h5 em { font-style:normal; font-weight:400; font-size:11px; color:var(--xm); }
#pregnancy-calendar-overlay .pc-w h5 u { text-decoration:none; margin-left:auto; font-size:10px; padding:2px 7px; border-radius:4px; }
#pregnancy-calendar-overlay .pc-w h5 u.pc-now { background:var(--g-fg); color:var(--surface); }
#pregnancy-calendar-overlay .pc-w h5 u.pc-rec { background:var(--l-fg); color:var(--surface); }
#pregnancy-calendar-overlay .pc-w.cur { background:color-mix(in srgb,var(--g-fg) 18%,var(--surface)); border:2px solid var(--g-fg); }
#pregnancy-calendar-overlay .pc-w.past { opacity:.6; }
#pregnancy-calendar-overlay .pc-w p { margin:0 0 3px; font-size:12px; color:var(--xi); }
#pregnancy-calendar-overlay .pc-w p.t { color:var(--xm); }
#pregnancy-calendar-overlay .pc-w p.t strong { color:var(--xi); }
#pregnancy-calendar-overlay .pc-btns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
html body #pregnancy-calendar-overlay .pc-btns .btn { min-height:44px; padding:0 4px; border:1px solid var(--g-fg) !important; border-radius:6px !important; background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)) !important; color:var(--g-fg) !important; font-size:13px !important; font-weight:700 !important; box-shadow:none !important; }
#pregnancy-calendar-overlay .pc-log { display:grid; gap:6px; }
#pregnancy-calendar-overlay .pc-r { display:flex; gap:8px; align-items:center; border:1px solid var(--g-fg); border-radius:6px; background:var(--surface); padding:6px 6px 6px 10px; min-height:52px; box-sizing:border-box; font-size:13px; color:var(--xi); min-width:0; }
#pregnancy-calendar-overlay .pc-r i { font-style:normal; font-size:20px; flex:0 0 auto; }
#pregnancy-calendar-overlay .pc-rt { flex:1 1 auto; min-width:0; overflow-wrap:anywhere; }
#pregnancy-calendar-overlay .pc-rt div { color:var(--xm); font-size:12px; }
#pregnancy-calendar-overlay .pc-rd { flex:0 1 auto; font-size:11px; color:var(--xm); text-align:right; }
#pregnancy-calendar-overlay .pc-del { flex:0 0 auto; width:44px; height:44px; padding:0; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:16px; cursor:pointer; }
#pregnancy-calendar-overlay .pc-empty { margin:0; padding:10px 0; text-align:center; font-size:13px; color:var(--xm); }
#pregnancy-calendar-overlay .pc-ft { flex:0 0 auto; display:flex; padding:6px; border-top:1px solid var(--xs); background:var(--surface); }
html body #pregnancy-calendar-overlay .pc-close { flex:1; min-height:48px; border:1px solid var(--l-fg) !important; border-radius:6px !important; background:var(--surface) !important; color:var(--l-fg) !important; font-weight:700; box-shadow:none !important; }
@media (max-width:820px) { html body #pregnancy-calendar-overlay.pc-wrap { padding:6px; } html body #pregnancy-calendar-overlay .pc-win { height:96vh !important; height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } #pregnancy-calendar-overlay .pc-info, #pregnancy-calendar-overlay .pc-w3 { grid-template-columns:minmax(0,1fr); } #pregnancy-calendar-overlay .pc-hd h2 { font-size:18px; } }

/* Editor zásoby (#supply-form-modal): tři sloupce stejných dlaždic, vše vycentrované (25. 10. 2026, návrh 3) */
#supply-form-modal.sp-wrap { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --p-bg:#fdeaf0; --p-fg:#a02a5c; --l-bg:#efe9ff; --l-fg:#5b2fb0; position:fixed; inset:0; z-index:2500; display:flex; align-items:center; justify-content:center; padding:12px; box-sizing:border-box; background:rgba(24,18,52,.6); }
html.dark #supply-form-modal.sp-wrap { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --p-bg:#3d1a2a; --p-fg:#f6b5cf; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
#supply-form-modal .sp-win { width:100%; max-width:1360px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); }
#supply-form-modal .sp-hd { position:relative; flex:0 0 auto; text-align:center; padding:12px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; }
#supply-form-modal .sp-hd h2 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); min-width:0; max-width:100%; overflow-wrap:anywhere; }
#supply-form-modal .sp-sub { margin-top:2px; font-size:12px; color:var(--xm); }
#supply-form-modal .sp-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#supply-form-modal .sp-bd { flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px; background:var(--l-bg); display:grid; gap:6px; align-content:start; }
#supply-form-modal .sp-cols { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; align-items:stretch; }
#supply-form-modal .sp-g { display:grid; grid-template-rows:auto repeat(3,1fr); gap:8px; padding:8px; border:1px solid; border-radius:6px; min-width:0; }
#supply-form-modal .sp-g.a { background:var(--g-bg); border-color:var(--g-fg); }
#supply-form-modal .sp-g.b { background:var(--y-bg); border-color:var(--y-fg); }
#supply-form-modal .sp-g.c { background:var(--b-bg); border-color:var(--b-fg); }
#supply-form-modal .sp-g h4 { margin:0; padding:2px 0; text-align:center; font-size:13px; font-weight:800; color:var(--xi); }
#supply-form-modal .sp-t { display:flex; flex-direction:column; justify-content:center; gap:6px; min-height:96px; padding:8px 10px; box-sizing:border-box; min-width:0; border:1px solid var(--xl); border-radius:6px; background:var(--surface); text-align:center; }
#supply-form-modal .sp-t.sp-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-content:center; gap:6px; }
#supply-form-modal .sp-t.off { opacity:.45; pointer-events:none; border-style:dashed; }
#supply-form-modal .sp-t label { display:block !important; margin:0 0 4px !important; text-align:center; font-size:11px !important; font-weight:800; color:var(--xm); text-transform:uppercase; letter-spacing:.4px; }
#supply-form-modal .sp-t input:not([type=checkbox]), #supply-form-modal .sp-t select { width:100%; min-width:0; min-height:44px; box-sizing:border-box; padding:8px 10px !important; margin:0 !important; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; color:var(--xi); font-size:15px; text-align:center; text-align-last:center; }
#supply-form-modal .sp-t > div { margin:0 !important; }
#supply-form-modal .sp-t > div[style*="display:flex"] { display:flex !important; gap:6px; align-items:center; width:100%; }
#supply-form-modal .sp-t > div[style*="display:flex"] input { flex:1 1 0 !important; width:auto; }
#supply-form-modal .sp-t > div[style*="display:flex"] .btn { flex:0 0 auto; min-height:44px; padding:0 12px !important; border-radius:6px !important; white-space:nowrap; }
#supply-form-modal .sp-t > div[style*="grid-template-columns:repeat(3"] { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
#supply-form-modal .supply-type-tile { border-radius:6px !important; padding:6px 2px !important; min-height:56px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
#supply-form-modal .sp-hint { margin:0; padding:4px 8px; text-align:center; font-size:11px; line-height:1.3; color:var(--xm); }
#supply-form-modal .sp-ft { flex:0 0 auto; display:flex; gap:6px; padding:6px; border-top:1px solid var(--xs); background:var(--surface); }
html body #supply-form-modal .sp-ft button { flex:1; min-height:48px; padding:4px 10px; border-radius:6px !important; font-weight:700 !important; font-size:15px; box-shadow:none !important; margin:0; width:auto; }
html body #supply-form-modal .sp-ft .sp-cancel { border:1px solid var(--l-fg) !important; background:var(--surface) !important; color:var(--l-fg) !important; }
html body #supply-form-modal .sp-ft .sp-save { flex:2; border:1px solid var(--g-fg) !important; background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)) !important; color:var(--g-fg) !important; }
html body #supply-form-modal .sp-ft .sp-del { border:1px solid var(--p-fg) !important; background:var(--p-bg) !important; color:var(--p-fg) !important; }
@media (max-width:1100px) { #supply-form-modal .sp-win { max-width:720px; } #supply-form-modal .sp-cols { grid-template-columns:minmax(0,1fr); } #supply-form-modal .sp-g { grid-template-rows:auto; } }
@media (max-width:820px) { #supply-form-modal.sp-wrap { padding:6px; } #supply-form-modal .sp-win { max-height:96vh; max-height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } #supply-form-modal .sp-hd h2 { font-size:18px; } }
html body #supply-form-modal > .sp-win { width:100% !important; max-width:1360px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; border-radius:6px !important; border:1px solid var(--xl) !important; background:var(--surface) !important; box-shadow:none !important; }
@media (max-width:1100px) { html body #supply-form-modal > .sp-win { max-width:720px !important; } }
@media (max-width:820px) { html body #supply-form-modal > .sp-win { max-height:96vh !important; max-height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; } }
/* Editor zásoby – opravy po připomínce (25. 10. 2026): vyšší dlaždice, stejná spodní tlačítka, okno nad spodní lištou */
#supply-form-modal .sp-g { grid-template-rows:auto repeat(3,minmax(104px,1fr)); }
#supply-form-modal .sp-t { min-height:104px; }
#supply-form-modal .supply-type-tile { min-height:48px; }
@media (max-width:1100px) { #supply-form-modal .sp-g { grid-template-rows:auto repeat(3,minmax(104px,1fr)); } }
@media (max-width:820px) {
  #supply-form-modal.sp-wrap { align-items:flex-start; padding:6px 6px calc(76px + env(safe-area-inset-bottom, 0px)); }
  html body #supply-form-modal > .sp-win { max-height:calc(100dvh - 82px - env(safe-area-inset-bottom, 0px)) !important; }
  #supply-form-modal .sp-ft { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
  html body #supply-form-modal .sp-ft button, html body #supply-form-modal .sp-ft .sp-save { flex:none; min-height:56px; font-size:13px; line-height:1.15; padding:4px; display:flex; align-items:center; justify-content:center; text-align:center; }
}
/* Editor zásoby – spodní tlačítka: tři stejná, přesně pod sloupci, ikona + text (25. 10. 2026) */
#supply-form-modal .sp-ft { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:6px !important; padding:6px !important; }
#supply-form-modal .sp-ft.two { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
html body #supply-form-modal .sp-ft button, html body #supply-form-modal .sp-ft .sp-save { flex:none !important; width:auto !important; min-width:0; height:56px; min-height:56px !important; margin:0 !important; padding:4px 6px !important; border-radius:6px !important; font-size:15px !important; font-weight:700 !important; line-height:1.15 !important; display:flex !important; flex-direction:row; align-items:center; justify-content:center; gap:8px; text-align:center; box-sizing:border-box; }
#supply-form-modal .sp-ft .ic { font-size:20px; line-height:1; }
@media (max-width:820px) { html body #supply-form-modal .sp-ft button, html body #supply-form-modal .sp-ft .sp-save { flex-direction:column; gap:2px; height:64px; min-height:64px !important; font-size:12px !important; } }
@media (max-width:420px) { #supply-form-modal .sp-g { grid-template-rows:auto repeat(3,minmax(112px,1fr)); } #supply-form-modal .sp-t { min-height:112px; } }

/* Grafy váhy (koťátko, vrh, kočka): záhlaví uprostřed s křížkem, graf v rámečku vlevo a stejné dlaždice s čísly vpravo (25. 10. 2026, návrh 2) */
#weight-chart-overlay, #litter-weight-comparison-overlay, #cat-weight-chart-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #weight-chart-overlay, html.dark #litter-weight-comparison-overlay, html.dark #cat-weight-chart-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
html body .overlay .wc-win { width:96% !important; max-width:1100px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; color:var(--xi); }
.wc-win .wc-hd { position:relative; flex:0 0 auto; text-align:center; padding:12px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.wc-win .wc-hd h2 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); min-width:0; max-width:100%; overflow-wrap:anywhere; }
.wc-win .wc-sub { margin-top:2px; font-size:12px; color:var(--xm); }
.wc-win .wc-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
.wc-win .wc-bd { flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px; background:var(--l-bg); }
.wc-win .wc-cols { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:6px; align-items:stretch; }
.wc-win .wc-chart { position:relative; min-width:0; height:400px; padding:8px; box-sizing:border-box; border:1px solid var(--xl); border-radius:6px; background:var(--surface); display:flex; align-items:center; }
.wc-win .wc-chart.wc-tall { height:450px; }
.wc-win .wc-chart svg { width:100%; height:auto; background:transparent !important; }
.wc-win .wc-stats { display:grid; grid-auto-rows:1fr; gap:6px; min-width:0; }
.wc-win .wc-s { display:flex; flex-direction:column; justify-content:center; gap:4px; min-width:0; min-height:84px; padding:8px; box-sizing:border-box; border:1px solid var(--xl); border-radius:6px; background:var(--surface); text-align:center; }
.wc-win .wc-l { font-size:11px; font-weight:800; color:var(--xm); text-transform:uppercase; letter-spacing:.4px; }
.wc-win .wc-v { font-size:20px; font-weight:700; color:var(--xi); overflow-wrap:anywhere; }
.wc-win .wc-ft { flex:0 0 auto; display:grid; padding:6px; border-top:1px solid var(--xs); background:var(--surface); }
html body .wc-win .wc-close { min-height:56px; border:1px solid var(--l-fg) !important; border-radius:6px !important; background:var(--surface) !important; color:var(--l-fg) !important; font-weight:700; font-size:15px; box-shadow:none !important; margin:0 !important; }
@media (max-width:820px) { .wc-win .wc-cols { grid-template-columns:minmax(0,1fr); } .wc-win .wc-chart { height:260px; } .wc-win .wc-chart.wc-tall { height:300px; } .wc-win .wc-hd h2 { font-size:18px; } }
.wc-win .wc-chart:has(canvas) { display:block; }

/* Skenování kódu (#supply-scan-overlay): okno se zeleným panelem Kamera a žlutým panelem Možnosti, čtyři stejná tlačítka (25. 10. 2026, návrh 3) */
#supply-scan-overlay.sc-wrap { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --l-bg:#efe9ff; position:fixed; inset:0; z-index:3500; display:flex; align-items:center; justify-content:center; padding:12px; box-sizing:border-box; background:rgba(24,18,52,.6); }
html.dark #supply-scan-overlay.sc-wrap { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --l-bg:#2a1f4a; }
#supply-scan-overlay .sc-win { width:100%; max-width:1100px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); }
#supply-scan-overlay .sc-hd { position:relative; flex:0 0 auto; text-align:center; padding:12px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; }
#supply-scan-overlay .sc-hd h2 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); min-width:0; max-width:100%; overflow-wrap:anywhere; }
#supply-scan-overlay .sc-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#supply-scan-overlay .sc-bd { flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px; background:var(--l-bg); display:grid; gap:6px; align-content:start; }
#supply-scan-overlay .sc-g { display:grid; gap:6px; padding:6px; border:1px solid; border-radius:6px; min-width:0; }
#supply-scan-overlay .sc-g.a { background:var(--g-bg); border-color:var(--g-fg); }
#supply-scan-overlay .sc-g.b { background:var(--y-bg); border-color:var(--y-fg); }
#supply-scan-overlay .sc-g h4 { margin:0; padding:2px 0; text-align:center; font-size:13px; font-weight:800; color:var(--xi); }
#supply-scan-overlay .sc-vf { position:relative; width:100%; aspect-ratio:16/7; max-height:56vh; max-height:min(56dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); min-width:0; overflow:hidden; border:1px solid var(--xl); border-radius:6px; background:#0d0a14; }
#supply-scan-overlay .sc-vf video { width:100%; height:100%; object-fit:cover; }
#supply-scan-overlay .sc-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
#supply-scan-overlay .sc-t { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; height:84px; min-width:0; padding:4px; box-sizing:border-box; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); font-size:13px; font-weight:700; line-height:1.15; text-align:center; cursor:pointer; }
#supply-scan-overlay .sc-t .ic { font-size:22px; line-height:1; }
#supply-scan-overlay .sc-t.on { background:#fde68a; border-color:#b45309; color:#78350f; }
@media (max-width:820px) { #supply-scan-overlay.sc-wrap { padding:6px; } #supply-scan-overlay .sc-win { max-height:96vh; max-height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } #supply-scan-overlay .sc-hd h2 { font-size:18px; } #supply-scan-overlay .sc-vf { aspect-ratio:1; max-height:50vh; max-height:min(50dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } #supply-scan-overlay .sc-row { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Výřez fotky (#crop-overlay) a výřez pro PDF (#pdf-crop-overlay): záhlaví s křížkem, výřez a jezdec v rámečcích, dvě stejná tlačítka (25. 10. 2026, návrh 1) */
#crop-overlay, #pdf-crop-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #crop-overlay, html.dark #pdf-crop-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
html body .overlay .cr-win { width:400px !important; max-width:96% !important; max-height:96vh !important; max-height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; text-align:left; color:var(--xi); }
.cr-win .cr-hd { position:relative; flex:0 0 auto; text-align:center; padding:12px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.cr-win .cr-hd h3 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); min-width:0; max-width:100%; overflow-wrap:anywhere; }
.cr-win .cr-sub { margin:2px 0 0; font-size:12px; line-height:1.3; color:var(--xm); }
.cr-win .cr-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
.cr-win .cr-bd { flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px; background:var(--l-bg); display:grid; gap:6px; align-content:start; }
.cr-win .cr-t { display:flex; align-items:center; justify-content:center; box-sizing:border-box; min-width:0; padding:8px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); }
.cr-win .cr-t .crop-canvas-wrap { margin:0 !important; border-radius:6px; flex:0 0 auto; }
.cr-win .cr-sl { height:64px; }
.cr-win .cr-sl input[type=range] { width:100%; margin:0; }
.cr-win .cr-ft { flex:0 0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:6px; border-top:1px solid var(--xs); background:var(--surface); }
html body .cr-win .cr-ft button { height:56px; min-height:56px; margin:0; padding:4px; border-radius:6px !important; font-size:15px; font-weight:700; box-shadow:none !important; flex:none; width:auto; }
html body .cr-win .cr-ft .cr-cancel { border:1px solid var(--l-fg) !important; background:var(--surface) !important; color:var(--l-fg) !important; }
html body .cr-win .cr-ft .cr-ok { border:1px solid var(--g-fg) !important; background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)) !important; color:var(--g-fg) !important; }
@media (max-width:820px) { html body .overlay .cr-win { width:96% !important; } .cr-win .cr-hd h3 { font-size:18px; } }

/* Výběr data (#datepicker-overlay): okno s políčkem a jedním propojeným kolečkem Den · Měsíc · Rok, dvě stejná tlačítka (25. 10. 2026, návrh 3) */
#datepicker-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #datepicker-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
html body #datepicker-overlay .dp-win { width:400px !important; max-width:96% !important; max-height:96vh !important; max-height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; color:var(--xi); }
.dp-win .dp-hd { position:relative; flex:0 0 auto; text-align:center; padding:12px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; }
.dp-win .dp-hd h3 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); text-transform:none; letter-spacing:0; }
.dp-win .dp-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
.dp-win .dp-bd { flex:1 1 auto; min-height:0; overflow-y:auto; padding:6px; background:var(--l-bg); display:grid; gap:6px; align-content:start; }
.dp-win .dp-t { box-sizing:border-box; min-width:0; padding:8px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); }
.dp-win #dp-text-input { width:100%; height:48px; box-sizing:border-box; margin:0; padding:6px 10px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); font-size:18px; font-family:inherit; text-align:center; }
.dp-win .dp-labs, .dp-win .dp-cols { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.dp-win .dp-labs { margin-bottom:6px; }
.dp-win .dp-labs div { text-align:center; font-size:11px; font-weight:800; color:var(--xm); text-transform:uppercase; }
.dp-win .dp-wheels .dp-wrap { border-radius:0; border-left:0; border-right:0; }
.dp-win .dp-wheels .dp-selector { left:0; right:0; border-radius:0; }
.dp-win .dp-ft { flex:0 0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:6px; border-top:1px solid var(--xs); background:var(--surface); }
html body .dp-win .dp-ft button { height:56px; min-height:56px; margin:0; padding:4px; border-radius:6px !important; font-size:15px; font-weight:700; box-shadow:none !important; flex:none; width:auto; }
html body .dp-win .dp-ft .dp-cancel { border:1px solid var(--l-fg) !important; background:var(--surface) !important; color:var(--l-fg) !important; }
html body .dp-win .dp-ft .dp-ok { border:1px solid var(--g-fg) !important; background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)) !important; color:var(--g-fg) !important; }
@media (max-width:820px) { html body #datepicker-overlay .dp-win { width:96% !important; } .dp-win .dp-hd h3 { font-size:18px; } }

/* Potvrzovací okna (#confirm-overlay, #prompt-overlay) a obecné okno (#generic-modal-overlay): záhlaví s ikonou a nadpisem, text v rámečku, dvě stejná tlačítka (25. 10. 2026, návrh 2) */
#confirm-overlay, #prompt-overlay, #generic-modal-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --p-bg:#fdeaf0; --p-fg:#a02a5c; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #confirm-overlay, html.dark #prompt-overlay, html.dark #generic-modal-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --p-bg:#3d1a2a; --p-fg:#f6b5cf; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
html body .overlay .dlg-win { width:420px !important; max-width:94% !important; max-height:96vh !important; max-height:min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; color:var(--xi); text-align:center; }
html body #confirm-overlay .dlg-win:has(#confirm-ok-btn.btn-danger), html body #prompt-overlay .dlg-win:has(#prompt-ok-btn.btn-danger) { border-color:var(--p-fg) !important; }
.dlg-win .dlg-hd { position:relative; flex:0 0 auto; padding:12px 64px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; }
.dlg-win .dlg-hd .modal-dialog-icon { margin:0; flex:0 0 auto; }
.dlg-win .dlg-hd h3 { margin:0; font-size:20px; font-weight:800; line-height:1.2; color:var(--xi); overflow-wrap:anywhere; max-width:100%; text-transform:none; letter-spacing:0; }
.dlg-win .dlg-hd-x { flex-direction:row; justify-content:center; }
.dlg-win .dlg-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
.dlg-win .dlg-bd { flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px; background:var(--l-bg); display:grid; gap:6px; align-content:start; }
html body #confirm-overlay .dlg-win:has(#confirm-ok-btn.btn-danger) .dlg-bd, html body #prompt-overlay .dlg-win:has(#prompt-ok-btn.btn-danger) .dlg-bd { background:var(--p-bg); }
.dlg-win .dlg-t { box-sizing:border-box; min-width:0; padding:12px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); display:flex; flex-direction:column; gap:8px; align-items:center; justify-content:center; text-align:center; font-size:15px; line-height:1.35; color:var(--xi); }
.dlg-win .dlg-t.dlg-left { align-items:stretch; text-align:left; }
html body #confirm-overlay .dlg-win:has(#confirm-ok-btn.btn-danger) .dlg-t, html body #prompt-overlay .dlg-win:has(#prompt-ok-btn.btn-danger) .dlg-t { border-color:var(--p-fg); }
.dlg-win .dlg-t p { margin:0; font-size:15px; color:var(--xi); white-space:pre-line; overflow-wrap:anywhere; }
.dlg-win .dlg-t .modal-dialog-warning { margin:0; }
.dlg-win .dlg-t input { width:100%; height:48px; box-sizing:border-box; margin:0; padding:6px 10px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:var(--xi); font-size:16px; text-align:center; }
.dlg-win .dlg-ft { flex:0 0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:6px; border-top:1px solid var(--xs); background:var(--surface); }
html body .dlg-win .dlg-ft button { height:56px; min-height:56px; margin:0; padding:4px; border-radius:6px !important; font-size:15px; font-weight:700; box-shadow:none !important; flex:none; width:auto; }
html body .dlg-win .dlg-ft button:not(.btn-primary):not(.btn-danger) { border:1px solid var(--l-fg) !important; background:var(--surface) !important; color:var(--l-fg) !important; }
html body .dlg-win .dlg-ft .btn-primary { border:1px solid var(--g-fg) !important; background:color-mix(in srgb,var(--g-fg) 24%,var(--g-bg)) !important; color:var(--g-fg) !important; }
html body .dlg-win .dlg-ft .btn-danger { border:1px solid var(--p-fg) !important; background:color-mix(in srgb,var(--p-fg) 30%,var(--p-bg)) !important; color:var(--p-fg) !important; }
@media (max-width:820px) { html body .overlay .dlg-win { width:94% !important; } .dlg-win .dlg-hd h3 { font-size:18px; } }

/* Editor zásoby: tlačítko × u data expirace má v tmavém režimu dost kontrastu (dřív 3,2 : 1, 25. 10. 2026) */
#supply-form-modal .sp-t button[onclick^="clearDateField"] { color:var(--p-fg) !important; border-color:var(--p-fg) !important; background:var(--p-bg) !important; }

/* Rodokmen v tmavém režimu: zelený / oranžový / červený text příbuznosti (COI) má barvu přímo v kódu,
   na tmavém podkladu měl 2,7–2,9 : 1 (test 25. 10. 2026). Zesvětlené odstíny dávají přes 7 : 1. */
html.dark #pedigree-overlay [style*="color:#2E7D32" i] { color:#86efac !important; }
html.dark #pedigree-overlay [style*="color:#E65100" i] { color:#fdba74 !important; }
html.dark #pedigree-overlay [style*="color:#C62828" i] { color:#fca5a5 !important; }

/* ── Úvodní průvodce (#onboarding-overlay), návrh 3 (26. 10. 2026): logo vlevo, obsah kroku vpravo, pruh postupu, dvě stejná tlačítka ── */
#onboarding-overlay.of-modal { background: rgba(29,22,72,0.38) !important; padding: 12px !important; }
#onboarding-overlay .ob-win { --ofw: 940px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
#onboarding-overlay .ob-sub { font-size: 13px; color: var(--xm); margin-top: 2px; }
#onboarding-overlay .onboarding-progress { display: grid !important; grid-template-columns: repeat(4,1fr); gap: 6px; padding: 6px 6px 0; margin: 0 !important; background: var(--l-bg); justify-content: stretch !important; }
#onboarding-overlay .onboarding-dot { width: auto !important; height: 6px !important; border-radius: 6px !important; background: var(--xs) !important; margin: 0 !important; transition: none !important; }
#onboarding-overlay .onboarding-dot.active { width: auto !important; background: var(--xl) !important; }
#onboarding-overlay .ob-bd { display: grid; grid-template-columns: 240px minmax(0,1fr); gap: 6px; padding: 6px; background: var(--l-bg); min-height: 0; overflow-y: auto; flex: 1 1 auto; }
#onboarding-overlay .ob-logo { border: 1px solid var(--xs); background: var(--surface); border-radius: 6px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 14px; font-weight: 800; color: var(--xi); text-align: center; word-break: break-word; }
#onboarding-overlay .ob-logo img { width: 120px; height: 120px; border-radius: 6px; border: 1px solid var(--xs); object-fit: contain; }
#onboarding-overlay .ob-right, #onboarding-overlay .onboarding-step { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
#onboarding-overlay .onboarding-step[style*="display:none"], #onboarding-overlay .onboarding-step[style*="display: none"] { display: none !important; }
#onboarding-overlay .ob-h { display: none; }
#onboarding-overlay .ob-lead { margin: 0; border: 1px solid var(--xs); background: var(--surface); border-radius: 6px; padding: 12px; text-align: center; font-size: 15px; line-height: 1.5; color: var(--xi); word-break: break-word; }
#onboarding-overlay .ob-lead.ob-small { font-size: 13px; color: var(--xm); }
#onboarding-overlay .ob-pan { border: 1px solid; border-radius: 6px; padding: 12px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 0; word-break: break-word; }
#onboarding-overlay .ob-pan h4 { margin: 0 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
#onboarding-overlay .ob-pan b { font-size: 15px; } #onboarding-overlay .ob-pan span { font-size: 13px; color: var(--xi); }
#onboarding-overlay .ob-ico { display: flex; margin-bottom: 4px; }
#onboarding-overlay .ob-pan.g { background: var(--g-bg); color: var(--g-fg); border-color: color-mix(in srgb,var(--g-fg) 35%,var(--g-bg)); }
#onboarding-overlay .ob-pan.y { background: var(--y-bg); color: var(--y-fg); border-color: color-mix(in srgb,var(--y-fg) 35%,var(--y-bg)); }
#onboarding-overlay .ob-pan.b { background: var(--b-bg); color: var(--b-fg); border-color: color-mix(in srgb,var(--b-fg) 35%,var(--b-bg)); }
#onboarding-overlay .ob-pan.p { background: var(--p-bg); color: var(--p-fg); border-color: color-mix(in srgb,var(--p-fg) 35%,var(--p-bg)); }
#onboarding-overlay .ob-pan.o { background: var(--o-bg); color: var(--o-fg); border-color: color-mix(in srgb,var(--o-fg) 35%,var(--o-bg)); }
#onboarding-overlay .ob-pan.l { background: var(--surface); color: var(--l-fg); border-color: var(--xs); }
#onboarding-overlay .ob-pan.g h4 { align-self: stretch; }
#onboarding-overlay .ob-g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; align-self: stretch; }
#onboarding-overlay .ob-g3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
#onboarding-overlay .ob-f { display: block; background: var(--surface); border: 1px solid color-mix(in srgb,currentColor 40%,transparent); border-radius: 6px; padding: 8px; text-align: center; margin: 0; }
#onboarding-overlay .ob-f small { display: block; font-size: 11px; margin-bottom: 4px; }
#onboarding-overlay .ob-f input { width: 100%; border: none !important; outline: none; box-shadow: none !important; text-align: center; font: inherit; font-size: 15px; font-weight: 700; color: var(--xi); background: transparent !important; padding: 4px 0 !important; min-height: 0 !important; }
#onboarding-overlay .ob-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 6px; border-top: 1px solid var(--xs); flex: 0 0 auto; }
#onboarding-overlay .ob-btns .of-act { margin-top: 0; min-height: 56px; font-size: 15px; }
#onboarding-overlay .ob-btns .of-act[style*="display:none"], #onboarding-overlay .ob-btns .of-act[style*="display: none"] { display: none !important; }
@media (max-width: 700px) {
  #onboarding-overlay .ob-bd { grid-template-columns: minmax(0,1fr); }
  #onboarding-overlay .ob-logo img { width: 64px; height: 64px; }
  #onboarding-overlay .ob-g3 { grid-template-columns: 1fr 1fr; }
  #onboarding-overlay .ob-g2 { grid-template-columns: 1fr; }
  #onboarding-overlay .ob-btns .of-act { font-size: 14px; padding: 4px 6px; }
}

/* ── Prohlížeč fotek a dokumentů (#viewer-overlay), návrh 3 (26. 10. 2026): světlý ve fialové barvě aplikace,
      ostrá tlačítka 44 px, dole datum (zelené), poznámka (žlutá), výřez (fialový), smazat (růžové). Funkce beze změny. ── */
#viewer-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --p-bg:#fdeaf0; --p-fg:#a02a5c; --l-bg:#efe9ff; --l-fg:#5b2fb0; background: var(--l-bg) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html.dark #viewer-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --p-bg:#3d1a2a; --p-fg:#f6b5cf; --l-bg:#1b1630; --l-fg:#cdb8ff; }
#viewer-overlay .viewer-close-btn, #viewer-overlay .viewer-share-btn { top: max(env(safe-area-inset-top, 6px), 6px) !important; height: 44px !important; min-width: 44px !important; padding: 0 16px !important; border-radius: 6px !important; border: 1px solid !important; box-shadow: none !important; font-size: 15px !important; font-weight: 800 !important; }
#viewer-overlay .viewer-close-btn { right: 6px !important; background: var(--g-bg) !important; color: var(--g-fg) !important; border-color: var(--g-fg) !important; }
#viewer-overlay .viewer-share-btn { left: 6px !important; background: var(--b-bg) !important; color: var(--b-fg) !important; border-color: var(--b-fg) !important; }
#viewer-overlay #viewer-counter { top: max(env(safe-area-inset-top, 6px), 6px) !important; height: 44px !important; line-height: 42px !important; box-sizing: border-box; text-align: center; padding: 0 14px !important; border-radius: 6px !important; border: 1px solid var(--xs) !important; background: var(--surface, #fff) !important; color: var(--xi) !important; box-shadow: none !important; }
#viewer-overlay #viewer-counter[style*="display: none"], #viewer-overlay #viewer-counter[style*="display:none"] { display: none !important; }
#viewer-overlay #viewer-img-wrap img { border-radius: 6px !important; border: 1px solid var(--xl) !important; box-shadow: none !important; background: #fff; }
#viewer-overlay #viewer-content iframe { border: 1px solid var(--xl) !important; border-radius: 6px !important; }
#viewer-overlay .viewer-nav-btn { width: 44px !important; height: 44px !important; border-radius: 6px !important; border: 1px solid var(--xl) !important; background: var(--surface, #fff) !important; color: var(--xl) !important; box-shadow: none !important; font-size: 24px !important; }
#viewer-overlay #viewer-meta { background: var(--surface, #fff) !important; border-top: 1px solid var(--xs); padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px)) !important; gap: 6px !important; display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,2fr); grid-auto-columns: minmax(0,1fr); grid-auto-flow: column; align-items: stretch; }
#viewer-overlay #viewer-meta[style*="display: none"], #viewer-overlay #viewer-meta[style*="display:none"] { display: none !important; }
#viewer-overlay .viewer-meta-row { background: var(--g-bg); border: 1px solid var(--g-fg); border-radius: 6px; padding: 2px 4px 2px 2px; min-height: 48px; }
#viewer-overlay #viewer-date { background: transparent !important; border: none !important; color: var(--g-fg) !important; font-weight: 700; text-align: center; font-size: 14px; }
#viewer-overlay #viewer-date::placeholder { color: color-mix(in srgb, var(--g-fg) 70%, transparent); }
#viewer-overlay .viewer-meta-clear { width: 40px; height: 40px; border-radius: 6px; border: 1px solid var(--p-fg); background: var(--p-bg); color: var(--p-fg); }
#viewer-overlay #viewer-note { background: var(--y-bg) !important; border: 1px solid var(--y-fg) !important; color: var(--xi) !important; border-radius: 6px !important; text-align: center; font-weight: 600; font-size: 14px; min-height: 48px; }
#viewer-overlay #viewer-note::placeholder { color: color-mix(in srgb, var(--y-fg) 75%, transparent); }
#viewer-overlay .viewer-meta-crop { margin: 0 !important; min-height: 48px; border-radius: 6px !important; border: 1px solid var(--l-fg) !important; background: var(--l-bg) !important; color: var(--l-fg) !important; font-size: 14px; }
#viewer-overlay .viewer-meta-delete { margin: 0 !important; min-height: 48px; border-radius: 6px !important; border: 1px solid var(--p-fg) !important; background: var(--p-bg) !important; color: var(--p-fg) !important; font-size: 14px; font-weight: 800; }
@media (max-width: 700px) {
  #viewer-overlay #viewer-meta { grid-template-columns: minmax(0,1fr); grid-auto-flow: row; }
}
@media (max-height: 500px) { #viewer-overlay #viewer-meta { display: none !important; } }

/* ── Náhled kartičky koťátka (#kitten-card-preview-overlay), návrh 1 (26. 10. 2026): stejný rám jako okno s volbami ── */
#kitten-card-preview-overlay { --xl:#3b2a7a; --xs:#d6cfee; --xi:#1d1648; --xm:#625a8c; --g-bg:#e3f6ef; --g-fg:#0b5a49; --y-bg:#fff6d9; --y-fg:#7a5a00; --b-bg:#e6f0fd; --b-fg:#1a5299; --l-bg:#efe9ff; --l-fg:#5b2fb0; }
html.dark #kitten-card-preview-overlay { --xl:#8f7fc8; --xs:#3a3160; --xi:#e9e4ff; --xm:#a79bd6; --g-bg:#16382f; --g-fg:#9ce8d2; --y-bg:#3b3210; --y-fg:#f0d36a; --b-bg:#14283f; --b-fg:#a3cbf8; --l-bg:#2a1f4a; --l-fg:#cdb8ff; }
html body #kitten-card-preview-overlay .kc-win { width:96% !important; max-width:1100px !important; max-height:94vh !important; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)) !important; padding:0 !important; display:flex !important; flex-direction:column; overflow:hidden !important; border:1px solid var(--xl) !important; border-radius:6px !important; background:var(--surface) !important; box-shadow:none !important; color:var(--xi); }
#kitten-card-preview-overlay .kc-hd { position:relative; flex:0 0 auto; text-align:center; padding:16px 64px 14px; border-bottom:1px solid var(--xs); min-height:72px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; }
#kitten-card-preview-overlay .kc-hd h2 { margin:0; font-size:22px; font-weight:800; line-height:1.2; color:var(--xi); }
#kitten-card-preview-overlay .kc-x { position:absolute; right:14px; top:14px; width:44px; height:44px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--xs); border-radius:6px; background:var(--surface); color:var(--xm); font-size:15px; cursor:pointer; }
#kitten-card-preview-overlay .kc-ft { flex:0 0 auto; display:flex; justify-content:center; gap:8px; padding:12px 16px; border-top:1px solid var(--xs); background:var(--surface); }
html body #kitten-card-preview-overlay .kc-ft .btn { min-height:48px; min-width:160px; padding:4px 16px; border:1px solid !important; border-radius:6px !important; font-weight:700 !important; box-shadow:none !important; }
html body #kitten-card-preview-overlay .kc-ft .kc-cancel { background:var(--b-bg) !important; color:var(--b-fg) !important; border-color:var(--b-fg) !important; }
html body #kitten-card-preview-overlay .kc-ft .kc-make { background:#b2d6c8 !important; color:#0c5848 !important; border-color:#0f6e5a !important; }
html.dark body #kitten-card-preview-overlay .kc-ft .kc-make { background:#16382f !important; color:#86dcc4 !important; border-color:#86dcc4 !important; }
html body #kitten-card-preview-overlay .kc-win { max-width:760px !important; }
#kitten-card-preview-overlay .kc-sub { position:absolute; left:64px; right:64px; bottom:6px; font-size:13px; color:var(--xm); text-align:center; }
#kitten-card-preview-overlay .kc-hd { flex-direction:column; padding-bottom:22px; }
#kitten-card-preview-overlay .kc-bd { flex:1 1 auto; min-height:0; overflow-y:auto; padding:6px; background:var(--l-bg); }
#kitten-card-preview-overlay #kitten-card-preview-container { display:flex; align-items:center; justify-content:center; margin:0 !important; border:1px solid var(--xs); border-radius:6px; background:var(--surface); padding:10px; }
#kitten-card-preview-overlay #kitten-card-preview-img { display:block; max-width:100%; max-height:62vh; max-height:min(62dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); border-radius:6px !important; border:1px solid var(--xs); box-shadow:none !important; }
html body #kitten-card-preview-overlay .kc-ft .kc-back { background:var(--b-bg) !important; color:var(--b-fg) !important; border-color:var(--b-fg) !important; }
@media (max-width:700px) { #kitten-card-preview-overlay #kitten-card-preview-img { max-height:52vh; max-height:min(52dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }
/* Obě okna kartičky: dole dvě stejná tlačítka přes celou šířku, 56 px (jako ostatní okna) */
#kitten-card-options-overlay .kc-ft, #kitten-card-preview-overlay .kc-ft { display:grid !important; grid-template-columns:1fr 1fr; gap:6px; padding:6px !important; }
html body #kitten-card-options-overlay .kc-ft .btn, html body #kitten-card-preview-overlay .kc-ft .btn { min-height:56px !important; min-width:0 !important; width:100%; margin:0 !important; font-size:15px !important; }
/* Obě okna kartičky se vejdou nad spodní lištu (vrstva .overlay si dole nechává místo na lištu; 98vh na 820 px přetékalo o ~30 px) */
html body #kitten-card-options-overlay .kc-win, html body #kitten-card-preview-overlay .kc-win { max-height: min(94vh, calc(100vh - 20px - var(--nav-bar-height, 0px) - var(--keyboard-height, 0px) - env(safe-area-inset-bottom, 0px))) !important; }
/* Na tabletu/telefonu obecné .modal posouvá okno o -45 % výšky (o 5 % níž než střed); okna kartičky centruje flex vrstvy */
@media (max-width: 820px) { html body #kitten-card-options-overlay .kc-win, html body #kitten-card-preview-overlay .kc-win { position: relative !important; top: auto !important; left: auto !important; transform: none !important; } }
#kitten-card-preview-overlay .kc-hd h2 { max-width: 100%; overflow-wrap: anywhere; }

/* ── Okna Rodokmenu: kamera, soubor, volba PDF (.ro-modal), návrh 1 (26. 10. 2026) ── */
.ro-modal .ro-win { max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
.ro-modal .ro-sub { font-size: 13px; color: var(--xm); margin-top: 2px; word-break: break-word; }
.ro-modal .ro-bd { flex: 1; min-height: 0; overflow-y: auto; padding: 6px; background: var(--l-bg); display: flex; flex-direction: column; gap: 6px; }
.ro-modal .ro-pan { border: 1px solid; border-radius: 6px; padding: 10px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ro-modal .ro-pan[style*="display: none"], .ro-modal .ro-pan[style*="display:none"] { display: none !important; }
.ro-modal .ro-pan h4 { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ro-modal .ro-g { background: var(--g-bg); color: var(--g-fg); border-color: color-mix(in srgb, var(--g-fg) 35%, var(--g-bg)); }
.ro-modal .ro-b { background: var(--b-bg); color: var(--b-fg); border-color: color-mix(in srgb, var(--b-fg) 35%, var(--b-bg)); }
.ro-modal .ro-y { background: var(--y-bg); color: var(--y-fg); border-color: color-mix(in srgb, var(--y-fg) 35%, var(--y-bg)); }
.ro-modal .ro-p { background: var(--p-bg); color: var(--p-fg); border-color: color-mix(in srgb, var(--p-fg) 35%, var(--p-bg)); }
.ro-modal .ro-l { background: var(--surface); color: var(--l-fg); border-color: var(--xs); }
.ro-modal .ro-txt { color: var(--xi); font-size: 14px; line-height: 1.45; word-break: break-word; }
.ro-modal .ro-vf { position: relative; width: 100%; aspect-ratio: 4 / 3; background: #0d0b16; border: 1px solid var(--xl); border-radius: 6px; overflow: hidden; flex: 0 0 auto; }
.ro-modal .ro-vf video { width: 100%; height: 100%; object-fit: cover; display: block; }
.ro-modal .ro-ret { position: absolute; inset: 12%; border: 2px dashed #86dcc4; border-radius: 6px; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.ro-modal .ro-ret span { background: rgba(0,0,0,.6); color: #86dcc4; font-weight: 700; font-size: 12px; padding: 4px 10px; border-radius: 6px; text-align: center; }
.ro-modal .ro-dzwrap { align-items: stretch; }
.ro-modal .ro-dz { border: 1px dashed var(--g-fg); border-radius: 6px; background: var(--surface); padding: 26px 12px; color: var(--xi); display: flex; flex-direction: column; gap: 4px; align-items: center; text-align: center; cursor: pointer; }
.ro-modal .ro-dz[style*="display: none"] { display: none !important; }
.ro-modal .ro-dz b { font-size: 16px; } .ro-modal .ro-dz small { color: var(--xm); } .ro-modal .ro-dz svg { color: var(--g-fg); }
.ro-modal .ro-ch { width: 100%; border: 1px solid; border-radius: 6px; padding: 16px 12px; text-align: center; font: inherit; cursor: pointer; display: flex; flex-direction: column; gap: 4px; min-height: 56px; justify-content: center; align-items: center; }
.ro-modal .ro-ch b { font-size: 16px; } .ro-modal .ro-ch span { font-size: 13px; color: var(--xi); }
.ro-modal .ro-ch.ro-b { border-color: var(--b-fg); } .ro-modal .ro-ch.ro-g { border-color: var(--g-fg); } .ro-modal .ro-ch.ro-l { border-color: var(--l-fg); font-weight: 800; }
.ro-modal .ro-prev { width: 100%; color: var(--xi); font-size: 13px; line-height: 1.5; text-align: left; }
.ro-modal .ro-spin { width: 34px; height: 34px; border: 3px solid var(--xs); border-top-color: var(--xl); border-radius: 50%; animation: ro-spin 1s linear infinite; }
@keyframes ro-spin { to { transform: rotate(360deg); } }
.ro-modal .ro-btns { display: flex; gap: 6px; padding: 6px; border-top: 1px solid var(--xs); flex: 0 0 auto; }
.ro-modal .ro-btns .of-act { flex: 1 1 0; min-width: 0; margin-top: 0; min-height: 56px; font-size: 15px; }
.ro-modal .ro-btns .of-act[disabled] { opacity: .5; cursor: not-allowed; }
@media (max-width: 700px) {
  .ro-modal { padding: 6px !important; }
  .ro-modal .of-hd { padding: 10px 60px; } .ro-modal .of-x { top: 50%; transform: translateY(-50%); right: 8px; }
  .ro-modal .ro-drag { display: none; }
}

/* ── Předplatné (#paywall-overlay), návrh 1 (26. 10. 2026): úzké okno, cena, 3 výhody, velké Koupit, dlaždice odkazů ── */
#paywall-overlay.pw-modal { background: rgba(29,22,72,0.38) !important; padding: 12px !important; }
#paywall-overlay .pw-win { --ofw: 600px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
#paywall-overlay .pw-bd { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 6px; background: var(--l-bg); display: flex; flex-direction: column; gap: 6px; }
#paywall-overlay .pw-desc { margin: 0; border: 1px solid var(--xs); background: var(--surface); border-radius: 6px; padding: 12px; text-align: center; color: var(--xi); font-size: 14px; line-height: 1.5; }
#paywall-overlay .pw-pan { border: 1px solid; border-radius: 6px; padding: 12px; text-align: center; display: flex; flex-direction: column; gap: 4px; }
#paywall-overlay .pw-price { background: var(--g-bg); color: var(--g-fg); border-color: var(--g-fg); }
#paywall-overlay .pw-pr { font-size: 30px; font-weight: 800; color: var(--xi); line-height: 1.2; } #paywall-overlay .pw-pr small { font-size: 14px; font-weight: 600; color: var(--xm); }
#paywall-overlay .pw-in { font-size: 13px; line-height: 1.4; }
#paywall-overlay .pw-in[style*="display: none"], #paywall-overlay .pw-in[style*="display:none"] { display: none !important; }
#paywall-overlay .pw-feats { display: flex; flex-direction: column; gap: 6px; }
#paywall-overlay .pw-t { border: 1px solid; border-radius: 6px; padding: 10px; text-align: center; font-weight: 700; font-size: 14px; }
#paywall-overlay .pw-b { background: var(--b-bg); color: var(--b-fg); border-color: color-mix(in srgb, var(--b-fg) 40%, var(--b-bg)); }
#paywall-overlay .pw-y { background: var(--y-bg); color: var(--y-fg); border-color: color-mix(in srgb, var(--y-fg) 40%, var(--y-bg)); }
#paywall-overlay .pw-p { background: var(--p-bg); color: var(--p-fg); border-color: color-mix(in srgb, var(--p-fg) 40%, var(--p-bg)); }
#paywall-overlay .pw-big { margin: 0 !important; min-height: 60px; font-size: 17px; text-decoration: none; display: flex; align-items: center; justify-content: center; text-align: center; }
#paywall-overlay .pw-big[style*="display: none"], #paywall-overlay .pw-big[style*="display:none"] { display: none !important; }
#paywall-overlay #paywall-stripe-hr { display: none !important; }
#paywall-overlay .pw-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); grid-auto-rows: 1fr; gap: 6px; }
@media (max-width: 520px) { #paywall-overlay .pw-links { grid-template-columns: minmax(0, 1fr); } }
#paywall-overlay .pw-l { min-height: 44px; border: 1px solid var(--xs); border-radius: 6px; background: var(--surface); color: var(--l-fg); font: inherit; font-weight: 700; font-size: 13px; padding: 6px 8px; cursor: pointer; text-align: center; }
#paywall-overlay .pw-l[style*="display: none"], #paywall-overlay .pw-l[style*="display:none"] { display: none !important; }
#paywall-overlay .pw-key { border: 1px solid var(--xs); border-radius: 6px; background: var(--surface); padding: 6px; }
#paywall-overlay .pw-key > * + * { margin-top: 6px; }
#paywall-overlay .pw-f { display: block; border: 1px solid var(--xs); border-radius: 6px; padding: 6px; text-align: center; }
#paywall-overlay .pw-f small { display: block; font-size: 11px; color: var(--xm); }
#paywall-overlay .pw-f input { width: 100%; box-sizing: border-box; border: none !important; text-align: center; font: inherit; font-size: 15px; background: transparent !important; color: var(--xi); outline: none; padding: 4px !important; box-shadow: none !important; }
#paywall-overlay .pw-err { color: var(--p-fg); font-size: 13px; text-align: center; }
#paywall-overlay .pw-key .of-act { margin-top: 6px; min-height: 48px; width: 100%; }
#paywall-overlay .pw-btns { padding: 6px; border-top: 1px solid var(--xs); flex: 0 0 auto; }
#paywall-overlay .pw-btns .of-act { margin: 0; min-height: 56px; width: 100%; }
@media (max-width: 700px) { #paywall-overlay.pw-modal { padding: 6px !important; } #paywall-overlay .pw-win { max-height:98vh; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); } }
#paywall-overlay #license-key-input { text-transform: uppercase; letter-spacing: .5px; }
#paywall-overlay #paywall-stripe-btn[style*="block"] { display: flex !important; }

/* ── Historie plateb (#pay-history-overlay), návrh 3 (26. 10. 2026): souhrny, pruh, tabulka plateb a vratek ── */
#pay-history-overlay.ph-modal { background: rgba(29,22,72,0.38) !important; padding: 12px !important; }
#pay-history-overlay .ph-win { --ofw: 880px; max-height:94vh; max-height:min(94dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
#pay-history-overlay .ph-sub { font-size: 13px; color: var(--xm); margin-top: 2px; word-break: break-word; }
#pay-history-overlay .ph-bd { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 6px; background: var(--l-bg); display: flex; flex-direction: column; gap: 6px; }
#pay-history-overlay .ph-g3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 6px; }
#pay-history-overlay .ph-t { border: 1px solid; border-radius: 6px; padding: 8px 4px; text-align: center; }
#pay-history-overlay .ph-t small { display: block; font-size: 11px; } #pay-history-overlay .ph-t b { font-size: 16px; color: var(--xi); word-break: break-word; }
#pay-history-overlay .ph-g { background: var(--g-bg); color: var(--g-fg); border-color: var(--g-fg); }
#pay-history-overlay .ph-p { background: var(--p-bg); color: var(--p-fg); border-color: var(--p-fg); }
#pay-history-overlay .ph-b { background: var(--b-bg); color: var(--b-fg); border-color: var(--b-fg); }
#pay-history-overlay .ph-bar { height: 8px; border: 1px solid var(--g-fg); border-radius: 6px; overflow: hidden; background: var(--surface); }
#pay-history-overlay .ph-bar i { display: block; height: 100%; background: var(--g-fg); }
#pay-history-overlay .ph-cap { font-size: 12px; font-weight: 800; color: var(--xm); text-align: center; text-transform: uppercase; letter-spacing: .05em; margin-top: 4px; }
#pay-history-overlay .ph-cap-r { color: var(--p-fg); }
#pay-history-overlay .ph-empty { border: 1px solid var(--xs); border-radius: 6px; background: var(--surface); padding: 16px; text-align: center; color: var(--xm); }
#pay-history-overlay .ph-row { display: grid; grid-template-columns: 120px minmax(0,1fr) 140px 140px; gap: 6px; width: 100%; padding: 0; margin: 0; border: none; background: none; font: inherit; text-align: center; }
#pay-history-overlay .ph-head span { font-size: 11px; color: var(--xm); font-weight: 700; }
#pay-history-overlay .ph-pay { cursor: pointer; }
#pay-history-overlay .ph-c { border: 1px solid var(--xs); border-radius: 6px; background: var(--surface); padding: 10px 6px; color: var(--xi); font-size: 14px; display: flex; align-items: center; justify-content: center; text-align: center; word-break: break-word; min-width: 0; }
#pay-history-overlay .ph-pay:hover .ph-c { border-color: var(--xl); }
#pay-history-overlay .ph-am { font-weight: 800; color: var(--g-fg); }
#pay-history-overlay .ph-ref { grid-template-columns: 120px minmax(0,1fr) 140px 44px; }
#pay-history-overlay .ph-ref .ph-c { border-color: color-mix(in srgb, var(--p-fg) 40%, var(--p-bg)); background: var(--p-bg); }
#pay-history-overlay .ph-ref .ph-am, #pay-history-overlay .ph-note { color: var(--p-fg); }
#pay-history-overlay .ph-del { min-height: 44px; border: 1px solid var(--p-fg); border-radius: 6px; background: var(--surface); color: var(--p-fg); display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
#pay-history-overlay .ph-att:empty { display: none; }
#pay-history-overlay .ph-btns { display: flex; gap: 6px; padding: 6px; border-top: 1px solid var(--xs); flex: 0 0 auto; }
#pay-history-overlay .ph-btns .of-act { flex: 1 1 0; min-width: 0; margin: 0; min-height: 56px; }
@media (max-width: 700px) {
  #pay-history-overlay.ph-modal { padding: 6px !important; }
  #pay-history-overlay .ph-win { max-height:98vh; max-height:min(98dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px)); }
  #pay-history-overlay .of-hd { padding: 10px 60px; } #pay-history-overlay .of-x { top: 50%; transform: translateY(-50%); right: 8px; }
  #pay-history-overlay .ph-row { grid-template-columns: 92px minmax(0,1fr) 108px; }
  #pay-history-overlay .ph-ref { grid-template-columns: 92px minmax(0,1fr) 100px 44px; }
  #pay-history-overlay .ph-m { display: none !important; }
  #pay-history-overlay .ph-t b { font-size: 14px; }
}


/* Přírůstek / úbytek váhy (graf váhy, seznam vážení): tmavší zelená a červená pro čitelnost na bílé (dřív #4caf50 = 2,78 : 1), v tmavém režimu světlé odstíny (Test 27. 10. 2026) */
.wc-plus { color:#2e7d32 !important; } .wc-minus { color:#c62828 !important; }
html.dark .wc-plus { color:#7ed67f !important; } html.dark .wc-minus { color:#ff8a80 !important; }
/* Test 27. 10. 2026 – kontrast: textové barvy oken ztmaveny (světlý režim) / zesvětleny (tmavý) tak, aby text měl aspoň 4,5 : 1. Pastelová pozadí beze změny.
   --g-fg #0f6e5a→#0b5a49, --xm #6f6598→#625a8c, --b-fg #1f5fb0→#1a5299, --o-fg #b4531a→#9a4514; tmavý --g-fg →#9ce8d2, --b-fg →#a3cbf8, --p-fg →#f6b5cf, --l-fg →#cdb8ff; nový vzhled --text3 #7c6aa2→#6a5893. */
/* Test 27. 10. 2026 – dotykové plochy: „ד u data měl klikací výšku 28 px; teď 44 px (průhledné tlačítko, křížek vypadá stejně). */
.of-modal .of-clr { bottom:0; height:44px; }
#pup-overlay .apple-sec-content .field:has(.date-display) > div > button { top:50%; height:44px; width:44px; right:0; transform:translateY(-50%); }

/* Moje vizitky (Nastavení → Přehledy) */
#my-showcases-modal .mv-intro { font-size:13px; line-height:1.4; text-align:center; margin:0 0 8px; opacity:.85; }
#my-showcases-modal .mv-list { display:flex; flex-direction:column; gap:8px; margin-bottom:8px; max-height:52vh; overflow-y:auto; -webkit-overflow-scrolling:touch; }
#my-showcases-modal .mv-row { display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; padding:8px 10px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); }
#my-showcases-modal .mv-nm { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1 1 140px; }
#my-showcases-modal .mv-nm b { font-size:14.5px; overflow-wrap:anywhere; }
#my-showcases-modal .mv-st { font-size:12px; font-weight:700; }
#my-showcases-modal .mv-st.on { color:var(--g-fg, #065F46); }
#my-showcases-modal .mv-st.off { color:var(--y-fg, #92400E); }
#my-showcases-modal .mv-act { display:flex; gap:6px; flex-wrap:wrap; }
#my-showcases-modal .mv-act button { min-height:44px; padding:4px 10px; border:1px solid var(--xl); border-radius:6px; background:var(--surface); color:inherit; font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; }
#my-showcases-modal .mv-act button.p { border-color:var(--g-fg, #065F46); background:var(--g-bg, #ECFDF5); color:var(--g-fg, #065F46); }
#my-showcases-modal .mv-act button:disabled { opacity:.5; cursor:default; }
#my-showcases-modal .mv-prog { min-height:18px; text-align:center; font-size:13px; font-weight:700; margin-bottom:6px; }
#my-showcases-modal .mv-empty { text-align:center; padding:12px; font-size:13px; opacity:.8; }

/* QR kód a vizitky (29. 10. 2026), návrh 1: kompaktní řádky s ikonami. Sjednocený ostrý styl: dlaždice se zaoblením 5 px, lemování 1 px, bez stínů a pilulek,
   mezery 6 px; barevný pruh vlevo ukazuje stav (zelená online, oranžová změněno, šedá nezveřejněno); fajfky jsou stejné dlaždice. */
#my-showcases-modal .mv-intro { margin:0 0 6px; text-align:center; font-size:13px; line-height:1.35; opacity:.85; }
#my-showcases-modal .mv-list { display:flex; flex-direction:column; flex:0 0 auto; align-content:flex-start; gap:6px; margin-bottom:6px; max-height:none; overflow:visible; }
#my-showcases-modal .qv-h { margin:6px 0 0; text-align:center; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--accent, #5B3FB8); }
#my-showcases-modal .qv-note { margin:0; text-align:center; font-size:12px; line-height:1.35; opacity:.75; }
#my-showcases-modal .qv-warn { padding:8px 10px; border:1px solid var(--y-fg, #92400E); border-radius:5px; background:var(--y-bg, #FFFBEB); color:var(--y-fg, #92400E); font-size:12.5px; font-weight:700; line-height:1.35; text-align:center; }
#my-showcases-modal .qv-fj { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:6px; padding:0; border:0; background:none; }
#my-showcases-modal .qv-fj label { display:flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:4px 6px; border:1px solid var(--xl); border-radius:5px; background:var(--surface); font-size:13px; font-weight:700; text-align:center; cursor:pointer; box-sizing:border-box; }
#my-showcases-modal .qv-fj label:has(input:checked) { border-color:var(--g-fg, #065F46); background:var(--g-bg, #ECFDF5); color:var(--g-fg, #065F46); }
#my-showcases-modal .qv-fj input { width:18px; height:18px; flex:none; margin:0; accent-color:var(--g-fg, #065F46); }
#my-showcases-modal .qv-fj label span { min-width:0; overflow-wrap:anywhere; line-height:1.15; }
#my-showcases-modal .mv-row { display:flex; flex:0 0 auto; flex-direction:row; align-items:center; gap:8px; padding:0 6px 0 0; min-height:54px; border:1px solid var(--xl); border-radius:5px; background:var(--surface); overflow:hidden; box-sizing:border-box; }
#my-showcases-modal .qv-bar { align-self:stretch; flex:none; width:5px; background:#cbd5e1; }
#my-showcases-modal .qv-bar.on { background:#16a34a; }
#my-showcases-modal .qv-bar.zm { background:#d97706; }
#my-showcases-modal .mv-nm { display:flex; flex:1 1 0; flex-direction:column; align-items:flex-start; gap:2px; min-width:0; padding:6px 0; text-align:left; }
#my-showcases-modal .mv-nm b { font-size:14px; line-height:1.2; overflow-wrap:anywhere; }
#my-showcases-modal .mv-st { font-size:12px; font-weight:700; line-height:1.2; }
#my-showcases-modal .mv-st.on { color:var(--g-fg, #065F46); }
#my-showcases-modal .mv-st.off { color:var(--y-fg, #92400E); }
#my-showcases-modal .mv-st.zm { color:var(--o-fg, #B45309); }
#my-showcases-modal .mv-act { display:flex; flex:none; gap:6px; }
#my-showcases-modal .mv-act button { display:flex; align-items:center; justify-content:center; gap:6px; min-width:44px; min-height:44px; padding:0; border:1px solid var(--xl); border-radius:5px; background:var(--surface); color:inherit; font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; box-sizing:border-box; }
#my-showcases-modal .mv-act button.qv-txt { padding:0 12px; }
#my-showcases-modal .mv-act button.p { border-color:var(--g-fg, #065F46); background:var(--g-bg, #ECFDF5); color:var(--g-fg, #065F46); }
#my-showcases-modal .mv-act button.d { border-color:var(--r-fg, #B42318); background:var(--r-bg, #FEF3F2); color:var(--r-fg, #B42318); }
#my-showcases-modal .mv-act button:disabled { opacity:.5; cursor:default; }
#my-showcases-modal .qv-i { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
#my-showcases-modal .qv-stanice { flex-wrap:wrap; justify-content:center; padding:8px; }
#my-showcases-modal .qv-qr { flex:none; width:84px; height:84px; }
#my-showcases-modal .qv-qr svg { width:84px !important; height:84px !important; border:1px solid var(--xl); border-radius:5px !important; }
#my-showcases-modal .qv-st-txt { display:flex; flex:1 1 150px; flex-direction:column; align-items:flex-start; gap:3px; min-width:150px; text-align:left; }
#my-showcases-modal .qv-st-txt b { font-size:14.5px; line-height:1.2; overflow-wrap:anywhere; }
#my-showcases-modal .qv-url { font-size:12px; font-weight:700; color:var(--g-fg, #065F46); overflow-wrap:anywhere; }
#my-showcases-modal .mv-prog { min-height:0; text-align:center; font-size:13px; font-weight:700; }
#my-showcases-modal .mv-empty { text-align:center; padding:12px; font-size:13px; opacity:.8; }
@media (max-width:640px) { #my-showcases-modal .qv-fj { grid-template-columns:repeat(2, minmax(0, 1fr)); } #my-showcases-modal .mv-row.qv-stanice .mv-act { flex-basis:100%; justify-content:center; } }
#my-showcases-modal .of-act { margin-top:6px; min-height:48px; }
#my-showcases-modal .of-act.of-d { background:var(--r-bg, #FEF3F2); color:var(--r-fg, #B42318); border-color:var(--r-fg, #B42318); }
#my-showcases-modal .qv-foot { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px; margin-top:6px; }
#my-showcases-modal .qv-foot .of-act { margin-top:0; min-height:44px; font-size:13px; padding:4px 8px; }
#my-showcases-modal .qv-foot .of-act:last-child { grid-column:1 / -1; }
#my-showcases-modal .mv-intro { font-size:12.5px; line-height:1.3; }
#my-showcases-modal .qv-fj label { min-height:40px; }
#my-showcases-modal .qv-leg { display:flex; flex-wrap:wrap; justify-content:center; gap:4px 12px; margin:0 0 6px; padding:6px 8px; border:1px solid var(--xl); border-radius:5px; background:var(--surface2, #f3f1fb); font-size:12px; font-weight:700; line-height:1.3; }
#my-showcases-modal .qv-leg span { display:inline-flex; align-items:center; gap:4px; }
/* Tlačítka vizitek: stejně velké dlaždice, barva podle významu (modrá odkaz, fialová QR karta, zelená zveřejnit/aktualizovat, červená odstranit); na telefonu pod jménem přes celou šířku */
#my-showcases-modal .mv-act button.b { border-color:#1D4ED8; background:#EFF6FF; color:#1D4ED8; }
#my-showcases-modal .mv-act button.v { border-color:#5B3FB8; background:#F3EDFF; color:#5B3FB8; }
@media (max-width:480px) {
  #my-showcases-modal .mv-row { flex-wrap:wrap; }
  #my-showcases-modal .mv-nm { flex:1 1 100%; padding:6px 8px 0 4px; }
  #my-showcases-modal .mv-act { flex:1 1 100%; display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); padding:0 0 6px 4px; }
  #my-showcases-modal .mv-row.qv-stanice .mv-act { flex-basis:100%; }
}
/* Popisy seřazené (Petr 29. 10. 2026): fajfky a popisky začínají vždy na stejném místě (zleva), legenda ikonek je pravidelná mřížka */
#my-showcases-modal .qv-fj label { justify-content:flex-start; text-align:left; padding:6px 10px; gap:10px; }
#my-showcases-modal .qv-leg { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:4px 12px; justify-content:stretch; padding:8px 10px; }
#my-showcases-modal .qv-leg span { justify-content:flex-start; text-align:left; white-space:nowrap; }
@media (max-width:480px) { #my-showcases-modal .qv-leg { grid-template-columns:1fr; } #my-showcases-modal .qv-leg span { white-space:normal; } }

/* Karta koťátka – panel „Důležité“ nahoře (30. 10. 2026, návrh 3): jméno, pohlaví, barva, váha + čas, úmrtí, poznámka.
   Rozložení jako ostatní dlaždice: 1 px lemování, rohy 6 px, bez stínů, text uprostřed. */
#pup-overlay #pt-important { background:var(--l-bg); }
#pup-overlay .pt-imp { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
#pup-overlay .pt-i-name, #pup-overlay .pt-i-sex { grid-column:1 / -1; }
#pup-overlay .pt-i-sex { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
#pup-overlay .pt-sexbtn { min-height:52px; padding:4px 6px; border:1px solid; border-radius:6px; font-family:inherit; font-size:15px; font-weight:700; text-align:center; cursor:pointer; box-shadow:none; background:var(--surface); line-height:1.15; }
#pup-overlay .pt-sexbtn.pt-b.on { background:var(--b-bg); font-weight:800; }
#pup-overlay .pt-sexbtn.pt-p.on { background:var(--p-bg); font-weight:800; }
#pup-overlay .pt-sexbtn:not(.on) { opacity:.6; }
#pup-overlay .pt-death { margin-top:10px; }
#pup-overlay .pt-sw2 { position:relative; display:flex; align-items:center; justify-content:center; gap:10px; min-height:44px; cursor:pointer; font-size:15px; font-weight:700; color:var(--p-fg); }
#pup-overlay .pt-sw2 input { position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
#pup-overlay .pt-knob { position:relative; flex:0 0 auto; width:38px; height:22px; border:1px solid var(--p-fg); border-radius:11px; background:var(--surface); }
#pup-overlay .pt-knob::after { content:''; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:var(--p-fg); }
#pup-overlay .pt-sw2 input:checked + .pt-knob { background:var(--p-bg); }
#pup-overlay .pt-sw2 input:checked + .pt-knob::after { left:18px; }
#pup-overlay .pt-sw2 input:focus-visible + .pt-knob { outline:2px solid var(--p-fg); outline-offset:1px; }
#pup-overlay .pt-death .pt-death-x { display:none; margin-top:6px; }
#pup-overlay .pt-death:has(#p-deceased:checked) .pt-death-x { display:flex; }
#pup-overlay .pt-i-note { margin-top:8px; }
#pup-overlay .pt-i-note textarea { display:block; width:100%; min-height:56px; padding:0; margin:0; border:0 !important; border-radius:0 !important; background:transparent !important; color:inherit; font:inherit; font-size:15px; font-weight:700; text-align:center; resize:vertical; outline:none; box-shadow:none; }
@media (max-width:600px) {
  #pup-overlay .pt-imp { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #pup-overlay .pt-i-color { grid-column:1 / -1; }
  #pup-overlay .pt-sexbtn, #pup-overlay .pt-i-note textarea { font-size:14px; }
}