.recruitment-base-page { height: calc(100vh - 72px); min-height: 0; padding: 0; overflow: hidden; background: #fff; }
.recruitment-base { height: 100%; min-height: 0; overflow: hidden; color: #1f2329; background: #fff; }
.recruitment-views { padding: 16px 12px; border-right: 1px solid #e7e8eb; background: #fbfbfc; }
.recruitment-view-search { display: flex; align-items: center; gap: 8px; height: 32px; margin: 0 4px 10px; color: #8f959e; font-size: 13px; }
.recruitment-view, .recruitment-new-view { display: block; width: 100%; min-height: 36px; padding: 8px 12px; border: 0; border-radius: 5px; color: #4e5969; background: transparent; text-align: left; font-weight: 500; }
.recruitment-view:hover, .recruitment-view.active { color: #3370ff; background: #edf3ff; }
.recruitment-view, .recruitment-new-view, .recruitment-view-tabs, .recruitment-toolbar > .recruitment-add { display: none !important; }
.recruitment-owner-bar { display: flex; align-items: center; gap: 8px; padding: 10px 0; }
.recruitment-owner-label { flex: 0 0 auto; color: #8f959e; font-size: 12px; font-weight: 600; }
.recruitment-owner-list { display: flex; flex-wrap: wrap; gap: 4px; }
.recruitment-owner { min-height: 30px; padding: 5px 10px; border: 0; border-radius: 5px; color: #4e5969; background: transparent; text-align: left; font-size: 13px; cursor: pointer; }
.recruitment-owner:hover, .recruitment-owner.active { color: #3370ff; background: #edf3ff; font-weight: 600; }
.recruitment-new-view { position: absolute; bottom: 16px; left: 12px; width: 214px; border: 1px solid #d0d3d8; color: #2e3440; background: #fff; text-align: center; }
.recruitment-new-view:hover { border-color: #3370ff; color: #3370ff; }
.recruitment-sheet { display: flex; flex-direction: column; height: 100%; min-width: 0; min-height: 0; overflow: hidden; }
.recruitment-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 62px; padding: 0 22px; border-bottom: 1px solid #e7e8eb; }
.recruitment-sheet-head h1 { margin: 0; font-size: 17px; font-weight: 650; }
.recruitment-title { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.recruitment-title span { overflow: hidden; color: #8f959e; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.recruitment-view-tabs { display: flex; align-items: center; align-self: stretch; }
.recruitment-view-tabs button { min-width: 86px; height: 100%; padding: 0 14px; border: 0; border-bottom: 2px solid transparent; color: #646a73; background: transparent; }
.recruitment-view-tabs button:hover, .recruitment-view-tabs button.active { color: #3370ff; border-bottom-color: #3370ff; font-weight: 650; }
.recruitment-view-tabs button:last-child { min-width: 40px; font-size: 19px; }
.recruitment-toolbar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 2px; min-height: 46px; padding: 7px 16px; border-bottom: 1px solid #e7e8eb; box-shadow: 0 1px 0 rgba(31, 35, 41, .04); background: #fff; white-space: nowrap; overflow-x: auto; }
.recruitment-toolbar > button { height: 30px; padding: 0 9px; border: 0; border-radius: 4px; color: #4e5969; background: transparent; }
.recruitment-toolbar > button:hover { color: #3370ff; background: #f2f3f5; }
.recruitment-toolbar > .recruitment-add { color: #3370ff; font-weight: 650; }
.recruitment-month-filter, .recruitment-date-filter { display: inline-flex; align-items: center; gap: 5px; height: 30px; margin-left: 5px; color: #646a73; font-size: 12px; }
.recruitment-month-filter select, .recruitment-date-filter input { height: 30px; padding: 0 8px; border: 1px solid #dcdfe4; border-radius: 4px; color: #4e5969; background: #fff; outline: 0; }
.recruitment-month-filter select { padding-right: 25px; }
.recruitment-month-filter select:focus, .recruitment-date-filter input:focus { border-color: #3370ff; box-shadow: 0 0 0 2px #eaf2ff; }
.recruitment-date-filter input:disabled { color: #c4c7cc; background: #f5f6f7; }
.recruitment-search { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.recruitment-search input { width: 184px; height: 29px; padding: 0 9px; border: 1px solid #dcdfe4; border-radius: 4px; outline: 0; }
.recruitment-search input:focus { border-color: #3370ff; box-shadow: 0 0 0 2px #eaf2ff; }
.recruitment-search button { height: 29px; border: 0; border-radius: 4px; color: #fff; background: #3370ff; }
.recruitment-grid-wrap { flex: 1 1 auto; min-height: 0; overflow: auto; overflow-anchor: none; }
.recruitment-grid { width: 100%; min-width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 13px; }
.recruitment-grid th, .recruitment-grid td { min-width: 0; height: 52px; padding: 6px 10px; border-right: 1px solid #e7e8eb; border-bottom: 1px solid #e7e8eb; vertical-align: middle; text-align: left; background: #fff; }
.recruitment-grid th { position: sticky; top: 0; z-index: 2; height: 36px; color: #4e5969; background: #f7f8fa; font-weight: 600; }
.recruitment-category-heading span { display: block; margin-top: 1px; color: #3370ff; font-size: 10px; font-weight: 500; line-height: 1.1; }
.recruitment-grid th:nth-child(2) { width: 220px; }.recruitment-grid th:nth-child(3) { width: 130px; }.recruitment-grid th:nth-child(4) { width: 180px; }.recruitment-grid th:nth-child(5) { width: 110px; }.recruitment-grid th:nth-child(6) { width: 150px; }.recruitment-grid th:nth-child(7) { width: 140px; }.recruitment-grid th:nth-child(8) { width: 320px; }.recruitment-grid th:nth-child(9) { width: 145px; }
.recruitment-grid tbody tr:hover td { background: #f8faff; }
.recruitment-grid .recruitment-row-number { position: sticky; left: 0; z-index: 1; width: 48px; min-width: 48px; padding: 0; color: #8f959e; background: #f7f8fa; text-align: center; font-variant-numeric: tabular-nums; }
.recruitment-grid .recruitment-row-number > span { display: block; width: 100%; text-align: center; }
.recruitment-delete-entry { position: absolute; top: 27px; left: 6px; width: 36px; height: 18px; padding: 0; border: 0; border-radius: 3px; color: #cf3f3f; background: #fff0f0; font-size: 11px; line-height: 18px; cursor: pointer; }.recruitment-delete-entry:hover { color: #fff; background: #e5484d; }.recruitment-delete-entry:disabled { cursor: wait; opacity: .55; }
.recruitment-grid th.recruitment-row-number { z-index: 3; }
.recruitment-cell-editor, .recruitment-draft input, .recruitment-draft select, .recruitment-status-select { box-sizing: border-box; width: 100%; min-width: 0; min-height: 31px; padding: 4px 6px; border: 1px solid transparent; border-radius: 3px; color: #1f2329; background: transparent; outline: 0; }
.recruitment-cell-editor:hover, .recruitment-draft input:hover, .recruitment-draft select:hover, .recruitment-status-select:hover { border-color: #d0d3d8; background: #fff; }
.recruitment-cell-editor:focus, .recruitment-draft input:focus, .recruitment-draft select:focus, .recruitment-status-select:focus { border-color: #3370ff; background: #fff; box-shadow: 0 0 0 2px #eaf2ff; }
.recruitment-draft input.recruitment-category-auto { color: #0d7a5f; background: #effbf6; font-weight: 600; }
.recruitment-cell-value { display: block; min-height: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recruitment-image-cell { min-width: 0; }.recruitment-image-grid { display: flex; flex-wrap: wrap; gap: 5px; width: 300px; max-width: 100%; margin: 0; }.recruitment-image-grid + small { display: none; }.recruitment-image-item { position: relative; display: block; width: 145px; height: 68px; }.recruitment-image-item .recruitment-image-preview { width: 100%; height: 100%; }.recruitment-image-delete { position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 3px; color: #fff; background: rgba(205, 59, 59, .9); font-size: 17px; line-height: 18px; cursor: pointer; }.recruitment-image-delete:hover { background: #b42318; }.recruitment-image-delete:disabled { cursor: wait; opacity: .55; }
.recruitment-image-preview { width: 145px; height: 68px; padding: 0; overflow: hidden; border: 1px solid #dcdfe4; border-radius: 2px; background: #f5f6f7; cursor: zoom-in; }.recruitment-image-preview:hover { border-color: #3370ff; }.recruitment-image-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }
.recruitment-image-preview.image-unavailable { width: auto; height: auto; padding: 7px; color: #8f959e; cursor: default; }
.recruitment-status-cell small { display: block; margin-top: 3px; overflow: hidden; color: #8f959e; font-size: 11px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.recruitment-state { display: inline-block; padding: 3px 8px; border-radius: 10px; color: #287a38; background: #dff4d9; font-size: 12px; }.recruitment-status-select { color: #287a38; background: #ecf9e8; }
.recruitment-draft td { height: 52px; background: #fff !important; }.recruitment-draft .recruitment-row-number { background: #f7f8fa !important; color: #8f959e; font-size: 13px; }
.recruitment-draft-saved td { background: #f3fbf5 !important; }.recruitment-draft-saved .recruitment-row-number { background: #e9f7ed !important; color: #287a38; }
.recruitment-upload-cell { min-width: 0; }.recruitment-upload-area { display: flex; align-items: stretch; gap: 5px; }.recruitment-paste-zone { display: grid; flex: 1; min-height: 32px; place-items: center; padding: 5px; border: 1px dashed #9ab7ed; border-radius: 3px; color: #3370ff; background: #f7faff; cursor: pointer; outline: 0; }.recruitment-paste-zone:hover, .recruitment-paste-zone:focus, .recruitment-paste-zone.drag-over { border-color: #3370ff; background: #edf4ff; }.recruitment-file-picker { flex: 0 0 32px; width: 32px; padding: 0; border: 1px solid #9ab7ed; border-radius: 3px; color: #3370ff; background: #fff; font-size: 20px; line-height: 1; cursor: pointer; }.recruitment-file-picker:hover { border-color: #3370ff; background: #edf4ff; }
.recruitment-existing-upload { display: block; width: 300px; max-width: 100%; margin-top: 5px; }.recruitment-existing-upload-state, .recruitment-upload-limit { display: block; margin-top: 4px; color: #8f959e; font-size: 11px; line-height: 1.25; }.recruitment-upload-limit { color: #8a5a00; }
.recruitment-image-selection { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }.recruitment-image-selection img { width: 60px; height: 42px; border: 1px solid #dce5f5; border-radius: 2px; object-fit: cover; }
.recruitment-submit { display: block; width: 100%; margin-top: 5px; padding: 4px 6px; border: 0; border-radius: 3px; color: #fff; background: #3370ff; font-size: 12px; font-weight: 650; }.recruitment-submit:hover { background: #245bdb; }
.recruitment-autosave { display: block; margin-top: 6px; color: #8f959e; font-size: 12px; line-height: 1.3; }.recruitment-autosave[data-tone="saved"] { color: #1f8f55; }.recruitment-autosave[data-tone="error"] { color: #d84a4a; }
.recruitment-next-row { display: inline-block; margin-top: 5px; padding: 3px 6px; border: 0; border-radius: 3px; color: #3370ff; background: transparent; font-size: 12px; cursor: pointer; }.recruitment-next-row:hover { background: #edf3ff; }
.recruitment-cell-editor[data-saving="1"] { background: #f7faff; color: #5f6f89; }
.recruitment-footer { display: flex; justify-content: space-between; align-items: center; min-height: 42px; padding: 7px 16px; border-top: 1px solid #e7e8eb; color: #8f959e; font-size: 12px; }.recruitment-footer > div { display: flex; align-items: center; gap: 9px; }.recruitment-footer button { padding: 4px 8px; border: 1px solid #dcdfe4; border-radius: 3px; color: #4e5969; background: #fff; }.recruitment-footer button:disabled { color: #bbbfc4; background: #f7f8fa; cursor: not-allowed; }
.recruitment-image-modal { position: fixed; inset: 0; z-index: 50; display: flex; align-items: center; justify-content: center; padding: 36px; background: rgba(15, 23, 42, .78); }.recruitment-image-modal img { max-width: min(1100px, 92vw); max-height: 88vh; border-radius: 3px; background: #fff; object-fit: contain; }.recruitment-image-close { position: fixed; top: 18px; right: 22px; width: 40px; height: 40px; border: 0; border-radius: 50%; color: #fff; background: rgba(15, 23, 42, .5); font-size: 28px; line-height: 1; cursor: pointer; }
.empty-row { padding: 30px !important; color: #8f959e; text-align: center !important; }
.recruitment-load-more td { height: 44px !important; color: #8f959e; background: #fafbfd !important; text-align: center !important; }
@media (max-width: 920px) { .recruitment-sheet-head { align-items: flex-start; flex-direction: column; gap: 2px; padding: 9px 12px; }.recruitment-title { width: 100%; }.recruitment-owner-bar { width: 100%; padding: 0; }.recruitment-title span { display: none; } }
@media (max-width: 760px) { .recruitment-sheet-head h1 { font-size: 15px; }.recruitment-toolbar { padding: 7px 10px; }.recruitment-toolbar > button:not(.recruitment-add) { display: none; }.recruitment-search { margin-left: 0; }.recruitment-search input { width: 145px; } }