:root { --bg:#0b0b0c; --panel:#151517; --panel-2:#1c1c20; --text:#ececf1; --muted:#a8adbd; --accent:#7aa2ff; --accent-2:#62d2a2; --border:#292a2f; --badge:#23242a; --badge-border:#363740; --danger:#ff6b6b; --ok:#37c96b; --shadow:0 8px 22px rgba(0,0,0,.35); --csfd:#ff6d00; }
@media (prefers-color-scheme: light){ :root { --bg:#f5f6f8; --panel:#fff; --panel-2:#fafafa; --text:#171717; --muted:#556070; --accent:#2f67ff; --accent-2:#0aa770; --border:#e6e8ef; --badge:#f2f4f8; --badge-border:#e6e8ef; --danger:#c62828; --ok:#1b8e4b; --shadow:0 8px 22px rgba(0,0,0,.08); --csfd:#ff6d00; } }
html[data-theme="dark"]  { --bg:#0b0b0c; --panel:#151517; --panel-2:#1c1c20; --text:#ececf1; --muted:#a8adbd; --accent:#7aa2ff; --accent-2:#62d2a2; --border:#292a2f; --badge:#23242a; --badge-border:#363740; --danger:#ff6b6b; --ok:#37c96b; --shadow:0 8px 22px rgba(0,0,0,.35); --csfd:#ff8a00; }
html[data-theme="light"] { --bg:#f5f6f8; --panel:#fff; --panel-2:#fafafa; --text:#171717; --muted:#556070; --accent:#2f67ff; --accent-2:#0aa770; --border:#e6e8ef; --badge:#f2f4f8; --badge-border:#e6e8ef; --danger:#c62828; --ok:#1b8e4b; --shadow:0 8px 22px rgba(0,0,0,.08); --csfd:#ff6d00; }

*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;margin:0;background:var(--bg);color:var(--text); overflow-y:scroll;}
.container{max-width:1200px;margin:0 auto;padding:18px}
.headerbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.brand{font-size:18px;font-weight:700;letter-spacing:.2px; cursor: pointer;}
.controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.controls input[type=text],.controls select,.controls button{border:1px solid var(--border);background:var(--panel);color:var(--text);padding:8px 10px;border-radius:8px;outline:none}
.controls label{display:flex;gap:6px;align-items:center;color:var(--muted);font-size:14px}
.controls button{background:var(--accent);border:1px solid transparent;color:#fff;cursor:pointer}
.controls button:hover{filter:brightness(1.05)}
.theme-toggle{border:1px solid var(--border);background:var(--panel);color:var(--text);padding:8px 10px;border-radius:8px;cursor:pointer}
.theme-toggle:hover{filter:brightness(1.05)}

/* Grid general */
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}

/* Liveloading */
.loading { text-align:center; padding: 40px; color: var(--muted); font-size: 1.1em; }

/* Karta z indexu */
.card{background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:opacity .2s; cursor:pointer;}
.card.completed{opacity:.6}
.card.completed:hover{opacity:.85}

.poster-link{display:block;position:relative}
.poster{aspect-ratio:2/3;background:var(--panel-2);display:block;width:100%;object-fit:cover;transition:filter .15s ease}
.card:hover .poster{filter:brightness(1.07)}

.progress-bar-wrap{height:4px;background:var(--border);width:100%}
.progress-bar-fill{height:4px;background:var(--accent-2);transition:width .3s}
.card.completed .progress-bar-fill{background:var(--muted)}

.card-body{padding:12px 12px 10px;display:flex;flex-direction:column;gap:6px;flex-grow:1}
.card-title{font-weight:700;font-size:15px;line-height:1.25}
.muted{color:var(--muted);font-size:13px}

.badges{display:flex;gap:5px;flex-wrap:wrap;margin-top:auto}
.badge{background:var(--badge);border:1px solid var(--badge-border);color:var(--muted);padding:2px 7px;border-radius:999px;font-size:11px;white-space:nowrap}
.badge.ok{color:var(--ok);border-color:rgba(55,201,107,.35)}
.badge.csfd{color:#fff;background:var(--csfd);border-color:rgba(0,0,0,.15);text-decoration:none;transition:filter .2s;}
a.badge.csfd:hover{filter:brightness(1.1);cursor:pointer;}
.badge.imdb{color:#000;background:#f5c518;border-color:rgba(0,0,0,.15);text-decoration:none;transition:filter .2s;font-weight:700}
a.badge.imdb:hover{filter:brightness(1.1);cursor:pointer;}
.badge.in-progress{color:var(--accent-2);border-color:rgba(98,210,162,.35)}
.badge.done{color:var(--muted);border-color:var(--badge-border)}
.badge.ts{opacity:.75}

.group-label{grid-column:1/-1;margin:8px 0 2px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:1px solid var(--border);padding-bottom:6px}

/* Detail (z detail.php) */
.hero{
    position:relative; width:100%; min-height:420px; background:#111; display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow); margin-bottom: 24px; border-radius: 12px; overflow:hidden;
}
.hero::before{
    content:""; position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.55) 100%),
    radial-gradient(ellipse at center, rgba(0,0,0,.45) 0%, rgba(0,0,0,.8) 100%);
    z-index:0;
}
.hero img.hero-bg{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    filter:saturate(1.05) contrast(1.1) brightness(.75) blur(1px);
    transform:scale(1.02);
}
.hero-center{
    position:relative; z-index:1; text-align:center; padding:24px 18px; max-width:1000px; width:100%;
    display:flex; flex-direction:column; align-items:center; gap:14px;
}
.hero-poster{
    width:min(260px, 70vw); aspect-ratio:2/3; border-radius:14px; overflow:hidden;
    border:1px solid rgba(255,255,255,.18); box-shadow:var(--shadow); background:var(--panel-2);
}
.hero-poster img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-title{ font-size:clamp(22px, 3vw, 32px); font-weight:800; margin:0; color:#fff;}
.hero-subtitle{ color:#e8e8e8; opacity:.9; font-size:14px; }
.hero-badges{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.hero-badges .badge { border:1px solid rgba(255,255,255,.2); color:#fff; padding:4px 8px; border-radius:999px; font-size:12px }
.hero-badges .badge:not(.csfd) { background:rgba(255,255,255,.12); }
.hero-badges .badge.light { background:var(--badge); border:1px solid var(--badge-border); color:var(--muted) }
.hero-overview{ color:#f0f0f0; max-width:900px; margin-top:6px; }

/* Objekty epizod */
.season{border:1px solid var(--border); border-radius:10px; background:var(--panel-2); margin:10px 0; overflow:hidden}
.season-header{padding:10px 12px; cursor:pointer; display:flex; justify-content:space-between; align-items:center; background:var(--panel); border-bottom:1px solid var(--border); font-weight:600}
.season-body{padding:8px 10px; display:none}
.season-body.open{display:block}
.toggle-icon{font-weight:700; font-size:18px}

.ep{padding:10px 10px; border-left:3px solid var(--border); background:linear-gradient(180deg, var(--panel) 0%, rgba(0,0,0,0) 100%); margin:8px 0; border-radius:8px}
.ep .head{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:6px}
.stream{font-size:13px; margin-left:16px; padding:3px 0; color:var(--muted)}
.stream .cz{color:var(--ok); font-weight:600}
.stream .f {color:var(--text)}

.back-action { display:inline-block; margin-bottom: 12px; color: var(--text); text-decoration: none; font-weight: bold; cursor:pointer; padding: 6px 12px; background: var(--panel); border: 1px solid var(--border); border-radius: 8px;}
.back-action:hover { filter: brightness(1.1); }