@media (max-width: 768px) {
  /* Stats: 4-col → 2-col grid */
  .stats-row { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px; }
  .stats-row.stats-5 { grid-template-columns: 1fr 1fr !important; }
  .stats-row .stat-card:last-child:nth-child(odd) { grid-column: span 2; }
  .stat-value { font-family: 'Montserrat', sans-serif !important; }

  /* Topbar */
  .topbar h1 { font-size: 20px; }
  .topbar .subtitle { font-size: 12px; }
  .topbar-right .btn { font-size: 12px; padding: 7px 12px; }

  /* Filter bar: wrap */
  .filter-bar { flex-wrap: wrap; gap: 8px; padding: 12px; }
  .filter-group { flex-wrap: wrap; gap: 6px; }
  .search-input { width: 100%; flex: none; }
  .filter-sep { display: none; }

  /* Section */
  .section { border-radius: 12px; }
  .section-header { padding: 12px 14px; flex-wrap: wrap; gap: 8px; }

  /* Table footer */
  .table-footer { flex-direction: column; gap: 8px; text-align: center; }

  /* Desktop-only hide */
  .desktop-only { display: none !important; }

  /* ─── MOBILE TASK CARDS ─── */
  .m-task-card {
    background: var(--bg-card, #fff); border-radius: 12px;
    padding: 14px; border: 1px solid var(--border, #e2e8f0);
    margin-bottom: 8px;
    display: flex; gap: 12px; align-items: flex-start;
    cursor: pointer;
  }
  .m-task-card.overdue { border-left: 3px solid var(--red, #dc2626); }
  .m-task-card.done { opacity: 0.5; }
  .m-task-check {
    width: 22px; height: 22px; border-radius: 6px;
    border: 2px solid #cbd5e1; cursor: pointer; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    margin-top: 1px;
  }
  .m-task-check.done { background: var(--green, #2d7a4f); border-color: var(--green, #2d7a4f); }
  .m-task-check.done::after { content: '\2713'; color: #fff; font-size: 12px; font-weight: 700; }
  .m-task-content { flex: 1; min-width: 0; }
  .m-task-title { font-size: 14px; font-weight: 500; line-height: 1.4; }
  .m-task-card.done .m-task-title { text-decoration: line-through; }
  .m-task-meta {
    display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; align-items: center;
  }
  .m-task-project {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; color: var(--text-secondary, #64748b); font-weight: 500;
  }
  .m-task-project .project-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
  .m-task-due {
    font-size: 11px; color: var(--text-muted, #94a3b8);
    padding: 2px 6px; background: var(--bg, #f4f6f5); border-radius: 4px;
  }
  .m-task-due.overdue { color: var(--red, #dc2626); background: #fef2f2; }
  .m-task-due.today { color: var(--accent, #3a8f6e); background: var(--accent-light, #e0f2ea); }
  .m-task-status {
    font-size: 10px; font-weight: 600; text-transform: uppercase;
    padding: 2px 6px; border-radius: 4px; letter-spacing: 0.3px;
  }
  .m-task-status.pending { background: #fef3c7; color: #92400e; }
  .m-task-status.progress { background: var(--accent-light, #e0f2ea); color: var(--accent, #3a8f6e); }
  .m-task-assignee { font-size: 11px; color: var(--text-muted, #94a3b8); }

  /* ─── MOBILE DOCUMENT CARDS ─── */
  .m-doc-card {
    background: var(--bg-card, #fff); border-radius: 12px;
    padding: 14px; border: 1px solid var(--border, #e2e8f0);
    margin-bottom: 8px;
    display: flex; gap: 12px; align-items: flex-start;
  }
  .m-doc-icon {
    width: 44px; height: 44px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 700; flex-shrink: 0;
  }
  .m-doc-icon.pdf { background: #fee2e2; color: #dc2626; }
  .m-doc-icon.xlsx, .m-doc-icon.xls { background: #dcfce7; color: #16a34a; }
  .m-doc-icon.docx, .m-doc-icon.doc { background: #dbeafe; color: #2563eb; }
  .m-doc-icon.jpg, .m-doc-icon.png, .m-doc-icon.webp { background: #fef3c7; color: #d97706; }
  .m-doc-icon.zip { background: #f3e8ff; color: #7c3aed; }
  .m-doc-icon.other { background: #f1f5f9; color: #64748b; }
  .m-doc-info { flex: 1; min-width: 0; }
  .m-doc-name { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .m-doc-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; align-items: center; }
  .m-doc-meta span { font-size: 11px; color: var(--text-muted, #94a3b8); }

  /* ─── MOBILE CALENDAR ─── */
  .m-cal-day-selector {
    display: flex; gap: 3px; justify-content: space-between;
    margin-bottom: 16px; padding: 0 4px;
  }
  .m-cal-day-btn {
    flex: 1; text-align: center; padding: 6px 2px;
    border-radius: 12px; border: 1px solid var(--border, #e2e8f0);
    background: var(--bg-card, #fff); cursor: pointer;
    font-family: 'Montserrat', sans-serif;
  }
  .m-cal-day-btn.active { background: var(--accent, #3a8f6e); color: #fff; border-color: var(--accent, #3a8f6e); }
  .m-cal-day-name { font-size: 10px; font-weight: 600; text-transform: uppercase; }
  .m-cal-day-num { font-size: 16px; font-weight: 700; margin-top: 2px; }
  .m-cal-dot { width: 4px; height: 4px; border-radius: 50%; margin: 4px auto 0; }
  .m-cal-event-card {
    background: var(--bg-card, #fff); border-radius: 10px;
    padding: 12px 14px; border-left: 3px solid var(--accent, #3a8f6e);
    margin-bottom: 8px;
  }
  .m-cal-event-time { font-size: 11px; color: var(--text-muted, #94a3b8); font-weight: 500; }
  .m-cal-event-title { font-size: 14px; font-weight: 500; margin-top: 2px; }
  .m-cal-event-project { font-size: 11px; color: var(--text-secondary, #64748b); margin-top: 4px; }
  .m-cal-empty { padding: 30px; text-align: center; color: var(--text-muted, #94a3b8); font-size: 13px; }

  /* ─── MOBILE NOTES ─── */
  .notes-layout { flex-direction: column; }
  .notes-panel { width: 100%; border-right: none; border-bottom: 1px solid var(--border, #e2e8f0); max-height: none; }
  .note-content { display: none; }
  .note-content.mobile-visible { display: block; }
  .notes-panel.mobile-hidden { display: none; }
  .m-note-back {
    display: flex; align-items: center; gap: 6px;
    padding: 10px 16px; font-size: 13px; color: var(--accent, #3a8f6e);
    font-weight: 500; cursor: pointer; border-bottom: 1px solid var(--border, #e2e8f0);
    background: var(--bg-card, #fff);
  }

  /* ─── MOBILE GOALS ─── */
  .year-goals { grid-template-columns: 1fr !important; }
  .year-goal { padding: 14px; }
  .quarter-section { margin-bottom: 16px; }
  .project-goal-row { flex-wrap: wrap; padding: 12px 14px; }
  .pg-progress { width: 100%; margin-top: 6px; }
  .period-toggle { flex-wrap: wrap; gap: 4px; }
  .period-btn { font-size: 12px; padding: 6px 12px; }
  .mini-bar-pct, .pg-pct, .quarter-pct { font-family: 'Montserrat', sans-serif !important; }

  /* ─── MOBILE SETTINGS ─── */
  .settings-tabs { overflow-x: auto; }
  .settings-tab { font-size: 12px; padding: 10px 12px; white-space: nowrap; }
  .settings-section-body { padding: 16px; }
  .form-row { flex-direction: column; }
  .integration-row { flex-direction: column; }

  /* Mobile user cards for settings */
  .m-user-card {
    display: flex; gap: 12px; align-items: flex-start;
    padding: 14px 0; border-bottom: 1px solid #f0f0f0;
  }
  .m-user-card:last-child { border-bottom: none; padding-bottom: 0; }
  .m-user-info { flex: 1; min-width: 0; }
  .m-user-name { font-size: 14px; font-weight: 600; }
  .m-user-email { font-size: 11px; color: var(--text-muted, #94a3b8); margin-top: 1px; }
  .m-user-meta { display: flex; gap: 6px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
  .m-user-actions { display: flex; gap: 8px; margin-top: 10px; }

  /* Mobile project cards for settings */
  .m-project-card {
    display: flex; gap: 12px; align-items: center;
    padding: 14px 0; border-bottom: 1px solid #f0f0f0;
  }
  .m-project-card:last-child { border-bottom: none; padding-bottom: 0; }
  .m-project-color { width: 12px; height: 40px; border-radius: 6px; flex-shrink: 0; }
  .m-project-info { flex: 1; min-width: 0; }
  .m-project-name { font-size: 14px; font-weight: 600; }
  .m-project-meta { display: flex; gap: 12px; margin-top: 4px; }
  .m-project-meta span { font-size: 11px; color: var(--text-muted, #94a3b8); }

  /* Mobile reminder cards */
  .m-reminder-card {
    background: var(--bg-card, #fff); border-radius: 12px;
    padding: 14px; border: 1px solid var(--border, #e2e8f0);
    margin-bottom: 8px;
    display: flex; gap: 12px; align-items: flex-start;
  }
  .m-reminder-check {
    width: 22px; height: 22px; border-radius: 6px;
    border: 2px solid #cbd5e1; cursor: pointer; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    margin-top: 1px;
  }
  .m-reminder-check.done { background: var(--green, #2d7a4f); border-color: var(--green, #2d7a4f); }
  .m-reminder-check.done::after { content: '\2713'; color: #fff; font-size: 12px; font-weight: 700; }
  .m-reminder-content { flex: 1; min-width: 0; }
  .m-reminder-title { font-size: 14px; font-weight: 500; }
  .m-reminder-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; align-items: center; }
  .m-reminder-meta span { font-size: 11px; color: var(--text-muted, #94a3b8); }

  /* FAB button */
  .fab-mobile {
    position: fixed; bottom: 24px; right: 24px;
    width: 52px; height: 52px; border-radius: 16px; border: none;
    background: var(--accent, #3a8f6e); color: #fff;
    font-size: 28px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 16px rgba(58, 143, 110, 0.4);
    z-index: 40;
  }
  .fab-mobile:active { transform: scale(0.95); }

  /* Modal adjustments */
  .modal { width: 95% !important; max-width: 400px !important; max-height: 90vh; overflow-y: auto; }
  .modal .form-row { flex-direction: column; }

  /* Dashboard bottom grid single column */
  .bottom-grid { grid-template-columns: 1fr !important; }
  .top-columns { grid-template-columns: 1fr !important; }

  /* Prevent horizontal overflow */
  .main { overflow-x: hidden; }

  /* Calendar toolbar wrap on mobile */
  .cal-toolbar { flex-wrap: wrap; gap: 8px; }
  .cal-nav { flex-wrap: wrap; }

}

/* ─── CREDENTIALS MOBILE ─── */
@media (max-width: 768px) {
  .m-cred-card {
    background: var(--bg-card); border-radius: 12px; padding: 14px;
    border: 1px solid var(--border); margin-bottom: 8px;
  }
  .m-cred-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 10px;
  }
  .m-cred-name { font-size: 15px; font-weight: 600; }
  .m-cred-lock { font-size: 14px; }
  .m-cred-fields { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
  .m-cred-field {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 10px; background: var(--bg); border-radius: 8px;
  }
  .m-cred-label {
    font-size: 11px; color: var(--text-muted); font-weight: 500;
    text-transform: uppercase; letter-spacing: 0.3px; min-width: 60px; flex-shrink: 0;
  }
  .m-cred-value {
    font-size: 13px; color: var(--text-secondary); flex: 1; min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-family: var(--font-main);
  }
  .m-cred-value.cred-revealed { color: var(--text-primary); }
  .m-cred-copy {
    background: none; border: none; font-size: 14px; cursor: pointer;
    padding: 2px; flex-shrink: 0;
  }
  .m-cred-url {
    font-size: 13px; color: var(--accent); text-decoration: none;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1;
  }
  .m-cred-meta { margin-bottom: 8px; }
  .m-cred-actions {
    display: flex; gap: 6px; padding-top: 8px;
    border-top: 1px solid var(--border-light);
  }
  .m-cred-actions .btn-sm { flex: 1; text-align: center; }
}

/* ─── TABS MOBILE ─── */
@media (max-width: 768px) {
  .tabs { margin-bottom: 16px; }
  .tab-btn { padding: 10px 16px; font-size: 14px; }
}

/* ─── SUBSCRIPTION MODAL FIX ─── */
@media (max-width: 768px) {
  .modal .form-group label[style*="margin-top"] { margin-top: 0 !important; }
}