*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:#0d0f14;color:#e7e9ee;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.5}
a{color:#6ea8fe;text-decoration:none}
a:hover{color:#9cc2ff}

.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:#12151c;border-bottom:1px solid #232838;position:sticky;top:0;z-index:20;backdrop-filter:blur(8px)}
.logo{font-weight:800;font-size:20px;letter-spacing:1px;color:#fff}
.logo span{color:#ff5d73;margin-left:4px;font-size:12px;vertical-align:super}
.topbar nav a{margin-left:14px;color:#c3cad8;font-weight:600;font-size:14px}
.topbar nav a:hover{color:#fff}

.wrap{max-width:1200px;margin:0 auto;padding:22px 16px 60px}
.cnt{color:#ff5d73;font-size:.7em;vertical-align:middle}

.filters{margin:14px 0 6px}
.sform input[type=text]{width:100%;max-width:420px;padding:12px 14px;border-radius:10px;border:1px solid #2a3145;background:#151a24;color:#eef1f6;font-size:15px;outline:none}
.sform input[type=text]:focus{border-color:#6ea8fe}
.alpha{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.alpha a{padding:5px 9px;border-radius:7px;background:#161b26;color:#9aa4b6;font-size:13px;font-weight:700}
.alpha a:hover,.alpha a.on{background:#6ea8fe;color:#0d0f14}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-top:20px}
.card{background:#141824;border-radius:12px;overflow:hidden;display:block;position:relative;transition:transform .12s ease,box-shadow .12s ease;border:1px solid #1f2536}
.card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.5);border-color:#2f3a55}
.card img{width:100%;aspect-ratio:185/278;object-fit:cover;display:block;background:#0a0c11}
.noposter{aspect-ratio:185/278;background:linear-gradient(135deg,#1b2130,#12151d)}
.cap{display:block;padding:8px 10px;font-size:12.5px;color:#d5dae4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.none{color:#8b93a5;margin-top:30px}

.serie{display:flex;gap:22px;align-items:flex-start;flex-wrap:wrap}
.serie-poster img,.noposter.big{width:200px;max-width:42vw;border-radius:12px;aspect-ratio:185/278;object-fit:cover;display:block;background:#0a0c11}
.serie-info h1{margin:.2em 0 .3em;font-size:26px;color:#fff}
.meta{color:#8b93a5}

.sec{font-size:18px;margin:28px 0 12px;color:#fff}
.ep-list{list-style:none;padding:0;margin:0}
.ep-list li{margin:0}
.ep-list a{display:block;padding:11px 14px;margin-bottom:8px;background:#141824;border:1px solid #1f2536;border-radius:10px;color:#dbe0ea;font-size:14.5px}
.ep-list a:hover{background:#191f2d;border-color:#33405e;color:#fff}

.player-wrap{max-width:860px;margin:0 auto}
.player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:14px;overflow:hidden;border:1px solid #232838;box-shadow:0 10px 40px rgba(0,0,0,.6)}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.no-player{padding:60px 20px;text-align:center;background:#141824;border-radius:14px;color:#aab2c2}
.ep-title{font-size:24px;margin:22px 0 4px;color:#fff}
.hint{color:#8b93a5;font-size:13.5px;margin:6px 0 0}

.btn{display:inline-block;padding:11px 18px;border-radius:10px;background:#6ea8fe;color:#0d0f14;font-weight:700;margin-top:10px}
.btn:hover{background:#9cc2ff;color:#0d0f14}
.btn.ghost{background:transparent;border:1px solid #2f3a55;color:#c3cad8}
.btn.ghost:hover{background:#161b26;color:#fff}

.foot{text-align:center;color:#6b7488;font-size:12.5px;padding:20px;border-top:1px solid #1c212e;margin-top:40px}

@media(max-width:520px){
  .grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
  .serie-info h1{font-size:21px}
}