/* Mobile task list: drag handle, assignee, then aligned task content. */
@media (max-width:850px){
  .task-row{
    grid-template-columns:28px 78px minmax(0,1fr) !important;
    position:relative;
    will-change:transform;
  }
  .task-row > .drag{
    grid-column:1;
    grid-row:1 / span 2;
    align-self:center;
    touch-action:none;
    -webkit-user-select:none;
    user-select:none;
  }
  .task-row > .status{
    grid-column:2 !important;
    grid-row:1 / span 2;
    align-self:center;
    justify-self:start;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    padding:0;
  }
  .task-row > .task-heading{
    grid-column:3;
    grid-row:1;
    min-width:0;
  }
  .task-row > .schedule-cell{
    grid-column:3 !important;
    grid-row:2;
    display:flex !important;
    min-width:0;
  }
  /* Assignee is the first item on the schedule line, before date/time. */
  .task-row .schedule-with-person{
    display:flex !important;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
  }
  .task-row .schedule-with-person .person-badge{
    order:-1;
    flex:0 0 auto;
  }
  .task-row .schedule-with-person .schedule-inline,
  .task-row .schedule-with-person .schedule-cell{
    order:0;
  }

  .task-drag-placeholder{
    background:#f1eee8;
    border-top:1px solid var(--line);
    box-shadow:inset 0 0 0 1px rgba(59,58,55,.035);
  }
  .task-drag-ghost{
    display:grid;
    grid-template-columns:28px 78px minmax(0,1fr) !important;
    gap:14px;
    align-items:center;
    padding:14px 12px;
    background:#fff;
    border:1px solid rgba(221,217,209,.85);
    border-radius:14px;
    box-shadow:0 4px 12px rgba(35,33,28,.06);
    opacity:.98;
    transform-origin:center;
    transition:box-shadow 180ms cubic-bezier(.22,1,.36,1), opacity 180ms ease;
    will-change:transform;
  }
  .task-drag-ghost.is-lifted{
    box-shadow:0 18px 38px rgba(35,33,28,.18),0 3px 10px rgba(35,33,28,.08);
    opacity:.985;
  }
  .task-drag-ghost.is-dropping{
    transition:transform 230ms cubic-bezier(.22,1,.36,1),box-shadow 230ms ease,opacity 230ms ease;
    box-shadow:0 2px 6px rgba(35,33,28,.05);
  }
  .task-drag-ghost > .drag{
    grid-column:1;
    grid-row:1 / span 2;
    align-self:center;
  }
  .task-drag-ghost > .status{
    grid-column:2 !important;
    grid-row:1 / span 2;
    align-self:center;
    justify-self:start;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    padding:0;
  }
  .task-drag-ghost > .task-heading{grid-column:3;grid-row:1;min-width:0}
  .task-drag-ghost > .schedule-cell{grid-column:3 !important;grid-row:2;display:flex !important;min-width:0}
  .task-drag-ghost .schedule-with-person{display:flex !important;align-items:center;flex-wrap:wrap;gap:6px}
  .task-drag-ghost .person-badge{order:-1}
  .task-drag-ghost > div:nth-of-type(3),
  .task-drag-ghost > div:nth-of-type(4){display:none}

  body.task-reordering{
    overflow:hidden;
    overscroll-behavior:none;
  }
}

@media (prefers-reduced-motion:reduce){
  .task-row,.task-drag-ghost{transition:none !important}
}