.staffing-plan-bar {
  position: sticky;
  top: 10px;
  z-index: 8;
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid #b2ddff;
  border-left: 5px solid #2e67ed;
  border-radius: 14px;
  background: #eff8ff;
  box-shadow: 0 8px 24px #10182812;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.staffing-plan-bar.has-errors { border-color: #fecdca; border-left-color: #d92d20; background: #fff6f5; }
.staffing-plan-bar > div:first-child { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; align-items: center; }
.staffing-plan-bar small { grid-column: 2; color: var(--muted); }
.staffing-plan-rows { display: grid; gap: 8px; margin: 14px 0; }
.staffing-plan-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid #e4e7ec; border-radius: 12px; background: #f9fafb; }
.staffing-plan-row small { display: block; color: var(--muted); margin-top: 2px; }
.operator.staged { border: 1px solid #fdb022; background: #fffaeb; }
.live-draft-summary { margin-top: 14px; padding: 14px 16px; border: 2px solid #fdb022; border-radius: 14px; background: #fffaeb; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.live-draft-summary > div:first-child { display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; align-items: center; }
.live-draft-summary small { grid-column: 2; color: var(--amber); }
.staffing-counts { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.live-layout-person.draft-outgoing { border: 2px dashed #fdb022; background: #fffaeb; }
.live-layout-person.draft-arrival { border: 2px solid #fdb022; background: #fff4cc; box-shadow: 0 0 0 3px #fef0c744; }
.draft-direction { color: #854a0e !important; font-weight: 800; }
@media (max-width: 700px) {
  .staffing-plan-bar { align-items: stretch; flex-direction: column; }
  .staffing-plan-bar .head-actions { width: 100%; }
  .staffing-plan-bar .head-actions .btn { flex: 1; }
  .live-draft-summary { align-items: stretch; flex-direction: column; }
  .live-draft-summary .head-actions { width: 100%; }
  .live-draft-summary .head-actions .btn { flex: 1; }
}