/* Hourly positioning is local calendar geometry; controls use the shared UI. */
.daily-timeline-scroll { overflow-x:auto; max-inline-size:100%; }
.planning-timeline.is-hourly { min-inline-size:76rem; }
.planning-timeline.is-hourly .timeline-head,
.planning-timeline.is-hourly .timeline-row { grid-template-columns:16rem minmax(60rem,1fr); }
.planning-timeline.is-hourly .timeline-head > div { grid-template-columns:repeat(24,minmax(0,1fr)); }
.planning-timeline.is-hourly .timeline-head i { justify-items:start; padding-inline-start:var(--zg-space-1); }
.planning-timeline.is-hourly .timeline-row > div > i {
  left:var(--start-percent);
  inline-size:var(--duration-percent);
  block-size:var(--zg-space-4);
  top:50%;
  transform:translateY(-50%);
}
.planning-timeline.is-hourly .timeline-row > div > .daily-duration { min-inline-size:var(--zg-space-1); }
.planning-timeline.is-hourly .timeline-row > div > .daily-deadline {
  inline-size:var(--zg-space-2);
  block-size:var(--zg-space-6);
  border-radius:var(--zg-radius-sm);
  transform:translate(-50%,-50%);
}