body { background: #0B0E14; color: #E5E7EB; font-family: sans-serif; margin: 0; }
header { display: flex; align-items: center; padding: 15px 40px; border-bottom: 1px solid #1F2937; }
.logo { font-weight: bold; margin-right: 40px; }
nav a { margin-right: 20px; color: #9CA3AF; text-decoration: none; }

main { display: flex; padding: 20px 40px; }
.sidebar { width: 250px; padding-top: 20px; }
.nav-links li { margin-bottom: 20px; cursor: pointer; color: #9CA3AF; }

.content { flex-grow: 1; padding-left: 40px; }
.hero-spotlight { display: flex; gap: 20px; height: 300px; margin-bottom: 40px; }
.main-featured { flex: 3; background: #1F2937; border-radius: 12px; }
.side-list { flex: 1; background: #1F2937; border-radius: 12px; }

.mod-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; }
.mod-card { background: #1F2937; padding: 15px; border-radius: 12px; }
.thumb { height: 120px; background: #374151; border-radius: 8px; margin-bottom: 10px; }
.btn-download { width: 100%; background: #374151; border: none; color: white; padding: 10px; border-radius: 6px; cursor: pointer; }
.btn-download:hover { background: #00D2FF; color: #000; }