/* Mobile-Responsive – lädt nach dem Haupt-CSS */
@media (max-width: 768px) {
  .app-shell { flex-direction: column; }
  .sidebar { width: 100%; min-width: unset; height: auto; position: static; padding: 12px 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border-bottom: 1px solid var(--border-soft); }
  .sidebar-logo { margin-bottom: 0; margin-right: auto; font-size: 15px; }
  .sidebar-nav { flex-direction: row; gap: 4px; flex-wrap: wrap; }
  .sidebar-link { padding: 8px 12px; font-size: 13px; }
  .content { padding: 12px; }
  h1 { font-size: 24px; }
  .card { padding: 16px; }
  .stat-cards { grid-template-columns: 1fr 1fr; gap: 8px; }
  .chart-container { height: 240px !important; }
  #tvChartContainer { height: 300px !important; }
  .bot-grid { grid-template-columns: 1fr; }
  .dialog-content { width: 95%; padding: 16px; }
  table { font-size: 12px; }
  th, td { padding: 6px 8px; }
  input, select, button { font-size: 14px; }
  .onboarding-card { display: none !important; }
  .settings-flow-card { display: none !important; }
}

@media (max-width: 480px) {
  .stat-cards { grid-template-columns: 1fr; }
  .sidebar-link { font-size: 12px; padding: 6px 10px; }
  .sidebar-logo { font-size: 13px; }
  h1 { font-size: 20px; }
  .subtitle { font-size: 14px; }
}