.mobile-day-totals, .mobile-agenda { display: none; }
.mobile-agenda-fallback { display: none !important; }
@media (max-width: 720px) {
  body[data-page="calendar"] .calendar-text-control { display: none; }
  #calendarView .calendar { grid-auto-rows: minmax(72px, auto); }
  #calendarView .calendar .day {
    position: relative;
    min-height: 72px;
    min-width: 0;
    padding: 5px 2px 8px;
    text-align: center;
    cursor: pointer;
  }
  /* Phone: no desktop name+amount crumbs — compact totals/count only; day cell is the hit target. */
  #calendarView .calendar .day .event.event-crumb,
  #calendarView .calendar .day .more {
    display: none !important;
    pointer-events: none !important;
  }
  #calendarView .calendar .day .day-total,
  #calendarView .calendar .day .day-projected-balance,
  #calendarView .calendar .day .mobile-day-totals {
    pointer-events: none !important;
  }
  #calendarView .calendar .day > :not(.day-number):not(.mobile-day-totals):not(.day-total):not(.day-projected-balance) {
    display: none !important;
  }
  #calendarView .calendar .day-number {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    margin: 0 auto 2px;
    font-size: .8125rem;
    font-weight: 800;
    pointer-events: none;
  }
  #calendarView .calendar .day.today { box-shadow: none; }
  #calendarView .calendar .day:focus-visible { outline: 2px solid var(--ink); outline-offset: -3px; }
  .mobile-day-totals {
    display: grid;
    gap: 2px;
    justify-items: center;
    margin-top: 2px;
  }
  .mobile-day-totals span {
    font-size: .6875rem;
    line-height: 1.2;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    letter-spacing: -.03em;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .mobile-day-totals .income { color: #08704c; }
  .mobile-day-totals .expense { color: #ad3b2e; }
  .mobile-day-totals .day-count { color: var(--muted); font-weight: 700; }
  body[data-theme="midnight"] .mobile-day-totals .income { color: #6ee7b7; }
  body[data-theme="midnight"] .mobile-day-totals .expense { color: #fca5a5; }
  body[data-theme="midnight"] .mobile-day-totals .day-count { color: #9aa3c7; }
  .calendar .day.outside .mobile-day-totals { opacity: .5; }
  /* A1: month grid last week must never sit under fixed Menu/Add FABs. */
  #calendarView .calendar-main > .calendar,
  #calendarView #calendarGrid.calendar,
  #calendarView .calendar {
    /* Inset + trailing gap ≥ fab dock so last-week cells can sit above the dock. */
    padding-bottom: 8px;
    margin-bottom: calc(var(--cs-fab-dock, 84px) + 24px);
    box-sizing: border-box;
  }
  #calendarView .mobile-agenda {
    display: block;
    margin-top: 14px;
    margin-bottom: 16px;
    /* Padding (not only margin) keeps sheet actions above fixed Menu/Add FABs. */
    padding: 16px 16px calc(var(--cs-fab-dock, 84px) + 24px);
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--card);
  }
  #calendarView .mobile-agenda h3 { margin: 0 0 10px; font: 800 1.2rem/1.35 Manrope, sans-serif; }
  #calendarView .mobile-agenda .agenda-txn-heading {
    margin: 14px 0 8px;
    font: 800 1rem/1.35 Manrope, sans-serif;
  }
  #calendarView .mobile-agenda .mobile-agenda-range { margin: 0 0 4px; }
  #calendarView .mobile-agenda .mobile-agenda-range:empty,
  #calendarView .mobile-agenda .mobile-agenda-range[hidden] { display: none !important; }
  .agenda-totals { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--muted); font-size: 1rem; margin-bottom: 12px; }
  .agenda-transaction {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    min-height: 56px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    color: var(--ink);
    padding: 12px 0;
    text-align: left;
    cursor: pointer;
  }
  .agenda-transaction-info { min-width: 0; border-left: 3px solid #e35342; padding-left: 10px; }
  .agenda-transaction.income .agenda-transaction-info { border-color: #0b8a62; }
  .agenda-transaction.expected .agenda-transaction-info { border-style: dashed; }
  .agenda-transaction strong.cs-calendar-item-title {
    display: block;
    max-width: min(100%, 390px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem;
  }
  .agenda-transaction strong:not(.cs-calendar-item-title) { display: block; font-size: 1rem; overflow-wrap: anywhere; }
  .agenda-transaction small { display: block; margin-top: 4px; color: var(--muted); font-size: .875rem; }
  .agenda-amount { flex-shrink: 0; font-size: 1rem; }
  .agenda-empty { padding: 12px 0; color: var(--muted); font-size: 1rem; line-height: 1.5; }
  .agenda-forecast { margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; background: #eef3ff; color: #24386b; font-size: .9375rem; line-height: 1.4; }
  .agenda-actions { display: flex; gap: 8px; margin-top: 16px; }
  .agenda-actions button {
    flex: 1;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--card);
    color: var(--ink);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    cursor: pointer;
  }
}

/* Calendar page: FABs stay opposite corners; grid stage + sheet clear the dock. */
@media (max-width: 720px) {
  body[data-page="calendar"] #calendarView .calendar-stage,
  body[data-page="calendar"] #calendarView .calendar-main {
    padding-bottom: 0;
  }
  body[data-page="calendar"] #calendarView .calendar-main > .calendar,
  body[data-page="calendar"] #calendarView #calendarGrid {
    /* A1: dock space lives below the grid (margin), not over the last week. */
    padding-bottom: 8px;
    margin-bottom: calc(var(--cs-fab-dock, 84px) + 24px);
  }
  /* Keep document scroll from tucking last-week cells under the FAB dock. */
  body[data-page="calendar"] {
    scroll-padding-bottom: calc(var(--cs-fab-dock, 84px) + 24px);
  }
  body[data-page="calendar"] main {
    scroll-padding-bottom: calc(var(--cs-fab-dock, 84px) + 24px);
  }
  body[data-page="calendar"] .mobile-menu-toggle,
  body[data-page="calendar"] .sidebar .add-button {
    z-index: 23;
  }
}