/* 채용관리 보드 — hr 사이트군과 같은 계열(웜 그레이 + 버건디), 카드·보드 위주라 더 밝고 가볍게 */
:root {
  --bg: #F4F2EE; --surface: #FFFFFF; --ink: #1F1B18; --muted: #7B736A; --line: #E4DFD7; --line-strong: #CFC8BE;
  --accent: #7A2233; --accent-ink: #5E1826; --accent-soft: #F5E8EA;
  --ok: #2F6B4F; --ok-soft: #E6F1EB; --warn: #B7791F; --warn-soft: #FBF1DF; --off: #9A948C; --off-soft: #EEEBE6;
  --radius: 10px; --shadow: 0 1px 2px rgba(31,27,24,.06);
  --font: "Pretendard Variable", Pretendard, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { font-family: var(--font); font-size: 14px; line-height: 1.5; color: var(--ink); background: var(--bg); }
button, input, select, textarea { font: inherit; color: inherit; }
.hidden { display: none !important; }

/* 상단 */
.top { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 28px; height: 56px; padding: 0 20px; background: var(--surface); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 10px; }
.brand-mark { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--accent); color: #fff; font-weight: 800; font-size: 12px; letter-spacing: .5px; }
.brand-title { font-weight: 700; font-size: 16px; }
.ver { color: var(--muted); font-size: 12px; }
.tabs { display: flex; gap: 2px; }
.tabs button { border: 0; background: transparent; padding: 8px 14px; border-radius: 8px; color: var(--muted); font-weight: 600; cursor: pointer; }
.tabs button.on { background: var(--accent-soft); color: var(--accent-ink); }
.tabs button:disabled { color: var(--line-strong); cursor: default; }
.who { margin-left: auto; display: flex; align-items: center; gap: 12px; color: var(--muted); }
.search { width: 260px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--bg); }
.search:focus { outline: 2px solid var(--accent-soft); border-color: var(--accent); }

/* 버튼 */
.btn { border: 1px solid var(--line-strong); background: var(--surface); padding: 7px 14px; border-radius: 8px; cursor: pointer; font-weight: 600; }
.btn:hover { border-color: var(--ink); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.primary:hover { background: var(--accent-ink); }
.btn.ghost { border-color: transparent; background: transparent; color: var(--muted); }
.btn.small { padding: 4px 10px; font-size: 13px; }
.btn.danger { color: #9B2C2C; border-color: #E5C3C3; }

/* 접수 */
#main { min-height: calc(100vh - 56px); }
.view { display: flex; }
#view-intake { height: calc(100vh - 56px); }
.postings { width: 280px; flex: none; border-right: 1px solid var(--line); background: var(--surface); overflow: auto; }
.side-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 6px; font-weight: 700; }
#postingList { list-style: none; margin: 0; padding: 6px 8px; }
#postingList li { padding: 10px 10px; border-radius: 8px; cursor: pointer; }
#postingList li:hover { background: var(--bg); }
#postingList li.on { background: var(--accent-soft); }
#postingList .pt { font-weight: 600; }
#postingList .pm { color: var(--muted); font-size: 12px; display: flex; gap: 8px; }
#postingList li.closed .pt { color: var(--muted); text-decoration: line-through; }
.intake-main { flex: 1; overflow: auto; padding: 20px 24px; }
.dropzone { border: 1.5px dashed var(--line-strong); border-radius: 14px; padding: 26px 24px; text-align: center; background: var(--surface); transition: border-color .15s, background .15s; }
.dropzone.over { border-color: var(--accent); background: var(--accent-soft); }
.dropzone.busy { opacity: .6; pointer-events: none; }
/* v0.12f 업로드 진행률: 점선 위에 실선이 왼쪽 위부터 시계방향으로 */
.dropzone { position: relative; }
.dropzone.progress { opacity: 1; }
.dropzone.progress > :not(.dz-prog):not(.dz-title) { opacity: .55; }
.dz-prog { position: absolute; left: -1.5px; top: -1.5px; pointer-events: none; overflow: visible; }
.dz-prog path { fill: none; stroke-linecap: round; transition: stroke-dasharray .45s ease-out; }
.dz-prog .dz-line { stroke: var(--accent); stroke-width: 2.5; }
.dz-prog .dz-glow { stroke: var(--accent); stroke-width: 7; opacity: .14; }
.dz-prog.done .dz-line { stroke: var(--ok); transition: stroke .2s; }
.dz-prog.done { animation: dzDone .7s ease-out forwards; }
@keyframes dzDone { 0% { opacity: 1; } 60% { opacity: 1; } 100% { opacity: 0; } }
.dz-pct { display: inline-block; min-width: 3.6em; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--accent-soft); color: var(--accent-ink); font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums; vertical-align: 2px; text-align: center; }
@media (prefers-reduced-motion: reduce) { .dz-prog path { transition: none; } .dz-prog.done { animation: none; } }
.dz-title { font-size: 18px; font-weight: 700; }
.dz-sub { color: var(--muted); margin-top: 4px; }
.dz-row { display: flex; gap: 10px; justify-content: center; align-items: center; margin-top: 14px; }
.dz-row select { padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
#dzTarget { font-weight: 600; color: var(--accent-ink); }

/* 지원자 카드 — 이 사이트의 기본 단위 */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin-top: 20px; }
.card { position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 14px 12px; cursor: pointer; box-shadow: var(--shadow); }
.card:hover { border-color: var(--line-strong); }
.card.dragging { opacity: .45; }
.card.new { animation: pop .35s ease-out; }
@keyframes pop { from { transform: scale(.96); box-shadow: 0 0 0 4px var(--accent-soft); } }
.card .nm { font-size: 17px; font-weight: 700; letter-spacing: -.2px; }
.card .meta { color: var(--muted); font-size: 12.5px; margin-top: 2px; }
/* 학교·학과 (v0.12n) */
.card .edu { margin-top: 3px; font-size: 12.5px; color: var(--accent-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card .pos { margin-top: 8px; font-size: 13px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card .foot { display: flex; align-items: center; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
/* v0.13v: 접수 카드 아래 칩 자리 고정 — [단계 | 채용경로] / [차수 | 인적성] 2×2, 빈 칸도 높이 유지. 드문 표시(재지원·연락처 없음·OCR)는 맨 아래 줄 */
.card .foot.fixed { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5px 6px; align-items: stretch; }
/* v0.13w: 칩은 칸을 꽉 채워 전부 같은 크기(글자 가운데, … 없음), 빈 칸은 점선 칩. 다섯째 칸(재지원·사유·OCR)은 한 줄 전체 */
.card .foot.fixed .fslot { display: flex; align-items: stretch; gap: 4px; min-height: 24px; min-width: 0; }
.card .foot.fixed .fslot > * { flex: 1 1 0; min-width: 0; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: clip; max-width: none; padding-left: 5px; padding-right: 5px; font-size: 11px; letter-spacing: -.2px; }
.cards { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }   /* v0.13w: 칸 두 개에 '서류합격(연락전) ▾'·'인적성 응시중 ~9/25' 가 …없이 들어가게 카드 최소 폭 230→250 */
.card .foot.fixed .fslot > .stsel { max-width: none; line-height: 1.4; }
.card .foot.fixed .f-flags { grid-column: 1 / -1; }
/* 이름을 .blank 로 — 전역 .empty(padding 40px)와 겹쳐 빈 칸이 큰 원으로 부풀었던 사고(v0.13w-b) */
.chip.blank, .nx.blank { background: transparent !important; color: var(--muted) !important; opacity: .7; font-weight: 400 !important; border: 1px dashed var(--line-strong) !important; box-shadow: none !important; padding-top: 1px !important; padding-bottom: 1px !important; }   /* v0.13y: 빈 칸도 자리 이름을 회색으로 */
.card .ph-txt { color: var(--muted); opacity: .7; }   /* v0.13y: 학력 미입력 · 연락 전 자리표시 */
/* v0.13w: 위 줄들도 늘 자리 차지 — 학교·전화·포지션·연락기록·다음 할 일 (없어도 높이 유지) */
#cards .card .edu { min-height: 19px; }
#cards .card .pos { min-height: 20px; }
#cards .card .last { min-height: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#cards .card .nx-row { min-height: 26px; }
#cards .card .nx-row .nx { width: 100%; box-sizing: border-box; justify-content: center; }
#cards .card .nx-row .nx.blank { display: inline-flex; min-height: 24px; }
/* v0.13x: 채용 필요 현황 입력 */
.needs .need-add { margin: 10px 0 14px; }
.needs .need-add input#needDept { flex: 1; min-width: 200px; }
.needs .need-add label, .need-row label { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--muted); }
.needs .need-add input[type=number], .need-row input[type=number] { flex: 0 0 64px; width: 64px; min-width: 0; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; text-align: right; }
.need-list { list-style: none; padding: 0; margin: 0; max-width: 860px; }
.need-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); margin-bottom: 6px; }
.need-row .grip { cursor: grab; color: var(--muted); user-select: none; }
.need-row.dragging { opacity: .45; } .need-row.over { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.need-row .nd-dept { flex: 1; min-width: 140px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; font-weight: 600; }
.need-row .nd-pv { color: var(--accent-ink); font-size: 12.5px; white-space: nowrap; min-width: 160px; }
.need-row .nd-pv.off { color: var(--muted); }
.need-pv { margin-top: 16px; max-width: 860px; }
.need-pv h4 { margin: 0 0 6px; font-size: 13px; color: var(--muted); }
.need-pv pre { margin: 0; padding: 12px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 13px; white-space: pre-wrap; }
/* v0.13w: 번호 없는 카드 — 000-0000-0000 회색 + 회색 수화기, 누를 수 없음 */
.tel-box.none .tel-no { color: #B3ABA4; cursor: default; }
.tel-box.none .tel-no:hover { background: transparent; color: #B3ABA4; }
.tel-box.none .tel-call { color: #C9C2BB; pointer-events: none; }
.chip { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; background: var(--off-soft); color: var(--muted); }
.chip.src { background: var(--bg); }
.chip.st-interview_set, .chip.st-passed, .chip.st-joining, .chip.st-joined { background: var(--ok-soft); color: var(--ok); }
.chip.st-contacting, .chip.st-scheduling { background: var(--warn-soft); color: var(--warn); }
.chip.st-dropped, .chip.st-hold { background: var(--off-soft); color: var(--off); }
.chip.st-screened { background: var(--accent-soft); color: var(--accent-ink); }
/* 카드·목록에서 바로 단계 바꾸는 버튼 (v0.12l → v0.12n-b: 기본 <select> 목록은 꾸밀 수 없어 .cm 팝업으로 바꿈) — 칩처럼 보이게 */
.stsel { appearance: none; -webkit-appearance: none; border: 0; cursor: pointer; padding: 2px 9px; border-radius: 999px; font: inherit; font-size: 11.5px; font-weight: 600;
  background: var(--off-soft); color: var(--muted); max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.7; }
.stsel:hover { filter: brightness(0.96); }
.stsel:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.stsel.st-interview_set, .stsel.st-passed, .stsel.st-joining, .stsel.st-joined { background-color: var(--ok-soft); color: var(--ok); }
.stsel.st-contacting, .stsel.st-scheduling { background-color: var(--warn-soft); color: var(--warn); }
.stsel.st-dropped, .stsel.st-hold { background-color: var(--off-soft); color: var(--off); }
.stsel.st-screened { background-color: var(--accent-soft); color: var(--accent-ink); }
/* 단계 고르는 팝업 (v0.12n-b) — '통화 결과' 메뉴와 같은 모양 */
.cm.cm-st { width: 232px; }
.cm-stit i { background: var(--muted); }
.cm-stit.st-screened i { background: var(--accent); }
.cm-stit.st-contacting i, .cm-stit.st-scheduling i { background: var(--warn); }
.cm-stit.st-interview_set i, .cm-stit.st-round2 i, .cm-stit.st-passed i, .cm-stit.st-joining i, .cm-stit.st-joined i { background: var(--ok); }
.cm-stit.st-dropped i, .cm-stit.st-hold i { background: #6B635C; }
.cm-stit.on { background: var(--bg); }
.cm-stit.on b::after { content: ' ✓'; color: var(--accent); }
.chip.why { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card .warn { color: var(--warn); font-size: 12px; }
.card.faded { opacity: .55; }
.empty { color: var(--muted); padding: 40px; text-align: center; grid-column: 1/-1; }

/* 파이프라인 */
#view-board { flex-direction: column; height: calc(100vh - 56px); }
.board-tools { display: flex; gap: 14px; align-items: center; padding: 14px 24px 6px; color: var(--muted); }
.board-tools select { padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.kanban { display: flex; gap: 12px; padding: 10px 24px 24px; overflow-x: auto; flex: 1; }
.col { flex: none; width: 236px; display: flex; flex-direction: column; background: rgba(255,255,255,.55); border: 1px solid var(--line); border-radius: 12px; }
.col.over { border-color: var(--accent); background: var(--accent-soft); }
.col-head { display: flex; justify-content: space-between; padding: 10px 12px 6px; font-weight: 700; }
.col-head .n { color: var(--muted); font-weight: 600; }
.col-body { flex: 1; overflow: auto; padding: 6px 8px 10px; display: flex; flex-direction: column; gap: 8px; min-height: 60px; }
.col .card { padding: 10px 12px; }
.col .card .nm { font-size: 15px; }

/* 상세 서랍 */
.scrim { position: fixed; inset: 0; background: rgba(31,27,24,.25); z-index: 30; }
.drawer { position: fixed; top: 0; right: 0; bottom: 0; width: 560px; max-width: 100vw; background: var(--surface); z-index: 31; box-shadow: -8px 0 30px rgba(31,27,24,.12); overflow: auto; }
.drawer-inner { padding: 22px 26px 40px; }
.d-head { display: flex; align-items: flex-start; gap: 12px; }
.d-head h2 { margin: 0; font-size: 22px; }
.d-head .sub { color: var(--muted); }
.d-head .close { margin-left: auto; }
.d-status { display: flex; gap: 8px; align-items: center; margin: 14px 0 6px; flex-wrap: wrap; }
.d-status select { padding: 6px 10px; border: 1px solid var(--line-strong); border-radius: 8px; }
.d-sec { margin-top: 22px; }
.d-sec h4 { margin: 0 0 8px; font-size: 13px; color: var(--muted); font-weight: 700; }
.form label { display: block; margin-bottom: 10px; font-size: 12.5px; color: var(--muted); }
.form input, .form select, .form textarea { display: block; width: 100%; margin-top: 3px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font-size: 14px; }
.form input:focus, .form select:focus, .form textarea:focus { outline: 2px solid var(--accent-soft); border-color: var(--accent); }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.checks { display: inline-flex; gap: 12px; margin-left: 6px; }
.checks label { display: inline-flex; gap: 4px; align-items: center; margin: 0; color: var(--ink); }
.actions { display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin-top: 6px; }
.files li, .log li { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--line); }
.files ul, .log ul { list-style: none; padding: 0; margin: 0; }
/* v0.13t: 카드 상세 '인적성 · 과제' — 첫 줄은 칩·상태·마감·삭제, 둘째 줄은 결과 한 줄(칩 왼쪽 선에 맞춤, 줄바꿈 허용 → 가로 스크롤 없음) */
.log li.apt-li { display: block; }
.log li.apt-li .apt-row { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.log li.apt-li .apt-res { margin-top: 4px; line-height: 1.5; white-space: normal; word-break: keep-all; overflow-wrap: anywhere; }   /* .log .t 의 nowrap 을 풀어야 줄바꿈됨 */
.log li.apt-li .apt-res .apt-sep { font-style: normal; opacity: .5; margin: 0 2px; }
.files a { color: var(--accent-ink); font-weight: 600; text-decoration: none; }
.log .t { color: var(--muted); font-size: 12px; white-space: nowrap; }
.log .r { font-weight: 600; }
.inline { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.inline select, .inline input { padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; }
.inline input { flex: 1; min-width: 160px; }
.saved { color: var(--ok); font-size: 12px; margin-left: 8px; }
.hint { font-size: 12.5px; }
.err { color: #9B2C2C; min-height: 1.2em; margin: 8px 0 0; }

/* 다이얼로그 */
dialog { border: 0; border-radius: 14px; padding: 22px 24px; width: 540px; max-width: 95vw; box-shadow: 0 20px 60px rgba(31,27,24,.25); }
dialog::backdrop { background: rgba(31,27,24,.3); }
dialog h3 { margin: 0 0 14px; }

/* 로그인 */
.login-body { display: grid; place-items: center; }
.login-card { width: 380px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 30px 30px 24px; }
.login-brand { display: flex; gap: 12px; align-items: center; margin-bottom: 22px; }
.login-brand .brand-mark { width: 40px; height: 40px; font-size: 14px; }
.brand-sub { color: var(--muted); font-size: 12.5px; }
.login-card form label { display: block; margin-bottom: 12px; font-size: 12.5px; color: var(--muted); }
.login-card form input { display: block; width: 100%; margin-top: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 15px; }
.login-card form input:focus { outline: 2px solid var(--accent-soft); border-color: var(--accent); }
.login-card .btn { width: 100%; padding: 10px; margin-top: 4px; }
.login-note { color: var(--muted); font-size: 12px; margin: 16px 0 0; }

@media (max-width: 900px) { .postings { display: none; } .search { width: 160px; } .drawer { width: 100vw; } }
@media (prefers-reduced-motion: reduce) { .card.new { animation: none; } }

/* 설정 */
.settings { padding: 24px 32px; max-width: 760px; }
.settings h3 { margin: 0 0 4px; }
.hits { list-style: none; padding: 0; margin: 6px 0 14px; }
.hits li { display: flex; gap: 12px; align-items: center; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 4px; background: var(--surface); }
.hits li .m { color: var(--muted); flex: 1; }
/* v0.13n 면접관 검색 공통: 불가 기간인 사람 표시, 이 조 시간 불가 줄 */
.hits li.busy { background: var(--warn-soft); border-color: #EBD9B4; }
.hits li .iv-busy { color: var(--warn); font-size: 12px; font-weight: 700; white-space: nowrap; }
.chip.busy { background: var(--warn-soft); border-color: #EBD9B4; color: #7E5213; }
.chip.busy em { font-style: normal; font-size: 11.5px; color: var(--warn); font-weight: 700; }
.iv-unav { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; padding: 7px 10px; border-radius: 8px; background: #FBF7EF; border: 1px dashed #E3C98F; font-size: 12.5px; color: #6B5A3A; }
.iv-unav b { color: var(--warn); margin-right: 2px; }
.iv-unav span { padding: 2px 8px; border-radius: 999px; background: #fff; border: 1px solid #EBD9B4; }
.iv-unav span i { font-style: normal; color: var(--muted); margin-left: 4px; }
.unav .unav-l { pointer-events: auto; cursor: pointer; border-radius: 4px; padding: 0 3px; }
.unav .unav-l:hover { background: rgba(255,255,255,.8); text-decoration: line-through; }
.tbl { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.tbl th, .tbl td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.tbl th { color: var(--muted); font-weight: 600; font-size: 12.5px; }
.tbl tr.off td { color: var(--off); }
#postingList li { position: relative; }
#postingList .edit { position: absolute; right: 8px; top: 8px; border: 0; background: transparent; color: var(--muted); cursor: pointer; opacity: .55; padding: 2px 6px; border-radius: 6px; font-size: 14px; }
#postingList li:hover .edit { opacity: 1; }
#postingList .edit:hover { background: var(--surface); color: var(--ink); }
.card .quick { position: absolute; right: 8px; top: 8px; display: none; gap: 4px; }
.card:hover .quick { display: flex; }
.card .quick button { border: 1px solid var(--line); background: var(--surface); border-radius: 6px; padding: 1px 7px; font-size: 12px; cursor: pointer; color: var(--muted); }
.card .quick button:hover { color: var(--ink); border-color: var(--ink); }
.card .last { color: var(--muted); font-size: 11.5px; margin-top: 4px; }
/* 증명사진: 오른쪽 위, 마우스를 올리면 크게 */
.card .ph { position: absolute; top: 12px; right: 12px; width: 46px; height: 60px; object-fit: cover; object-position: center top; border-radius: 10px; opacity: 0;
  background: var(--bg); box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--line), 0 6px 14px -6px rgba(31,27,24,.35);
  transform-origin: top right; transition: transform .22s cubic-bezier(.2,.9,.3,1.2), box-shadow .22s ease, opacity .3s ease; z-index: 1; }
.card.has-photo .ph { opacity: 1; }
.card .ph:hover { transform: scale(2.4); z-index: 5; box-shadow: 0 0 0 1.5px #fff, 0 0 0 2.5px rgba(122,34,51,.35), 0 18px 34px -10px rgba(31,27,24,.45); }
.card.has-photo .nm, .card.has-photo .meta, .card.has-photo .pos, .card.has-photo .edu { margin-right: 56px; }   /* v0.12n-b: 학교·학과가 사진에 가리던 것 */
.card.has-photo .quick { right: 66px; }
.col .card .ph, .q-list .card .ph { top: 8px; right: 8px; width: 32px; height: 42px; border-radius: 7px; }
.col .card.has-photo .nm, .col .card.has-photo .meta, .col .card.has-photo .edu, .q-list .card.has-photo .nm, .q-list .card.has-photo .meta, .q-list .card.has-photo .edu { margin-right: 38px; }
.col .card.has-photo .quick { right: 46px; }

/* 다음 할 일 표시 */
.nx-row { margin-top: 8px; }
.nx { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 3px 9px 3px 7px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; border: 1px solid transparent; }
.nx i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.nx em { font-style: normal; font-weight: 500; opacity: .7; }
.nx-recall { background: #FBEDEE; color: #9B2C3C; border-color: #F1D3D7; }
.nx-recall i { animation: nxPulse 1.8s ease-in-out infinite; }
.nx-wait { background: #EEF2F8; color: #3A5580; border-color: #DBE3EF; }
.nx-ours { background: var(--warn-soft); color: #8A5A12; border-color: #F1DDB5; }
.nx-assign { background: var(--ok-soft); color: var(--ok); border-color: #CFE3D8; }
.nx-drop { background: #EFECE8; color: #4A433D; border-color: #DDD7D0; }
@keyframes nxPulse { 50% { opacity: .35; } }

/* 포지션 안 단계 칸 (끌어서 단계 이동) */
#cards.lanes { display: flex; align-items: flex-start; gap: 12px; overflow-x: auto; padding-bottom: 10px; }
#cards.lanes .lane { width: 252px; transition: border-color .15s ease, background .15s ease, box-shadow .15s ease; }
#cards.lanes .lane .col-body { min-height: 90px; overflow: visible; }
#cards.lanes .col-head span:first-child { display: inline-flex; align-items: center; gap: 7px; }
#cards.lanes .col-head span:first-child::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--off); }
.lane-screened .col-head span:first-child::before { background: var(--accent); }
.lane-contacting .col-head span:first-child::before, .lane-scheduling .col-head span:first-child::before { background: var(--warn); }
.lane-interview_set .col-head span:first-child::before, .lane-interviewed .col-head span:first-child::before, .lane-passed .col-head span:first-child::before, .lane-joining .col-head span:first-child::before, .lane-joined .col-head span:first-child::before { background: var(--ok); }
.lane-empty { border: 1.5px dashed var(--line); border-radius: 10px; padding: 18px 8px; text-align: center; color: var(--off); font-size: 12px; }
#cards.lanes.dragging-on .lane { border-style: dashed; }
#cards.lanes.dragging-on .lane-empty { border-color: var(--line-strong); color: var(--muted); }
#cards.lanes .lane.over { border-style: solid; border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px rgba(122,34,51,.08); }
#cards.lanes .lane.over .lane-empty { border-color: var(--accent); color: var(--accent); }
/* 격자(카드만 보기)에서 놓일 자리 — 세로 막대 (v0.12m) */
.drop-ph.card-ph { height: auto; min-height: 90px; margin: 0; border: 0; border-left: 3px solid var(--accent); border-radius: 3px; box-shadow: none; align-self: stretch; }
.drop-ph.card-ph::before, .drop-ph.card-ph::after { display: none; }
#cards.dragging-on .card:not(.dragging) { transition: transform .12s ease; }
.drop-ph { height: 0; margin: -2px 6px; border-top: 3px solid var(--accent); border-radius: 3px; position: relative; box-shadow: 0 0 0 3px rgba(122,34,51,.10); animation: phIn .12s ease-out; }
.drop-ph::before, .drop-ph::after { content: ""; position: absolute; top: -6px; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.drop-ph::before { left: -6px; } .drop-ph::after { right: -6px; }
@keyframes phIn { from { opacity: 0; transform: scaleX(.6); } }
#cards.lanes .card.dragging { opacity: .35; transform: scale(.98); }
#cards .card { cursor: grab; }
#cards .card:active { cursor: grabbing; }
#cards .card .tel-box, #cards .card .quick { cursor: default; }
#cards .card .stsel { cursor: pointer; }
.nx-filter { padding: 4px 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); font-size: 13px; }
.log-hd { display: flex; align-items: center; gap: 8px; }

/* 통화 결과 메뉴 */
.cm { position: fixed; z-index: 60; width: 300px; padding: 8px; border-radius: 14px; background: #fff; border: 1px solid var(--line);
  box-shadow: 0 18px 40px -12px rgba(31,27,24,.35), 0 4px 10px -4px rgba(31,27,24,.12); animation: cmIn .16s ease-out both; }
.cm.busy { opacity: .6; pointer-events: none; }
@keyframes cmIn { from { opacity: 0; transform: translateY(-4px) scale(.98); } }
.cm-hd { display: flex; align-items: center; gap: 8px; padding: 4px 6px 8px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.cm-hd b { font-size: 14px; }
.cm-hd .chip { margin-left: auto; }
.cm-back { border: 0; background: var(--bg); border-radius: 6px; width: 24px; height: 24px; font-size: 16px; line-height: 1; cursor: pointer; color: var(--muted); }
.cm-sec { display: flex; align-items: baseline; gap: 8px; padding: 8px 8px 4px; font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--muted); }
.cm-req { font-weight: 600; letter-spacing: 0; color: #8A5A12; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cm-it { display: flex; align-items: flex-start; gap: 10px; width: 100%; text-align: left; border: 0; background: transparent; padding: 7px 8px; border-radius: 9px; cursor: pointer; }
.cm-it:hover { background: var(--bg); }
.cm-it i { width: 9px; height: 9px; border-radius: 50%; margin-top: 5px; flex: none; background: var(--off); }
.cm-it span { display: flex; flex-direction: column; }
.cm-it b { font-size: 13.5px; font-weight: 600; }
.cm-it small { font-size: 11.5px; color: var(--muted); }
.cm-no_answer i, .cm-alt_repropose i { background: #C2556A; }
.cm-accept i, .cm-alt_ok i { background: var(--ok); }
.cm-callback i { background: #5B7BB0; }
.cm-alt_request i { background: var(--warn); }
.cm-declined i, .cm-alt_drop i { background: #6B635C; }
.cm-note { margin: 6px 4px 2px; padding: 7px 9px; border-radius: 8px; background: var(--bg); font-size: 11.5px; color: var(--muted); }
.cm-lb { display: flex; flex-direction: column; gap: 4px; padding: 6px 6px 0; font-size: 12px; color: var(--muted); }
.cm-lb input { padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; font-size: 13.5px; color: var(--ink); }
.cm-lb input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.cm-act { display: flex; justify-content: flex-end; padding: 10px 6px 4px; }
.cm-reasons { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 6px 2px; }
.cm-reasons button { border: 1px solid var(--line-strong); background: #fff; border-radius: 999px; padding: 4px 11px; font-size: 12.5px; cursor: pointer; }
.cm-reasons button:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
@media (prefers-reduced-motion: reduce) { .cm, .nx-recall i { animation: none; } }

/* 면접 달력 */
#view-calendar { height: calc(100vh - 56px); }
.queue { width: 280px; flex: none; border-right: 1px solid var(--line); background: var(--surface); display: flex; flex-direction: column; }
.q-tools { padding: 0 16px 6px; }
.q-tools select { width: 100%; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; }

/* ── v0.13f~h 조합키 안내 (실장님 요청 26.09.22) ──
   면접 달력에서 Ctrl(⌘)·Alt 를 누르는 즉시(calendar.js khSet()) 그 조합으로 움직이는 곳이 깜빡인다. 화살표는 없음(v0.13h 실장님 "화살표 다 없애줘").
   Ctrl → 포지션 선택 칸(Ctrl+↑/↓) · '오늘' 양옆 ‹ ›(Ctrl+←/→) 테두리
   Alt  → 월·주·일 묶음 테두리 하나(Alt+↑/↓) · 위 메뉴 글자(Alt+←/→)
   색 = --kh (테마 버건디보다 채도 높은 크림슨), 1.1초 주기. */
:root { --kh: #D81E43; --kh-rgb: 216, 30, 67; }
@keyframes khPulse {
  0%, 100% { box-shadow: 0 0 0 1px rgba(var(--kh-rgb), .30), 0 0 3px rgba(var(--kh-rgb), .12); }
  50% { box-shadow: 0 0 0 2px rgba(var(--kh-rgb), .95), 0 0 10px rgba(var(--kh-rgb), .45); }
}
@keyframes khText { 50% { color: var(--kh); text-shadow: 0 0 6px rgba(var(--kh-rgb), .45); } }
body.kh-ctrl #calPosting, body.kh-ctrl #calPrev, body.kh-ctrl #calNext,
body.kh-alt #view-calendar .cal-bar .seg { animation: khPulse 1.1s ease-in-out infinite; border-color: var(--kh); }
body.kh-alt #tabs button:not(:disabled) { animation: khText 1.1s ease-in-out infinite; }
/* v0.13i(실장님 요청 26.09.22): 접수에서 Ctrl → 왼쪽 선택된 포지션 카드 배경이 투명도 70%(불투명 30%)까지 옅어졌다가 돌아옴 */
@keyframes khBg { 50% { background-color: rgba(245, 232, 234, .30); border-color: rgba(245, 232, 234, .30); } }
body.kh-ctrl #view-intake #postingList li.on { animation: khBg 1.1s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  body.kh-ctrl #calPosting, body.kh-ctrl #calPrev, body.kh-ctrl #calNext, body.kh-alt #view-calendar .cal-bar .seg { animation: none; box-shadow: 0 0 0 2px rgba(var(--kh-rgb), .8); }
  body.kh-alt #tabs button:not(:disabled) { animation: none; color: var(--kh); }
  body.kh-ctrl #view-intake #postingList li.on { animation: none; background-color: rgba(245, 232, 234, .5); }
}
.q-list { flex: 1; overflow: auto; padding: 4px 10px 16px; display: flex; flex-direction: column; gap: 6px; }
.q-list .card { padding: 8px 10px; cursor: grab; }
.q-list .card .nm { font-size: 14px; }
.q-list .card.set { border-style: dashed; }
.q-dept { color: var(--muted); font-size: 12px; font-weight: 700; margin: 8px 4px 0; }
/* v0.12z: 조에 안 들어간 이탈 카드 — 흐리게·점선, 끌어서 조에 넣을 수 있음 */
.q-sub { color: var(--off); font-size: 11px; margin: 6px 4px 0; padding-top: 6px; border-top: 1px dashed var(--line); }
.q-list .card.dropped { background: #F1EEEA; border-style: dashed; color: #8A8178; padding: 6px 10px; }
.q-list .card.dropped .nm { font-size: 13px; }
.cal-main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.cal-bar { display: flex; align-items: center; gap: 8px; padding: 12px 20px 8px; }
.cal-title { font-weight: 700; font-size: 16px; margin-left: 8px; }
.spacer { flex: 1; }
.seg { display: inline-flex; border: 1px solid var(--line-strong); border-radius: 8px; overflow: hidden; }
.seg button { border: 0; background: var(--surface); padding: 5px 12px; cursor: pointer; }
.seg button.on { background: var(--accent); color: #fff; }
.cal-grid { flex: 1; overflow: auto; padding: 0 20px 20px; }
/* 주·일: 시간 그리드 */
.tg { display: grid; grid-template-columns: 52px repeat(var(--days), 1fr); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); overflow: hidden; min-width: 700px; }
.tg .th { position: sticky; top: 0; z-index: 3; background: var(--surface); padding: 8px 6px; text-align: center; font-weight: 700; border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); }
.tg .th.today { color: var(--accent-ink); background: var(--accent-soft); }
.tg .th small { display: block; color: var(--muted); font-weight: 500; }
.tg .tc { position: relative; height: 1800px; border-left: 1px solid var(--line); }
.tg .tc.today { background: #FBFAF7; }
/* v0.13b 고른 날짜: 진한 테마색 테두리 + 아주 옅은 바탕. 머리(날짜·요일)와 아래 조 칸이 한 상자로 이어져 보이게 */
.tg .th[data-day], .tg .tc { cursor: pointer; }
.tg .th.pick { color: var(--accent-ink); background: #FBF1F3; box-shadow: inset 2px 0 0 var(--accent), inset -2px 0 0 var(--accent), inset 0 2px 0 var(--accent); }
.tg .tc.pick { background: #FDF8F9; }
.tg .tc.pick::before { content: ''; position: absolute; inset: 0; border: 2px solid var(--accent); border-top: 0; border-radius: 0 0 4px 4px; box-shadow: 0 4px 14px rgba(122, 34, 51, .10); pointer-events: none; z-index: 1; }
.mg .md.pick { border-color: var(--accent); background: #FDF8F9; box-shadow: 0 0 0 1.5px var(--accent), 0 3px 12px rgba(122, 34, 51, .12); }
.tg .hours { position: relative; height: 1800px; }
.tg .hl { position: absolute; left: 0; right: 0; border-top: 1px solid var(--line); font-size: 11px; color: var(--muted); padding-left: 6px; }
.tg .hl.half { border-top-style: dashed; border-top-color: #DDD8CF; color: #B5AEA4; }
.tg .hl.ten { border-top-color: #F1EEE8; }
.tg .cell { position: absolute; left: 0; right: 0; height: 25px; }
.tg .cell.over { background: var(--accent-soft); outline: 2px dashed var(--accent); outline-offset: -2px; z-index: 4; }
.tg .cell.over::after { content: attr(data-hm); position: absolute; left: 6px; top: 2px; font-size: 13px; font-weight: 700; color: var(--accent-ink); opacity: .55; pointer-events: none; }
.slot { position: absolute; left: 2px; right: 2px; z-index: 2; box-sizing: border-box; background: var(--sb, #EEF3F1); border-left: 3px solid var(--sc, var(--ok)); border-radius: 5px; padding: 0 6px; font-size: 12px; line-height: 21px; white-space: nowrap; overflow: hidden; cursor: pointer; box-shadow: var(--shadow); display: flex; align-items: center; gap: 5px; }
.slot .t { font-weight: 700; color: var(--sc, var(--ok)); }
.slot .d { font-weight: 700; color: var(--sc, inherit); }
.slot .n { color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; min-width: 0; }
.slot.over { outline: 2px solid var(--accent); }
.slot.empty { background: repeating-linear-gradient(135deg, #F6F4F1 0 6px, #EFECE8 6px 12px); border-left-color: var(--off); }
.slot.empty .t { color: var(--muted); }
.slot.sel { background: var(--accent-soft); border-left-color: var(--accent); box-shadow: 0 0 0 2px var(--accent) inset; z-index: 3; }
.slot.sel .t { color: var(--accent); }
.slot.other { opacity: .38; filter: grayscale(.7); z-index: 1; }
.slot.other:hover { opacity: .8; }
.mg .mi.other { opacity: .4; }
.slot-selbar { display: flex; align-items: center; gap: 8px; padding: 0 20px 8px; min-height: 30px; }
.slot-selbar .hint b { color: var(--ink); }
.slot .pill { display: inline-block; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 0 6px; line-height: 17px; margin-right: 2px; cursor: grab; }
.slot .pill.no_show, .slot .pill.cancelled { color: var(--off); }   /* v0.13z-d: 취소선 없앰 */
/* v0.12d 이탈·보류 카드가 조에 남아 있을 때 */
.slot .pill.st-dropped { background: #E4E0DB; border-color: #CFC8BE; border-style: dashed; color: #8A8178; }
.slot .pill.st-hold { background: var(--warn-soft); border-color: #E8CFA3; border-style: dashed; color: #8A5A12; }
.slot .pill .pill-x { font-style: normal; font-size: 9.5px; font-weight: 800; margin-right: 3px; padding: 0 3px; border-radius: 4px; background: #9A948C; color: #fff; vertical-align: 1px; }
.slot .pill.st-hold .pill-x { background: var(--warn); }
#slotCands li.off b { color: var(--off); }   /* v0.13z-d(실장님 요청): 이탈·보류 이름 취소선 없앰 — 회색 글자 + 상태 칩으로만 구분 */
#slotCands li.off .chip { margin-left: 4px; }
.unav { position: absolute; left: 0; right: 0; background: repeating-linear-gradient(135deg, #F6EDEE, #F6EDEE 6px, #F1E2E4 6px, #F1E2E4 12px); color: #9B2C2C; font-size: 11px; padding: 2px 6px; opacity: .9; pointer-events: none; border-top: 1px solid #E5C3C3; }
/* 월 */
.mg { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.mg .mh { text-align: center; color: var(--muted); font-weight: 700; padding: 4px; }
.mg .md { min-height: 110px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 6px 8px; cursor: pointer; }
.mg .md.out { opacity: .45; }
.mg .md.today { border-color: var(--accent); }
.mg .md .dn { font-weight: 700; } .mg .md .dn b { color: var(--ok); font-weight: 600; font-size: 12px; margin-left: 4px; }
/* v0.12o: 월 보기 칩도 부서 색(--sc/--sb)을 따라감 */
.mg .md .mi { font-size: 12px; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  padding: 0 6px; border-radius: 4px; background: var(--sb, transparent); border-left: 3px solid var(--sc, transparent); }
.mg .md .mi b { color: var(--sc, var(--ok)); }
.mg .md .mi b.rd2 { color: #fff; }
/* 보고서 */
.reports { padding: 24px 32px; }
.reports h3 { margin: 0 0 10px; }
.rp-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 14px; }
.rp-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; }
.rp-card h4 { margin: 0 0 4px; }
.rp-card textarea { width: 100%; margin-top: 10px; font-family: "Pretendard Variable", ui-monospace, monospace; font-size: 13px; line-height: 1.5; padding: 10px; border: 1px solid var(--line); border-radius: 8px; white-space: pre; }
.reports input[type=date] { padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; }
@media (max-width: 1100px) { .rp-cards { grid-template-columns: 1fr; } }
/* 슬롯 편집 · 면접자 줄: 한 줄에 이름·구분·참석·메모·빼기 */
#slotCands li { display: flex; align-items: center; gap: 8px; padding: 6px 0; }
#slotCands li b { white-space: nowrap; min-width: 52px; }
#slotCands li .t { white-space: nowrap; }
.form #slotCands select { display: inline-block; width: auto; margin: 0; padding: 5px 8px; }
.form #slotCands input { display: inline-block; width: auto; flex: 1; margin: 0; padding: 5px 8px; min-width: 120px; }
#slotCands li button { white-space: nowrap; }
#slotDlg .actions { align-items: center; }
/* v0.13z(실장님 요청 26.09.23): 조 편집 창 넓게 + 면접자 줄 칸 고정(참석 여부·사유가 같은 세로줄) + 이탈 칩 한 줄 + 체크 */
#slotDlg { width: 1000px; }
#slotCands li.sc-row { display: grid; grid-template-columns: 14px 18px 76px 210px 92px 112px minmax(140px, 1fr) auto; gap: 10px; align-items: center; }
/* v0.14o 조 안 순서 끌어서 바꾸기: 왼쪽 ⠿ 손잡이, 놓을 자리 위/아래에 버건디 선 */
#slotCands .sc-grip { color: var(--muted); font-size: 15px; line-height: 1; text-align: center; cursor: grab; user-select: none; }
#slotCands .sc-grip:empty { cursor: default; }
#slotCands li.sc-row:hover .sc-grip:not(:empty) { color: var(--accent, #7A2233); }
#slotCands li.sc-row.dragging { opacity: .4; }
#slotCands li.sc-row.dr-b { box-shadow: inset 0 2px 0 var(--accent, #7A2233); }
#slotCands li.sc-row.dr-a { box-shadow: inset 0 -2px 0 var(--accent, #7A2233); }
#slotCands li.sc-row > b { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
#slotCands li.sc-row > .chip { margin: 0 !important; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; padding: 3px 10px; font-size: 12px; line-height: 1.35; border: 1px solid transparent; }
#slotCands li.sc-row > .chip.sc-ok { background: transparent; border: 1px solid var(--line-strong); color: var(--muted); font-weight: 400; }
.form #slotCands li.sc-row select, .form #slotCands li.sc-row input:not([type=checkbox]) { width: 100%; min-width: 0; }
.form #slotCands input[type=checkbox] { width: 16px; height: 16px; min-width: 0; flex: none; margin: 0; padding: 0; accent-color: var(--accent, #7A2233); cursor: pointer; }
#slotCands li.sc-head { display: flex; align-items: center; gap: 12px; padding: 4px 0 6px; font-size: 12.5px; }
#slotCands li.sc-head label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 600; cursor: pointer; }
#slotCands li.sc-grp { display: block; padding: 12px 0 4px; font-weight: 700; font-size: 13px; border-bottom: 1px solid var(--line-strong); }
#slotCands li.sc-grp .t { font-weight: 400; margin-left: 6px; }
#slotCands li.sc-none { padding-left: 52px; }   /* v0.14o ⠿ 칸만큼 더 */
/* v0.13z-c: 면접관 칩은 ✕ 없이 이름을 누르면 빠짐 — 올리면 취소선 + 버건디 */
#slotIv .chip.iv-rm { cursor: pointer; user-select: none; transition: background .12s, color .12s; }
#slotIv .chip.iv-rm:hover, #slotIv .chip.iv-rm:focus-visible { background: var(--accent-soft); color: var(--accent); text-decoration: line-through; outline: none; }
#slotDlg .iv-copy:not(.hidden) { display: flex; width: max-content; margin: 6px 0 4px; }

.cal-grid { scrollbar-gutter: stable; }
.chk { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: 13px; margin-right: 6px; }
/* 달력 영역 자체 스크롤 (주·일·월 공통) */
#view-calendar { overflow: hidden; }
.cal-main { min-height: 0; }
.cal-grid { min-height: 0; overflow-y: scroll; overflow-x: auto; scrollbar-width: auto; }
.cal-grid::-webkit-scrollbar { width: 14px; }
.cal-grid::-webkit-scrollbar-track { background: var(--bg); }
.cal-grid::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 8px; border: 3px solid var(--bg); }
.cal-grid::-webkit-scrollbar-thumb:hover { background: var(--muted); }
.queue { min-height: 0; }
/* 달력: 페이지 스크롤은 그대로 두고, 일정표 안에 별도 스크롤 (날짜·요일 헤더는 안에서 고정) */
#view-calendar { height: auto; min-height: calc(100vh - 56px); overflow: visible; }
.cal-main { min-height: 0; }
.cal-grid { flex: none; height: 78vh; min-height: 480px; overflow-y: scroll; overflow-x: auto; position: relative; }
/* v0.14e: 달력 + 오른쪽 '면접관 불가' 글자 목록 (빗금 없음) */
.cal-body { display: flex; align-items: stretch; min-height: 0; }
.cal-body > .cal-grid { flex: 1 1 auto; min-width: 0; }
.cal-unav { flex: 0 0 210px; height: 78vh; min-height: 480px; overflow-y: auto; padding: 2px 16px 16px 4px; font-size: 12.5px; }
.cal-unav .cu-h { font-weight: 700; color: var(--muted); font-size: 12px; margin: 4px 0 8px; }
.cal-unav .cu-i { display: block; width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px dashed var(--line); padding: 6px 2px; color: var(--ink); cursor: pointer; line-height: 1.45; font: inherit; }
.cal-unav .cu-i b { color: #9B2C2C; font-weight: 700; }
.cal-unav .cu-i span { display: block; color: var(--muted); }
.cal-unav .cu-i:hover { color: var(--accent); }
.cal-unav .cu-i:hover span { color: var(--accent); }
/* v0.14f 면접관 SET — 칩 줄(면접관 넣는 곳마다) + SET 화면 */
.ivset-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 4px; }
.ivset-bar:empty { display: none; }
.ivset-lab { font-size: 11.5px; font-weight: 700; color: var(--muted); margin-right: 2px; }
.ivset-chip { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); border-radius: 999px; padding: 3px 11px; font-size: 12.5px; cursor: pointer; font-family: inherit; }
.ivset-chip em { font-style: normal; color: var(--muted); font-size: 11.5px; }
.ivset-chip i { font-style: normal; font-size: 10.5px; font-weight: 700; color: #fff; background: var(--accent); border-radius: 999px; padding: 0 6px; }
.ivset-chip.rec { border-color: var(--accent); background: var(--accent-soft); }
.ivset-chip:hover { border-color: var(--accent); color: var(--accent); }
.ivs-page { max-width: 1040px; }
.ivs-top { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.ivs-top h3 { margin: 0 0 4px; }
.ivs-top .btn { white-space: nowrap; flex: none; }
.ivs-list { display: grid; grid-template-columns: 1fr; gap: 14px; }   /* v0.14h: 한 줄에 하나, 세로로 쌓임(폭 = 페이지 폭 1040px) */
.ivs-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 2px; }
.ivs-col { min-width: 0; }
.ivs-chips .chip.ivs-drag { cursor: grab; display: inline-flex; align-items: center; gap: 4px; user-select: none; }
.ivs-chips .chip.ivs-drag .grip { font-style: normal; color: var(--muted); font-size: 11px; letter-spacing: -2px; margin-right: 2px; }
.ivs-chips .chip.ivs-drag.dragging { opacity: .4; }
.ivs-chips .chip.drop-l { box-shadow: -3px 0 0 var(--accent); }
.ivs-chips .chip.drop-r { box-shadow: 3px 0 0 var(--accent); }
.ivs-chips .chip.ivs-drag:hover { text-decoration: none; }
.slot-cc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -4px 0 10px; font-size: 12.5px; }
.slot-cc b { font-size: 12px; color: var(--muted); margin-right: 2px; }
.slot-cc .chip.iv-rm { cursor: pointer; }
.ivs-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; box-shadow: 0 1px 2px rgba(31,27,24,.04); }
.ivs-card.new { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ivs-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.ivs-title { font-size: 15px; }
.ivs-st { font-size: 11.5px; transition: color .3s; }
.ivs-st.ok { color: var(--ok, #2F7D4F); }
.ivs-grid { display: grid; grid-template-columns: 1fr 1.3fr 1fr; gap: 10px; }
.ivs-card label { display: block; font-size: 12px; color: var(--muted); }
.ivs-card select, .ivs-card input { display: block; width: 100%; margin-top: 3px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font-size: 13.5px; font-family: inherit; }
.ivs-ql { margin-top: 10px; }
.ivs-card .hits { margin: 4px 0 0; }
.ivs-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; min-height: 26px; }
.ivs-chips .chip.iv-rm { cursor: pointer; padding: 3px 10px; font-size: 12.5px; }
.ivs-chips .chip.iv-rm:hover { background: var(--accent-soft); color: var(--accent); text-decoration: line-through; }
.empty-note { padding: 30px; text-align: center; border: 1px dashed var(--line-strong); border-radius: 14px; }
.tg { overflow: visible; }
.tg .th { position: sticky; top: 0; z-index: 5; }
.queue { position: sticky; top: 56px; align-self: flex-start; height: calc(100vh - 56px); }

/* 전형 */
#view-assess { min-height: calc(100vh - 56px); }
.as-main { flex: 1; padding: 20px 24px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.q-list .card.sel { border-color: var(--accent); background: var(--accent-soft); }
.q-list .card .chip.apt { background: #E8EEF6; color: #2E4A7A; }
#asDrop.over { outline: 2px dashed var(--accent); background: var(--accent-soft); }
.as-tbl { width: 100%; border-collapse: collapse; }
.as-tbl th, .as-tbl td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.as-tbl th { color: var(--muted); font-size: 12.5px; font-weight: 600; }
.as-tbl tr.grp td { background: var(--bg); font-weight: 700; padding: 8px; }
.as-tbl select, .as-tbl input { padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; font-size: 13px; }
.as-tbl input.memo { width: 100%; min-width: 140px; }
.as-tbl .g { font-weight: 700; }
.as-tbl tr.due td { color: #9B2C2C; }
.chip.st-done { background: var(--ok-soft); color: var(--ok); }
.chip.st-missed { background: #F6E4E4; color: #9B2C2C; }
.chip.st-in_progress, .chip.st-extended, .chip.st-retake { background: var(--warn-soft); color: var(--warn); }

.cards-bar { display: flex; align-items: center; gap: 8px; margin-top: 16px; min-height: 28px; }
.card.sel { outline: 2px solid var(--accent); outline-offset: -1px; background: var(--accent-soft); }

/* 입사 예정 */
.joining { padding: 20px 24px; }
.join-cols { display: flex; gap: 12px; overflow-x: auto; margin-top: 14px; padding-bottom: 10px; }
.join-cols .col { width: 250px; }
.join-cols .col.new-date { width: 180px; border-style: dashed; }
.join-cols .col-head small { display: block; color: var(--muted); font-weight: 500; }
.join-cols .col-head.done { color: var(--muted); }
.join-cols .card .org { font-size: 12px; color: var(--ink); margin-top: 4px; }
.join-cols .card .chip.of-accepted { background: var(--ok-soft); color: var(--ok); }
.join-cols .card .chip.of-proposed, .join-cols .card .chip.of-pending_resign, .join-cols .card .chip.of-objection { background: var(--warn-soft); color: var(--warn); }
.offer-box { border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; background: var(--bg); }
.offer-hist li { color: var(--muted); font-size: 12px; }
/* 채용건 목록: 각 항목을 박스로 */
#postingList { padding: 6px 10px; }
#postingList li { background: var(--surface); border: 1px solid var(--line); margin-bottom: 6px; padding: 10px 12px; box-shadow: var(--shadow); }
#postingList li:hover { border-color: var(--line-strong); background: var(--surface); }
#postingList li.on { background: var(--accent-soft); border-color: var(--accent); }
/* 채용건 목록: 색 배경 박스 (선택 = 버건디 톤) */
#postingList li { background: var(--bg); border: 1px solid transparent; box-shadow: none; }
#postingList li:hover { background: #ECE8E1; border-color: transparent; }
#postingList li.on { background: var(--accent-soft); border-color: var(--accent-soft); }
#postingList li.on .pt { color: var(--accent-ink); }

.trash-row { display: flex; align-items: center; gap: 10px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; margin-bottom: 8px; }
#postingList li.trash { background: transparent; color: var(--muted); margin-top: 10px; }

.inline input[type=checkbox] { flex: none; min-width: 0; width: auto; margin: 0 4px 0 0; }
.inline .chk { display: inline-flex; align-items: center; gap: 4px; }
#asDrop { margin-top: 8px; padding: 20px; }
#asDrop.busy { opacity: .6; pointer-events: none; }
.as-tbl .sum { font-size: 12.5px; white-space: nowrap; }

dialog.wide { width: 980px; }
#mailDlg.wide { width: min(1140px, 96vw); } /* v0.13d: 면접관 안내 메일 본문 폭 1060px — 미리보기에서 옆 스크롤 덜 생기게 */

/* ── 위험 작업 확인 창 (포지션 카드 전체 삭제) ── */
dialog.xd { width: 440px; max-width: calc(100vw - 32px); padding: 0; border-radius: 22px; background: transparent; box-shadow: none; overflow: visible; }
dialog.xd::backdrop { background: radial-gradient(ellipse at center, rgba(40,20,24,.38), rgba(20,16,14,.62)); backdrop-filter: blur(6px) saturate(.9); animation: xdFade .28s ease both; }
dialog.xd.closing::backdrop { animation: xdFade .2s ease reverse both; }
.xd-card { position: relative; overflow: hidden; padding: 34px 32px 22px; border-radius: 22px; text-align: center;
  background: linear-gradient(180deg, #FFFFFF 0%, #FBF9F6 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 0 0 1px rgba(122,34,51,.08), 0 30px 80px -20px rgba(40,14,20,.45), 0 12px 24px -12px rgba(31,27,24,.25);
  animation: xdIn .46s cubic-bezier(.2,.9,.25,1.15) both; }
dialog.xd.closing .xd-card { animation: xdOut .2s ease-in both; }
dialog.xd.shake .xd-card { animation: xdShake .42s ease both; }
.xd-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, transparent, #B8475C 20%, var(--accent) 50%, #B8475C 80%, transparent); }
.xd-glow { position: absolute; top: -120px; left: 50%; width: 320px; height: 220px; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(184,71,92,.16), transparent); pointer-events: none; }
.xd-medal { position: relative; width: 68px; height: 68px; margin: 0 auto 16px; display: grid; place-items: center; border-radius: 50%; color: #fff;
  background: radial-gradient(circle at 30% 25%, #B8475C, var(--accent) 55%, var(--accent-ink)); box-shadow: 0 10px 24px -8px rgba(122,34,51,.6), 0 0 0 6px var(--accent-soft); animation: xdMedal .6s .08s cubic-bezier(.2,.9,.25,1.3) both; }
.xd-ring { position: absolute; inset: -6px; border-radius: 50%; border: 1.5px solid rgba(122,34,51,.35); animation: xdPulse 2.4s ease-out infinite; }
.xd-ring.r2 { animation-delay: 1.2s; }
.xd-kicker { font-size: 11px; font-weight: 700; letter-spacing: .18em; color: var(--accent); text-transform: uppercase; }
.xd-title { margin: 6px 0 6px !important; font-size: 21px; font-weight: 800; letter-spacing: -.02em; }
.xd-subject { display: inline-block; max-width: 100%; padding: 4px 12px; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: #5A524B; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xd-count { margin: 18px 0 8px; display: flex; align-items: baseline; justify-content: center; gap: 4px; }
.xd-count b { font-size: 46px; line-height: 1; font-weight: 800; letter-spacing: -.04em; font-variant-numeric: tabular-nums;
  background: linear-gradient(180deg, var(--accent) 0%, var(--accent-ink) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.xd-count span { font-size: 16px; font-weight: 700; color: var(--muted); }
.xd-names { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin: 4px 0 18px; max-height: 64px; overflow: hidden; }
.xd-names span { padding: 3px 9px; border-radius: 6px; background: #F3EFEA; color: #4A433D; font-size: 12px; animation: xdChip .35s ease both; }
.xd-names span.more { background: transparent; color: var(--muted); }
.xd-rule { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 11.5px; font-weight: 600; letter-spacing: .04em; }
.xd-rule::before, .xd-rule::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--line-strong), transparent); }
.xd-list { list-style: none; margin: 10px auto 22px; padding: 0; display: inline-flex; flex-direction: column; gap: 6px; text-align: left; }
.xd-list li { position: relative; padding-left: 22px; font-size: 13px; color: #4A433D; }
.xd-list li::before { content: ""; position: absolute; left: 2px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: var(--accent-soft); box-shadow: inset 0 0 0 1.5px rgba(122,34,51,.45); }
.xd-list li::after { content: ""; position: absolute; left: 6px; top: 8px; width: 4px; height: 4px; border-radius: 50%; background: var(--accent); }
.xd-actions { display: grid; grid-template-columns: 1fr 1.6fr; gap: 10px; }
.xd-actions button { height: 46px; border-radius: 12px; font-weight: 700; font-size: 14px; cursor: pointer; transition: transform .15s ease, box-shadow .2s ease, background .2s ease; }
.xd-cancel { border: 1px solid var(--line-strong); background: #fff; color: #4A433D; }
.xd-cancel:hover { background: var(--bg); }
.xd-hold { position: relative; overflow: hidden; border: 0; color: #fff; user-select: none; -webkit-user-select: none; touch-action: none;
  background: linear-gradient(180deg, #9A3649, var(--accent)); box-shadow: 0 8px 18px -8px rgba(122,34,51,.55), inset 0 1px 0 rgba(255,255,255,.16); }   /* v0.13m: 까만 버튼 → 버건디 (실장님 "까만 팝업 모두 바꿔줘") */
.xd-hold:hover { transform: translateY(-1px); box-shadow: 0 12px 22px -10px rgba(122,34,51,.65), inset 0 1px 0 rgba(255,255,255,.16); }
.xd-actions button:focus { outline: none; }
.xd-hold:focus-visible { box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(122,34,51,.45), 0 8px 18px -8px rgba(122,34,51,.55); }
.xd-cancel:focus-visible { box-shadow: 0 0 0 3px var(--accent-soft); border-color: rgba(122,34,51,.45); }
.xd-hold.holding { transform: scale(.98); }
.xd-fill { position: absolute; inset: 0; transform: scaleX(0); transform-origin: left center; background: linear-gradient(90deg, #3E0F1A, var(--accent-ink) 60%, #4A1320); }   /* v0.13m: 바탕이 버건디라 채워지는 막대는 더 진하게 */
.xd-hold.holding .xd-fill::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent); animation: xdSheen .9s linear infinite; }
.xd-label { position: relative; letter-spacing: .01em; }
.xd-hold.busy .xd-fill { transform: scaleX(1) !important; }
.xd-hold.busy .xd-label::before { content: ""; display: inline-block; width: 13px; height: 13px; margin: -2px 8px 0 0; vertical-align: middle; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; animation: xdSpin .7s linear infinite; }
.xd-hold.done .xd-fill { background: linear-gradient(90deg, #24563F, var(--ok)); }
.xd-hold.done .xd-label::before { content: "✓"; display: inline-block; width: auto; height: auto; margin: 0 6px 0 0; border: 0; animation: xdMedal .35s ease both; }
.xd-hint { margin-top: 12px; font-size: 11.5px; color: var(--off); }
@keyframes xdFade { from { opacity: 0; } }
@keyframes xdIn { from { opacity: 0; transform: translateY(18px) scale(.94); filter: blur(4px); } }
@keyframes xdOut { to { opacity: 0; transform: translateY(8px) scale(.97); } }
@keyframes xdMedal { from { opacity: 0; transform: scale(.4) rotate(-12deg); } }
@keyframes xdPulse { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.7); opacity: 0; } }
@keyframes xdChip { from { opacity: 0; transform: translateY(6px); } }
@keyframes xdSheen { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
@keyframes xdSpin { to { transform: rotate(360deg); } }
@keyframes xdShake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
@media (prefers-reduced-motion: reduce) { dialog.xd *, dialog.xd::backdrop { animation: none !important; } }
.mail-html { border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; max-height: 44vh; overflow: auto; background: #fff; color: var(--ink); font-size: 13.5px; }
.mail-html table { font-size: 12.5px; }
.att-list { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 14px; }
.att-list label { display: flex; gap: 6px; align-items: center; margin: 0; color: var(--ink); font-size: 13px; }
.att-list input { width: auto; display: inline; margin: 0; }
.warn { color: var(--warn); font-size: 12.5px; }
.default-submit { position: absolute; width: 0; height: 0; padding: 0; border: 0; overflow: hidden; opacity: 0; }

/* ── v0.08 지원자 이력 · 보관 · 면접 메모 ── */
.chip.prior { background: #EEF0F6; color: #4A5578; }
.chip.prior.sure { background: var(--accent-soft); color: var(--accent-ink); }
.chip.prior.iv { box-shadow: inset 0 0 0 1px currentColor; }
.chip.arch { background: var(--off-soft); color: var(--off); }
.chip.ok { background: var(--ok-soft); color: var(--ok); }
.chip.memo { background: #FFF4D6; color: #8A6212; }
.chip.warn { background: var(--warn-soft); color: var(--warn); }
b.ok { color: var(--ok); }

.prior-note { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; padding: 10px 14px; border-radius: 12px; background: linear-gradient(90deg, var(--accent-soft), #fff 80%); border: 1px solid #EBD3D7; }
.prior-note > b { color: var(--accent-ink); margin-right: 4px; }
.prior-note button { border: 1px solid #E3C9CE; background: #fff; border-radius: 999px; padding: 3px 12px; cursor: pointer; font-weight: 600; display: inline-flex; gap: 6px; align-items: baseline; }
.prior-note button.sure { border-color: var(--accent); }
.prior-note button small { color: var(--muted); font-weight: 500; }
.prior-note button:hover { background: var(--accent-soft); }
.prior-note .x { border: 0; background: transparent; font-size: 18px; color: var(--muted); padding: 0 4px; }

#view-history { display: block; }
.hist { max-width: 1180px; margin: 0 auto; padding: 22px 24px 60px; }
.hist-top { display: grid; grid-template-columns: 1.1fr 1fr; gap: 18px; align-items: stretch; }
.hist-search { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; }
.hist-search h3 { margin: 0 0 4px; }
.hist-search .hint { color: var(--muted); margin: 0 0 12px; }
.search.big { width: 100%; flex: 1; padding: 10px 16px; font-size: 15px; }
.dropzone.slim { padding: 18px 20px; display: flex; flex-direction: column; justify-content: center; }
.memo-out { margin: 14px 0 0; padding: 0; list-style: none; }
.memo-out li { display: flex; gap: 10px; align-items: baseline; padding: 6px 10px; border-bottom: 1px solid var(--line); cursor: pointer; }
.memo-out li.sum { cursor: default; background: var(--surface); border-radius: 8px; border: 1px solid var(--line); }
.memo-out li.bad .r { color: #9B2C2C; }
.memo-out li.skip { opacity: .6; }
.memo-out li:hover:not(.sum) { background: var(--accent-soft); }
#hList { margin-top: 18px; }
.hp { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; margin-bottom: 14px; box-shadow: var(--shadow); }
.hp-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.hp-head .nm { font-size: 17px; }
.hp-head .t, .hp-tbl .t { color: var(--muted); font-size: 12.5px; }
.hp-tbl { border-radius: 8px; }
.hp-tbl tr[data-open] { cursor: pointer; }
.hp-tbl tr[data-open]:hover td { background: #FBF8F5; }
.hp-tbl tr.arch td { color: var(--off); }
.hp-bar { margin-bottom: 10px; }
.nm-only { color: var(--warn); font-weight: 600; }
.memo-link { display: inline-block; padding: 1px 8px; border-radius: 6px; background: #FFF4D6; color: #8A6212; font-size: 12px; font-weight: 700; text-decoration: none; }
.memo-link:hover { background: #FBE7B0; }

.arch-banner { display: flex; align-items: center; gap: 8px; margin: 10px 0 4px; padding: 10px 14px; border-radius: 10px; background: var(--off-soft); border: 1px solid var(--line-strong); }
.arch-banner div { display: flex; flex-direction: column; min-width: 0; }
.arch-banner .btn, .hist-sec .btn { white-space: nowrap; flex: none; }
.arch-banner span { color: var(--muted); font-size: 12.5px; }
.memo-bar { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin: 10px 0 0; padding: 8px 12px; border-radius: 10px; background: #FFF8E6; border: 1px solid #F1DFAF; }
.memo-bar b { color: #8A6212; }
.memo-bar a { color: #6B4A0B; font-weight: 600; }
.hist-sec { margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #F7F5FA; border: 1px solid #E3DFEC; }
.hist-sec h4 { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; color: #4A5578; }
.hist-sec ul { list-style: none; margin: 0; padding: 0; }
.hist-sec li { display: flex; gap: 10px; align-items: flex-start; padding: 7px 0; border-top: 1px solid #E8E4F0; cursor: pointer; }
.hist-sec li:first-child { border-top: 0; }
.hist-sec li.arch .what b { color: var(--off); }
.hist-sec .when { color: var(--muted); font-size: 12px; white-space: nowrap; padding-top: 2px; }
.hist-sec .what { flex: 1; }
.hist-sec .what .t { color: var(--muted); font-size: 12px; }
.hist-sec .m { font-size: 11.5px; white-space: nowrap; color: var(--muted); }
.hist-sec .m.phone { color: var(--accent-ink); font-weight: 700; }
.hist-sec .m.name { color: var(--warn); }
@media (max-width: 900px) { .hist-top { grid-template-columns: 1fr; } }

/* ── v0.08a 보고 버튼 선택 · 토스트 ── */
#rpOut.loading { opacity: .5; }
.toast { position: fixed; z-index: 9999; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 8px; border-radius: 999px; background: rgba(255,255,255,.98); color: var(--ink); border: 1px solid var(--line); font-size: 13px; font-weight: 600; box-shadow: 0 12px 30px rgba(31,27,24,.14), 0 2px 6px rgba(31,27,24,.06); opacity: 0; transform: translateY(6px) scale(.96); transition: opacity .22s ease, transform .22s cubic-bezier(.2,.9,.3,1.3); pointer-events: none; white-space: nowrap; }
.toast.show { opacity: 1; transform: translateY(0) scale(1); }
.toast.center { left: 50%; top: 72px; margin-left: -80px; }
/* v0.13l(실장님 요청 26.09.22 "까만색 팝업 안 어울리고 안 예뻐 — 모두 바꿔줘"): 흰 바탕·연한 테두리·부드러운 그림자, 아이콘은 연한 초록(완료)·연한 노랑(주의) */
.toast i { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--ok-soft); color: var(--ok); font-style: normal; font-size: 12px; font-weight: 800; }
.toast.warn { border-color: #EBD9B4; }
.toast.warn i { background: var(--warn-soft); color: var(--warn); }

/* ── v0.09 문구·양식 편집 ── */
dialog.tpl-dlg { width: min(1560px, 97vw); height: 94vh; max-height: 94vh; padding: 0; border-radius: 16px; overflow: hidden; background: var(--bg); }
.tpl-shell { display: flex; flex-direction: column; height: 100%; }
.tpl-hd { display: flex; align-items: center; gap: 10px; padding: 12px 18px; background: var(--surface); border-bottom: 1px solid var(--line); }
.tpl-hd > .btn { flex: none; white-space: nowrap; }
.tpl-title { display: flex; flex-direction: column; margin-right: 10px; }
.tpl-title b { font-size: 16px; }
.tpl-title small { color: var(--muted); font-size: 11.5px; }
.tpl-title code, .tpl-help code { background: var(--accent-soft); color: var(--accent-ink); padding: 0 4px; border-radius: 4px; font-size: 11.5px; }
.tpl-kinds { display: flex; gap: 8px; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.tpl-title small { white-space: nowrap; }
.tk-g { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border-radius: 10px; background: var(--bg); }
.tk-g em { font-style: normal; font-size: 10.5px; color: var(--muted); padding: 0 6px; }
.tk-g button { border: 0; background: transparent; padding: 5px 10px; border-radius: 7px; cursor: pointer; font-size: 12.5px; color: var(--muted); font-weight: 600; }
.tk-g button.on { background: var(--surface); color: var(--accent-ink); box-shadow: 0 1px 3px rgba(31,27,24,.12); }
.tpl-dirty { font-size: 12px; color: var(--muted); }
.tpl-dirty.on { color: var(--warn); font-weight: 700; }
.tpl-body { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(360px, 1.05fr) minmax(330px, .95fr) minmax(380px, 1.15fr); gap: 0; }
.tpl-col { min-height: 0; overflow: auto; padding: 14px 16px 30px; border-right: 1px solid var(--line); }
.tpl-col:last-child { border-right: 0; }
.tpl-colhd { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 10px; }
.tpl-colhd small { color: var(--muted); font-size: 11.5px; }
.tpl-metarow { display: grid; grid-template-columns: 1fr 180px; gap: 8px; }
.tpl-metarow label, .co-grid label, .ve-row label, .ve-l { display: block; font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.tpl-metarow input, .co-grid input, .ve-row input, .ve-row select, .ve-l input, .ve-l select { display: block; width: 100%; margin-top: 3px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); font-size: 13.5px; }
.ve-l input.short { width: 120px; }
.tpl-doctabs { display: flex; gap: 4px; margin-bottom: 6px; }
.tpl-doctabs button, .tpl-pvtabs button { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 3px 12px; font-size: 12px; cursor: pointer; color: var(--muted); font-weight: 600; }
.tpl-doctabs button.on, .tpl-pvtabs button.on { background: var(--accent); border-color: var(--accent); color: #fff; }   /* v0.13m 까만 탭 → 버건디 */
.tpl-chips { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-bottom: 6px; }
.tpl-chips .lb { font-size: 11px; color: var(--muted); margin: 0 2px 0 6px; }
.tpl-chips .lb:first-child { margin-left: 0; }
.tpl-chips button { border: 1px solid var(--line); background: var(--surface); border-radius: 6px; padding: 1px 7px; font-size: 12px; cursor: pointer; color: var(--ink); }
.tpl-chips button:hover { border-color: var(--ink); }
.tpl-chips .chip-v { background: var(--accent-soft); border-color: #E7CDD2; color: var(--accent-ink); font-weight: 600; }
.tpl-chips .chip-v.blk::before { content: '▤ '; font-weight: 400; }
#tplText { width: 100%; min-height: 46vh; resize: vertical; padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: 10px; background: #FFFEFC; font-family: "D2Coding", "JetBrains Mono", Consolas, var(--font); font-size: 13px; line-height: 1.7; color: var(--ink); }
#tplText.short { min-height: 110px; }
#tplText:focus { outline: 2px solid var(--accent-soft); border-color: var(--accent); }
.tpl-help { margin: 8px 0 14px; font-size: 12px; color: var(--muted); }
.tpl-help summary { cursor: pointer; font-weight: 600; }
.tpl-help p { margin: 6px 0; line-height: 1.6; }
.tpl-sec { margin-top: 16px; }
.tpl-varlist { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.tpl-varlist li { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); cursor: pointer; }
.tpl-varlist li:hover { border-color: var(--line-strong); }
.tpl-varlist li.on { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.tpl-varlist li div { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.tpl-varlist li b { color: var(--accent-ink); font-size: 13px; }
.tpl-varlist li small { color: var(--muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tpl-varlist .unused { font-size: 10.5px; color: var(--warn); background: var(--warn-soft); border-radius: 999px; padding: 0 7px; }
.tpl-varlist .empty-li { cursor: default; color: var(--muted); font-size: 12.5px; }
.tpl-dlg .x { border: 0; background: transparent; color: var(--muted); font-size: 16px; cursor: pointer; padding: 0 4px; line-height: 1; }
.tpl-dlg .x:hover { color: #9B2C2C; }
.tpl-varedit { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }
.ve-empty { color: var(--muted); text-align: center; padding: 30px 10px; font-size: 13px; line-height: 1.7; }
.ve-row { display: grid; grid-template-columns: 1fr 1.2fr; gap: 8px; }
.ve-opts { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 4px 0 10px; }
.ve-fmt { margin-bottom: 10px; }
.ve-fl { font-size: 12px; color: var(--muted); margin: 8px 0 3px; font-weight: 600; }
.ve-fmt textarea { width: 100%; resize: vertical; padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; font-family: "D2Coding", Consolas, var(--font); font-size: 12.5px; line-height: 1.6; background: #FFFEFC; }
.ve-ph { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; }
.ve-ph button { border: 1px dashed var(--line-strong); background: transparent; border-radius: 5px; padding: 0 6px; font-size: 11px; color: var(--muted); cursor: pointer; }
.ve-ph button:hover { border-style: solid; color: var(--accent-ink); border-color: var(--accent); }
.ve-cols { list-style: none; margin: 0; padding: 0; max-height: 260px; overflow: auto; border: 1px solid var(--line); border-radius: 8px; }
.ve-cols li { display: flex; align-items: center; padding: 3px 8px; border-bottom: 1px solid var(--line); }
.ve-cols li:last-child { border-bottom: 0; }
.ve-cols small { color: var(--off); margin-left: 4px; }
.ve-cols button, .ve-term button, .ar-hd button { border: 1px solid var(--line); background: var(--surface); border-radius: 5px; padding: 0 6px; cursor: pointer; font-size: 11px; }
.ve-terms { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.ve-term { display: grid; grid-template-columns: 110px 1fr auto auto auto; gap: 4px; align-items: center; }
.ve-term input { padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; font-size: 12.5px; min-width: 0; }
.cg { border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; margin: 8px 0; background: #FCFBF9; }
.cg-hd { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 4px; font-size: 12px; font-weight: 700; color: var(--ink); }
.cg-hd small { font-weight: 500; color: var(--muted); font-size: 11px; }
.cr { display: grid; grid-template-columns: minmax(90px, 1fr) minmax(90px, 1fr) auto; gap: 4px; align-items: center; padding: 5px 0; border-top: 1px dashed var(--line); }
.cr select, .cr input { padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; font-size: 12.5px; background: var(--surface); min-width: 0; }
.cr .cv { grid-column: 1 / -1; }
.cr .cv input { width: 100%; }
.cr .cv input.num { width: 90px; }
.pills { display: flex; flex-wrap: wrap; gap: 3px; }
.pills button { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 1px 9px; font-size: 11.5px; cursor: pointer; color: var(--muted); }
.pills button.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.cg-add { border: 0; background: transparent; color: var(--accent-ink); font-size: 12px; font-weight: 600; cursor: pointer; padding: 4px 0 0; }
.ar { border: 1px solid var(--line); border-radius: 10px; background: var(--surface); padding: 8px 10px; margin-bottom: 6px; }
.ar.off { opacity: .55; }
.ar-hd { display: grid; grid-template-columns: auto 130px 1fr auto auto auto; gap: 4px; align-items: center; }
.ar-hd select, .ar-hd input { padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; font-size: 12.5px; min-width: 0; }
.ar-hd .al { font-size: 12.5px; }
.ar .cg { margin: 6px 0 0; }
label.upl { cursor: pointer; }
.co-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 8px; }
.tpl-ctx { display: inline-flex; gap: 4px; align-items: center; font-size: 12px; }
.tpl-ctx input, .tpl-ctx select { padding: 3px 6px; border: 1px solid var(--line); border-radius: 6px; font-size: 12px; max-width: 200px; }
.tpl-pvtabs { display: flex; gap: 4px; margin-bottom: 8px; }
.tpl-preview { position: relative; }
.pv-text { margin: 0; white-space: pre-wrap; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; font-family: var(--font); font-size: 13.5px; line-height: 1.75; color: var(--ink); min-height: 50vh; }
.pv-copy { position: absolute; top: 8px; right: 8px; }
.pv-frame { width: 100%; height: 72vh; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.pv-subj { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; margin-bottom: 8px; font-weight: 600; font-size: 13.5px; }
.pv-subj small { display: block; color: var(--muted); font-weight: 500; font-size: 11px; }
.pv-att { list-style: none; margin: 0; padding: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.pv-att li { padding: 8px 12px; border-bottom: 1px solid var(--line); display: flex; gap: 8px; align-items: center; font-size: 13px; }
.pv-att li:last-child { border-bottom: 0; }
.pv-err { color: #9B2C2C; background: #F8E9E9; border-radius: 10px; padding: 12px; }
.pv-empty { color: var(--muted); padding: 40px; text-align: center; }
@media (max-width: 1100px) { .tpl-body { grid-template-columns: 1fr; overflow: auto; } .tpl-col { overflow: visible; border-right: 0; border-bottom: 1px solid var(--line); } }
/* 오퍼레터 발송 창 */
.ol-name { color: var(--accent-ink); }
.ol-html { max-height: 50vh; padding: 0; }
.ol-html > div { padding: 18px 10px !important; }

/* ── v0.10 카드 목록 필터 · 목록 보기 · 페이지 · 끝난 칸 접기 · 마감 포지션 ── */
.card-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 18px; padding: 10px 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.card-filter:empty { display: none; }
.card-filter .cf { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--muted); }
.card-filter select, .card-filter input[type=date] { padding: 4px 8px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); font-size: 13px; color: var(--ink); }
.card-filter select:disabled { opacity: .5; }
.card-filter em { font-style: normal; color: var(--muted); }
.card-filter .seg button { font-size: 12.5px; padding: 5px 12px; white-space: nowrap; }
.card-filter .cf-note { font-size: 12.5px; color: var(--accent-ink); background: var(--accent-soft); border-radius: 999px; padding: 2px 10px; }
.cards-bar { margin-top: 10px; }
#cards.as-list { display: block; }
.clist { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; font-size: 13px; }
.clist thead th:first-child { border-top-left-radius: 12px; }
.clist thead th:last-child { border-top-right-radius: 12px; }
.clist th { position: sticky; top: -20px; z-index: 2; box-shadow: 0 1px 0 var(--line); text-align: left; font-weight: 600; font-size: 12px; color: var(--muted); background: #FAF8F5; padding: 9px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.clist td { padding: 8px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.clist tr:last-child td { border-bottom: 0; }
.clist .crow { cursor: pointer; transition: background .12s; }
.clist .crow:hover td { background: #FBF8F5; }
.clist .crow.sel td { background: var(--accent-soft); }
.clist .crow.faded td { color: var(--off); }
.clist .crow.new td { animation: rowIn 1.6s ease; }
@keyframes rowIn { from { background: #F3E3E6; } }
.clist td.nm { white-space: nowrap; }
.clist td.nm b { margin-right: 6px; }
.clist td.nm .chip, .clist td.nm .nx { margin-left: 4px; vertical-align: 1px; }
.clist .t { color: var(--muted); font-size: 12px; white-space: nowrap; }
.pager { display: flex; align-items: center; gap: 4px; margin: 16px 0 30px; padding: 10px 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.pager .pg-info { font-size: 13px; color: var(--muted); }
.pager .pg-info b { color: var(--ink); }
.pager button { min-width: 32px; height: 30px; border: 1px solid var(--line); background: var(--surface); border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--ink); }
.pager button:hover:not(:disabled) { border-color: var(--ink); }
.pager button.on { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 700; }
.pager button:disabled { opacity: .35; cursor: default; }
.pager .gap { color: var(--muted); padding: 0 2px; }
.pager select { margin-left: 8px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 7px; font-size: 12.5px; }
/* 접힌 이탈·입사 칸 */
#cards.lanes .lane.folded { width: 64px; flex: none; cursor: pointer; background: repeating-linear-gradient(-45deg, var(--surface), var(--surface) 6px, #F7F4F0 6px, #F7F4F0 12px); }
#cards.lanes .lane.folded .col-head { flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px; }
#cards.lanes .lane.folded .col-head span:first-child { writing-mode: vertical-rl; letter-spacing: 3px; }
#cards.lanes .lane.folded .col-head span:first-child::before { margin-bottom: 4px; }
#cards.lanes .lane.folded .col-body { display: none; }
#cards.lanes .lane.folded:hover { border-color: var(--line-strong); }
.lane .fold-note { font-size: 11px; color: var(--muted); text-align: center; line-height: 1.5; padding: 4px 2px 12px; }
.col-head.foldable { cursor: pointer; user-select: none; }
.col-head .fold-ic { font-style: normal; color: var(--muted); font-size: 15px; line-height: 1; margin-left: 4px; }
.col-head.foldable:hover .fold-ic { color: var(--accent); }
#cards.lanes .lane.folded.over { width: 90px; }
/* 마감 포지션 접기 */
#postingList li.closed-head { background: transparent; margin-top: 12px; padding: 6px 10px; color: var(--muted); border-top: 1px solid var(--line); border-radius: 0; }
#postingList li.closed-head:hover { background: transparent; color: var(--ink); }
#postingList li.closed-head .pt { font-weight: 600; font-size: 13px; }
#postingList li.closed-head i { font-style: normal; display: inline-block; width: 12px; }
#postingList li.closed-head b { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px; border-radius: 999px; background: var(--off-soft); color: var(--muted); font-size: 11.5px; text-align: center; }
#postingList .closed-group { animation: cgIn .2s ease; }
@keyframes cgIn { from { opacity: 0; transform: translateY(-4px); } }
#postingList li.closed .pt { text-decoration: none; color: var(--muted); }
#postingList li.closed.on .pt { color: var(--accent-ink); }
/* 마감 정리 창 */
dialog.cl-dlg { width: 560px; max-width: calc(100vw - 32px); padding: 0; border-radius: 18px; overflow: hidden; }
dialog.cl-dlg::backdrop { background: rgba(31,27,24,.42); backdrop-filter: blur(3px); }
.cl-card { padding: 24px 26px 20px; border-top: 4px solid var(--accent); }
.cl-kicker { font-size: 11px; font-weight: 700; letter-spacing: 2px; color: var(--accent); }
.cl-card h3 { margin: 4px 0 10px; font-size: 20px; }
.cl-lead { margin: 0 0 14px; font-size: 13.5px; line-height: 1.7; color: var(--ink); }
.cl-lead span { color: var(--muted); font-size: 12.5px; }
.cl-bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--bg); border-radius: 10px 10px 0 0; border: 1px solid var(--line); border-bottom: 0; flex-wrap: wrap; }
.cl-reason { font-size: 12.5px; color: var(--muted); display: inline-flex; gap: 6px; align-items: center; }
.cl-bar select, .cl-bar input { padding: 4px 8px; border: 1px solid var(--line); border-radius: 7px; font-size: 13px; }
.cl-list { list-style: none; margin: 0 0 16px; padding: 0; max-height: 42vh; overflow: auto; border: 1px solid var(--line); border-radius: 0 0 10px 10px; }
.cl-list li { border-bottom: 1px solid var(--line); }
.cl-list li:last-child { border-bottom: 0; }
.cl-list label { display: flex; align-items: center; gap: 8px; padding: 8px 12px; cursor: pointer; }
.cl-list label:hover { background: #FBF8F5; }
.cl-list .t { color: var(--muted); font-size: 12px; }
.cl-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cl-actions .btn:disabled { opacity: .45; cursor: default; }

/* ── v0.10a 가운데 팝업 (알림·확인·입력·사유) ── */
dialog.ui-pop { width: 420px; }
.ui-pop .ui-msg { margin: 8px auto 4px; max-width: 340px; font-size: 13.5px; line-height: 1.7; color: #4A433D; white-space: pre-line; word-break: keep-all; }
.ui-pop .ui-msg.long { max-width: none; max-height: 38vh; overflow: auto; text-align: left; padding: 10px 14px; border-radius: 10px; background: #F7F4F0; border: 1px solid var(--line); font-size: 13px; }
.ui-pop .ui-in { display: block; width: 100%; margin: 14px 0 2px; padding: 11px 14px; border: 1px solid var(--line-strong); border-radius: 12px; font-size: 14.5px; background: #fff; text-align: left; transition: border-color .15s, box-shadow .15s; }
.ui-pop textarea.ui-in { resize: vertical; font-family: inherit; line-height: 1.6; }
.ui-pop .ui-in:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.ui-pop .ui-err { margin: 6px 0 0; font-size: 12px; color: #9B2C2C; }
.ui-pop .xd-actions { margin-top: 20px; }
.ui-pop .xd-actions.one { grid-template-columns: 1fr; }
.ui-pop .ui-ok { cursor: pointer; }
.ui-pop .ui-ok:active { transform: scale(.98); }
.ui-pop .ui-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 16px 0 4px; }
.ui-pop .ui-chips button { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: #fff; color: var(--ink); font-size: 13.5px; font-weight: 600; cursor: pointer; animation: xdChip .3s ease both; transition: background .15s, border-color .15s, color .15s, transform .12s; }
.ui-pop .ui-chips button:hover, .ui-pop .ui-chips button:focus-visible { outline: none; background: var(--accent); border-color: var(--accent); color: #fff; transform: translateY(-1px); }
.ui-pop .ui-or { display: flex; align-items: center; gap: 10px; margin: 14px 0 0; color: var(--muted); font-size: 11.5px; font-weight: 600; }
.ui-pop .ui-or::before, .ui-pop .ui-or::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--line-strong), transparent); }
.ui-pop .ui-or + .ui-in { margin-top: 8px; }
/* 톤별 메달 색 */
/* v0.13m(실장님 지적 "확인 창이 아직도 까매"): 확인·안내·입력 창도 테마 버건디 — 메달은 밝은 버건디, 링·윗선·빛도 버건디 */
.ui-pop.tone-info .xd-medal, .ui-pop.tone-ask .xd-medal, .ui-pop.tone-input .xd-medal { background: radial-gradient(circle at 30% 25%, #C9677A, #A13A4E 55%, var(--accent)); box-shadow: 0 10px 24px -8px rgba(122,34,51,.45), 0 0 0 6px var(--accent-soft); }
.ui-pop.tone-info .xd-ring, .ui-pop.tone-ask .xd-ring, .ui-pop.tone-input .xd-ring { border-color: rgba(122,34,51,.30); }
.ui-pop.tone-info .xd-kicker, .ui-pop.tone-ask .xd-kicker, .ui-pop.tone-input .xd-kicker { color: var(--accent); }
.ui-pop.tone-ok .xd-medal { background: radial-gradient(circle at 30% 25%, #4E9A74, var(--ok) 55%, #1F4A36); box-shadow: 0 10px 24px -8px rgba(47,107,79,.55), 0 0 0 6px var(--ok-soft); }
.ui-pop.tone-warn .xd-medal { background: radial-gradient(circle at 30% 25%, #D9A04A, var(--warn) 55%, #7E5213); box-shadow: 0 10px 24px -8px rgba(183,121,31,.55), 0 0 0 6px var(--warn-soft); }
.ui-pop.tone-warn .xd-ring { border-color: rgba(183,121,31,.35); }
.ui-pop.tone-warn .xd-kicker { color: var(--warn); }
.ui-pop.tone-info .xd-card::before, .ui-pop.tone-ask .xd-card::before, .ui-pop.tone-input .xd-card::before { background: linear-gradient(90deg, transparent, #C9677A 25%, var(--accent) 50%, #C9677A 75%, transparent); }
.ui-pop.tone-warn .xd-card::before { background: linear-gradient(90deg, transparent, #E3B368 25%, var(--warn) 50%, #E3B368 75%, transparent); }
.ui-pop.tone-info .xd-glow, .ui-pop.tone-ask .xd-glow, .ui-pop.tone-input .xd-glow { background: radial-gradient(closest-side, rgba(184,71,92,.14), transparent); }
.ui-pop.tone-warn .xd-glow { background: radial-gradient(closest-side, rgba(183,121,31,.16), transparent); }

/* ── v0.10b 지원자 이력 포지션별 보기 ── */
.hist-search .inline .seg + .seg { margin-left: 2px; }
#hView button { white-space: nowrap; }
.hpp { padding: 0; overflow: hidden; }
.hpp .hp-head { margin: 0; padding: 12px 16px; cursor: pointer; align-items: center; background: linear-gradient(180deg, #FFFFFF, #FBF9F6); border-bottom: 1px solid var(--line); user-select: none; }
.hpp .hp-head:hover { background: #F8F5F1; }
.hpp .hp-head .nm { font-size: 15.5px; }
.hpp-ic { font-style: normal; color: var(--muted); width: 12px; display: inline-block; }
.hpp .hpp-all { margin: 0 2px 0 0; width: 15px; height: 15px; }
.hpp-st { display: inline-flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.hpp .hp-tbl { border: 0; border-radius: 0; }
.hpp.folded .hp-tbl { display: none; }
.hpp.folded .hp-head { border-bottom: 0; }
.chip.pst-open { background: var(--ok-soft); color: var(--ok); }
.chip.pst-closed { background: var(--off-soft); color: var(--muted); }
.chip.pst-trashed { background: #F6E4E4; color: #9B2C2C; }

/* ── v0.10c 포지션 끌어서 순서 바꾸기 ── */
#postingList li[draggable="true"] { cursor: grab; padding-left: 22px; }
#postingList li[draggable="true"]:active { cursor: grabbing; }
#postingList li .grip { position: absolute; left: 6px; top: 50%; transform: translateY(-50%); font-size: 11px; letter-spacing: -2px; color: var(--line-strong); opacity: 0; transition: opacity .15s; user-select: none; }
#postingList li:hover .grip { opacity: 1; }
#postingList li.dragging { opacity: .35; }
#postingList.pst-dragging li:not(.dragging):not(.pst-ph) .edit { visibility: hidden; }
#postingList li.pst-ph { height: 0; min-height: 0; padding: 0 !important; margin: 2px 4px 8px !important; border: 0 !important; border-top: 2px solid var(--accent) !important; border-radius: 2px; background: transparent !important; box-shadow: 0 0 0 2px rgba(122,34,51,.08); cursor: default; position: relative; }
#postingList li.pst-ph::before { content: ""; position: absolute; left: -4px; top: -5px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
#postingList li.moved { animation: pstMoved 1.2s ease; }
@keyframes pstMoved { from { box-shadow: 0 0 0 2px var(--accent); background: var(--accent-soft); } }

/* ── v0.10d 통화 결과 하위 화면 가운데 + 다른 일정 요청 달력 ── */
.cm-dim { position: fixed; inset: 0; z-index: 59; background: rgba(31,27,24,.28); animation: cmDimIn .16s ease-out both; }
@keyframes cmDimIn { from { opacity: 0; } }
.cm.center { left: 50%; top: 50%; transform: translate(-50%, -50%); width: 360px; max-width: calc(100vw - 24px); max-height: calc(100vh - 24px); overflow-y: auto; padding: 10px; animation: cmInC .18s ease-out both; }
@keyframes cmInC { from { opacity: 0; transform: translate(-50%, calc(-50% + 6px)) scale(.98); } }
.cm-who { margin-left: auto; font-size: 12px; color: var(--muted); }
.cc { margin: 4px 4px 0; padding: 8px 8px 6px; border: 1px solid var(--line); border-radius: 11px; background: #FCFBF9; }
.cc-hd { display: flex; align-items: center; justify-content: space-between; padding: 0 2px 6px; }
.cc-hd b { font-size: 13.5px; }
.cc-nav { width: 26px; height: 26px; border: 0; border-radius: 7px; background: transparent; font-size: 17px; line-height: 1; color: var(--muted); cursor: pointer; }
.cc-nav:hover:not(:disabled) { background: var(--bg); color: var(--ink); }
.cc-nav:disabled { opacity: .3; cursor: default; }
.cc-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.cc-wd { font-size: 11px; font-weight: 600; color: var(--muted); padding: 2px 0 4px; }
.cc-wd.sun, .cc-d.sun { color: #B4455A; }
.cc-wd.sat, .cc-d.sat { color: #4F6FA5; }
.cc-d { height: 29px; border: 0; border-radius: 8px; background: transparent; font-size: 13px; cursor: pointer; font-variant-numeric: tabular-nums; }
.cc-d:hover:not(:disabled) { background: var(--accent-soft); }
.cc-d:disabled { color: #CFC8BE !important; cursor: default; }
.cc-d.today { box-shadow: inset 0 0 0 1px var(--line-strong); font-weight: 700; }
.cc-d.on { background: var(--accent) !important; color: #fff !important; font-weight: 700; box-shadow: none; }
.cc-hint { font-weight: 500; letter-spacing: 0; color: #B0A89E; }
.cc-times { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; padding: 0 6px; }
.cc-times.off, .cc-qual.off { opacity: .4; pointer-events: none; }
.cc-t { padding: 3px 0; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 12px; cursor: pointer; font-variant-numeric: tabular-nums; }
.cc-t:hover { border-color: var(--accent); color: var(--accent); }
.cc-t.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.cc-any { grid-column: span 2; }
.cc-qual { display: flex; gap: 0; margin: 8px 6px 0; border: 1px solid var(--line-strong); border-radius: 8px; overflow: hidden; }
.cc-qual button { flex: 1; padding: 5px 0; border: 0; background: #fff; font-size: 12.5px; cursor: pointer; }
.cc-qual button + button { border-left: 1px solid var(--line); }
.cc-qual button.on { background: var(--accent-soft); color: var(--accent-ink); font-weight: 700; }
.cc-sel { display: flex; align-items: center; gap: 8px; margin: 10px 6px 0; padding: 7px 7px 7px 10px; border-radius: 9px; background: var(--bg); }
.cc-now { flex: 1; font-size: 13.5px; font-weight: 700; color: var(--accent-ink); }
.cc-now.none { font-weight: 500; color: #B0A89E; font-size: 12.5px; }
.cc-now.shake { animation: ccShake .35s; }
@keyframes ccShake { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.cc-add { border: 1px solid var(--line-strong); background: #fff; border-radius: 999px; padding: 3px 10px; font-size: 12px; cursor: pointer; white-space: nowrap; }
.cc-add:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.cc-add:disabled { opacity: .45; cursor: default; }
.cc-picks { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 6px 0; }
.cc-pick { display: inline-flex; align-items: center; gap: 4px; padding: 3px 4px 3px 10px; border-radius: 999px; background: var(--warn-soft); color: #8A5A12; font-size: 12.5px; font-weight: 600; }
.cc-pick button { width: 18px; height: 18px; border: 0; border-radius: 50%; background: transparent; color: inherit; line-height: 1; cursor: pointer; }
.cc-pick button:hover { background: rgba(138,90,18,.15); }
.cc-freebtn { display: block; margin: 10px 6px 0; padding: 0; border: 0; background: none; font-size: 12px; color: var(--muted); cursor: pointer; }
.cc-freebtn small { color: #B0A89E; }
.cc-freebtn:hover { color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .cm.center, .cm-dim, .cc-now.shake { animation: none; } }
/* v0.12c 다른 일정 요청: 날짜 방식·시간대 */
.cm.center.alt { width: 404px; }
.cc-seg { display: flex; margin: 6px 4px 0; padding: 3px; gap: 3px; border-radius: 10px; background: var(--bg); }
.cc-seg button { flex: 1; min-width: 0; padding: 5px 2px; border: 0; border-radius: 7px; background: transparent; font-size: 12.5px; color: var(--muted); cursor: pointer; line-height: 1.25; }
.cc-seg button b { display: block; font-weight: 700; }
.cc-seg button small { display: block; font-size: 10.5px; color: #B0A89E; }
.cc-seg button:hover { color: var(--ink); }
.cc-seg button.on { background: #fff; color: var(--accent-ink); box-shadow: 0 1px 3px rgba(31,27,24,.14); font-weight: 700; }
.cc-seg button.on small { color: var(--accent); }
.cc-seg.off { opacity: .4; pointer-events: none; }
.cc-tmode { margin: 0 6px; }
.cc-dmode + .cc { margin-top: 8px; }
.cc-d.in { background: var(--accent-soft); color: var(--accent-ink); border-radius: 0; }
.cc-d.on.r-start { border-radius: 8px 0 0 8px; }
.cc-d.on.r-end { border-radius: 0 8px 8px 0; }
.cc-guide { margin: 6px 2px 0; font-size: 11.5px; color: var(--muted); text-align: center; }
.cc-times2 { margin: 8px 6px 0; display: flex; flex-direction: column; gap: 6px; }
.cc-times2.off { opacity: .4; pointer-events: none; }
.cc-trow { display: flex; align-items: flex-start; gap: 6px; }
.cc-tl { flex: none; width: 30px; padding-top: 4px; font-size: 11.5px; font-weight: 700; color: var(--muted); }
.cc-trow .cc-times { flex: 1; padding: 0; grid-template-columns: repeat(5, 1fr); }

/* ── v0.10e 카드 연락처 ── */
.tel-box { display: inline-flex; align-items: center; gap: 2px; vertical-align: middle; }
.tel-no { color: var(--ink); text-decoration: none; font-variant-numeric: tabular-nums; letter-spacing: .1px; border-radius: 5px; padding: 1px 4px; margin-left: -4px; cursor: copy; transition: background .15s, color .15s; }
.tel-no:hover { background: var(--accent-soft); color: var(--accent-ink); }
.tel-no.copied { background: var(--ok-soft); color: var(--ok); }
.tel-call { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: var(--accent); text-decoration: none; transition: background .15s, color .15s; }
.tel-call:hover { background: var(--accent); color: #fff; }
.card .tel { margin-top: 5px; font-size: 13.5px; font-weight: 600; line-height: 22px; }
.card.has-photo .tel { margin-right: 56px; }
.col .card .tel { font-size: 12.5px; margin-top: 3px; }
.clist td.tel-td { white-space: nowrap; font-size: 13px; }
.clist td.tel-td .warn { color: var(--warn); }
.d-head .d-tel { margin-left: 8px; font-size: 15px; font-weight: 600; }
.d-head .d-tel .tel-no { margin-left: 0; }
@media (pointer: coarse) { .tel-no { cursor: pointer; } }

/* ── v0.11 1차 / 2차 면접 (2차는 보라 계열로 구분) ── */
:root { --r2: #5B4B8A; --r2-soft: #EEEAF6; }
.chip.st-round2, .chip.rd2 { background: var(--r2-soft); color: var(--r2); }
.chip.rd2.ghost { background: transparent; box-shadow: inset 0 0 0 1px #CFC6E6; }
.chip.rdone { background: var(--ok-soft); color: var(--ok); }
.lane-round2 .col-head span:first-child::before { background: var(--r2); }
.lane-round2 .col-body { background: linear-gradient(180deg, rgba(91,75,138,.04), transparent 120px); border-radius: 10px; }
b.rd2 { display: inline-block; padding: 0 5px; border-radius: 4px; background: var(--r2); color: #fff; font-size: 10.5px; line-height: 15px; font-weight: 700; vertical-align: 1px; }
.slot.r2 { background: var(--sb, var(--r2-soft)); border-left-color: var(--sc, var(--r2)); border-left-style: double; border-left-width: 5px; }
.slot.r2 .t { color: var(--sc, var(--r2)); }
/* v0.12o 부서 색(--sc/--sb)은 인라인으로 붙지만, 빈 조·선택한 조는 예전처럼 보여야 하므로 여기서 다시 덮는다 */
.slot.empty, .slot.r2.empty { background: repeating-linear-gradient(135deg, #F6F4F1 0 6px, #EFECE8 6px 12px); border-left-color: var(--off); }
.slot.empty .t, .slot.empty .d { color: var(--muted); }
.slot.sel, .slot.r2.sel { background: var(--accent-soft); border-left-color: var(--accent); }
.slot.sel .t, .slot.sel .d { color: var(--accent); }
/* 부서 색 범례 */
.cal-legend { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.cal-legend .lg { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px 1px 6px; border-radius: 999px; font-size: 11.5px; font-weight: 600;
  background: var(--sb); color: var(--sc); border-left: 3px solid var(--sc); }
/* 슬롯 창 면접관 검색줄 */
.ivbar { gap: 6px; }
.ivbar input { flex: 1; min-width: 0; }
#slotIvHits li.on { background: var(--accent-soft); outline: 2px solid var(--accent); outline-offset: -2px; border-radius: 8px; }
#slotIvHits li.tip { color: var(--muted); font-size: 11.5px; justify-content: flex-start; padding: 2px 8px; }
#queue .card.rd2 { border-left: 3px solid var(--r2); }
#queue .card .foot .hint { font-size: 11px; color: var(--r2); }

/* ── v0.12a 포지션 배정 창 (포지션 없이 이력서를 넣었을 때) ── */
dialog.xd.as-dlg { width: 620px; }
.as-dlg .xd-card { max-height: calc(100vh - 40px); display: flex; flex-direction: column; padding-bottom: 18px; }
.as-lead { margin: 2px auto 14px; max-width: 460px; font-size: 13px; line-height: 1.65; color: var(--muted); word-break: keep-all; }
.as-list { flex: 1 1 auto; min-height: 0; overflow: auto; margin: 0 -8px; padding: 2px 8px 4px; display: flex; flex-direction: column; gap: 10px; text-align: left; }
.as-grp { position: relative; padding: 12px 14px 12px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(31,27,24,.04); animation: asIn .35s ease both; transition: border-color .2s, box-shadow .2s; }
.as-grp::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: var(--line-strong); transition: background .2s; }
.as-grp.matched::before, .as-grp.picked::before { background: var(--accent); }
.as-grp.unknown:not(.picked) { background: #FFFCF6; border-color: #EBD9B8; }
.as-grp.unknown:not(.picked)::before { background: var(--warn, #B7791F); }
.as-grp.picked { border-color: #E7CDD2; box-shadow: 0 0 0 3px var(--accent-soft); }
.as-hd { display: flex; align-items: center; gap: 8px; }
.as-field { font-size: 15px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); }
.as-n { font-size: 12px; font-weight: 700; color: var(--muted); padding: 1px 8px; border-radius: 999px; background: var(--bg); }
.as-badge { margin-left: auto; font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.as-badge.ok { background: var(--accent-soft); color: var(--accent-ink); }
.as-badge.ask { background: #FBEFD9; color: #8A5A12; }
.as-q { margin: 6px 0 8px; font-size: 13.5px; line-height: 1.6; color: #4A433D; word-break: keep-all; }
.as-q b { color: var(--accent-ink); font-weight: 800; box-shadow: inset 0 -6px 0 var(--accent-soft); }
.as-names { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 10px; }
.as-names span { padding: 2px 8px; border-radius: 6px; background: #F3EFEA; color: #4A433D; font-size: 12px; animation: xdChip .35s ease both; }
.as-names span.more { background: transparent; color: var(--muted); }
.as-opts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 10px; border-top: 1px dashed var(--line); }
.as-op { display: inline-flex; align-items: baseline; gap: 5px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-strong); background: #fff; color: var(--ink); font-size: 13px; font-weight: 600; cursor: pointer; transition: background .15s, border-color .15s, color .15s, transform .15s; }
.as-op small { font-size: 11px; font-weight: 500; color: var(--muted); }
.as-op:hover { border-color: var(--accent); color: var(--accent-ink); transform: translateY(-1px); }
.as-op.hint { border-color: #D9A04A; background: #FFF8EC; }
.as-op.on { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 6px 14px -8px rgba(122,34,51,.8); }
.as-op.on small { color: rgba(255,255,255,.75); }
.as-op .as-star { font-style: normal; font-size: 11px; color: var(--accent); }
.as-op.on .as-star { color: #fff; }
.as-op.new { border-style: dashed; color: var(--accent-ink); background: transparent; }
.as-op.none { border-color: transparent; background: var(--bg); color: var(--muted); }
.as-op.none.on { background: #5A524B; border-color: #5A524B; color: #fff; box-shadow: none; }
.as-closed { padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; font-size: 12px; color: var(--muted); background: #fff; }
.as-dlg .xd-actions { margin-top: 16px; flex: none; }
.as-dlg .as-ok { cursor: pointer; }
.as-dlg .as-ok:active { transform: scale(.98); }
.as-dlg .as-err { margin: 8px 0 0; font-size: 12px; color: #9B2C2C; }
.as-dlg .xd-hint { flex: none; }
@keyframes asIn { from { opacity: 0; transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) { .as-grp, .as-names span { animation: none; } }

/* v0.13o 입사 달력 (면접달력과 같은 틀, 시간 칸 없이 날짜 칸만) */
#view-joining { height: calc(100vh - 56px); }
#view-joining { overflow: hidden; }
#view-joining .queue { position: static; height: 100%; align-self: stretch; min-height: 0; }
#jnQueue.over { background: var(--accent-soft); box-shadow: inset 0 0 0 2px var(--accent); }
.jn-grid { flex: 1; min-height: 0; overflow: auto; padding: 0 20px 20px; }
.jn-cal { display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); background: var(--surface); border-radius: 10px; overflow: hidden; }
.jn-cal .jh { padding: 7px 8px; font-size: 12.5px; font-weight: 700; color: var(--muted); text-align: center; background: var(--bg); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 2; }
.jn-cal .jh.sun { color: #B4343F; } .jn-cal .jh.sat { color: #2E5A9A; }
.jn-cal .jd { min-height: 118px; padding: 6px 7px 8px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; min-width: 0; transition: background .12s; }
.jn-cal.week .jd { min-height: calc(100vh - 56px - 110px); }
.jn-cal .jd.out { background: #FAF9F7; }
.jn-cal .jd.out .dn { color: #BDB6AD; }
.jn-cal .jd.past:not(.out) { background: #FCFBFA; }
.jn-cal .jd.today { background: var(--accent-soft); }
.jn-cal .jd.today .dn { color: var(--accent-ink); }
.jn-cal .jd.over { background: var(--accent-soft); box-shadow: inset 0 0 0 2px var(--accent); }
.jn-cal .dn { font-size: 13px; font-weight: 700; color: var(--ink); }
.jn-cal .dn small { color: var(--muted); font-weight: 600; margin-left: 2px; }
.jn-cal .dn b { color: var(--ok); font-weight: 600; font-size: 12px; margin-left: 4px; }
.jn-cal .jd-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.jp { display: block; padding: 3px 7px 3px 8px; border-radius: 6px; background: var(--ok-soft); border-left: 3px solid var(--ok); font-size: 12.5px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.jp[draggable=true] { cursor: grab; }
.jp small { font-weight: 500; color: var(--muted); margin-left: 5px; font-size: 11.5px; }
.jp.of-proposed, .jp.of-objection, .jp.of-pending_resign { background: var(--warn-soft); border-left-color: var(--warn); }
.jp.of-none, .jp.of-declined { background: var(--off-soft); border-left-color: var(--off); }
.jp.done, .jn-card.done { opacity: .55; }
.jp:hover { filter: brightness(.97); }
.jn-card { padding: 8px 10px; }
.jn-card[draggable=true] { cursor: grab; }
.jn-card .nm { font-size: 14px; }
.jn-card .org { font-size: 12px; color: var(--ink); margin-top: 3px; }
.jn-card .foot { margin-top: 6px; }
.jn-card .chip.of-accepted { background: var(--ok-soft); color: var(--ok); }
.jn-card .chip.of-proposed, .jn-card .chip.of-pending_resign, .jn-card .chip.of-objection { background: var(--warn-soft); color: var(--warn); }
.jn-cal.week .jn-card { box-shadow: none; }
.cal-title small { font-size: 13px; color: var(--muted); font-weight: 600; margin-left: 6px; }
.jn-warn { font-size: 12px; font-weight: 700; color: var(--warn); background: var(--warn-soft); border-radius: 999px; padding: 2px 9px; margin-left: 8px; }
body.kh-ctrl #jnPrev, body.kh-ctrl #jnNext, body.kh-alt #view-joining .cal-bar .seg { animation: khPulse 1.1s ease-in-out infinite; border-color: var(--kh); }
@media (prefers-reduced-motion: reduce) { body.kh-ctrl #jnPrev, body.kh-ctrl #jnNext, body.kh-alt #view-joining .cal-bar .seg { animation: none; box-shadow: 0 0 0 2px rgba(var(--kh-rgb), .8); } }
/* v0.14g 오퍼레터: 발송 창 회사 고르기 · 회사별 표기 표 · 설정 첨부 파일 표 */
.ol-co { display: flex; align-items: center; gap: 12px; margin: 0 0 8px; }
.ol-co label { display: flex; align-items: center; gap: 6px; margin: 0; }
.ol-co select { width: auto; }
.co-tbl { width: 100%; border-collapse: collapse; margin: 4px 0 10px; font-size: 12.5px; }
.co-tbl th { text-align: left; font-weight: 600; color: var(--muted); padding: 3px 4px; }
.co-tbl td { padding: 2px 4px; }
.co-tbl input { width: 100%; }
.of-tbl select { width: auto; }
.of-tbl td a { font-weight: 600; }
/* v0.15a 과거 자료 가져오기 (설정) */
.imp-info { margin: 8px 0; font-size: 13px; line-height: 1.6; }
.imp-bar { height: 6px; background: var(--line); border-radius: 3px; overflow: hidden; margin: 6px 0 4px; max-width: 640px; }
.imp-bar i { display: block; height: 100%; background: var(--accent, #7A2233); transition: width .4s; }
.imp-drop { border: 1.5px dashed var(--line-strong); border-radius: 10px; padding: 18px 16px; margin: 10px 0; color: var(--muted); font-size: 13px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.imp-drop.over { border-color: var(--accent, #7A2233); background: var(--accent-soft); color: var(--accent, #7A2233); }
/* v0.15i 입사 예정 메뉴 왼쪽 아래 '입사 예정'(오늘 이후 입사일 있는 사람) — 누르면 달력 그 날짜로 */
.jn-up-head { border-top: 1px solid var(--line); padding-top: 12px; }
.jn-up { flex: 0 1 auto; max-height: 42%; overflow: auto; padding: 2px 10px 14px; }
.jn-up-i { display: flex; align-items: baseline; gap: 8px; width: 100%; text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 7px 10px; margin: 0 0 6px; cursor: pointer; font: inherit; font-size: 13px; color: var(--ink); }
.jn-up-i:hover { background: var(--accent-soft); border-color: var(--accent-soft); }
.jn-up-i b { flex: none; color: var(--accent-ink); font-weight: 700; }
.jn-up-i span { font-weight: 600; }
.jn-up-i small { margin-left: auto; color: var(--muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 45%; }
.jn-flash { animation: jnFlash .8s ease 4; }
@keyframes jnFlash { 0%, 100% { box-shadow: 0 0 0 0 transparent; } 50% { box-shadow: 0 0 0 3px var(--accent, #7A2233); } }

/* v0.16: keep the large drop target; improve hierarchy without more workflow steps. */
.pending-files{display:flex;align-items:center;gap:12px;padding:12px 16px;margin-top:12px;border:1px solid #D9BA78;border-radius:10px;background:#FFF8E7;flex-wrap:wrap}
.pending-files span{flex:1;font-size:13px}.pending-dialog{width:720px;max-width:95vw;border:1px solid var(--line);border-radius:14px;padding:24px;max-height:85vh}.pending-dialog::backdrop{background:#0005}.pending-row{padding:14px 0;border-bottom:1px solid var(--line)}.pending-row p{font-size:13px;color:var(--muted)}.pending-row select{max-width:75%;padding:8px}
.card .foot.fixed .fslot > *{font-size:12px;white-space:normal;min-height:28px}.card .nm{font-size:18px}.card .foot.fixed .f-stage{font-weight:700}
.chip.st-interview_set,.stsel.st-interview_set{background:#E8EFFA;color:#295B91}.chip.st-passed,.stsel.st-passed{background:#EFE7F5;color:#6B4380}.chip.st-joining,.stsel.st-joining{background:#E6F1EB;color:#2F6B4F}.chip.st-joined,.stsel.st-joined{background:#D9EADD;color:#24513A}.chip.st-hold,.stsel.st-hold{background:#FBF1DF;color:#8A5A12}
.ui-pop .xd-glow,.ui-pop .xd-ring{display:none}.ui-pop .xd-medal{width:44px;height:44px;margin-bottom:10px;box-shadow:none}.ui-pop .xd-card{padding:24px}.ui-pop *{animation:none!important}
@media(max-width:1500px){.top{height:auto;min-height:56px;flex-wrap:wrap;gap:8px 18px;padding:10px 16px}.tabs{order:3;width:100%;overflow:auto}.tabs button{white-space:nowrap}.who .search{width:220px}}
