/* ═══════════════════════════════════════════════
   Xtream GUI — designový systém
   Tmavý motiv je výchozí, světlý se přepíná
   pouze přepsáním proměnných na :root.
   ═══════════════════════════════════════════════ */

:root {
  --bg:            #0a0d14;
  --bg-elev:       #10141f;
  --surface:       #161b28;
  --surface-2:     #1d2333;
  --surface-3:     #262d40;
  --line:          #262d3d;
  --line-soft:     #1b2130;

  --text:          #e8ecf6;
  --text-dim:      #98a2b8;
  --text-faint:    #64708a;

  --accent:        #6d5efc;
  --accent-hi:     #8a7dff;
  --accent-soft:   #6d5efc22;
  --cyan:          #37d4cf;
  --green:         #35c58a;
  --amber:         #f3b23c;
  --red:           #f0556b;

  --radius:        14px;
  --radius-sm:     9px;
  --radius-lg:     20px;

  --shadow:        0 10px 30px -12px #00000099;
  --shadow-lg:     0 24px 60px -18px #000000cc;

  --sidebar-w:     238px;
  --topbar-h:      64px;

  --ease:          cubic-bezier(.22,.61,.36,1);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
}

[data-theme="light"] {
  --bg:            #f5f6fa;
  --bg-elev:       #ffffff;
  --surface:       #ffffff;
  --surface-2:     #f0f2f7;
  --surface-3:     #e4e8f0;
  --line:          #dfe3ec;
  --line-soft:     #eaedf3;

  --text:          #141824;
  --text-dim:      #5b6478;
  --text-faint:    #8c94a6;

  --accent:        #5a49f0;
  --accent-hi:     #4536dd;
  --accent-soft:   #5a49f018;

  --shadow:        0 8px 24px -14px #1b224033;
  --shadow-lg:     0 24px 60px -20px #1b224040;
}

* { box-sizing: border-box; }

html, body {
  margin: 0; padding: 0; height: 100%;
  background: var(--bg); color: var(--text);
  font-family: var(--font);
  font-size: 15px; line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior: none;
}
body { overflow: hidden; }

a { color: inherit; text-decoration: none; cursor: pointer; }
button { font: inherit; color: inherit; }
[hidden] { display: none !important; }
::selection { background: var(--accent); color: #fff; }

/* ── posuvníky ── */
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--surface-3); border-radius: 8px; border: 3px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: var(--text-faint); background-clip: content-box; }

/* ═══ ikony ═══ */
.ico { width: 20px; height: 20px; display: inline-block; flex: none;
  background: currentColor; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; }

/* ═══ tlačítka ═══ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 10px 18px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--surface-2); cursor: pointer; font-weight: 600; font-size: 14px;
  transition: background .16s var(--ease), transform .12s var(--ease), border-color .16s;
  white-space: nowrap;
}
.btn:hover { background: var(--surface-3); }
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--accent); border-color: transparent; color: #fff; }
.btn-primary:hover { background: var(--accent-hi); }
.btn-ghost { background: transparent; }
.btn-ghost:hover { background: var(--surface-2); }
.btn-lg { padding: 13px 24px; font-size: 15px; }
.btn-sm { padding: 7px 13px; font-size: 13px; }
.btn-danger { color: var(--red); border-color: #f0556b44; }
.btn-danger:hover { background: #f0556b1a; }
.btn[disabled] { opacity: .45; pointer-events: none; }
.btn.on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-hi); }

.icon-btn {
  display: inline-grid; place-items: center; width: 38px; height: 38px; flex: none;
  border-radius: 11px; border: 0; background: transparent; cursor: pointer;
  color: var(--text-dim); transition: background .16s, color .16s, transform .1s;
}
.icon-btn:hover { background: var(--surface-2); color: var(--text); }
.icon-btn:active { transform: scale(.92); }
.icon-btn.sm { width: 30px; height: 30px; border-radius: 9px; }
.icon-btn.sm .ico { width: 16px; height: 16px; }
.icon-btn.lg { width: 46px; height: 46px; }
.icon-btn.on { color: var(--accent-hi); background: var(--accent-soft); }

/* ═══ přihlášení ═══ */
.login {
  position: fixed; inset: 0; display: grid; place-items: center; padding: 24px;
  background:
    radial-gradient(1100px 620px at 18% -10%, #6d5efc26, transparent 62%),
    radial-gradient(900px 560px at 88% 108%, #37d4cf1f, transparent 60%),
    var(--bg);
  overflow: auto;
}
.login-card {
  width: 100%; max-width: 420px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-lg); padding: 34px 30px 26px; box-shadow: var(--shadow-lg);
  display: flex; flex-direction: column; gap: 15px;
}
.login-brand { display: flex; align-items: center; gap: 14px; margin-bottom: 6px; }
.login-brand h1 { margin: 0; font-size: 25px; letter-spacing: -.5px; }
.login-brand p { margin: 2px 0 0; color: var(--text-dim); font-size: 13.5px; }
.brand-mark { width: 42px; height: 42px; color: var(--accent); flex: none; }

.field { display: flex; flex-direction: column; gap: 6px; }
.field > span { font-size: 12.5px; font-weight: 600; color: var(--text-dim); letter-spacing: .2px; }
.field input, .select {
  width: 100%; padding: 11px 14px; border-radius: var(--radius-sm);
  border: 1px solid var(--line); background: var(--bg-elev); color: var(--text);
  font: inherit; font-size: 14.5px; transition: border-color .16s, box-shadow .16s;
}
.field input:focus, .select:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft);
}
.check { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--text-dim); cursor: pointer; }
.check input { width: 17px; height: 17px; accent-color: var(--accent); }
.login-error {
  margin: 0; padding: 11px 14px; border-radius: var(--radius-sm);
  background: #f0556b1c; border: 1px solid #f0556b40; color: #ff8fa0; font-size: 13.5px;
}
[data-theme="light"] .login-error { color: #b3243a; }
.login-note { margin: 4px 0 0; font-size: 11.5px; color: var(--text-faint); line-height: 1.55; }
.login-note code { background: var(--surface-2); padding: 1px 5px; border-radius: 5px; font-size: 11px; }

/* ═══ rozvržení ═══ */
.app { display: grid; grid-template-columns: var(--sidebar-w) 1fr; height: 100vh; height: 100dvh; }

.sidebar {
  display: flex; flex-direction: column; gap: 4px; padding: 18px 12px 12px;
  background: var(--bg-elev); border-right: 1px solid var(--line-soft); min-height: 0;
}
.side-brand { display: flex; align-items: center; gap: 10px; padding: 0 10px 18px; font-weight: 700; font-size: 17px; letter-spacing: -.3px; }
.side-brand .brand-mark { width: 26px; height: 26px; }

.side-nav { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; flex: 1; min-height: 0; }
.nav-item {
  display: flex; align-items: center; gap: 11px; padding: 9px 12px; border-radius: 10px;
  color: var(--text-dim); font-size: 14.5px; font-weight: 500; position: relative;
  transition: background .15s, color .15s;
}
.nav-item:hover { background: var(--surface-2); color: var(--text); }
.nav-item.active { background: var(--accent-soft); color: var(--accent-hi); font-weight: 600; }
.nav-item.active::before {
  content: ''; position: absolute; left: -12px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 20px; border-radius: 0 3px 3px 0; background: var(--accent);
}
.nav-sep { height: 1px; background: var(--line-soft); margin: 9px 12px; }

/* Shluky v liště: nadpis říká, odkud data jsou. Skrytý shluk zabírá nulu,
   ať v buildu bez crawleru nezůstane po prostředním bloku mezera. */
.nav-group { display: flex; flex-direction: column; gap: 2px; }
.nav-group[hidden] { display: none; }
.nav-group + .nav-group { margin-top: 16px; }
/* Nadpis skupiny je zároveň přepínač: šipka sbalí celou sekci. U tří sekcí
   po sedmi položkách je lišta dlouhá a člověk většinou pracuje jen v jedné. */
.nav-group-head {
  display: flex; align-items: center; gap: 6px; width: 100%;
  font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-dim); padding: 4px 12px 6px; user-select: none;
  background: none; border: 0; cursor: pointer; text-align: left;
  font-family: inherit; transition: color .15s;
}
.nav-group-head:hover { color: var(--text); }
.nav-sipka {
  width: 12px; height: 12px; flex: none; opacity: .7;
  transition: transform .18s var(--ease, ease);
}
.nav-group.sbaleno .nav-sipka { transform: rotate(-90deg); }
/* Sbalená skupina schová položky, nadpis zůstává — jinak by nešla rozbalit. */
.nav-group.sbaleno .nav-item { display: none; }
@media (prefers-reduced-motion: reduce) { .nav-sipka { transition: none; } }
.nav-badge {
  margin-left: auto; min-width: 21px; height: 21px; padding: 0 6px; border-radius: 999px;
  background: var(--accent); color: #fff; font-size: 11.5px; font-weight: 700;
  display: grid; place-items: center;
}

.side-foot { display: flex; flex-direction: column; gap: 10px; padding-top: 10px; }
.mini-queue { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 10px 11px; }
.mini-queue-head { display: flex; align-items: center; gap: 6px; margin-bottom: 7px; }
.mini-queue-name { font-size: 12px; font-weight: 600; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-queue-meta { font-size: 11px; color: var(--text-faint); margin-top: 6px; font-variant-numeric: tabular-nums; }

.bar { height: 5px; border-radius: 99px; background: var(--surface-3); overflow: hidden; }
.bar-fill { height: 100%; width: 0; border-radius: 99px; background: linear-gradient(90deg, var(--accent), var(--cyan)); transition: width .35s var(--ease); }
.bar-fill.indet { width: 35% !important; animation: slide 1.4s ease-in-out infinite; }
@keyframes slide { 0% { margin-left: -35%; } 100% { margin-left: 100%; } }

.main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }

.topbar {
  display: flex; align-items: center; gap: 8px; height: var(--topbar-h); flex: none;
  padding: 0 20px; border-bottom: 1px solid var(--line-soft);
  background: color-mix(in srgb, var(--bg) 86%, transparent);
  backdrop-filter: blur(14px); position: relative; z-index: 20;
}
/* min-width: 0 — bez toho se pole nesmrští pod šířku svého placeholderu
   a na úzkém telefonu vystrčí pravou část lišty mimo obrazovku */
.search { flex: 1; min-width: 0; max-width: 560px; display: flex; align-items: center; gap: 9px;
  padding: 0 13px; height: 40px; border-radius: 999px; background: var(--surface);
  border: 1px solid var(--line); transition: border-color .16s, box-shadow .16s; }
.search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.search .ico { color: var(--text-faint); width: 17px; height: 17px; }
.search input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--text); font: inherit; font-size: 14px; outline: none; }
.search input::-webkit-search-cancel-button { display: none; }
.topbar-right { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.topbar-right #btn-restart { margin-right: 8px; gap: 6px; }
.topbar-right #btn-restart .ico { width: 16px; height: 16px; }
.only-mobile { display: none; }

.content { flex: 1; overflow-y: auto; overflow-x: hidden; scroll-behavior: smooth; }
.page { padding: 26px 30px 60px; max-width: 1680px; }
.page-wide { padding: 0 0 60px; max-width: none; }

/* ═══ hlavičky sekcí ═══ */
.page-head { display: flex; align-items: flex-end; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; }
.page-head h1 { margin: 0; font-size: 27px; letter-spacing: -.6px; font-weight: 700; }
.page-head .sub { color: var(--text-dim); font-size: 13.5px; margin-bottom: 4px; }
.page-head .grow { flex: 1; }

/* ═══ lepkavé lišty (dom.js: lepkava) ═══
   Ovládání stránky — přepínače, filtry, katalogy, lišta s výběrem — zůstává
   při posouvání nahoře pod horním pruhem. Dokud lišta neleží „přilepená",
   splývá se stránkou; přilepená dostane stín, ať je vidět, že obsah pod
   ní jede dál. Pozadí je schválně neprůhledné, ne rozmazané: backdrop-filter
   nad dlouhým seznamem WebKit (Safari, nativní okno) při posouvání brzdí. */
.lepkava { position: sticky; top: 0; z-index: 15;
  display: flex; flex-direction: column; gap: 10px;
  margin: -10px -30px 16px; padding: 10px 30px 12px;
  background: var(--bg); transition: box-shadow .2s var(--ease), background .2s var(--ease); }
.lepkava.prilepena {
  box-shadow: 0 1px 0 var(--line), 0 12px 24px -18px rgba(0, 0, 0, .55); }
/* zdvojená třída: vlastní okraje lišt (.lib-filters, .lib-bulk…) jsou v souboru níž */
.lepkava.lepkava > * { margin-top: 0; margin-bottom: 0; }
.lepkava > [hidden] { display: none; }
/* úroveň 2: hlavička sekce pod první lištou, drží jen v rámci své sekce */
.lepkava-2 { top: var(--lepkava-1, 0px); z-index: 14; margin-top: 0; }
/* lišta ve sloupci vedle panelu — nesahá přes okraje stránky */
.lepkava-uzka { margin-left: -6px; margin-right: -6px; padding-left: 6px; padding-right: 6px;
  border-radius: 0 0 var(--radius-sm) var(--radius-sm); }
.lepkava .chips { padding-bottom: 2px; }
.lepkava .queue-toolbar { padding: 10px 14px; }
.lepkava .lib-bulk { padding: 8px 12px; border-radius: var(--radius); }
.lepkava .row-head { min-height: 34px; }
@media (max-width: 1000px) {
  .lepkava { margin-left: -18px; margin-right: -18px; padding-left: 18px; padding-right: 18px; }
  .lepkava-uzka { margin-left: -6px; margin-right: -6px; padding-left: 6px; padding-right: 6px; }
}
@media (prefers-reduced-motion: reduce) { .lepkava { transition: none; } }

.row-head { display: flex; align-items: center; gap: 12px; margin: 0 0 13px; }
.row-head h2 { margin: 0; font-size: 17.5px; font-weight: 650; letter-spacing: -.3px; }
.row-head .count { font-size: 12.5px; color: var(--text-faint); }
.row-head .grow { flex: 1; }

/* ═══ mřížka plakátů ═══ */
.grid {
  display: grid; gap: 20px 16px;
  grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
}
.grid.wide { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }

.card { cursor: pointer; display: flex; flex-direction: column; gap: 8px; position: relative; }
.poster {
  position: relative; aspect-ratio: 2/3; border-radius: var(--radius); overflow: hidden;
  background: var(--surface-2); box-shadow: var(--shadow);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease);
}
.card.landscape .poster { aspect-ratio: 16/9; }
.poster img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity .3s; }
.poster img.loaded { opacity: 1; }
.card:hover .poster { transform: translateY(-4px) scale(1.022); box-shadow: var(--shadow-lg); }
.poster-fallback {
  position: absolute; inset: 0; display: grid; place-items: center; padding: 12px;
  text-align: center; font-size: 12.5px; font-weight: 600; color: var(--text-faint);
  background: linear-gradient(150deg, var(--surface-2), var(--surface));
}
.poster-glow { position: absolute; inset: 0; background: linear-gradient(to top, #000000cc, transparent 55%); opacity: 0; transition: opacity .22s; }
.card:hover .poster-glow { opacity: 1; }
.poster-actions {
  position: absolute; inset: auto 8px 8px; display: flex; gap: 6px; justify-content: flex-end;
  opacity: 0; transform: translateY(6px); transition: opacity .2s, transform .2s;
}
.card:hover .poster-actions { opacity: 1; transform: none; }
.poster-actions .icon-btn { background: #0b0e14cc; color: #fff; backdrop-filter: blur(8px); width: 34px; height: 34px; }
.poster-actions .icon-btn:hover { background: var(--accent); }

.badge {
  position: absolute; top: 8px; left: 8px; padding: 3px 8px; border-radius: 7px;
  background: #0b0e14cc; backdrop-filter: blur(8px); color: #fff;
  font-size: 11px; font-weight: 700; letter-spacing: .3px;
}
.badge.right { left: auto; right: 8px; }
.badge.live { background: var(--red); }
.badge.rating { display: flex; align-items: center; gap: 3px; }
.badge.fav { background: var(--amber); color: #1a1200; }

/* kooperace: co s titulem dělají ostatní (koop.js) */
.koop-odznaky { position: absolute; top: 8px; left: 8px; display: flex; gap: 4px; flex-wrap: wrap; max-width: calc(100% - 70px); z-index: 2; cursor: help; }
.koop-bublina {
  position: fixed; z-index: 1000; max-width: 340px; min-width: 220px; padding: 12px 14px;
  background: var(--bg-elev); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg); font-size: 13px; line-height: 1.45;
}
.koop-bublina[hidden] { display: none; }
.kb-titul { font-weight: 700; font-size: 14px; margin-bottom: 6px; }
.kb-sekce { padding-top: 8px; margin-top: 8px; border-top: 1px solid var(--line-soft); }
.kb-nadpis { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--text-faint); margin-bottom: 3px; }
.kb-nadpis .ico { width: 13px; height: 13px; }
.kb-radek { margin: 3px 0; }
.kb-radek span { color: var(--text-dim); }
.kb-pozn { color: var(--text-dim); font-style: italic; font-size: 12.5px; }
.kb-chyba { color: var(--red); font-style: normal; }
.kb-pruh { display: flex; align-items: center; gap: 8px; margin-top: 3px; font-size: 12px; color: var(--text-dim); }
.kb-draha { width: 90px; height: 4px; border-radius: 2px; background: var(--surface-3); overflow: hidden; flex: none; }
.kb-draha i { display: block; height: 100%; background: var(--accent); }

.koop-odznaky.nize { top: 34px; }
.koop-odznaky[hidden] { display: none; }
.koop-o {
  display: inline-flex; align-items: center; gap: 2px; padding: 2px 6px; border-radius: 7px;
  background: #0b0e14cc; backdrop-filter: blur(8px); color: #fff; font-size: 11px; font-weight: 700;
}
.koop-o .ico { width: 12px; height: 12px; }
.koop-o.hotovo { background: var(--green); color: #04130c; }
.koop-o.prace { background: var(--accent); }
.koop-o.moje:not(.prace):not(.zabrano):not(.hotovo) { box-shadow: inset 0 0 0 1px #ffffff88; background: #0b0e1499; }
.koop-o.prace.moje { background: #0b0e14cc; color: var(--accent-hi); box-shadow: inset 0 0 0 1px var(--accent-hi); }
body:not(.koop-on) .koop-jen { display: none !important; }
body:not(.koop-pri) .koop-nav { display: none !important; }
.koop-o.prani { background: #e8609c; color: #fff; }
.koop-o.prani.moje { background: #0b0e14cc; color: #f07fb1; box-shadow: inset 0 0 0 1px #f07fb1; }
.koop-prani-info { background: #e8609c14; border: 1px solid #e8609c55; border-radius: var(--radius-sm); padding: 10px 12px; margin-bottom: 12px; font-size: 14px; line-height: 1.5; }
.koop-konci { color: var(--red); font-weight: 600; }
.koop-prani-kdo { color: #f07fb1; font-weight: 600; }
.koop-prani-info b { color: #f07fb1; display: block; margin-bottom: 4px; }
.koop-o.zabrano { background: var(--amber); color: #1a1200; }
.koop-o.zabrano.moje { background: #0b0e14cc; color: var(--amber); box-shadow: inset 0 0 0 1px var(--amber); }
.koop-varovani { background: #f3b23c18; border: 1px solid #f3b23c66; border-radius: var(--radius-sm); padding: 10px 12px; margin-bottom: 12px; font-size: 14px; line-height: 1.5; }
.koop-varovani b { color: var(--amber); display: block; margin-bottom: 4px; }
.koop-cbs { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 4px 0 6px; }
.koop-cb { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }

.card-title { font-size: 13.5px; font-weight: 600; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card-meta { font-size: 11.5px; color: var(--text-faint); margin-top: -4px; }

.progress-strip { position: absolute; inset: auto 0 0; height: 4px; background: #00000066; }
.progress-strip i { display: block; height: 100%; background: var(--accent); }

/* ═══ vodorovné pásy ═══ */
.rail { margin-bottom: 34px; }
.rail-scroll {
  display: grid; grid-auto-flow: column; grid-auto-columns: 158px; gap: 16px;
  overflow-x: auto; padding: 4px 30px 10px; scroll-snap-type: x proximity; scrollbar-width: thin;
}
.rail-scroll.landscape { grid-auto-columns: 268px; }
.rail-scroll > * { scroll-snap-align: start; }
.rail .row-head { padding: 0 30px; }

/* ═══ štítky kategorií ═══ */
.chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 20px; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip {
  padding: 7px 15px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line);
  font-size: 13px; font-weight: 550; color: var(--text-dim); cursor: pointer; white-space: nowrap;
  transition: background .15s, color .15s, border-color .15s;
}
.chip:hover { background: var(--surface-2); color: var(--text); }
.chip.active { background: var(--accent); border-color: transparent; color: #fff; }
.chip[disabled] { opacity: .45; cursor: not-allowed; }
/* Chyby si o pozornost říct musí — jinak je filtr k ničemu, protože se
   na něj nikdo nepodívá. Aktivní stav zůstává jednotný s ostatními. */
.chip-chyba { border-color: #f0556b66; color: var(--red); }
.chip-chyba:hover { color: var(--red); background: #f0556b1a; }
.chip-chyba.active { background: var(--red); border-color: transparent; color: #fff; }

/* ═══ detail ═══ */
.hero { position: relative; min-height: 430px; display: flex; align-items: flex-end; padding: 30px; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center 18%; filter: saturate(1.05); }
.hero-bg::after { content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top, var(--bg) 2%, #0a0d14cc 40%, #0a0d1466 100%),
              linear-gradient(to right, var(--bg) 0%, transparent 65%); }
[data-theme="light"] .hero-bg::after {
  background: linear-gradient(to top, var(--bg) 2%, #f5f6fae0 42%, #f5f6fa88 100%),
              linear-gradient(to right, var(--bg) 0%, transparent 68%); }
.hero-inner { position: relative; display: flex; gap: 28px; align-items: flex-end; width: 100%; max-width: 1200px; }
.hero-poster { width: 208px; flex: none; aspect-ratio: 2/3; border-radius: var(--radius); overflow: hidden;
  box-shadow: var(--shadow-lg); background: var(--surface-2); }
.hero-poster img { width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .3s; }
.hero-poster img.loaded { opacity: 1; }
.img-wrap { position: relative; width: 100%; height: 100%; }
.img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity .3s; }
.img-wrap img.loaded { opacity: 1; }
.hero-info { flex: 1; min-width: 0; padding-bottom: 6px; }
.hero-info h1 { margin: 0 0 10px; font-size: 38px; line-height: 1.1; letter-spacing: -1.1px; font-weight: 750; }
.hero-meta { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; color: var(--text-dim); font-size: 13.5px; margin-bottom: 14px; }
.hero-meta .dot { width: 4px; height: 4px; border-radius: 50%; background: var(--text-faint); }
.pill { padding: 2px 9px; border-radius: 7px; background: var(--surface-2); border: 1px solid var(--line); font-size: 12px; font-weight: 600; }
.pill.score { color: var(--amber); border-color: #f3b23c44; background: #f3b23c14; }
.hero-plot { color: var(--text-dim); font-size: 14.5px; line-height: 1.65; max-width: 720px; margin: 0 0 20px; }
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

.detail-body { padding: 4px 30px 60px; max-width: 1200px; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 18px 26px; margin-bottom: 34px; }
.fact > dt { font-size: 11.5px; font-weight: 700; color: var(--text-faint); letter-spacing: .5px; text-transform: uppercase; margin-bottom: 4px; }
.fact > dd { margin: 0; font-size: 14px; line-height: 1.55; }

/* ═══ epizody ═══ */
.season-tabs { display: flex; gap: 8px; overflow-x: auto; margin-bottom: 18px; padding-bottom: 4px; scrollbar-width: none; }
.season-tabs::-webkit-scrollbar { display: none; }

.episodes { display: flex; flex-direction: column; gap: 8px; }
.episode {
  display: flex; gap: 14px; align-items: center; padding: 11px 14px; border-radius: var(--radius-sm);
  background: var(--surface); border: 1px solid var(--line-soft); cursor: pointer;
  transition: background .15s, border-color .15s, transform .12s;
}
.episode:hover { background: var(--surface-2); border-color: var(--line); }
.episode-num { width: 42px; flex: none; text-align: center; font-size: 16px; font-weight: 700; color: var(--text-faint); font-variant-numeric: tabular-nums; }
.episode-still { width: 124px; flex: none; aspect-ratio: 16/9; border-radius: 7px; overflow: hidden; background: var(--surface-2); }
.episode-still img { width: 100%; height: 100%; object-fit: cover; }
.episode-still .poster-fallback { font-size: 10.5px; }
.episode-body { flex: 1; min-width: 0; }
.episode-title { font-size: 14.5px; font-weight: 600; margin-bottom: 3px; }
.episode-plot { font-size: 12.5px; color: var(--text-faint); line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.episode-actions { display: flex; gap: 4px; flex: none; }
.episode.watched .episode-num { color: var(--green); }

/* ═══ EPG ═══ */
.epg-days { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 18px; scrollbar-width: none; }
.epg-days::-webkit-scrollbar { display: none; }
.epg-day { padding: 8px 14px; border-radius: var(--radius-sm); background: var(--surface); border: 1px solid var(--line);
  cursor: pointer; text-align: left; min-width: 92px; transition: background .15s, border-color .15s; }
.epg-day:hover { background: var(--surface-2); }
.epg-day.active { background: var(--accent); border-color: transparent; color: #fff; }
.epg-day b { display: block; font-size: 13.5px; }
.epg-day span { font-size: 11.5px; opacity: .7; }

.epg-list { display: flex; flex-direction: column; gap: 6px; }
.epg-item {
  display: flex; gap: 14px; align-items: center; padding: 10px 14px; border-radius: var(--radius-sm);
  background: var(--surface); border: 1px solid var(--line-soft); transition: background .15s;
}
.epg-item:hover { background: var(--surface-2); }
.epg-item.running { border-color: var(--accent); background: var(--accent-soft); }
.epg-time { width: 100px; flex: none; font-variant-numeric: tabular-nums; font-size: 13px; color: var(--text-dim); font-weight: 600; }
.epg-body { flex: 1; min-width: 0; }
.epg-title { font-size: 14px; font-weight: 600; }
.epg-desc { font-size: 12.5px; color: var(--text-faint); margin-top: 2px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.epg-actions { display: flex; gap: 4px; flex: none; }
.epg-item.future { opacity: .55; }

/* ═══ fronta stahování ═══ */
.queue-toolbar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 14px 18px; margin-bottom: 18px; border-radius: var(--radius);
  background: var(--surface); border: 1px solid var(--line);
}
.queue-stats { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13px; color: var(--text-dim); }
.queue-stats b { color: var(--text); font-variant-numeric: tabular-nums; }

.jobs { display: flex; flex-direction: column; gap: 9px; }
.job {
  display: grid; grid-template-columns: 46px 1fr auto; gap: 14px; align-items: center;
  padding: 12px 14px; border-radius: var(--radius); background: var(--surface);
  border: 1px solid var(--line-soft); transition: border-color .15s, background .15s, box-shadow .15s;
}
.job[draggable="true"] { cursor: grab; }
.job.dragging { opacity: .4; }
.job.drop-before { box-shadow: 0 -3px 0 var(--accent); }
.job.drop-after { box-shadow: 0 3px 0 var(--accent); }
.job.active { border-color: var(--accent); background: linear-gradient(180deg, var(--accent-soft), transparent); }
.job.state-error { border-color: #f0556b55; }
.job.state-done { opacity: .68; }

/* Odeslané z debridu: podbarvený řádek. Fajfka u názvu se v seznamu o třiceti
   položkách ztrácela — barva řádku je vidět i při rychlém sjetí očima.
   „Zařazeno" je bledší než „hotovo": odesílání ještě může spadnout. */
.job.odeslano-zarazeno { border-color: #35c58a44; background: linear-gradient(180deg, #35c58a10, transparent); }
.job.odeslano-hotovo { border-color: #35c58a88; background: linear-gradient(180deg, #35c58a24, transparent); }
.pill-odeslano { margin-left: 8px; background: #35c58a1f; color: var(--green); }

.job-thumb { position: relative; width: 46px; height: 66px; border-radius: 8px; overflow: hidden; background: var(--surface-2); flex: none; }
.job-thumb .img-wrap { position: absolute; inset: 0; }
.job-thumb img { width: 100%; height: 100%; object-fit: cover; }
.job-thumb .poster-fallback { font-size: 0; }
.job-kind { width: 100%; height: 100%; display: grid; place-items: center; color: var(--text-faint); }
.job-kind .ico { width: 22px; height: 22px; }
.job-main { min-width: 0; }
.job-title { font-size: 14px; font-weight: 600; margin-bottom: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-dest { font-size: 11.5px; color: var(--text-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 7px; }
.job-progress { display: flex; align-items: center; gap: 10px; }
.job-progress .bar { flex: 1; }
.job-pct { font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; min-width: 44px; text-align: right; }
.job-meta { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11.5px; color: var(--text-faint); margin-top: 6px; font-variant-numeric: tabular-nums; }
.job-actions { display: flex; gap: 2px; align-items: center; }
.job-state { font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 6px; letter-spacing: .3px; }
.st-waiting { background: var(--surface-3); color: var(--text-dim); }
.st-downloading { background: var(--accent-soft); color: var(--accent-hi); }
.st-muxing { background: #37d4cf1f; color: var(--cyan); }
.st-done { background: #35c58a1f; color: var(--green); }
.st-error { background: #f0556b1f; color: var(--red); }
.st-retry { background: #f3b23c1f; color: var(--amber); }

.stages { display: flex; flex-direction: column; gap: 5px; margin-top: 9px; padding-top: 9px; border-top: 1px dashed var(--line); }
.stage { display: flex; align-items: center; gap: 9px; font-size: 11.5px; color: var(--text-dim); }
.stage-label { width: 92px; flex: none; font-weight: 600; }
.stage .bar { flex: 1; height: 4px; }
.stage-num { width: 96px; text-align: right; font-variant-numeric: tabular-nums; color: var(--text-faint); }
.stage.done .stage-label { color: var(--green); }
.stage.running .stage-label { color: var(--accent-hi); }
.stage.error .stage-label { color: var(--red); }

/* ═══ přehrávač ═══ */
.player { position: fixed; inset: 0; z-index: 200; background: #000; }
.player video { width: 100%; height: 100%; object-fit: contain; background: #000; }
.player video::cue { background: #000000b3; color: #fff; font-size: 1.05em; line-height: 1.4; }
/* Titulky kreslí vlastní vrstva nad obrazem (titulky.js) — pozice od
   spodního okraje obrazu, ne celého okna; vzhled si člověk nastaví. */
.titulky-vrstva { position: absolute; z-index: 1; pointer-events: none; text-align: center;
  line-height: 1.32; font-weight: 600; padding: 0 4%; box-sizing: border-box; }
.titulky-radek { margin-top: .12em; white-space: pre-line; }
.titulky-radek span { padding: .06em .35em; border-radius: .18em;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.titulky-vrstva[data-pozadi="polo"] .titulky-radek span { background: #000000a6; }
.titulky-vrstva[data-pozadi="plne"] .titulky-radek span { background: #000; }
.titulky-vrstva[data-pozadi="zadne"] .titulky-radek span {
  text-shadow: 0 0 .12em #000, 0 0 .12em #000, .06em .06em .1em #000, -.06em -.06em .1em #000; }
.titulky-vzhled { border-top: 1px solid #ffffff1f; margin-top: 6px; padding-top: 4px; }
.tv-radek { display: flex; align-items: center; gap: 6px; padding: 5px 12px; }
.tv-popis { flex: 1; font-size: 13px; opacity: .8; }
.tv-hodnota { min-width: 44px; text-align: center; font-variant-numeric: tabular-nums; font-size: 13px; }
.tv-btn { width: 28px; height: 28px; border-radius: 8px; border: 1px solid #ffffff33; background: #ffffff14;
  color: #fff; font-size: 16px; cursor: pointer; }
.tv-btn:hover { background: #ffffff2e; }
.tv-barva { width: 22px; height: 22px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; }
.tv-barva.on { border-color: var(--accent-hi, #8b7cff); box-shadow: 0 0 0 2px #000 inset; }
.tv-volba { padding: 4px 9px; border-radius: 999px; border: 1px solid #ffffff33; background: transparent;
  color: #fff; font-size: 12px; cursor: pointer; }
.tv-volba.on { background: var(--accent, #6d5cff); border-color: transparent; }
/* Menu titulků nese i vzhled — potřebuje víc místa než ostatní nabídky. */
#pl-subs-menu { max-height: min(560px, calc(100vh - 140px)); min-width: 300px; }

.player-ui { position: absolute; inset: 0; display: flex; flex-direction: column;
  opacity: 1; transition: opacity .25s; }
.player.idle .player-ui { opacity: 0; pointer-events: none; }
.player.idle { cursor: none; }

.player-top { display: flex; align-items: center; gap: 14px; padding: 16px 20px;
  background: linear-gradient(to bottom, #000000cc, transparent); color: #fff; }
.player-top .icon-btn { color: #fff; }
.player-top .icon-btn:hover { background: #ffffff26; }
.player-title { flex: 1; min-width: 0; }
.player-title strong { display: block; font-size: 17px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.player-title span { font-size: 12.5px; opacity: .68; }

.player-center { flex: 1; display: grid; place-items: center; position: relative; }
.big-play { width: 84px; height: 84px; border-radius: 50%; border: 0; cursor: pointer;
  background: #ffffff1f; backdrop-filter: blur(10px); color: #fff; display: grid; place-items: center; }
.big-play:hover { background: #ffffff33; }
.big-play .ico { width: 34px; height: 34px; }
.spinner { width: 46px; height: 46px; border-radius: 50%; border: 3px solid #ffffff2e; border-top-color: #fff; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.player-error { max-width: 520px; padding: 18px 22px; border-radius: var(--radius);
  background: #1a1016ee; border: 1px solid #f0556b55; color: #ffb3bf; font-size: 14px; text-align: center; line-height: 1.6; }

.player-bottom { padding: 8px 20px 18px; background: linear-gradient(to top, #000000d9, transparent); color: #fff; }
.seek { position: relative; padding: 10px 0; cursor: pointer; }
.seek-track { height: 5px; border-radius: 99px; background: #ffffff2e; position: relative; transition: height .14s; }
.seek:hover .seek-track { height: 8px; }
.seek-buffer { position: absolute; inset: 0 auto 0 0; width: 0; background: #ffffff33; border-radius: 99px; }
.seek-fill { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--accent); border-radius: 99px; }
.seek-fill i { position: absolute; right: -7px; top: 50%; transform: translateY(-50%) scale(0);
  width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: transform .14s; }
.seek:hover .seek-fill i { transform: translateY(-50%) scale(1); }
.seek-tip { position: absolute; bottom: 100%; transform: translateX(-50%); padding: 3px 8px; border-radius: 6px;
  background: #000000e0; font-size: 12px; font-variant-numeric: tabular-nums; pointer-events: none; }

.player-controls { display: flex; align-items: center; gap: 4px; }
.player-controls .icon-btn { color: #fff; }
.player-controls .icon-btn:hover { background: #ffffff26; }
.player-controls .spacer { flex: 1; }
.time { font-size: 13px; font-variant-numeric: tabular-nums; opacity: .82; margin-left: 8px; }
.volume { display: flex; align-items: center; gap: 4px; }
.volume input { width: 0; opacity: 0; transition: width .2s, opacity .2s; accent-color: #fff; }
.volume:hover input, .volume input:focus { width: 84px; opacity: 1; }
.live-badge { padding: 3px 9px; border-radius: 6px; background: var(--red); font-size: 11px; font-weight: 800; letter-spacing: .6px; }

.menu-wrap { position: relative; }
.menu { position: absolute; bottom: calc(100% + 10px); right: 0; min-width: 210px; max-height: 320px; overflow-y: auto;
  background: #14192699; backdrop-filter: blur(20px); border: 1px solid #ffffff1f; border-radius: var(--radius-sm);
  padding: 6px; box-shadow: var(--shadow-lg); z-index: 5; }
.menu-title { font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
  color: #ffffff8c; padding: 7px 10px 5px; }
.menu-item { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 7px;
  font-size: 13.5px; cursor: pointer; color: #fff; }
.menu-item:hover { background: #ffffff1a; }
.menu-item.on { color: var(--accent-hi); font-weight: 600; }
.menu-item .tick { width: 15px; flex: none; opacity: 0; }
.menu-item.on .tick { opacity: 1; }

/* ═══ modály, toasty, stavy ═══ */
.overlay { position: fixed; inset: 0; z-index: 150; display: grid; place-items: center; padding: 24px;
  background: #05070ca8; backdrop-filter: blur(6px); animation: fade .18s var(--ease); }
@keyframes fade { from { opacity: 0; } }
.modal { width: 100%; max-width: 520px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); overflow: hidden;
  animation: pop .2s var(--ease); }
.modal.wide { max-width: 900px; }
@keyframes pop { from { transform: translateY(12px) scale(.98); opacity: 0; } }
.modal-head { display: flex; align-items: center; gap: 12px; padding: 18px 20px 14px; border-bottom: 1px solid var(--line-soft); }
.modal-head h3 { margin: 0; font-size: 17px; font-weight: 650; flex: 1; }
.modal-body { padding: 18px 20px; max-height: min(66vh, 560px); overflow-y: auto; }
.modal-foot { display: flex; gap: 10px; justify-content: flex-end; padding: 14px 20px 18px; }
.modal .ratio { position: relative; aspect-ratio: 16/9; background: #000; }
.modal .ratio iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.toasts { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 300;
  display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.toast { display: flex; align-items: center; gap: 10px; padding: 11px 17px; border-radius: 999px;
  background: var(--surface-2); border: 1px solid var(--line); box-shadow: var(--shadow-lg);
  font-size: 13.5px; font-weight: 550; animation: rise .22s var(--ease); pointer-events: auto;
  max-width: min(90vw, 460px); cursor: pointer; }
/* Dlouhá hláška se zalomí místo toho, aby roztáhla pruh přes celou šířku. */
.toast span { overflow-wrap: anywhere; }
@keyframes rise { from { transform: translateY(14px); opacity: 0; } }
.toast.ok .ico { color: var(--green); }
.toast.err { border-color: #f0556b55; }
.toast.err .ico { color: var(--red); }

.empty { display: grid; place-items: center; gap: 12px; padding: 80px 20px; text-align: center; color: var(--text-faint); }
.empty .ico { width: 44px; height: 44px; opacity: .35; }
.empty h3 { margin: 0; font-size: 17px; color: var(--text-dim); font-weight: 600; }
.empty p { margin: 0; font-size: 13.5px; max-width: 400px; line-height: 1.6; }

.skeleton { border-radius: var(--radius); background: linear-gradient(100deg, var(--surface) 30%, var(--surface-2) 50%, var(--surface) 70%);
  background-size: 220% 100%; animation: shimmer 1.3s infinite linear; }
@keyframes shimmer { to { background-position: -220% 0; } }
.sk-poster { aspect-ratio: 2/3; }

.loading-line { position: fixed; top: 0; left: 0; right: 0; height: 2.5px; z-index: 400; background: transparent; overflow: hidden; }
.loading-line i { display: block; height: 100%; width: 32%; background: var(--accent);
  animation: load 1s infinite var(--ease); }
@keyframes load { 0% { margin-left: -32%; } 100% { margin-left: 100%; } }

.kbd { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 7px;
  border-radius: 6px; background: var(--surface-2); border: 1px solid var(--line);
  border-bottom-width: 2px; font-size: 11.5px; font-weight: 700; font-family: ui-monospace, monospace; }
.shortcuts { display: grid; gap: 9px; }
.shortcut { display: flex; align-items: center; gap: 12px; font-size: 13.5px; }
.shortcut .keys { display: flex; gap: 4px; min-width: 116px; }
.shortcut .desc { color: var(--text-dim); }

.status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; margin-bottom: 26px; }
.status-card { padding: 16px 18px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); }
.status-card dt { font-size: 11.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--text-faint); margin-bottom: 6px; }
.status-card dd { margin: 0; font-size: 15px; font-weight: 600; word-break: break-all; }
.status-card dd.ok { color: var(--green); }
.status-card dd.bad { color: var(--red); }
.status-card .hint { font-size: 12px; color: var(--text-faint); font-weight: 400; margin-top: 5px; }

.settings-section { max-width: 720px; margin-bottom: 34px; }
.settings-row { display: flex; align-items: center; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.settings-row:last-child { border-bottom: 0; }
.settings-row .grow { flex: 1; }
.settings-row h4 { margin: 0 0 3px; font-size: 14.5px; font-weight: 600; }
.row-head.sub { margin: 22px 0 6px; }
.row-head.sub h3 { margin: 0; font-size: 13px; font-weight: 650; letter-spacing: .4px; text-transform: uppercase; color: var(--text-faint); }
.settings-lead { margin: -6px 0 14px; font-size: 12.5px; color: var(--text-faint); line-height: 1.55; max-width: 620px; }
.settings-row p { margin: 0; font-size: 12.5px; color: var(--text-faint); line-height: 1.5; }

/* ═══ responzivita ═══ */
@media (max-width: 1000px) {
  .app { grid-template-columns: 1fr; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: 268px; z-index: 60;
    transform: translateX(-100%); transition: transform .24s var(--ease); box-shadow: var(--shadow-lg); }
  .app.nav-open .sidebar { transform: none; }
  .app.nav-open::after { content: ''; position: fixed; inset: 0; z-index: 50; background: #05070c99; }
  .only-mobile { display: inline-grid; }
  .page, .detail-body { padding-left: 18px; padding-right: 18px; }
  .rail .row-head, .rail-scroll { padding-left: 18px; padding-right: 18px; }
  .hero { padding: 18px; min-height: 0; }
  .hero-inner { flex-direction: column; align-items: flex-start; gap: 18px; }
  .hero-poster { width: 132px; }
  .hero-info h1 { font-size: 27px; }
  .grid { grid-template-columns: repeat(auto-fill, minmax(126px, 1fr)); gap: 16px 12px; }
  .episode-still { display: none; }
  .job { grid-template-columns: 1fr auto; }
  .job-thumb { display: none; }
  .epg-time { width: 74px; }
}
@media (max-width: 620px) {
  .topbar { padding: 0 12px; }
  .topbar-right .icon-btn:not(#btn-theme) { display: none; }
  /* Restart vedle motivu se na telefonu trefil omylem — je v Nastavení → Provoz. */
  .topbar-right #btn-restart { display: none; }
  .facts { grid-template-columns: 1fr 1fr; }
  .hero-actions .btn span.lbl { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ═══ televize: průvodce programem ═══ */
.content.flush { overflow: hidden; }
.guide { display: grid; grid-template-columns: 190px minmax(258px, 320px) 1fr; height: 100%; min-height: 0; }

.guide-cats { display: flex; flex-direction: column; gap: 1px; min-height: 0; overflow-y: auto;
  padding: 14px 8px 16px; background: var(--bg-elev); border-right: 1px solid var(--line); }
.guide-cats-head { padding: 4px 10px 8px; font-size: 11px; font-weight: 700; letter-spacing: .5px;
  text-transform: uppercase; color: var(--text-faint); }
.cat { flex: none; text-align: left; padding: 8px 11px; border: 0; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-dim); font: inherit; font-size: 13px; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat:hover { background: var(--surface); color: var(--text); }
.cat:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.cat.active { background: var(--accent-soft); color: var(--accent-hi); font-weight: 600; }

.guide-side { display: flex; flex-direction: column; min-height: 0; background: var(--bg-elev); border-right: 1px solid var(--line); }
.guide-side-head { padding: 16px 14px 12px; }
.guide-search-wrap { display: flex; align-items: center; gap: 8px; padding: 8px 13px;
  border-radius: 999px; background: var(--surface); border: 1px solid var(--line); }
.guide-search-wrap:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.guide-search-wrap .ico { width: 16px; height: 16px; color: var(--text-faint); }
.guide-search { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--text);
  font: inherit; font-size: 13.5px; outline: none; }
.guide-search::-webkit-search-cancel-button { display: none; }
.guide-count { font-size: 11.5px; color: var(--text-faint); font-variant-numeric: tabular-nums; flex: none; }

.chan-list { flex: 1; min-height: 0; overflow-y: auto; padding: 0 8px 16px; }
.chan { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left;
  padding: 6px 10px; border: 0; border-radius: var(--radius-sm); background: transparent;
  color: inherit; cursor: pointer; font: inherit; }
.chan:hover { background: var(--surface); }
.chan:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.chan.active { background: var(--accent-soft); box-shadow: inset 2px 0 0 var(--accent); }
/* Logo je rozlišovací znak, ne dominanta řádku — čtvercová dlaždice velikosti
   ikony. Loga stanic bývají tmavá PNG s průhledným pozadím, takže pod nimi
   musí být o něco světlejší plocha, jinak na tmavém motivu zmizí. */
.chan-logo { position: relative; width: 34px; height: 34px; flex: none; border-radius: 9px;
  overflow: hidden; background: var(--surface-3); border: 1px solid var(--line-soft);
  transition: background .15s, border-color .15s; }
.chan-logo img { object-fit: contain; padding: 4px; }
.chan-logo .poster-fallback { padding: 0; font-size: 11px; font-weight: 700; letter-spacing: -.2px; }
.chan.active .chan-logo { border-color: var(--accent); }
.chan-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.chan-name { font-size: 13.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chan-now { font-size: 11.5px; color: var(--text-dim); overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; min-height: 15px; }
.chan-now.soon { color: var(--text-faint); font-style: italic; }
.chan-bar { display: block; height: 3px; margin-top: 4px; border-radius: 99px; background: var(--surface-3); overflow: hidden; }
.chan-bar i { display: block; height: 100%; border-radius: 99px; background: var(--accent); }
/* Archiv má skoro každý kanál, takže je to spíš poznámka než odznak —
   výrazný rámeček u každého řádku dělal ze seznamu blikající pás. */
.chan-tag { flex: none; font-size: 9px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
  color: var(--cyan); opacity: .7; padding: 0; }
.chan:hover .chan-tag, .chan.active .chan-tag { opacity: 1; }
.chan-star { flex: none; color: var(--amber); font-size: 12px; }
.chan-sentinel { height: 1px; }

.guide-main { display: grid; grid-template-rows: auto auto auto 1fr; min-height: 0; min-width: 0; padding: 14px 24px 0; }
.guide-stage-wrap { display: flex; justify-content: center; }
.guide-stage { position: relative; width: 100%; aspect-ratio: 16/9; max-height: 38vh;
  max-width: calc(38vh * 16 / 9); background: #000; border-radius: var(--radius);
  overflow: hidden; box-shadow: var(--shadow-lg); }
.stage-ph { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 16px;
  background: radial-gradient(circle at 50% 35%, var(--surface-2), var(--bg-elev)); }
.stage-ph .empty { padding: 0; }
.stage-logo { position: relative; width: 104px; height: 52px; opacity: .9; }
.stage-logo img { object-fit: contain; }

.player.docked { position: absolute; inset: 0; z-index: 1; }
.player.docked .player-top { padding: 10px 12px; }
.player.docked .player-title strong { font-size: 14px; }
.player.docked .player-bottom { padding: 4px 12px 10px; }
.player.docked .big-play { width: 62px; height: 62px; }
.player.docked:fullscreen { position: fixed; inset: 0; border-radius: 0; }

.guide-info { display: flex; align-items: center; gap: 12px; padding: 13px 2px 11px; flex-wrap: wrap; }
.guide-main .epg-days { margin-bottom: 12px; padding-bottom: 4px; }
.guide-main .epg-day { padding: 6px 12px; }
.guide-main .epg-day b { font-size: 12.5px; }
.guide-main .epg-day span { font-size: 11px; }
.guide-ch h2 { margin: 0; font-size: 19px; font-weight: 650; letter-spacing: -.4px; }
.guide-ch-meta { font-size: 12.5px; color: var(--text-faint); margin-top: 2px; }
.guide-info .grow { flex: 1; }
.guide-epg { overflow-y: auto; min-height: 0; padding: 0 6px 22px 0; }

@media (max-width: 1240px) {
  .guide { grid-template-columns: 168px minmax(238px, 300px) 1fr; }
}
@media (max-width: 1000px) {
  .content.flush { overflow-y: auto; }
  .guide { display: flex; flex-direction: column; height: auto; }
  /* Na telefonu je hlavní věc seznam kanálů, ne prázdné pódium — proto
     kategorie a kanály nahoru, pódium s programem pod ně. Jakmile se
     kanál pustí, přehrávač si o pozornost řekne sám. */
  .guide-cats { order: 0; }
  .guide-side { order: 1; }
  .guide-main { order: 2; padding: 12px 16px 0; }
  /* na úzké obrazovce se ze sloupce kategorií stane vodorovný pás */
  .guide-cats { flex-direction: row; gap: 6px; overflow-x: auto; overflow-y: hidden;
    padding: 10px 16px; border-right: 0; border-top: 1px solid var(--line); scrollbar-width: none; }
  .guide-cats::-webkit-scrollbar { display: none; }
  .guide-cats-head { display: none; }
  .cat { border: 1px solid var(--line); border-radius: 999px; padding: 6px 13px; }
  .guide-side { border-right: 0; border-top: 1px solid var(--line); }
  /* seznam kanálů má na telefonu smysl mít dost vysoký, ale ne přes celý svět */
  .chan-list { max-height: 58vh; }
  .guide-stage { max-height: 30vh; max-width: calc(30vh * 16 / 9); }
  /* dokud nic nehraje, je pódium jen proužek s logem – ne černá plocha 16:9 */
  .guide-stage:not(.playing) { aspect-ratio: auto; height: 92px; }
  .guide-stage:not(.playing) .stage-logo { width: 74px; height: 38px; }
  .guide-stage:not(.playing) .stage-ph .btn { display: none; }
  .chan-list { max-height: 62vh; }
  /* program dostane vlastní výšku, ať se seznam kanálů nezasune až úplně dolů */
  .guide-epg { max-height: 52vh; padding-bottom: 8px; }
}

/* ═══ hlídač seriálů ═══ */
.watch-thumb { position: relative; width: 46px; height: 66px; flex: none; border-radius: 8px;
  overflow: hidden; background: var(--surface-2); }
.watch-thumb img { object-fit: cover; }

.new-group { margin-bottom: 18px; }
.new-group:last-child { margin-bottom: 0; }
.new-group-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.new-group-poster { position: relative; width: 40px; height: 58px; flex: none; border-radius: 7px;
  overflow: hidden; background: var(--surface-2); }
.new-group-poster img { object-fit: cover; }
.new-group-name { font-size: 15px; font-weight: 650; letter-spacing: -.2px; }
.new-group-name:hover { color: var(--accent-hi); }
.new-group-meta { font-size: 12px; color: var(--text-faint); margin-top: 2px; }
.new-eps { display: flex; flex-direction: column; gap: 3px; }
.new-ep { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: var(--radius-sm);
  background: var(--surface); cursor: pointer; }
.new-ep:hover { background: var(--surface-2); }
.new-ep input { width: 16px; height: 16px; accent-color: var(--accent); flex: none; }
.new-ep-num { font-size: 12.5px; font-weight: 700; color: var(--accent-hi); font-variant-numeric: tabular-nums; flex: none; }
.new-ep-title { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-check-head { position: sticky; top: -18px; z-index: 2; margin: 0 -20px 6px; padding: 6px 20px 10px;
  background: var(--surface); border-bottom: 1px solid var(--line-soft); }
.ep-check-head .count { font-size: 13px; font-weight: 600; color: var(--text-dim); }
.ep-check-list { display: flex; flex-direction: column; gap: 3px; }
.ep-check-season { font-size: 11.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
  color: var(--text-faint); padding: 14px 2px 6px; position: sticky; top: 30px;
  background: var(--surface); z-index: 1; }
.ep-check-season:first-child { padding-top: 4px; }

.queue-banner { display: flex; align-items: center; gap: 10px; margin-bottom: 14px;
  padding: 11px 14px; border-radius: var(--radius-sm);
  background: #f3b23c14; border: 1px solid #f3b23c55; color: var(--amber);
  font-size: 13.5px; font-weight: 550; }
.queue-banner .ico { width: 17px; height: 17px; flex: none; }

/* ═══ skryté kategorie ═══ */
.cat-hide { border-bottom: 1px solid var(--line-soft); }
.cat-hide:last-child { border-bottom: 0; }
.cat-hide > summary { display: flex; align-items: center; gap: 10px; padding: 13px 2px;
  cursor: pointer; font-size: 14.5px; font-weight: 600; list-style: none; }
.cat-hide > summary::-webkit-details-marker { display: none; }
.cat-hide > summary::before { content: '▸'; color: var(--text-faint); font-size: 12px; transition: transform .15s; }
.cat-hide[open] > summary::before { transform: rotate(90deg); }
.cat-hide > summary .count { margin-left: auto; font-weight: 400; }
.cat-hide-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 2px 14px; padding: 4px 0 16px 20px; }
.cat-hide-item { display: flex; align-items: center; gap: 9px; padding: 6px 8px;
  border-radius: var(--radius-sm); font-size: 13.5px; cursor: pointer; color: var(--text-dim); }
.cat-hide-item:hover { background: var(--surface); color: var(--text); }
.cat-hide-item input { width: 16px; height: 16px; accent-color: var(--accent); flex: none; }

.stage.planned { opacity: .8; }
.stage.planned .stage-label { color: var(--text-dim); }
.stage-plan { flex: 1; font-size: 11.5px; color: var(--text-faint); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }

/* ═══ co je ve zdroji ═══ */
.tech-block { margin-top: 18px; }
.tech-head { font-size: 13.5px; color: var(--text-dim); margin-bottom: 14px;
  padding-bottom: 12px; border-bottom: 1px solid var(--line-soft); }
.tech-title { font-size: 11.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
  color: var(--text-faint); margin: 14px 0 6px; }
.tech-list { display: flex; flex-direction: column; gap: 3px; }
.tech-row { display: grid; grid-template-columns: minmax(120px, auto) 1fr auto; gap: 12px;
  align-items: baseline; padding: 8px 10px; border-radius: var(--radius-sm);
  background: var(--surface); font-size: 13.5px; opacity: .6; }
.tech-row.on { opacity: 1; }
.tech-name { font-weight: 600; }
.tech-meta { font-size: 12px; color: var(--text-faint); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.tech-size { font-size: 12.5px; font-variant-numeric: tabular-nums; color: var(--text-dim); }
@media (max-width: 620px) {
  .tech-row { grid-template-columns: 1fr auto; }
  .tech-meta { grid-column: 1 / -1; }
}
.new-ep-from { margin-left: auto; font-size: 11px; color: var(--text-faint); white-space: nowrap; }
.new-ep input:disabled { opacity: .4; }

/* ═══ nahrávání na demostream ═══ */
.sub { font-size: 12.5px; color: var(--text-faint); line-height: 1.6; }
.lib-row { align-items: center; }
.lib-row.up-done { border-color: #35c58a3d; }
.lib-row.lib-gone { opacity: .5; }
.lib-check { display: flex; align-items: center; flex: none; padding: 0 2px; cursor: pointer; }
.lib-check input { width: 17px; height: 17px; accent-color: var(--accent); cursor: pointer; }

.lib-bulk { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 14px; padding: 10px 14px; border-radius: var(--radius-sm);
  background: var(--accent-soft); border: 1px solid var(--accent);
  font-size: 13px; font-weight: 600; }
.lib-bulk .grow { flex: 1; }

/* Úložiště: řádek nálezu se zaškrtávátkem. Stejný tvar jako řádek fronty,
   ať se to nemusí učit dvakrát. */
.storage-row { display: flex; align-items: center; gap: 12px; }
.storage-row .row-check { display: flex; align-items: center; flex: none; }
/* Úložiště: vlevo nálezy, vpravo co je v souboru. Zavřený panel nezabírá
   nic — seznam se roztáhne přes celou šířku. */
/* Okno s heslem: text a pole pod sebou, ať se nelepí na okraje. */
.heslo-box { display: flex; flex-direction: column; gap: 12px; }
.heslo-box p { margin: 0; color: var(--text-dim); font-size: 13.5px; line-height: 1.5; }
.heslo-box .input { width: 100%; }

/* Přepínač zdrojů nad výsledky. */
/* Účty zdrojů: jeden přehled místo sedmi karet. Na první pohled je vidět,
   co chybí; rozbalí se jen to, co chce člověk měnit. */
.ucty-uvod { margin-bottom: 12px; }
.ucty-seznam { display: flex; flex-direction: column; gap: 2px; }
.ucet-radek { border-top: 1px solid var(--line-soft); padding: 10px 0; }
.ucet-radek:first-child { border-top: 0; }
.ucet-hlava { display: flex; align-items: center; gap: 12px; }
.ucet-nazev { font-weight: 600; font-size: 14px; display: flex; align-items: baseline; gap: 8px; }
.ucet-role { font-size: 11px; font-weight: 500; color: var(--text-dim); text-transform: uppercase; letter-spacing: .06em; }
.ucet-k { font-size: 12.5px; color: var(--text-dim); margin-top: 2px; max-width: 46ch; }
.ucet-radek.chibi .ucet-nazev, .ucet-radek.chybi .ucet-nazev { color: var(--text); }
.ucet-telo { padding: 10px 0 4px; }
.ucet-telo[hidden] { display: none; }
.ucet-pole { display: flex; flex-direction: column; gap: 8px; max-width: 340px; }

.zdroje-lista { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.zdroje-popis { color: var(--text-dim); font-size: 12.5px; font-weight: 600; }
.zdroj-chip { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px;
  border-radius: 999px; border: 1px solid var(--line); background: var(--surface);
  font-size: 13px; cursor: pointer; user-select: none; }
.zdroj-chip:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-hi); }
/* Stav zdroje po hledání: počet nálezů, „—" když nic, „!" když selhal. */
.zdroj-znacka { min-width: 18px; padding: 0 5px; border-radius: 999px; font-size: 11px;
  font-weight: 700; text-align: center; background: var(--surface-2); color: var(--text-dim); }
.zdroj-chip.ok .zdroj-znacka { background: var(--accent); color: #fff; }
.zdroj-chip.chyba { border-color: var(--red); }
.zdroj-chip.chyba .zdroj-znacka { background: var(--red); color: #fff; }
.zdroj-chip.hleda .zdroj-znacka { opacity: .6; }

.zdroj-chip.nejde { opacity: .45; cursor: not-allowed; }

.storage-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
.storage-split.s-open { grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); }
.storage-list { min-width: 0; }
.detail-panel { position: sticky; top: 16px; padding: 14px 16px;
  border: 1px solid var(--line-soft); border-radius: var(--radius-sm); background: var(--surface); }
.detail-panel[hidden] { display: none; }
.detail-head { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 12px; }
.detail-title { font-weight: 650; font-size: 14px; line-height: 1.35; word-break: break-word; flex: 1; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px;
  padding-top: 12px; border-top: 1px solid var(--line-soft); }
.job.vybrany { border-color: var(--accent); background: var(--accent-soft); }
@media (max-width: 900px) { .storage-split.s-open { grid-template-columns: minmax(0, 1fr); }
  .detail-panel { position: static; } }

.storage-info { margin-top: 8px; padding: 8px 10px; border-radius: var(--radius-sm);
  background: var(--surface-2); font-size: 12.5px; display: flex; flex-direction: column; gap: 3px; }
/* Výpis stop v panelu: každá stopa na vlastním řádku, ať jde porovnat. */
.info-souhrn { font-size: 13px; color: var(--text-dim); margin-bottom: 6px; }
.info-skupina { margin-bottom: 10px; }
.info-nadpis { font-size: 10.5px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text-dim); margin-bottom: 4px; }
.info-stopa { display: flex; align-items: baseline; gap: 7px; padding: 2px 0;
  font-size: 12.5px; line-height: 1.4; }
.info-cislo { flex: none; width: 16px; color: var(--text-dim);
  font-variant-numeric: tabular-nums; }

.storage-info-row { display: flex; gap: 8px; }
.storage-info-row b { min-width: 62px; color: var(--text-dim); font-weight: 600; }
.storage-info-err { color: var(--red); }

.badge-part { margin-left: 8px; padding: 1px 7px; border-radius: 20px;
  background: var(--surface-2); color: var(--text-dim); font-size: 11px; font-weight: 600; }
/* Nastavení ve třech sloupcích. Na užší obrazovce se skládají pod sebe
   ve stejném pořadí — účty nahoře, protože se hledají nejčastěji. */
.settings-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px; align-items: start; }
.settings-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.settings-col-head { margin: 0 0 2px; padding-bottom: 8px; border-bottom: 1px solid var(--line-soft);
  font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-dim); }
.settings-col:empty, .settings-col:has(> :only-child) { display: none; }
.settings-ctl-col { display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
@media (max-width: 1100px) { .settings-cols { grid-template-columns: 1fr; } }

.page-sub { color: var(--text-dim); font-size: 13px; margin-left: 12px; align-self: center; }

.lib-group { display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 22px 0 8px; padding-bottom: 8px; border-bottom: 1px solid var(--line-soft); }
.lib-group:first-child { margin-top: 0; }
.lib-group-name { font-size: 15px; font-weight: 650; letter-spacing: -.2px; }
.lib-group-meta { font-size: 12px; color: var(--text-faint); margin-top: 2px;
  font-variant-numeric: tabular-nums; }

.lib-notes { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.7; color: var(--text-dim); }
.lib-notes li { margin-bottom: 2px; }

/* našeptávač TMDb — vodorovný pás plakátů jako v katalogu. Dřív svislý
   seznam s náhledy 38×56, na kterých nešlo nic přečíst. Kolečko myši pás
   posouvá do stran (tmdb.js), na konci pásu se posune dialog. */
.tmdb-results { display: flex; gap: 10px; margin-top: 10px; padding: 2px 2px 10px;
  overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity;
  overscroll-behavior-x: contain; scrollbar-width: thin; }
.tmdb-results > .sub, .tmdb-results > .skeleton { flex: 1; }
.tmdb-hit { flex: none; width: 132px; display: flex; flex-direction: column; gap: 6px;
  text-align: left; padding: 6px; border-radius: var(--radius); border: 2px solid transparent;
  background: none; color: var(--text); font: inherit; cursor: pointer; scroll-snap-align: start;
  transition: background .15s var(--ease), border-color .15s var(--ease); }
.tmdb-hit:hover { background: var(--surface-2); }
.tmdb-hit.on { background: var(--accent-soft); border-color: var(--accent); }
.tmdb-poster { width: 100%; aspect-ratio: 2 / 3; height: auto; border-radius: 7px; overflow: hidden;
  background: var(--surface-2); box-shadow: 0 2px 10px rgba(0,0,0,.25); }
.tmdb-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tmdb-title { font-size: 13px; font-weight: 600; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tmdb-meta { font-size: 11.5px; color: var(--text-faint); margin-top: 2px; }
/* názvy pro demostream — skládací, protože ve většině případů sedí */
.up-names { border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--bg-elev); overflow: hidden; }
.up-names > summary { display: flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 11px 14px; font-size: 13.5px; color: var(--text-dim); }
.up-names > summary::-webkit-details-marker { display: none; }
.up-names > summary::marker { content: ''; }
.up-names > summary > span:first-of-type { flex: 1; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.up-names-hint { flex: none; font-size: 12px; color: var(--accent-hi); }
.up-names[open] .up-names-hint::after { content: ' ▴'; }
.up-names:not([open]) .up-names-hint::after { content: ' ▾'; }
.up-names-body { padding: 0 14px 14px; border-top: 1px solid var(--line); }
.up-renumber { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 12px 0; }
.up-names .up-num { width: 68px; padding: 7px 9px; border-radius: var(--radius-sm);
  border: 1px solid var(--line); background: var(--surface); color: var(--text); font: inherit; }
.up-names-rows { display: flex; flex-direction: column; gap: 6px;
  max-height: 300px; overflow-y: auto; }
.up-name-row { display: flex; align-items: center; gap: 8px; }
.up-names .up-name-input { flex: 1; min-width: 0; padding: 8px 11px; border-radius: var(--radius-sm);
  border: 1px solid var(--line); background: var(--surface); color: var(--text);
  font: inherit; font-size: 13.5px; }
.up-names .up-name-input:focus { outline: none; border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft); }
.up-name-ext { flex: none; font-size: 12.5px; color: var(--text-faint); }
.up-names-note { margin: 12px 0 0; }
.lib-thumb-ph { display: flex; align-items: center; justify-content: center; color: var(--text-faint); }
.lib-thumb-ph .ico { width: 20px; height: 20px; }
/* fronta nahrávání nemá plakát, tak jí ubereme sloupec */
.job.upload-job, .job.cekarna-job { grid-template-columns: 1fr auto; }
/* Čekárna: stav položky. „Zadávám" a „Čeká" jsou obě klidné — nic se neděje
   špatně, jen se čeká — takže tlumeně; chyba červeně jako všude jinde. */
.up-state-ceka { background: var(--accent-soft); color: var(--accent-hi); }
.up-state-zadava { background: var(--surface-3); color: var(--text-dim); }
.up-state-chyba { background: #f0556b1f; color: var(--red); }
/* Řádek bez plakátu: bez tohohle by obsah spadl do sloupce pro náhled
   (46 px) a název by se usekl po třech písmenech. */
.job.job-bez-nahledu { grid-template-columns: minmax(0, 1fr) auto; }

/* fronta nahrávání: dvě etapy vedle sebe */
.up-head { display: flex; align-items: baseline; gap: 10px; }
.up-head .job-title { flex: 1; margin-bottom: 0; }
.up-state { flex: none; font-size: 11px; font-weight: 700; letter-spacing: .3px;
  padding: 3px 9px; border-radius: 999px; background: var(--surface-2); color: var(--text-faint); }
.up-state-downloading, .up-state-muxing { background: var(--accent-soft); color: var(--accent-hi); }
.up-state-done { background: #35c58a1f; color: var(--green); }
.up-state-error { background: #f0556b1f; color: var(--red); }

.up-stages { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin-top: 10px; }
.up-stage { min-width: 0; opacity: .55; transition: opacity .2s; }
.up-stage.active, .up-stage.done { opacity: 1; }
.up-stage-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 5px; }
.up-stage-name { font-size: 11.5px; font-weight: 700; letter-spacing: .4px;
  text-transform: uppercase; color: var(--text-faint); }
.up-stage-pct { margin-left: auto; font-size: 12px; font-weight: 700;
  font-variant-numeric: tabular-nums; color: var(--text-dim); }
.up-stage.active .up-stage-pct { color: var(--accent-hi); }
.up-stage.done .up-stage-pct { color: var(--green); }
.up-stage .bar { height: 5px; }
.up-stage.done .bar-fill { background: var(--green); }
.up-stage-note { margin-top: 5px; font-size: 11.5px; color: var(--text-faint);
  font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Běžící pruh se lehce vlní, ať je vidět, že se něco děje. Pásy jdou přes
   původní přechod, ne místo něj — proto dvě vrstvy v background-image. */
.up-stage.active .bar-fill {
  background-image:
    linear-gradient(90deg, transparent 0 50%, #ffffff2b 50% 100%),
    linear-gradient(90deg, var(--accent), var(--cyan));
  background-size: 26px 100%, 100% 100%;
  background-repeat: repeat, no-repeat;
  animation: up-flow 1.1s linear infinite;
}
@keyframes up-flow { to { background-position: 26px 0, 0 0; } }
@media (prefers-reduced-motion: reduce) { .up-stage.active .bar-fill { animation: none; } }

.up-err { display: flex; align-items: center; gap: 8px; margin-top: 10px;
  font-size: 12.5px; color: var(--red); }
.up-err .ico { width: 15px; height: 15px; flex: none; }
/* Důvod u čekajícího opakování: tatáž informace, ale není to verdikt. */
.up-err.mirna { color: var(--amber); }

@media (max-width: 700px) { .up-stages { grid-template-columns: 1fr; } }
.up-stage.active .bar-fill.indet { background-position: 0 0; animation: slide 1.4s ease-in-out infinite; }
/* filtry knihovny a k nim „Označit vše“ */
.lib-filters { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 20px; }
.lib-filters .chips { margin-bottom: 0; }
.lib-filters .grow { flex: 1; }

/* hledání a řazení v knihovně */
.lib-search { flex: 1; min-width: 140px; max-width: 320px; padding: 8px 13px;
  border-radius: 999px; border: 1px solid var(--line); background: var(--surface);
  color: var(--text); font: inherit; font-size: 13px; }
.lib-search:focus { outline: none; border-color: var(--accent); }
.lib-sort { width: auto; padding: 8px 12px; font-size: 13px; flex: none; }
@media (max-width: 760px) {
  .lib-filters { flex-wrap: wrap; }
  .lib-search { max-width: none; }
}

/* pruh průběhu kontroly */
.check-bar { display: flex; align-items: center; gap: 16px; margin-bottom: 18px;
  padding: 13px 16px; border-radius: var(--radius); background: var(--surface);
  border: 1px solid var(--line-soft); }
.check-bar-main { flex: 1; min-width: 0; }
.check-bar-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 7px; }
.check-bar-name { font-size: 13.5px; font-weight: 600; }
.check-bar-num { margin-left: auto; font-size: 12.5px; font-weight: 700;
  font-variant-numeric: tabular-nums; color: var(--accent-hi); }
.check-bar-note { margin-top: 6px; font-size: 11.5px; color: var(--text-faint);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Náhled z videa v knihovně. Všechny tři varianty (snímek, plakát, ikona)
   mají stejný rámeček, jinak by texty ve sloupci skákaly. */
.lib-row .watch-thumb { width: 76px; height: 44px; border-radius: 7px; }
.lib-row .watch-thumb img { object-fit: cover; }
.lib-shot { background: #000; }
.lib-shot img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Verdikt kontroly jako proužek na hraně řádku — malý odznak uprostřed
   se při rolování dvěma tisíci soubory ztratí, barevná hrana ne. */
.lib-row { position: relative; overflow: hidden; }
.lib-row::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--line); }
.lib-row.chk-ok::before { background: var(--green); }
.lib-row.chk-warn::before { background: var(--amber); }
.lib-row.chk-bad::before { background: var(--red); }
.lib-row.chk-none::before { background: var(--surface-3); }
.lib-row.lib-gone::before { opacity: .4; }

/* ═══ spodní lišta na telefonu ═══
   Palec dosáhne dolů, ne do levého horního rohu — hlavní sekce proto na
   mobilu patří sem a hamburger zůstává na zbytek. */
.tabbar { display: none; }

@media (max-width: 1000px) {
  /* v Nastavení jsou popis a ovládání vedle sebe; na telefonu pod sebou */
  .settings-row { flex-wrap: wrap; }
  .settings-row .grow { flex: 1 1 100%; }
  .settings-section { max-width: none; }
  .lib-filters { flex-wrap: wrap; }

  .tabbar {
    display: grid; grid-template-columns: repeat(5, 1fr); flex: none;
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg) 92%, transparent);
    backdrop-filter: blur(14px);
    padding-bottom: env(safe-area-inset-bottom); /* gesto-lišta iPhonu */
    position: relative; z-index: 30;
  }
  .tab {
    position: relative; display: flex; flex-direction: column; align-items: center;
    justify-content: center; gap: 3px; padding: 8px 2px 7px; min-height: 52px;
    color: var(--text-faint); font-size: 10.5px; font-weight: 600; letter-spacing: -.1px;
    text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  .tab .ico { width: 21px; height: 21px; }
  .tab.active { color: var(--accent-hi); }
  .tab.active::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
    width: 26px; height: 2px; border-radius: 0 0 3px 3px; background: var(--accent); }
  .tab .nav-badge { position: absolute; top: 4px; left: 50%; margin-left: 4px; }
  /* obsah nesmí končit pod lištou */
  .content { padding-bottom: 0; }
}

/* ── Demostream: co už tam je ─────────────────────────────────────────
   Stránka slouží k jedinému rozhodnutí: nahrávat, nebo ne. Proto plakát
   (poznám film na první pohled) a barevně odlišené zvukové stopy — záznam
   bez češtiny je pro tenhle účel skoro jako by tam nebyl. */
.ds-souhrn { font-size: 13px; color: var(--text-dim); margin-bottom: 14px; }
.ds-zvuk { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.ds-jazyk {
  font-size: 10px; font-weight: 700; letter-spacing: .04em; padding: 1px 5px;
  border-radius: 4px; background: var(--surface-3); color: var(--text-faint);
}
.ds-jazyk.nas { background: #35c58a1f; color: var(--green); }

.ds-detail { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 16px; }
.ds-detail-plakat .poster { aspect-ratio: 2/3; }
.ds-detail-text { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.ds-detail-meta { font-size: 12.5px; color: var(--text-dim); }
.ds-popis { font-size: 13px; line-height: 1.55; margin: 0; }
.ds-idy { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
@media (max-width: 560px) { .ds-detail { grid-template-columns: minmax(0, 1fr); }
  .ds-detail-plakat { display: none; } }

/* Odznaky u nálezu: heslo k archivu a nutnost debridu. Vzor je hlásí ještě
   před akcí — dozvědět se to až z chyby po kliknutí je pozdě. */
.badge-part.heslo { background: var(--surface-3); color: var(--text-dim); }
.badge-part.chybi { background: #f0556b1f; color: var(--red); }

/* Souhrn release v detailu: kolik souborů, kde leží a heslo k archivu.
   Heslo je jediné, co uživatel jinde nevezme — proto je vidět i s tlačítkem
   na zkopírování, jak to má vzor. */
.release-souhrn { display: flex; flex-direction: column; gap: 5px; padding: 10px 12px;
  border-radius: var(--radius-sm); background: var(--surface-2); margin-bottom: 10px; font-size: 12.5px; }
.release-radek { display: flex; align-items: center; gap: 8px; }
.release-klic { width: 78px; flex: none; color: var(--text-faint); }
.release-heslo { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: 12px;
  background: var(--surface-3); padding: 2px 6px; border-radius: 4px; }
.release-varovani { color: var(--red); font-size: 12px; line-height: 1.4; margin-top: 2px; }

/* Vlastnosti nálezu: rozlišení, HDR, kodeky, jazyky, seedeři. Podle nich se
   mezi dvěma verzemi téhož filmu vybírá — dokud se zahazovaly, poznal to
   člověk leda z názvu. */
.znacka-kv { font-size: 10px; font-weight: 700; letter-spacing: .03em; padding: 1px 5px;
  border-radius: 3px; background: var(--surface-3); color: var(--text-dim); margin-left: 4px; }
.znacka-kv.rozliseni { background: var(--accent-soft); color: var(--accent-hi); }
.znacka-kv.hdr { background: #f3b23c1f; color: var(--amber); }
.znacka-kv.jazyk.nas { background: #35c58a1f; color: var(--green); }
.seederu { font-variant-numeric: tabular-nums; }

/* Lišta nad výsledky: kolik jich je, filtr a řazení. U jednoho filmu chodí
   z osmi zdrojů desítky verzí a bez toho se v nich nedá vybrat. */
.vysledky-lista { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 0 2px 10px; font-size: 12.5px; color: var(--text-dim); }
.vysledky-pocet { font-variant-numeric: tabular-nums; }
.select-sm { padding: 4px 8px; font-size: 12.5px; }

/* Obsah úlohy na debridu. Sezónní balík má dvacet souborů — dokud se dal
   vzít jen jeden, stáhla se z celé sezóny jedna epizoda. */
.debrid-soubory { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line);
  display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; }
.debrid-soubor { display: flex; align-items: center; gap: 8px; min-width: 0; cursor: pointer; }
.debrid-soubor.jine { color: var(--text-faint); }
.debrid-jmeno { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.debrid-akce-vyber { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.debrid-akce-vyber:empty { display: none; }

/* Zdroj, který našel až na volnější tvar dotazu. Bez označení vypadají
   výsledky, jako by se hledalo něco jiného. */
.zdroj-chip.jinak .zdroj-znacka { background: #f3b23c1f; color: var(--amber); }

/* Díly seriálu na demostreamu. U seriálu nestačí vědět, že tam je —
   bez seznamu dílů se nahrává znovu i to, co už tam leží. */
.ds-dily { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.ds-sezona-hlava { display: flex; align-items: baseline; gap: 10px; font-size: 12.5px; margin-bottom: 4px; }
.ds-sezona-hlava > span:first-child { font-weight: 600; }
.ds-uplna { color: var(--green); font-size: 11.5px; }
.ds-chybi { color: var(--amber); font-size: 11.5px; }
.ds-mriz { display: flex; flex-wrap: wrap; gap: 3px; }
.ds-dil { min-width: 22px; text-align: center; font-size: 11px; font-weight: 600;
  padding: 2px 4px; border-radius: 3px; font-variant-numeric: tabular-nums; }
.ds-dil.je { background: #35c58a1f; color: var(--green); }
.ds-dil.chybi { background: var(--surface-3); color: var(--text-faint); }

/* Zdroje a výsledky po sekcích. Se souborem z úložiště a s torrentem se dělá
   něco jiného — torrent musí nejdřív na debrid — takže mít je promíchané
   v jednom seznamu jen mate. */
.zdroje-skupina { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.zdroje-skupina + .zdroje-skupina { margin-top: 6px; }
.zdroje-nadpis {
  font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-faint); background: none; border: 1px dashed var(--line);
  border-radius: 999px; padding: 3px 10px; cursor: pointer; flex: none;
  transition: color .15s, border-color .15s, background .15s;
}
.zdroje-nadpis:hover { color: var(--text-dim); border-color: var(--line-strong, var(--line)); }
.zdroje-nadpis.vse { color: var(--accent-hi); border-color: var(--accent); border-style: solid;
  background: var(--accent-soft); }

.vysledky-nadpis {
  display: flex; align-items: baseline; gap: 8px; margin: 16px 0 8px;
  font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-faint);
}
.vysledky-nadpis:first-child { margin-top: 0; }
.vysledky-kolik { font-variant-numeric: tabular-nums; background: var(--surface-2);
  color: var(--text-dim); border-radius: 999px; padding: 1px 7px; letter-spacing: 0; }
.vysledky-vysvetleni { letter-spacing: 0; text-transform: none; font-weight: 400;
  font-size: 11.5px; color: var(--text-faint); }

/* Soubory za záznamem na demostreamu.
   U jednoho filmu jich bývá čtrnáct a liší se hlavně kvalitou a zvukem —
   proto je kvalita odznak vepředu, podle kterého jde řádky přelétnout,
   a akce jsou ikony, aby na popis zbylo místo. */
.ds-verze { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; }
.ds-poznamka {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 11.5px; color: var(--amber); background: #f3b23c14;
  border-radius: var(--radius-sm); padding: 6px 9px; margin-bottom: 4px;
}
.ds-poznamka .btn { margin-left: auto; }
.ds-verze-radek {
  display: grid; grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center; gap: 10px;
  padding: 7px 10px; border-radius: var(--radius-sm); background: var(--surface-2);
}
.ds-verze-radek:hover { background: var(--surface-3); }
.ds-kvalita {
  text-align: center; font-size: 10.5px; font-weight: 700; letter-spacing: .04em;
  padding: 3px 0; border-radius: 4px; background: var(--surface-3); color: var(--text-dim);
}
.ds-kvalita.k-4k { background: var(--accent-soft); color: var(--accent-hi); }
.ds-kvalita.k-fhd { background: #35c58a1f; color: var(--green); }
.ds-verze-popis { min-width: 0; }
.ds-verze-meta { font-size: 12.5px; font-variant-numeric: tabular-nums;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ds-verze-zvuk { font-size: 11px; color: var(--text-faint);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ds-verze-akce { display: flex; gap: 2px; }
.ds-verze-akce .icon-btn[disabled] { opacity: .32; cursor: not-allowed; }

/* Okno detailu musí unést čtrnáct řádků, aniž by přerostlo obrazovku. */
.ds-detail-text { max-height: min(62vh, 560px); overflow-y: auto; padding-right: 4px; }

/* Záznam bez souborů. Katalog má stejný název klidně pětkrát a jen u části
   z nich něco je — prázdné se zašedí, ať se nekliká naslepo. */
.badge.souboru { left: 6px; right: auto; background: #35c58a; color: #06210f; font-weight: 700; }
.card.bez-souboru { opacity: .5; }
.card.bez-souboru:hover { opacity: .8; }

/* Filtr na stránce Debrid. V db-crawleru jsou to dvě obrazovky („Zobrazit
   cachované" a „Zobrazit připravené"); u devadesáti položek je rozdíl mezi
   hotovým a rozdělaným to první, co člověk potřebuje vidět. */
.debrid-lista { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.debrid-lista .input-sm { width: 220px; padding: 5px 10px; font-size: 12.5px; }
.chip-pocet { margin-left: 6px; font-size: 11px; font-variant-numeric: tabular-nums;
  background: var(--surface-3); color: var(--text-faint); border-radius: 999px; padding: 0 6px; }
.chip.active .chip-pocet { background: #ffffff26; color: inherit; }

/* Řádek na Debridu se zaškrtávátkem. Playlist z víc úloh má smysl u seriálu:
   demostream dostane jeden soubor se seznamem dílů místo dvaceti nahrání. */
.job.job-s-vyberem { grid-template-columns: auto minmax(0, 1fr) auto; }
/* Řádek bez náhledu. Výchozí mřížka .job počítá s plakátem v prvním
   sloupci (46 px) — bez něj do něj spadne text a zbyde z něj „Odv…". */
.job.bez-nahledu { grid-template-columns: minmax(0, 1fr) auto; }


/* ═══ Nastavení: záložky ═══════════════════════════════════════════
   Ve třech sloupcích se dvanáct sekcí nedalo přehlédnout a nic nenapovídalo,
   kde co hledat. Svislá lišta mluví stejným jazykem jako postranní menu
   a unese delší názvy než vodorovné karty. */
.nast-rozvrzeni {
  display: grid; grid-template-columns: 248px minmax(0, 1fr); gap: 28px;
  align-items: start;
}
.nast-lista {
  display: flex; flex-direction: column; gap: 3px;
  position: sticky; top: 16px;
}
.nast-zalozka {
  display: flex; align-items: flex-start; gap: 11px; width: 100%;
  padding: 11px 13px; border: 0; border-radius: var(--radius);
  background: transparent; color: var(--text-dim); cursor: pointer;
  text-align: left; font: inherit;
  transition: background .15s, color .15s;
}
.nast-zalozka:hover { background: var(--surface-2); color: var(--text); }
.nast-zalozka .ico { width: 18px; height: 18px; margin-top: 1px; opacity: .85; }
.nast-zal-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nast-zal-nazev { font-size: 13.5px; font-weight: 600; }
.nast-zal-popis { font-size: 11.5px; color: var(--text-faint); line-height: 1.35; }
.nast-zalozka.active {
  background: var(--accent-soft); color: var(--accent-hi);
}
.nast-zalozka.active .ico { opacity: 1; }
.nast-zalozka.active .nast-zal-popis { color: var(--accent-hi); opacity: .72; }

.nast-obsah { min-width: 0; max-width: 780px; }
.nast-panel { display: flex; flex-direction: column; gap: 14px; }
.nast-panel[hidden] { display: none; }

/* Nadpis skupiny uvnitř panelu: odděluje Xtream od DB-Crawleru, aniž by
   z toho byla další úroveň karet. */
.nast-nadpis { padding: 6px 2px 0; }
.nast-nadpis:not(:first-child) { margin-top: 10px; }
.nast-nadpis h2 { font-size: 17px; margin: 0 0 3px; }
.nast-nadpis p { font-size: 12.5px; color: var(--text-faint); margin: 0; line-height: 1.45; }

@media (max-width: 900px) {
  .nast-rozvrzeni { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .nast-lista { position: static; flex-direction: row; overflow-x: auto; gap: 6px; padding-bottom: 4px; }
  .nast-zalozka { flex: none; }
  .nast-zal-popis { display: none; }
}

/* Aktivační obrazovka. Otisk je dlouhý kód, který uživatel posílá dál —
   musí být celý vidět a jít zkopírovat jedním klikem. */
.otisk-radek { display: flex; align-items: flex-start; gap: 8px; }
.otisk-radek code {
  flex: 1; min-width: 0; font-size: 11.5px; line-height: 1.6;
  word-break: break-all; background: var(--surface); color: var(--text);
  border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 8px 10px;
}
.otisk-radek .btn { flex: none; }
#licence-klic {
  width: 100%; font-family: ui-monospace, Menlo, monospace; font-size: 12px;
  line-height: 1.6; resize: vertical; padding: 9px 11px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--surface); color: var(--text);
}
#licence-klic:focus { outline: 2px solid var(--accent); outline-offset: -1px; }

/* ═══ domov crawleru ═══ */
/* Vodorovný pás plakátů. Katalog TMDb má dvacet titulů na řadu a svisle by
   z toho byla stránka na pět obrazovek. */
.row-block { margin-bottom: 26px; }
.poster-pas { display: flex; gap: 12px; overflow-x: auto; padding: 4px 2px 10px; scroll-snap-type: x proximity; }
.poster-pas::-webkit-scrollbar { height: 8px; }
.poster-pas::-webkit-scrollbar-thumb { background: var(--line); border-radius: 999px; }
.poster-dlazdice {
  flex: 0 0 150px; scroll-snap-align: start; text-align: left; padding: 0; cursor: pointer;
  background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--radius);
  overflow: hidden; color: inherit; font: inherit; transition: border-color .15s, transform .15s;
}
.poster-dlazdice:hover { border-color: var(--accent); transform: translateY(-2px); }
.poster-dlazdice img { width: 100%; aspect-ratio: 2/3; object-fit: cover; display: block; }
.poster-nahrada { width: 100%; aspect-ratio: 2/3; display: grid; place-items: center; background: var(--surface-2); color: var(--text-faint); }
.poster-popis { padding: 8px 10px 10px; }
.poster-nazev { font-size: 13px; font-weight: 600; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.poster-rok { margin-top: 3px; font-size: 12px; color: var(--text-faint); }

/* Přetahování zdrojů mění pořadí, ve kterém se ukazují výsledky. */
.zdroj-chip[draggable="true"] { cursor: grab; }
.zdroj-chip.tahne { opacity: .45; cursor: grabbing; }
.zdroj-chip.cil { outline: 2px solid var(--accent); outline-offset: 1px; }

/* Odhad, kdy bude fronta hotová. Sedí vedle nadpisu — je to odpověď na
   otázku „stihnu to dneska", ne údaj k jednotlivé úloze. */
.fronta-odhad { display: flex; align-items: baseline; gap: 2px; flex-wrap: wrap;
  font-size: 13.5px; align-self: center; }
.fronta-odhad b { font-variant-numeric: tabular-nums; }
.fronta-odhad .sub { font-size: 13px; }

/* ═══ hlášení a karta po dokončení ═══ */
/* Zvoneček drží, co toast nestihl říct. */
#btn-hlaseni { position: relative; }
#btn-hlaseni .nav-badge { position: absolute; top: 0; right: 0; transform: translate(35%, -25%); }

.hlaseni-panel {
  position: absolute; top: calc(var(--topbar-h) - 8px); right: 14px; z-index: 60;
  width: min(380px, calc(100vw - 28px)); max-height: 60vh; overflow-y: auto;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
}
.hlaseni-hlava { display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--line-soft); }
.hlaseni-radek { display: flex; align-items: flex-start; gap: 10px; width: 100%;
  padding: 10px 14px; background: none; border: 0; border-bottom: 1px solid var(--line-soft);
  color: inherit; font: inherit; text-align: left; cursor: pointer; }
.hlaseni-radek:last-child { border-bottom: 0; }
.hlaseni-radek:hover { background: var(--surface); }
.hlaseni-radek .grow { flex: 1; min-width: 0; }
.hlaseni-nazev { font-size: 13.5px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hlaseni-text { font-size: 12.5px; color: var(--text-dim); margin-top: 2px; line-height: 1.45; }
.hlaseni-radek.chyba .hlaseni-nazev { color: var(--red); }
.hlaseni-radek .sub { font-size: 11.5px; white-space: nowrap; flex: none; }

/* Karta se stahuje zdola vpravo, nad toasty — je to nabídka, ne hláška.
   Je vždycky jen jedna (hlaseni.js); sloupec dřív při dávce vylezl
   z obrazovky. Strop je pojistka, aby se to nemohlo opakovat. */
.hotovo-karty { position: fixed; right: 16px; bottom: 16px; z-index: 55;
  display: flex; flex-direction: column-reverse; gap: 10px; pointer-events: none;
  max-height: calc(100vh - 32px); overflow: hidden; }
.hotovo-karta {
  pointer-events: auto; width: min(300px, calc(100vw - 32px));
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg); padding: 12px 14px 14px;
  animation: hotovo-prijezd .22s var(--ease);
}
@keyframes hotovo-prijezd { from { opacity: 0; transform: translateY(10px); } }
@media (prefers-reduced-motion: reduce) { .hotovo-karta { animation: none; } }
.hotovo-hlava { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 9px; }
.hotovo-hlava .ico { width: 16px; height: 16px; color: var(--green); }
.hotovo-plakat { width: 100%; max-height: 130px; object-fit: cover;
  border-radius: var(--radius-sm); display: block; margin-bottom: 9px; }
.hotovo-nazev { font-size: 14px; font-weight: 600; line-height: 1.35; margin-bottom: 4px; }
.hotovo-verdikt { font-size: 12.5px; margin-bottom: 10px; }
.hotovo-verdikt.warn { color: var(--amber); }
.hotovo-verdikt.bad { color: var(--red); }
.hotovo-dalsi { flex: none; background: none; border: 0; padding: 0; font: inherit;
  font-size: 12px; color: var(--text-dim); cursor: pointer;
  text-decoration: underline; text-underline-offset: 2px; }
.hotovo-dalsi:hover { color: var(--text); }
.hotovo-akce { display: flex; gap: 8px; margin-top: 10px; }
.hotovo-akce .btn { flex: 1; justify-content: center; }

@media (max-width: 640px) {
  /* Na telefonu by karta překryla ovládání fronty. */
  .hotovo-karty { left: 16px; right: 16px; bottom: calc(var(--tabbar-h, 58px) + 12px); }
  .hotovo-karta { width: auto; }
}

/* debrid: hromadný výběr souborů úlohy */
.debrid-soubor.debrid-vse { border-bottom: 1px solid var(--line-soft); padding-bottom: 6px; margin-bottom: 4px; gap: 10px; }
.debrid-soubor.debrid-vse .sub { margin-left: 4px; }

/* ── Hlídač: záložky, filtry, tabulka seriálů (views.js, renderWatch) ── */
.hl-zalozky { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin: 4px 0 16px; overflow-x: auto; scrollbar-width: none; }
.hl-zalozky::-webkit-scrollbar { display: none; }
.hl-zalozka { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border: 0; background: none; color: var(--text-dim); font: inherit; font-weight: 600; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.hl-zalozka .ico { width: 16px; height: 16px; }
.hl-zalozka:hover { color: var(--text); }
.hl-zalozka.active { color: var(--text); border-bottom-color: var(--accent); }
.hl-pocet { font-size: 11.5px; font-variant-numeric: tabular-nums; padding: 1px 7px; border-radius: 99px; background: var(--surface-2); color: var(--text-dim); }
.hl-pocet.nove { background: var(--accent); color: #fff; }
.hl-lista { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.hl-hledat { flex: 1; min-width: 200px; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--text); font: inherit; font-size: 14px; }
.hl-nastroje { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.hl-prepinac { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--line); border-radius: var(--radius-sm); }
.hl-akce { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: -8px 0 10px; }
.hl-vse { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; color: var(--text-dim); font-size: 13.5px; }
.hl-cb { width: 17px; height: 17px; flex: none; align-self: center; accent-color: var(--accent); cursor: pointer; margin-right: 4px; }
.hl-koop { color: #f3b23c !important; }
.hl-prazdno { padding: 28px 4px; }
.hl-skupina { cursor: pointer; }
.hl-sipka { pointer-events: none; }
.hl-deti { margin: 4px 0 10px 34px; padding-left: 10px; border-left: 2px solid var(--line); display: flex; flex-direction: column; gap: 6px; }
.hl-tab-obal { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.hl-tab { width: 100%; border-collapse: collapse; font-size: 14px; }
.hl-tab th { text-align: left; font-size: 11.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text-faint); padding: 9px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.hl-tab td { padding: 7px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.hl-tab tr:last-child td { border-bottom: 0; }
.hl-tab tbody tr:hover { background: var(--surface-2); }
.hl-tab tr.vybrano { background: var(--accent-soft); }
.hl-tab td a { color: var(--text); font-weight: 600; text-decoration: none; }
.hl-tab td a:hover { color: var(--accent-hi); }
.hl-c { text-align: center; width: 1%; white-space: nowrap; }
.hl-nazev { display: flex; gap: 10px; align-items: center; min-width: 200px; }
.hl-mini { width: 30px; height: 44px; border-radius: 5px; overflow: hidden; flex: none; background: var(--surface-2); }
.hl-mini img { width: 100%; height: 100%; object-fit: cover; }
.hl-stav { font-size: 12.5px; display: flex; gap: 8px; }
.hl-ok { color: var(--green); }
.hl-varuj { color: var(--amber); font-weight: 600; }
.hl-ostatni { font-size: 12.5px; color: var(--text-dim); }
.icon-btn.hl-btn-varuj { color: var(--amber); }
.hl-mriz { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 16px; }
.hl-karta { color: inherit; text-decoration: none; display: flex; flex-direction: column; gap: 4px; }
.hl-plakat { position: relative; aspect-ratio: 2 / 3; border-radius: 10px; overflow: hidden; background: var(--surface-2); }
.hl-plakat img { width: 100%; height: 100%; object-fit: cover; }
.hl-karta-nazev { font-weight: 600; font-size: 13.5px; line-height: 1.3; }
.hl-karta:hover .hl-karta-nazev { color: var(--accent-hi); }
.hl-karta-pod { font-size: 12px; color: var(--text-dim); }
@media (max-width: 760px) {
  .hl-skryt-m { display: none; }
  .hl-deti { margin-left: 8px; }
}
.hl-nastroje .select { width: auto; }
.hl-chips { flex-wrap: wrap; overflow: visible; margin-bottom: 14px; }
.hl-nowrap { white-space: nowrap; }

/* ── Torrenty (torrenty.js) ── */
.tor-stav { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin: -6px 0 14px; font-size: 14px; }
.tor-vpn { font-weight: 600; }
.tor-vpn.ok { color: var(--green); }
.tor-vpn.varuj { color: var(--amber); }
.tor-vpn.stoji { color: var(--text-dim); }
.tor-nazev { font-weight: 600; word-break: break-word; min-width: 220px; }
.tor-prubeh { min-width: 130px; }
.tor-draha { height: 6px; border-radius: 3px; background: var(--surface-2); overflow: hidden; margin-bottom: 3px; }
.tor-draha i { display: block; height: 100%; background: var(--accent); }
.tor-pridat { display: flex; flex-direction: column; gap: 6px; }
.tor-pridat .sub { margin-top: 6px; }
.tor-magnet, .tor-pole { width: 100%; padding: 9px 12px; border-radius: var(--radius-sm); border: 1px solid var(--line); background: var(--surface); color: var(--text); font: inherit; font-size: 13.5px; }
.tor-magnet { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; resize: vertical; }
.tor-check { display: inline-flex; gap: 8px; align-items: center; margin-top: 8px; cursor: pointer; }
.tor-ovl { display: flex; gap: 8px; align-items: center; flex: none; }
.tor-ovl .tor-pole { width: min(360px, 60vw); }
.tor-ovl input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--accent); }
.tor-detail h4 { margin: 0 0 8px; }

/* Demostream → Co chybí: je to na portálu? */
.badge.na-portalu { top: auto; bottom: 8px; background: #e0b53a; color: #1a1200; font-weight: 700; }
.badge.na-portalu.jiste { background: #35c58a; color: #06210f; }
.badge.na-portalu.overuje { background: var(--surface-3); color: var(--text-dim); }
.chybi-shoda-jistota { font-size: 11px; padding: 1px 7px; border-radius: 20px; margin-left: 8px; background: var(--surface-3); color: var(--text-dim); }
.chybi-shoda-jistota.jiste { background: #35c58a2a; color: #35c58a; }
.podavac { border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; margin-bottom: 16px; background: var(--surface-2, transparent); }
.podavac-hlava { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.podavac-bezi { color: #35c58a; font-size: 12px; font-weight: 700; }
.podavac-stoji { color: var(--amber); font-size: 12px; font-weight: 700; }
.podavac-akce { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.podavac-chyby { margin-top: 8px; font-size: 12px; }
.podavac-chyby summary { cursor: pointer; color: var(--red); }
.badge.podavac-stav { top: 8px; left: 8px; }
.badge.podavac-stav.s-bezi { background: var(--accent); }
.badge.podavac-stav.s-hotovo { background: #35c58a; color: #06210f; }
.badge.podavac-stav.s-chyba, .badge.podavac-stav.s-vyprselo { background: var(--red); }

/* ═══ hledání v crawleru: lišta filtrů, řádek nálezu, nabídka ═══
   Filtry jen ukazují, co už je na obrazovce; kde se hledá, je zvlášť
   za tlačítkem „Hledám všude". Dřív dělal jeden přepínač obojí. */
.seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px;
  background: var(--surface); border: 1px solid var(--line); }
.seg-btn { border: 0; background: none; color: var(--text-dim); font: inherit; font-size: 12.5px;
  font-weight: 600; padding: 5px 13px; border-radius: 999px; cursor: pointer; }
.seg-btn:hover { color: var(--text); }
.seg-btn.on { background: var(--accent); color: #fff; }
.btn.omezeno { color: var(--amber); border-color: #f3b23c66; }

.filtry-box { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px 10px;
  margin-bottom: 12px; border-radius: var(--radius); background: var(--surface);
  border: 1px solid var(--line-soft); }
.filtry-box[hidden] { display: none; }
.filtry { display: flex; flex-direction: column; gap: 6px; }
.filtry-radek { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 8px; }
.filtry-nazev { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-faint); }
.filtry-chipy { display: flex; flex-wrap: wrap; gap: 5px; }
.chip.chip-sm { padding: 3px 10px; font-size: 12px; display: inline-flex; align-items: center; gap: 0; }
.chip.chip-sm .chip-pocet { margin-left: 6px; }
.chip-znacka { margin-left: 5px; font-weight: 700; }
.chip.hleda .chip-znacka { opacity: .6; animation: blik 1.2s ease-in-out infinite; }
.chip.chyba { border-color: #f0556b88; color: var(--red); }
.chip.chyba[disabled] { opacity: .8; cursor: help; }
.chip.jinak .chip-znacka { color: var(--amber); }
@keyframes blik { 50% { opacity: .2; } }
.filtry-ovladani { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding-top: 6px; border-top: 1px dashed var(--line-soft); font-size: 12.5px; color: var(--text-dim); }
.filtry-ovladani .grow { flex: 1; }
.filtry-text { flex: 0 1 260px; min-width: 150px; padding: 6px 12px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--bg, var(--surface-2)); color: var(--text);
  font: inherit; font-size: 12.5px; }
.filtry-ovladani .check { font-size: 12.5px; gap: 6px; }
.filtry-ovladani .check input { width: 15px; height: 15px; }
.filtry-aktivni { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.filtry-aktivni[hidden] { display: none; }
.stitek-filtr { display: inline-flex; align-items: center; gap: 5px; padding: 2px 6px 2px 10px;
  border-radius: 999px; border: 1px solid var(--accent); background: var(--accent-soft);
  color: var(--accent-hi); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.stitek-filtr .ico { width: 13px; height: 13px; }
.stitek-filtr:hover { background: var(--accent); color: #fff; }
.lepkava .filtry-box { margin-bottom: 0; box-shadow: 0 6px 18px #0000001f; }

.hledani-prubeh { display: flex; align-items: center; gap: 10px; margin-bottom: 10px;
  font-size: 12px; color: var(--text-faint); }
.hledani-prubeh[hidden] { display: none; }
.hledani-prubeh .bar { flex: 0 0 140px; }

/* Řádek nálezu: zaškrtnutí | název a soubor | stálé sloupce | akce. */
.job.nalez { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 12px; padding: 9px 12px; }
.job.nalez.v-skupine { margin-left: 28px; border-style: dashed; }
.job.nalez.fokus { box-shadow: 0 0 0 2px var(--accent); }
.nalez-hlavni { min-width: 0; cursor: pointer; }
.nalez-nazev { display: flex; align-items: baseline; gap: 6px; min-width: 0; flex-wrap: wrap; }
.nalez-titul { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.nalez-rok { font-size: 12.5px; color: var(--text-faint); font-variant-numeric: tabular-nums; }
.nalez-nazev .badge-part { margin-left: 0; font-size: 10.5px; }
.nalez-soubor { font-size: 11.5px; color: var(--text-faint); overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; margin-top: 2px; }
.nalez-zrcadla { margin-top: 3px; padding: 0; border: 0; background: none; font: inherit;
  font-size: 11.5px; color: var(--accent-hi); cursor: pointer; }
.nalez-zrcadla:hover { text-decoration: underline; }
.nalez-sloupce { display: grid; grid-template-columns: 112px 70px 70px 110px; gap: 8px;
  align-items: center; font-size: 12px; color: var(--text-dim); }
.nalez-kv, .nalez-jazyk { display: flex; flex-wrap: wrap; gap: 3px; }
.nalez-kv .znacka-kv, .nalez-jazyk .znacka-kv { margin-left: 0; }
.nalez-velikost { text-align: right; font-variant-numeric: tabular-nums; }
.nalez-zdroj { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nalez-akce { gap: 4px; }
.nalez-akce .btn { gap: 5px; }
.storage-split.s-open .nalez-sloupce { grid-template-columns: 70px 60px 64px; }
.storage-split.s-open .nalez-zdroj { display: none; }
.storage-split.s-open .nalez-akce .btn > span:not(.ico) { display: none; }
@media (max-width: 1100px) {
  .nalez-sloupce { grid-template-columns: 70px 60px 64px; }
  .nalez-zdroj { display: none; }
}
@media (max-width: 760px) {
  .job.nalez { grid-template-columns: auto minmax(0, 1fr) auto; }
  .nalez-sloupce { grid-column: 2 / -1; grid-row: 2; grid-template-columns: repeat(3, auto); justify-content: start; }
  .nalez-akce .btn > span:not(.ico) { display: none; }
  .filtry-box.sbalene .filtry { display: none; }
  .filtry-box.sbalene:has(.filtry) { display: none; }
  .filtry-radek { grid-template-columns: 1fr; gap: 3px; }
}

/* Hromadné akce u spodního okraje — nad výsledky by při každém zaškrtnutí
   posunuly celý seznam. */
.lib-bulk.hromadne-dole { position: sticky; bottom: 12px; z-index: 5; margin: 12px 0 0;
  background: var(--surface); box-shadow: 0 8px 28px #00000055; }

/* Nabídka „⋯" u řádku. */
.nabidka { position: fixed; z-index: 1000; min-width: 210px; padding: 5px;
  border-radius: var(--radius-sm); background: var(--surface); border: 1px solid var(--line);
  box-shadow: 0 12px 32px #00000066; display: flex; flex-direction: column; }
.nabidka-polozka { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0;
  border-radius: 6px; background: none; color: var(--text); font: inherit; font-size: 13px;
  text-align: left; cursor: pointer; }
.nabidka-polozka:hover { background: var(--surface-2); }
.nabidka-polozka .ico { width: 16px; height: 16px; color: var(--text-dim); }

/* Okno „Kde hledat". */
.rozsah-predvolby { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.rozsah-seznam { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; }
.rozsah-radek { display: flex; align-items: center; gap: 10px; padding: 7px 10px;
  border-radius: var(--radius-sm); border: 1px solid var(--line-soft); background: var(--surface);
  cursor: grab; font-size: 13.5px; }
.rozsah-radek .grow { flex: 1; }
.rozsah-radek .ico { width: 14px; height: 14px; color: var(--text-faint); }
.rozsah-radek input { width: 16px; height: 16px; accent-color: var(--accent); }
.rozsah-radek.tahne { opacity: .45; }
.rozsah-radek.cil { outline: 2px solid var(--accent); outline-offset: 1px; }
.rozsah-druh { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: .06em; }

.filtry-ovladani .select { width: auto; }
.filtry-lista .filtry-ovladani { padding-top: 0; border-top: 0; }
.filtry-lista { padding: 8px 12px; }
.filtry-box + .lepkava .filtry-lista, .filtry-box + .lepkava { margin-top: 0; }
.jen-mobil { display: none; }
@media (max-width: 760px) {
  .jen-mobil { display: inline-flex; }
  .filtry-ovladani .filtry-text { flex: 1 1 100%; order: 5; }
}

/* ═══ Nahrávání: seriály jako sbalitelné skupiny, souhrn, jeden štítek stavu ═══ */
.lib-group-hlava { display: flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none;
  color: var(--text); font: inherit; text-align: left; cursor: pointer; min-width: 0; }
.lib-group-hlava > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.lib-group-sipka { width: 16px; height: 16px; flex: none; display: flex; align-items: center; justify-content: center;
  color: var(--text-dim); transition: transform .15s var(--ease); transform: rotate(90deg); }
.lib-group-sipka::before { content: ''; border-left: 7px solid currentColor;
  border-top: 5px solid transparent; border-bottom: 5px solid transparent; }
.lib-group.sbaleno .lib-group-sipka { transform: none; }
.lib-group-hlava:hover .lib-group-sipka { color: var(--text); }
.lib-group.sbaleno { margin-bottom: 4px; border-bottom-style: dashed; }
.lib-souhrn { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12px; color: var(--text-faint);
  font-variant-numeric: tabular-nums; }
.lib-souhrn-pol.ok { color: var(--green); }
.lib-souhrn-pol.pripraveno { color: var(--accent-hi); }
.lib-souhrn-pol.warn { color: var(--amber); }
.lib-souhrn-pol.bad { color: var(--red); }
.lib-sezona { display: flex; align-items: center; gap: 10px; margin: 10px 0 4px 26px;
  font-size: 12.5px; color: var(--text-dim); }
.lib-sezona-nazev { font-weight: 650; color: var(--text); }
.lib-row.v-serialu { margin-left: 26px; }
.lib-row.fokus { box-shadow: 0 0 0 2px var(--accent); }
.lib-row .epg-title { display: flex; align-items: baseline; gap: 8px; min-width: 0; flex-wrap: wrap; }
.lib-nazev { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; max-width: 100%; }
.lib-stav { margin-left: 0; font-size: 11.5px; }
.lib-akce { gap: 6px; align-items: center; }
.lib-akce .btn { gap: 5px; }
.lib-dalsi { display: flex; justify-content: center; margin: 14px 0; }
.lib-dalsi[hidden] { display: none; }
.lib-bulk-popis { display: flex; flex-direction: column; gap: 1px; }
.lib-bulk-rozpad { font-size: 11.5px; font-weight: 500; color: var(--text-dim); }
.chip.chip-dalsi { border-style: dashed; color: var(--text-dim); gap: 5px; }
.chip.chip-dalsi .ico { width: 13px; height: 13px; }
/* okno výběru hodnot fasety (seriály v Nahrávání) */
.vyber-hlava { position: sticky; top: -18px; z-index: 1; display: flex; gap: 8px; align-items: center;
  margin: -18px -20px 10px; padding: 14px 20px 10px; background: var(--surface);
  border-bottom: 1px solid var(--line-soft); }
.vyber-hlava .vyber-hledat { flex: 1; max-width: none; }
.vyber-hlava .select { width: auto; }
.vyber-seznam { display: flex; flex-direction: column; }
.vyber-radek { display: flex; align-items: center; gap: 10px; padding: 6px 4px; border-radius: 6px;
  cursor: pointer; font-size: 13.5px; }
.vyber-radek:hover { background: var(--surface-2); }
.vyber-radek input { width: 16px; height: 16px; accent-color: var(--accent); flex: none; }
.vyber-nazev { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vyber-souhrn { font-size: 12.5px; color: var(--text-dim); align-self: center; }
@media (max-width: 760px) {
  .lib-row.v-serialu, .lib-sezona { margin-left: 0; }
  .lib-akce .btn > span:not(.ico) { display: none; }
  .lib-souhrn { width: 100%; order: 5; }
}

/* ═══ Demostream (BE2): ikonky kvality ze StreamCube, zámek, stopy ═══ */
.ds-verze-radek { grid-template-columns: 58px minmax(0, 1fr) auto; }
.ds-ikona { position: relative; display: inline-flex; justify-content: center; width: 58px; }
.ds-ikona img { height: 44px; width: auto; max-width: 58px; display: block; }
.ds-ikona-zamek { position: absolute; top: -2px; right: 2px; color: #fff;
  filter: drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); }
.ds-ikona-zamek .ico { width: 15px; height: 15px; }
.ds-kvalita.zamceno { outline: 1px solid var(--amber); }
.ds-verze-meta { display: flex; align-items: center; gap: 8px; }
.ds-sifr { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 700;
  color: var(--amber); }
.ds-sifr .ico { width: 12px; height: 12px; }
.ds-znacka-ds { font-size: 10px; font-weight: 800; letter-spacing: .05em; padding: 1px 5px;
  border-radius: 4px; background: var(--accent-soft); color: var(--accent-hi); }
.ds-verze-radek.sifrovany { background: color-mix(in srgb, var(--surface-2) 88%, #f3b23c); }
.ds-stopy { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 4px; }
.ds-stopy .ico { width: 13px; height: 13px; color: var(--text-faint); }
.ds-stopa { font-size: 11px; padding: 1px 6px; border-radius: 5px; background: var(--surface-3);
  color: var(--text-dim); white-space: nowrap; }
.ds-stopa b { font-weight: 700; }
.ds-stopa.nas { background: #35c58a1f; color: var(--green); }
.badge.souboru { display: inline-flex; align-items: center; gap: 6px; }
.badge-zamek { display: inline-flex; align-items: center; gap: 2px; color: #4a2c00; }
.badge-zamek .ico { width: 11px; height: 11px; }
.badge.kvalita-nej { top: auto; bottom: 8px; left: 6px; }
@media (max-width: 760px) {
  .ds-verze-radek { grid-template-columns: 50px minmax(0, 1fr) auto; }
  .ds-ikona, .ds-ikona img { width: 50px; max-width: 50px; height: auto; }
}

/* Řádek „co je na demostreamu" (hledání v crawleru, detail titulu). */
.ds-stav-radek { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px;
  padding: 9px 12px; border-radius: var(--radius); background: var(--surface);
  border: 1px solid var(--line-soft); border-left: 3px solid var(--line); font-size: 13px; }
.ds-stav-radek.je { border-left-color: var(--green); }
.ds-stav-radek.cast { border-left-color: var(--amber); }
.ds-stav-radek.chybi { border-left-color: var(--accent); }
.ds-stav-ikona .ico { width: 16px; height: 16px; color: var(--text-faint); }
.ds-stav-titul { font-weight: 650; }
.ds-stav-text { flex: 1; min-width: 200px; color: var(--text-dim); }
.ds-stav-radek.je .ds-stav-text { color: var(--text); }
.ds-stav-radek.cast .ds-stav-text { color: var(--amber); }
.ds-stav-akce { display: inline-flex; gap: 6px; }

/* Našeptávač TMDb pod horním hledáním. */
.search { position: relative; }
.nasep { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 60;
  max-height: min(70vh, 520px); overflow-y: auto; padding: 6px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 16px 40px #00000066; }
.nasep[hidden] { display: none; }
.nasep-nadpis { padding: 6px 8px 4px; font-size: 10.5px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text-faint); }
.nasep-radek { display: flex; align-items: center; gap: 10px; width: 100%; padding: 5px 8px;
  border: 0; border-radius: 8px; background: none; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.nasep-radek:hover, .nasep-radek.on { background: var(--surface-2); }
.nasep-radek.on { box-shadow: inset 0 0 0 1px var(--accent); }
.nasep-plakat { width: 30px; height: 44px; flex: none; border-radius: 4px; overflow: hidden; background: var(--surface-3); }
.nasep-plakat img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nasep-text { display: flex; flex-direction: column; min-width: 0; }
.nasep-nazev { font-size: 13.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nasep-meta { font-size: 11.5px; color: var(--text-faint); }
.nasep-pata { padding: 6px 8px 2px; font-size: 11px; color: var(--text-faint); border-top: 1px solid var(--line-soft); margin-top: 4px; }
.ds-stopa.neznamy { font-style: italic; }
.nasep-puvodni { font-weight: 400; color: var(--text-faint); }

/* Pořad z iVysílání ve výpisu hledání: náhled | název a žánry | akce. */
.job.nalez.porad-iv { grid-template-columns: 96px minmax(0, 1fr) auto; }
.porad-iv-obr { display: block; width: 96px; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: var(--surface-2); }
.porad-iv-obr img { width: 100%; height: 100%; object-fit: cover; display: block; }
.porad-iv .nalez-hlavni { color: inherit; text-decoration: none; }
@media (max-width: 760px) {
  .job.nalez.porad-iv { grid-template-columns: 72px minmax(0, 1fr) auto; }
  .porad-iv-obr { width: 72px; }
}

/* Výběr chybějících dílů v tabulce pokrytí (stránka seriálu na demostreamu). */
.ds-pokryti-lista { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.ds-pokryti-napoveda { font-size: 11.5px; color: var(--text-faint); }
button.ds-dil { border: 1px solid transparent; font: inherit; font-size: 11px; font-weight: 600; cursor: pointer; }
button.ds-dil.chybi:hover { border-color: var(--accent); color: var(--text); }
button.ds-dil.chybi.vybrany { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ═══ mobil a dotyk ═══
   Z auditu mobilní verze (25. 10. 2026, iPhone 390 a 360 px ve WebKitu).
   Příčiny „nedoklikám se“ byly systémové, proto jsou opravy tady na jednom
   místě, ne po stránkách:
   - textová pole bez třídy neměla žádný styl (19 px vysoká, písmo 11 px),
   - pole s písmem pod 16 px iOS při klepnutí přiblíží a samo nevrátí,
   - select bez appearance:none ve WebKitu ignoruje padding (22 px výšky),
   - ovládací prvky měly desktopových 30–36 px. */

/* Holé pole (bez .field a vlastní třídy). :where() má nulovou specifičnost —
   pole s vlastním stylem (hledání v liště…) si ho nechají. */
:where(input:not([type=checkbox], [type=radio], [type=range], [type=file], [type=color], [type=hidden])),
:where(textarea) {
  padding: 10px 13px; border-radius: var(--radius-sm); border: 1px solid var(--line);
  background: var(--bg-elev); color: var(--text); font: inherit; font-size: 14.5px; max-width: 100%;
}
:where(input:not([type=checkbox], [type=radio]), textarea):focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft);
}
.select, .select-sm {
  -webkit-appearance: none; appearance: none; padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%238a90a6' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center; background-size: 11px 8px;
}
.hl-stav { flex-wrap: wrap; }
.job-thumb-slozka { display: grid; place-items: center; }

/* Prst místo myši: cíle aspoň 44 px (Apple HIG), zaškrtávátka 22 px. */
@media (pointer: coarse) {
  .btn, .btn-sm, .select, .select-sm, .seg-btn, .chip:not(.chip-sm) { min-height: 44px; }
  .chip.chip-sm { min-height: 36px; padding: 6px 12px; }
  .chip { display: inline-flex; align-items: center; }
  .icon-btn { width: 44px; height: 44px; }
  .icon-btn.sm { width: 40px; height: 40px; }
  #btn-restart { min-width: 44px; }
  .stitek-filtr { min-height: 36px; }
  /* zaškrtávátko řádku knihovny: label je plocha na klepnutí */
  .lib-check { min-width: 44px; min-height: 44px; display: inline-grid; place-items: center; }
  :where(input:not([type=checkbox], [type=radio], [type=range], [type=file], [type=color], [type=hidden])) { min-height: 44px; }
  input[type=checkbox], input[type=radio] { width: 22px; height: 22px; accent-color: var(--accent); }
  /* zaškrtávátko řádku: plocha na klepnutí větší než samotný čtvereček */
  .row-check { padding: 10px; margin: -10px; }
  .nav-group-head { min-height: 40px; }
  .nav-item { min-height: 44px; }
  .nast-zalozka { min-height: 44px; align-items: center; }
  .hl-zalozka { min-height: 44px; }
  .ds-dil { min-width: 32px; min-height: 30px; display: inline-grid; place-items: center; }
}

@media (max-width: 1000px) {
  /* 16 px = iOS při psaní nepřibližuje. Proti třídám s menším písmem. */
  input:not([type=checkbox], [type=radio]), select, textarea { font-size: 16px !important; }

  /* Nastavení: ovládání pod popisem na celou šířku, ne v desktopových
     pevných šířkách (92, 240, 280 px, 62 %) zmáčknuté vpravo. */
  .settings-row input:not([type=checkbox], [type=radio]), .settings-row select,
  .settings-row textarea { width: 100% !important; }
  .settings-row > div:not(.grow) { flex: 1 1 100%; flex-wrap: wrap; }
  .settings-row .grow { min-width: 0; overflow-wrap: anywhere; }
  .chips-volba { justify-content: flex-start !important; flex: 1 1 100% !important; }
  .chips-cesty .chip { white-space: normal; text-align: left; line-height: 1.35; }
  .tor-ovl { flex-wrap: wrap; }
  .tor-ovl .tor-pole { width: 100%; }
  .ucet-hlava { flex-wrap: wrap; }

  /* zavírací křížek v menu (hamburger je pod panelem schovaný) */
  .side-brand { position: relative; }
  .side-zavrit { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); }

  /* spodní lišta: bez portálu crawler místo prázdného katalogu */
  html:not([data-tabbar=crawler]) .tab[data-bez-portalu],
  html[data-tabbar=crawler] .tab[data-jen-portal] { display: none; }
  .tab { font-size: 11px; }

  /* úloha: akce pod názvem, ne vedle něj — vedle zbylo na název 96 px */
  .job { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .job-actions { flex-wrap: wrap; justify-content: flex-start; }
}

/* Nastavení: lišta záložek. Každá záložka měla width:100 % (343 px), takže
   byla vidět jen aktivní a o ostatních člověk nevěděl. */
@media (max-width: 900px) {
  .nast-lista { flex-wrap: wrap; overflow: visible; }
  .nast-zalozka { width: auto; }

  /* Detail nálezu v Hledání: dřív se vykreslil pod seznam (y = 11 640 px)
     a klepnutí na řádek zdánlivě nic neudělalo. Teď spodní list. */
  .detail-panel:not([hidden]) {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 70;
    max-height: 78dvh; overflow-y: auto; border-radius: 16px 16px 0 0;
    padding-bottom: calc(16px + env(safe-area-inset-bottom)); box-shadow: var(--shadow-lg);
  }
}

/* Lepkavá lišta vyšší než třetina obrazovky se nelepí (lepkava v dom.js). */
.lepkava.lepkava-vysoka { position: static; }

/* Torrenty: tabulka (936 px v okně 311 px) jako karty. */
@media (max-width: 760px) {
  .tor-tab thead { display: none; }
  .tor-tab, .tor-tab tbody { display: block; }
  .tor-tab tr { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
    padding: 10px 12px; border-bottom: 1px solid var(--line); }
  .tor-tab td { display: block; border: 0; padding: 0; width: auto; }
  .tor-tab td.tor-nazev { flex: 1 1 calc(100% - 44px); min-width: 0; }
  .tor-tab td.tor-prubeh { flex: 1 1 100%; }
  .tor-tab td:last-child { margin-left: auto; }

  /* záložky a filtry, které se jinak schovaly za okraj bez posuvníku */
  .hl-zalozky { flex-wrap: wrap; overflow: visible; }
  .lepkava .chips { flex-wrap: wrap; overflow: visible; }

  /* dialogy: víc místa na úzké obrazovce (okraj 24 px → 10 px, tělo vyšší) */
  .overlay { padding: 10px; }
  .modal-body { max-height: calc(100dvh - 170px); padding: 16px; }
  .modal-foot { flex-wrap: wrap; }
}

/* Telefon na šířku: zbylo 140 px na obsah. Spodní lišta pryč (menu zůstává). */
@media (max-height: 500px) and (orientation: landscape) and (max-width: 1000px) {
  .tabbar { display: none; }
  .lepkava { position: static; }
  .topbar { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  .page { padding-left: max(18px, env(safe-area-inset-left)); padding-right: max(18px, env(safe-area-inset-right)); }
}

/* Nahrávání na telefonu: náhled (76 px) a štítek stavu vedle názvu nechaly
   na název 110–140 px. Náhled menší, štítek pod názvem. */
@media (max-width: 620px) {
  .lib-row { gap: 8px; padding: 8px 10px; flex-wrap: wrap; }
  .lib-row .watch-thumb { width: 52px; height: 32px; }
  .lib-row .epg-body { flex: 1 1 0; }
  .lib-row .epg-title { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
  .lib-row .lib-nazev { flex: 1 1 100%; overflow-wrap: anywhere; white-space: normal; }
  .lib-row .lib-akce { margin-left: auto; }
}