@media (max-width: 1024px) {
  .mobile-menu-btn { display: flex; }
  .header-action-btn { display: none; }
  .mobile-header-menu-btn { display: flex; }
  .suggestion-chips { gap: 6px; }
  .chip { font-size: 13px; padding: 6px 10px; }
}

@media (min-width: 1025px) {
  .mobile-header-menu-btn { display: none; }
  #exportBtn.has-text { display: flex; }
}

@media (max-width: 768px) {
  :root { --sidebar-width: 100%; }
  .chat-header { padding: 0 12px; }
  .model-dropdown { padding: 6px 8px; }
  .messages { padding: 16px 12px 0; }
  .message { gap: 10px; }
  .message-avatar { width: 26px; height: 26px; }
  .input-area { padding: 0 12px 12px; }
  .input-box { padding: 8px 12px; }
  .welcome-logo { width: 48px; height: 48px; }
  .welcome-logo svg { width: 24px; height: 24px; }
  .suggestion-chips { margin-top: 10px; }
  .chip { font-size: 13px; padding: 6px 10px; }
  .message-actions { opacity: 1; }
  .code-copy { padding: 3px 6px; font-size: 12px; }
  .modal-panel { border-radius: var(--radius-lg); }
  .modal-body { padding: 28px 24px 24px; }
  .upgrade-card { display: none !important; }
  .sidebar { padding-left: var(--safe-area-inset-left); }
  .sidebar-footer { padding-bottom: calc(6px + var(--safe-area-inset-bottom)); }
}

@media (max-width: 480px) {
  .chip { font-size: 12px; padding: 5px 8px; }
  .pro-banner { display: none; }
}

@media (min-width: 1920px) {
  .messages { max-width: 900px; }
  .input-area-inner { max-width: 900px; }
  .welcome-content { max-width: 500px; }
}

@media (min-width: 2560px) {
  :root { --sidebar-width: 330px; }
  .messages { max-width: 1000px; }
  .input-area-inner { max-width: 1000px; }
  .chat-container { max-width: 1400px; margin: 0 auto; width: 100%; }
}

@media (min-width: 3440px) {
  :root { --sidebar-width: 380px; }
  .messages { max-width: 1100px; }
  .input-area-inner { max-width: 1100px; }
}