.grid-scroll {
  flex: 1 1 auto; min-height: 0;
  overflow: auto;
  position: relative;
  padding: 0 16px 24px;
}

.grid {
  display: grid;
  position: relative;
  width: max-content;
  min-width: 100%;
  /* Шаг сетки постоянный: стикер под неё подстраивается, а не наоборот */
  grid-auto-rows: var(--row-min-height);
}

/* ------------------------------------------------------------------ шапка */
.grid-corner,
.col-head {
  position: sticky; top: 0; z-index: 6;
  height: var(--header-height);
  background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(247, 250, 255, .82));
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--glass-edge);
  display: flex; flex-direction: column; justify-content: center;
  padding: 4px 11px; overflow: hidden;
}
.grid-corner .title, .grid-corner .sub,
.col-head .title, .col-head .sub {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.grid-corner { left: 0; z-index: 8; border-right: 1px solid var(--glass-edge);
  border-top-left-radius: var(--radius); }
.col-head { border-right: 1px solid var(--border-secondary); }
.col-head .title { font-size: 12px; font-weight: 650; white-space: nowrap; }
.col-head .sub { font-size: 11px; color: var(--text-muted); }
.col-head.non-working {
  background: repeating-linear-gradient(45deg,
    rgba(255, 255, 255, .9), rgba(255, 255, 255, .9) 6px,
    rgba(228, 234, 245, .95) 6px, rgba(228, 234, 245, .95) 12px);
}
.col-head.later { color: var(--accent-purple); }
.col-head.current { box-shadow: inset 0 -2px 0 var(--accent-blue); }

/* ----------------------------------------------------------------- строки */
.row-head {
  position: sticky; left: 0; z-index: 5;
  background: linear-gradient(90deg, rgba(255, 255, 255, .92), rgba(250, 252, 255, .78));
  backdrop-filter: blur(12px);
  border-right: 1px solid var(--glass-edge);
  border-bottom: 1px solid var(--border-secondary);
  padding: 11px; display: flex; flex-direction: column; gap: 4px;
}
.row-head .title { font-weight: 650; }
.row-head .meta { font-size: 11px; color: var(--text-muted); }
.row-head .row-actions { display: flex; gap: 4px; opacity: 0; transition: opacity .12s;
  margin-top: auto; }
.row-head:hover .row-actions { opacity: 1; }

/* -------------------------------------------- ячейки как участки доски */
.cell {
  position: relative;
  background: transparent;
  /* Клетки не рисуем: доска — поверхность, читаются стикеры */
  border-right: 1px dashed rgba(120, 140, 175, .16);
  border-bottom: 1px dashed rgba(120, 140, 175, .16);
  padding: 9px 8px;
  overflow: visible;
  height: var(--row-min-height);
  width: var(--col-width);
}
.cell:hover { background: rgba(255, 255, 255, .45); }
.cell.non-working { background: rgba(120, 140, 175, .08); }
.cell.later { background: rgba(155, 127, 224, .07); }
.cell.drop-target {
  background: rgba(91, 141, 239, .14);
  box-shadow: inset 0 0 0 2px var(--accent-blue); border-radius: 10px;
}
.cell.meeting-current {
  box-shadow: inset 0 0 0 2px var(--accent-orange);
  background: rgba(221, 154, 60, .1); border-radius: 10px;
}
/* Когда задач больше, чем влезает, ячейка прокручивается — сетка не едет */
.cell.crowded { overflow: auto; }
.cell.crowded:hover { overflow: visible; }

.cell .cell-add {
  position: absolute; right: 5px; top: 5px; z-index: 8; width: 21px; height: 21px;
  border-radius: 7px; border: 1px solid var(--glass-edge);
  background: rgba(255, 255, 255, .92);
  color: var(--text-secondary); cursor: pointer; display: none;
  align-items: center; justify-content: center; line-height: 1; padding: 0; font-size: 14px;
  box-shadow: 0 1px 4px rgba(88, 108, 145, .18);
}
.cell:hover .cell-add { display: flex; }
.cell .cell-add:hover { color: var(--accent-blue); border-color: var(--accent-blue); }

/* Зоны квартального планирования */
.cell.zone-light { background-color: var(--zone-light); }
.cell.zone-gray { background-color: var(--zone-gray); }
.cell.zone-dark { background-color: var(--zone-dark); }

/* --------------------------------------------------------------- поплавки */
.markers-lane {
  position: sticky; top: var(--header-height); z-index: 6; height: 30px;
  background: rgba(255, 255, 255, .78); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border-secondary);
  display: flex; align-items: center; justify-content: center;
}
.markers-lane.corner { left: 0; z-index: 8; border-right: 1px solid var(--glass-edge);
  font-size: 11px; color: var(--text-muted); justify-content: flex-start; padding-left: 11px; }

.float-marker {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 1px 10px; border-radius: 999px; font-size: 11px; font-weight: 600;
  background: rgba(255, 255, 255, .95); border: 1px solid currentColor; cursor: grab;
  user-select: none; white-space: nowrap; box-shadow: 0 1px 4px rgba(88, 108, 145, .18);
}
.float-marker:active { cursor: grabbing; }
.float-marker::before { content: "◆"; font-size: 9px; }
.float-marker.today { color: var(--marker-today); }
.float-marker.launch { color: var(--marker-launch); }
.float-marker.test_launch { color: var(--accent-purple); }
.float-marker.custom { color: var(--accent-blue); }
.markers-lane.drop-target { background: rgba(91, 141, 239, .16); }