.hr4bWorkspace { min-width: 0; }
.hr4bHeading { display: flex; justify-content: space-between; gap: 24px; align-items: start; }
.hr4bHeading .sectionHeading { margin-bottom: 0; }
.hr4bHeading .mutedNote { margin: 8px 0 0; }
.hr4bStatus { display: grid; gap: 8px; min-width: 180px; color: var(--muted); font-size: 12px; text-align: right; }
.hr4bSourceBadge { display: inline-flex; justify-content: center; padding: 6px 9px; border: 1px solid #b8d2ca; background: #f1f8f5; color: #1d5c4b; font-weight: 800; }
.hr4bToolbar { display: flex; justify-content: space-between; gap: 18px; align-items: end; margin: 22px 0 16px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hr4bFilters { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 10px; align-items: end; }
.hr4bFilters label, .hr4bReason, .hr4bFileInput { display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
.hr4bFilters input, .hr4bFilters select, .hr4bReason input { min-height: 38px; min-width: 132px; border: 1px solid var(--line); border-radius: 4px; padding: 8px 10px; background: var(--surface); color: var(--text); font: inherit; font-weight: 500; }
.hr4bFilters .hr4bSearch input { min-width: 200px; }
.hr4bToolbarActions, .hr4bActionButtons { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 8px; align-items: end; }
.hr4bToolbarActions .quietCommand, .hr4bActionButtons .quietCommand, .hr4bActionButtons .primaryCommand { white-space: nowrap; }
.hr4bActionBar { display: flex; justify-content: space-between; gap: 18px; align-items: end; margin-bottom: 18px; }
.hr4bReason { flex: 1 1 300px; max-width: 440px; }
.hr4bReason input { width: 100%; }
.hr4bWorkspaceGrid, .hr4bMainColumn { min-width: 0; display: grid; gap: 22px; }
.hr4bSupportGrid { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.hr4bMatrixScroller { width: 100%; overflow: auto; border: 1px solid var(--line); background: var(--surface); }
.hr4bMatrixScroller { max-height: 610px; }
.hr4bMatrixTable { width: max-content; min-width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; --employee-column: 180px; }
.hr4bEmployeeCol { width: var(--employee-column); min-width: var(--employee-column); }
.hr4bDayCol { width: 48px; min-width: 48px; }
.hr4bMatrixTable th, .hr4bMatrixTable td { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hr4bMatrixTable thead th { position: sticky; top: 0; z-index: 3; height: 52px; padding: 6px 4px; background: #f7faf9; color: var(--muted); font-size: 11px; font-weight: 800; text-align: center; }
.hr4bMatrixTable .hr4bEmployeeHead { left: 0; z-index: 5; width: var(--employee-column); min-width: var(--employee-column); padding: 10px 12px; text-align: left; }
.hr4bDayHead span, .hr4bDayHead small { display: block; }
.hr4bDayHead span { color: var(--ink); font-size: 14px; }
.hr4bDayHead small { margin-top: 2px; color: var(--muted); font-size: 10px; font-weight: 700; }
.hr4bEmployeeCell { position: sticky; left: 0; z-index: 2; width: var(--employee-column); min-width: var(--employee-column); padding: 9px 12px; background: var(--surface); text-align: left; vertical-align: middle; }
.hr4bEmployeeCell strong, .hr4bEmployeeCell span, .hr4bEmployeeCell small { display: block; overflow-wrap: anywhere; }
.hr4bEmployeeCell strong { color: var(--ink); font-size: 13px; }
.hr4bEmployeeCell span, .hr4bEmployeeCell small { margin-top: 3px; color: var(--muted); font-size: 11px; font-weight: 500; }
.hr4bScheduleCell { width: 48px; min-width: 48px; height: 60px; padding: 3px; background: #f5f7f7; vertical-align: middle; }
.hr4bScheduleCell button { position: relative; display: grid; place-items: center; width: 100%; min-width: 0; min-height: 52px; border: 1px solid transparent; border-radius: 3px; padding: 4px 2px; color: var(--text); font: inherit; font-size: 10px; font-weight: 800; line-height: 1.15; cursor: pointer; }
.hr4bScheduleCell button:hover, .hr4bScheduleCell button:focus-visible { border-color: var(--brand); outline: 2px solid var(--focus); outline-offset: -2px; }
.hr4bScheduleCell button span { max-width: 46px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hr4bScheduleCell button b { position: absolute; top: 3px; right: 3px; min-width: 13px; height: 13px; border-radius: 50%; background: #b44539; color: #fff; font-size: 9px; line-height: 13px; text-align: center; }
.hr4bScheduleCell.morning button { background: #edf5ff; color: #255a82; }
.hr4bScheduleCell.night button { background: #fff6dc; color: #765719; }
.hr4bScheduleCell.rest button { background: #f5f7f7; color: #7a8583; }
.hr4bScheduleCell.one-to-one button { background: #f0eafd; color: #5d438d; }
.hr4bScheduleCell.pending button { background: #fff3bd; color: #75591b; }
.hr4bScheduleCell.blocked button { background: #fff0ee; color: #a33a32; }
.hr4bScheduleCell button.is-selected { border-color: var(--brand); background: var(--brand-soft); }
.hr4bPagination { display: flex; justify-content: space-between; gap: 14px; align-items: center; color: var(--muted); font-size: 12px; }
.hr4bPagination > div { display: flex; gap: 8px; align-items: center; }
.hr4bPagination select { min-height: 34px; border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; background: var(--surface); color: var(--text); }
.hr4bSummary, .hr4bWeekly, .hr4bValidation, .hr4bImport { min-width: 0; padding-top: 18px; border-top: 1px solid var(--line); }
.hr4bSummary .sectionHeading, .hr4bWeekly .sectionHeading, .hr4bValidation .sectionHeading, .hr4bImport .sectionHeading { margin-bottom: 12px; }
.hr4bSummary h3, .hr4bWeekly h3, .hr4bValidation h3, .hr4bImport h3 { margin: 0; color: var(--ink); font-size: 15px; }
.hr4bSummaryGrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(78px, 1fr)); width: 100%; border-top: 1px solid var(--line); border-left: 1px solid var(--line); background: var(--surface); }
.hr4bSummaryDay { min-width: 0; padding: 8px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hr4bSummaryDay > strong { display: block; margin-bottom: 6px; color: var(--ink); font-size: 11px; }
.hr4bSummaryDay dl, .hr4bSummaryDay dl div { margin: 0; }
.hr4bSummaryDay dl { display: grid; gap: 3px; }
.hr4bSummaryDay dl div { display: flex; justify-content: space-between; gap: 6px; color: var(--muted); font-size: 10px; }
.hr4bSummaryDay dt, .hr4bSummaryDay dd { margin: 0; }
.hr4bSummaryDay dd { color: var(--ink); font-weight: 800; }
.hr4bWeeklyList { display: grid; gap: 7px; }
.hr4bWeek { display: flex; justify-content: space-between; gap: 10px; padding: 9px 10px; border-left: 3px solid #d7b968; background: #fffaf0; color: var(--text); font-size: 12px; }
.hr4bWeek.ready { border-left-color: #5d9f80; background: #f2f8f4; }
.hr4bWeek span { color: var(--muted); }
.hr4bValidation ul { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.hr4bValidation li { display: grid; gap: 3px; padding: 9px 10px; border-left: 3px solid #d7b968; background: #fffaf0; }
.hr4bValidation li.blocker { border-left-color: #b44539; background: #fff3f1; }
.hr4bValidation li strong { color: var(--ink); font-size: 12px; }
.hr4bValidation li span { color: var(--muted); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.hr4bCellEditor { position: fixed; z-index: 40; display: grid; gap: 12px; width: min(360px, calc(100vw - 24px)); max-height: min(620px, calc(100vh - 24px)); overflow: auto; border: 1px solid var(--line); border-radius: 6px; padding: 16px; background: var(--surface); box-shadow: 0 18px 48px rgba(23, 36, 32, 0.18); }
.hr4bCellEditorBackdrop { display: none; }
.hr4bEditorHeading { display: flex; justify-content: space-between; gap: 10px; align-items: start; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.hr4bEditorHeading h3 { margin: 0; color: var(--ink); font-size: 16px; }
.hr4bCellEditor label, .hr4bReadonlyField { display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 700; }
.hr4bReadonlyGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.hr4bReadonlyField strong { color: var(--ink); font-size: 13px; overflow-wrap: anywhere; }
.hr4bCellEditor input, .hr4bCellEditor select, .hr4bCellEditor textarea { width: 100%; min-height: 36px; border: 1px solid var(--line); border-radius: 4px; padding: 7px 9px; background: var(--surface); color: var(--text); font: inherit; }
.hr4bCellEditor textarea { min-height: 76px; resize: vertical; }
.hr4bEditorActions { display: flex; justify-content: end; gap: 8px; align-items: center; }
.iconCommand { display: inline-grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); color: var(--ink); font: inherit; font-size: 18px; line-height: 1; cursor: pointer; }
.dangerCommand { color: #a33a32; border-color: #e0b5b0; background: #fff8f7; }
.hr4bImport .mutedNote { color: var(--muted); font-size: 12px; line-height: 1.5; }
.hr4bFileInput { padding: 10px; border: 1px dashed #b9c8c2; background: #f8faf9; }
.hr4bFileInput input { width: 100%; font: inherit; font-weight: 500; }
.hr4bImportPreview { display: grid; gap: 8px; margin-top: 10px; padding: 10px; border-left: 3px solid var(--focus); background: var(--brand-soft); }
.hr4bImportPreview strong { color: var(--ink); font-size: 12px; overflow-wrap: anywhere; }
.hr4bImportPreview span { color: var(--muted); font-size: 12px; }
.hr4bEmptyActions, .hr4bEmptyState { display: grid; gap: 9px; padding: 22px 0; color: var(--muted); }
.hr4bEmptyActions p, .hr4bEmptyState strong, .hr4bEmptyState span { margin: 0; }
.hr4bEmptyState strong { color: var(--ink); }
.srOnly { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
@media (max-width: 900px) {
  .hr4bSupportGrid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .hr4bHeading, .hr4bToolbar, .hr4bActionBar, .hr4bPagination { display: grid; align-items: stretch; }
  .hr4bStatus { min-width: 0; text-align: left; }
  .hr4bFilters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hr4bFilters label, .hr4bFilters .hr4bSearch { min-width: 0; }
  .hr4bFilters .hr4bSearch { grid-column: 1 / -1; }
  .hr4bFilters .hr4bSearch input { min-width: 0; }
  .hr4bToolbarActions, .hr4bActionButtons { justify-content: start; }
  .hr4bReason { max-width: none; }
  .hr4bCellEditorBackdrop { position: fixed; inset: 0; z-index: 39; display: block; background: rgba(20, 29, 27, 0.36); }
  .hr4bCellEditor { left: 0 !important; right: 0; bottom: 0; top: auto !important; width: 100%; max-height: min(72vh, 620px); border-radius: 6px 6px 0 0; }
  .hr4bMatrixScroller { max-height: 540px; }
}