@media (max-width: 1120px) {
    .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .compact-metrics { grid-template-columns: minmax(240px, 360px); justify-content: end; }
    .report-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dashboard-grid, .dividendos-layout { grid-template-columns: 1fr; }
    .details-panel { position: static; }
    .dividendos-layout > .details-panel { display: none; }
    .details-panel.inline-details-panel { display: block; }
    .cards-grid > .details-panel { grid-column: 1 / -1; }
}

@media (max-width: 860px) {
    .shell { grid-template-columns: 1fr; }
    body.sidebar-collapsed .shell { grid-template-columns: 1fr; }
    .sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        width: 280px;
        transform: translateX(-100%);
        transition: transform .2s ease;
        z-index: 60;
    }
    body.sidebar-collapsed .sidebar { padding: 22px 18px; }
    body.sidebar-collapsed .brand > span:last-child,
    body.sidebar-collapsed .nav span,
    body.sidebar-collapsed .logout-form span { display: inline; }
    body.sidebar-collapsed .nav a,
    body.sidebar-collapsed .logout-form button { justify-content: flex-start; padding: 12px; }
    .sidebar.open { transform: translateX(0); }
    .sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 55;
        background: rgba(15, 23, 42, .42);
    }
    body.sidebar-open .sidebar-backdrop { display: block; }
    .content { padding: 18px; }
    .topbar { align-items: flex-start; }
    .topbar-logo { display: none; }
    .user-chip { display: none; }
    .filter-bar {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
        align-items: end;
    }
    .actions-row {
        display: grid;
        grid-template-columns: 1fr;
        align-items: stretch;
        justify-items: stretch;
    }
    .actions-row.right { justify-content: stretch; }
    .actions-row > *,
    .filter-bar > *,
    .primary-button,
    .secondary-button { width: 100%; }
    .filter-bar.compact { width: 100%; }
    .app-footer { display: grid; text-align: center; justify-content: center; }
}

@media (max-width: 640px) {
    .content { padding: 14px; }
    .topbar {
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr);
        align-items: start;
    }
    .topbar h1 { font-size: 23px; overflow-wrap: anywhere; }
    .filter-bar, .actions-row { grid-template-columns: 1fr; }
    .metric-grid { grid-template-columns: 1fr; }
    .compact-metrics { grid-template-columns: 1fr; justify-content: stretch; }
    .report-metrics { grid-template-columns: 1fr; }
    .paid-total-card { text-align: left; }
    .panel-header,
    .category-row,
    .dividendo-card-header,
    .dividendo-card-footer,
    .form-grid header,
    .form-grid footer {
        display: grid;
        grid-template-columns: 1fr;
        align-items: start;
        justify-items: stretch;
    }
    .row-actions { justify-content: flex-start; }
    .cards-grid { grid-template-columns: minmax(0, 1fr); }
    .dividendo-values { grid-template-columns: 1fr; }
    .metric-card strong { font-size: 23px; }
    .form-grid { grid-template-columns: 1fr; }
    .span-2 { grid-column: span 1; }
    .panel { padding: 14px; }
    .modal {
        align-items: start;
        padding: 10px;
        overflow-y: auto;
    }
    .modal-dialog { max-height: calc(100dvh - 20px); }
    .form-grid footer .primary-button,
    .form-grid footer .secondary-button { width: 100%; }
}

@media (max-width: 420px) {
    .content { padding: 10px; }
    .topbar { padding: 10px; gap: 10px; }
    .panel,
    .metric-card,
    .dividendo-card,
    .login-panel { padding: 12px; }
    .data-table { min-width: 620px; }
    .parcelas-table { min-width: 0; }
    .toast {
        right: 10px;
        left: 10px;
        max-width: none;
    }
}
