No Interactions working in OpenLayers 6 with Angular 9

I'm trying to setup an OpenLayers 6 Map in an Angular 9 component. I can successfully load the OSM source and the controls are working, but Interactions like dragging the map or zooming with the mouse wheel don't work. Manually adding the default Interactions doesn't resolve the issue.

Everything worked in my previous project, so I'm mainly looking for factors outside my component that the Interactions depend on, that I might not be thinking of.

map.component.ts

import { Component, OnInit } from '@angular/core';

import Map from 'ol/Map';
import OsmSource from 'ol/source/OSM';
import TileLayer from 'ol/layer/Tile';
import {fromLonLat} from 'ol/proj';
import View from 'ol/View';


@Component({
    selector: 'app-map',
    templateUrl: './map.component.html',
    styleUrls: ['./map.component.css']
})
export class MapComponent implements OnInit {

    constructor() { }

    ngOnInit(): void {

        let map = new Map({
            target: 'map',
            layers: [
                new TileLayer({
                    source: new OsmSource()
                })
            ],
            view: new View({
                center: fromLonLat([10.4515, 51.1657]),
                zoom: 6.3
            })
        });

    }

}

map.component.html

<div id="map" class="map"></div>
<link rel="stylesheet" href="https://openlayers.org/en/v6.1.1/css/ol.css" type="text/css">

map.component.css

.map {
    width: 100%;
    height: 100vh;
}

The issue was, that I included the wrong ol.css in my component.css file.

It needed to be

<link rel="stylesheet" href="https://openlayers.org/en/v6.2.1/css/ol.css" type="text/css">

in order to fit the version of OpenLayers I'm using.