body {margin:0;font-family:'Inter',sans-serif;background:#0f1724;color:#fff;}
nav{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:#071124;}
nav .logo{font-weight:700;font-size:20px;letter-spacing:1px;}
nav .nav-links a{color:#94a3b8;text-decoration:none;margin-left:16px;padding:6px 12px;border-radius:8px;transition:background 0.2s;}
nav .nav-links a.active, nav .nav-links a:hover{background:#ff4d6d;color:#fff;}
.container{max-width:1100px;margin:20px auto;padding:0 16px;}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;}
.card{background:#0b1220;border-radius:12px;overflow:hidden;cursor:pointer;transition:transform 0.2s,box-shadow 0.2s;border:1px solid rgba(255,255,255,0.05);}
.card:hover{transform:translateY(-6px);box-shadow:0 8px 20px rgba(0,0,0,0.5);}
.poster img{width:100%;height:260px;object-fit:cover;display:block;}
.info{padding:10px;}
.title{font-weight:700;font-size:16px;margin-bottom:4px;}
.genre{font-size:14px;color:#94a3b8;}
.play-badge{position:absolute;right:10px;top:10px;background:rgba(0,0,0,0.5);color:#fff;padding:6px 8px;border-radius:6px;font-weight:700;font-size:12px;display:none;}
.card:hover .play-badge{display:inline-block;}
@media(max-width:600px){.poster img{height:180px;}}