The layout on the Tasks page breaks on mid-sized screen widths (mainly tablet sizes).
At viewports around 768px–900px, the header actions (Add Task, Sync) shift outside the container and overflow toward the right. The filter row also loses alignment.

This happens consistently on devices like iPad Air, iPad Mini, and Surface-type screens.

To Reproduce

Go to /home#tasks

Resize the browser window to a width between 768px–900px
(or select iPad / tablet presets in DevTools)

Look at the top row containing filters and the Add Task / Sync buttons

The layout will overflow out of the container

Expected behavior

The layout should remain responsive across tablet widths.
Buttons and filters should either wrap or adjust spacing without overflowing outside the main container.

Screenshots

=> Video

Desktop

OS: Ubuntu

Browser: Chrome

Affected widths: 768px–900px

Tablet

iPad Air (820px)

iPad Mini (768px)

Surface Pro 7 (912px)

Additional context

Other breakpoints (mobile and large desktop) look fine.
The issue seems isolated to the md → lg breakpoint range.