css - クラスとメディア クエリに CSS を使用する

Question

スライドして開閉するメニューバーがあります。閉じた状態は、画面が十分に小さい場合の外観でもあります。したがって、基本的に同じスタイルを 2 回使用します。1 回はクラスとして、もう 1 回はメディア クエリとして使用します。

これを回避する方法はありますか？

編集¹：

メディア クエリ スタイルとクラスを持つことは避けたいと思います。クラスとメディア クエリの両方を介して同じスタイルを適用する賢い方法があればいいのですが。

編集²：

コード例 (説明目的):

menu {
    width: 100px;
}

menu.closed { /*triggered via class addition in javascript */
    width:10px;
}

@media (max-width:1000px) {
    menu { /*notice how this is the same as the closed class*/
        width:10px;
    }
}