/* 레이아웃: 상단 요약 바 → 포지션별 섹션 → 한 줄에 한 사람, 오른쪽에 판정 버튼 */
:root{
  --ink:#16211f; --ink-2:#4a5b58; --ink-3:#7d8e8a;
  --paper:#f5f3ee; --card:#ffffff; --line:#ddd9d0;
  --accent:#0f5257; --accent-soft:#e2eceb;
  --wait:#9a6a12; --wait-soft:#fbf1dc;
  --late:#9c2f23; --late-soft:#fbe6e2;
  --go:#1f6b46; --go-soft:#e2f0e8;
  --off:#6b6b6b; --off-soft:#eceae6;
  --font-body:"Noto Sans KR",system-ui,-apple-system,"Malgun Gothic",sans-serif;
  --font-num:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#e8e9e6; --ink-2:#a9b5b2; --ink-3:#78857f;
  --paper:#141a19; --card:#1c2423; --line:#2e3a38;
  --accent:#6fc4c0; --accent-soft:#1d3433;
  --wait:#e0ae52; --wait-soft:#33290f;
  --late:#f08b7c; --late-soft:#3a1c17;
  --go:#6fc492; --go-soft:#12301f;
  --off:#9a9a9a; --off-soft:#262625;
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --ink:#e8e9e6; --ink-2:#a9b5b2; --ink-3:#78857f;
  --paper:#141a19; --card:#1c2423; --line:#2e3a38;
  --accent:#6fc4c0; --accent-soft:#1d3433;
  --wait:#e0ae52; --wait-soft:#33290f;
  --late:#f08b7c; --late-soft:#3a1c17;
  --go:#6fc492; --go-soft:#12301f;
  --off:#9a9a9a; --off-soft:#262625;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:14px;line-height:1.5;margin:0}
.wrap{max-width:980px;margin:0 auto;padding-inline:16px;padding-block:20px 56px}

header.top{display:flex;flex-wrap:wrap;gap:12px;align-items:baseline;justify-content:space-between;margin-bottom:4px}
h1{font-size:1.35rem;font-weight:700;margin:0;letter-spacing:-.01em;text-wrap:balance}
.sub{color:var(--ink-3);font-size:.8rem}

/* 로그인한 사람 · 로그아웃 */
.userbar{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;font-size:.8rem;color:var(--ink-2);margin:6px 0 0}
.userbar b{font-weight:700;color:var(--ink)}
.userbar a,.userbar button{font:inherit;color:var(--accent);background:none;border:none;padding:0;cursor:pointer;text-decoration:underline}

.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:16px 0 22px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:12px 14px;min-width:0}
.tile .k{font-size:.72rem;color:var(--ink-3);letter-spacing:.04em;text-transform:uppercase}
.tile .v{font-family:var(--font-num);font-size:1.5rem;font-weight:600;font-variant-numeric:tabular-nums;margin-top:2px}
.tile.alarm .v{color:var(--late)}

.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:18px 0 14px}
.tabs button,.tabs a{font:inherit;font-size:.9rem;font-weight:700;padding:9px 16px;border:none;background:none;
  color:var(--ink-3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;text-decoration:none}
.tabs button[aria-selected="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.tabs .n{font-family:var(--font-num);font-size:.78rem;font-weight:500;color:var(--ink-3);margin-left:5px}

.filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.filters button{font:inherit;font-size:.8rem;padding:5px 11px;border-radius:999px;border:1px solid var(--line);
  background:var(--card);color:var(--ink-2);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--paper)}
.filters button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.filters .scope{border-style:dashed}
.filters .scope[aria-pressed="true"]{border-style:solid;background:var(--ink);border-color:var(--ink);color:var(--paper)}
.filters .sep{width:1px;background:var(--line);margin:2px 5px}

section.pos{margin-bottom:28px}
section.pos > h2{font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line)}

.row{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:11px 13px;margin-bottom:7px;
  display:grid;grid-template-columns:auto minmax(16em,1fr) fit-content(52%);gap:10px 12px;align-items:center}
/* 버튼 열은 줄 폭의 52%까지만 쓰고 넘치면 줄바꿈한다 — 예전 「auto」 열은 버튼이 많으면 이름 칸을 한 글자 폭으로 찌그러뜨렸다(10/21) */
.row.done{opacity:.72}
.row .score{font-family:var(--font-num);font-size:1.18rem;font-weight:600;font-variant-numeric:tabular-nums;
  min-width:2.6em;text-align:right;color:var(--ink)}
.row .score small{font-size:.62rem;display:block;text-align:right;color:var(--ink-3);font-weight:500;letter-spacing:.06em}
.who{min-width:0}
.who .nm{font-weight:700;font-size:1rem}
.who .meta{font-size:.76rem;color:var(--ink-3);margin-top:1px}
.who .note{font-size:.76rem;color:var(--wait);margin-top:3px}
.acts{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.acts button{font:inherit;font-size:.78rem;padding:5px 10px;border-radius:5px;border:1px solid var(--line);
  background:transparent;color:var(--ink-2);cursor:pointer;white-space:nowrap}
.acts button:hover{border-color:var(--accent);color:var(--accent)}
.acts button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.acts button[disabled]{opacity:.4;cursor:default}
.acts .cv{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);font-weight:500}
.acts a.cv{font-size:.78rem;padding:5px 10px;border-radius:5px;border:1px solid var(--accent);text-decoration:none;display:inline-flex;align-items:center;white-space:nowrap}
.acts .cv:hover{background:var(--accent);color:var(--paper);border-color:var(--accent)}
.acts a.cv.hot{background:var(--accent);color:var(--paper);font-weight:700}
.acts .cv[aria-expanded="true"]{background:var(--accent);color:var(--paper);border-color:var(--accent)}
.acts .step{font-size:.72rem;color:var(--ink-3);align-self:center;margin-left:4px}
.acts .pass{border-color:var(--go);color:var(--go);font-weight:700}
.acts .pass:hover{background:var(--go);color:var(--paper);border-color:var(--go)}
.acts a.sheet{font-size:.78rem;padding:5px 10px;border-radius:5px;border:1px solid var(--go);color:var(--go);font-weight:700;text-decoration:none;white-space:nowrap}
.acts a.sheet:hover{background:var(--go);color:var(--paper)}
.acts .back{border-color:var(--line);color:var(--ink-3)}
.acts .back:hover{border-color:var(--ink-2);color:var(--ink-2)}

.cvbox{grid-column:1/-1;margin-top:9px;border-top:1px solid var(--line);padding-top:10px;min-width:0}
.cvbox .cvhead{font-size:.72rem;color:var(--ink-3);letter-spacing:.04em;margin-bottom:6px}
.cvbox .cvpages{display:flex;flex-direction:column;gap:8px;max-height:640px;overflow:auto;
  background:var(--line);border:1px solid var(--line);border-radius:5px;padding:8px;-webkit-overflow-scrolling:touch}
.cvbox .cvpages canvas{width:100%;height:auto;display:block;background:#fff;border-radius:3px;
  box-shadow:0 1px 3px rgba(0,0,0,.18)}
.cvbox .cvpages iframe{width:100%;height:620px;border:0;background:#fff;border-radius:3px}
.cvbox .cvpages .msg{padding:22px 10px;text-align:center;font-size:.8rem;color:var(--ink-2)}
.cvbox .txt{font:inherit;font-size:.72rem;background:none;border:none;color:var(--accent);
  text-decoration:underline;cursor:pointer;padding:0 0 0 8px}
.cvbox pre{margin:8px 0 0;max-height:440px;overflow:auto;background:var(--paper);border:1px solid var(--line);
  border-radius:5px;padding:11px 12px;font-family:var(--font-body);font-size:.8rem;line-height:1.55;
  white-space:pre-wrap;word-break:break-word;color:var(--ink-2);-webkit-overflow-scrolling:touch}

.pill{display:inline-block;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:999px;letter-spacing:.02em}
.p-wait{background:var(--wait-soft);color:var(--wait)}
/* 「CEO용」 표지 — 대표이사 보고용 자료(녹취 기록·면접관 평가) 버튼·탭 앞에 붙는 작은 배지 */
.ceo{display:inline-block;font-size:.74em;font-weight:800;letter-spacing:.03em;padding:1px 5px;margin-right:5px;
  border-radius:3px;background:var(--late);color:var(--card);line-height:1.45;vertical-align:1px;white-space:nowrap}
.p-late{background:var(--late-soft);color:var(--late)}
.p-go{background:var(--go-soft);color:var(--go)}
.p-off{background:var(--off-soft);color:var(--off)}
.p-new{background:var(--accent-soft);color:var(--accent)}

.decided{grid-column:1/-1;font-size:.76rem;color:var(--ink-3);border-top:1px dashed var(--line);padding-top:7px}
.decided b{color:var(--ink-2);font-weight:500}

.linkbtn{font:inherit;font-size:.74rem;background:none;border:none;color:var(--accent);text-decoration:underline;cursor:pointer;padding:0 0 0 8px}
.decided .fix{color:var(--go);font-weight:700}

/* 면접 희망 날짜·시간 입력 */
.wishbox{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;align-items:center;border-top:1px dashed var(--line);padding-top:10px;font-size:.8rem;color:var(--ink-2)}
.wishbox input[type=date],.wishbox select{font:inherit;font-size:.9rem;width:auto;padding:6px 8px;border:1px solid var(--line);border-radius:5px;background:var(--paper);color:var(--ink)}
.wishbox button{font:inherit;font-size:.8rem;padding:6px 12px;border-radius:5px;border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer}
.wishbox .go{background:var(--go);border-color:var(--go);color:var(--paper);font-weight:700}
.wishbox .hint{flex-basis:100%;margin:0}
.wishbox .slot{display:inline-flex;gap:4px;align-items:center}
.wishbox .slot button{padding:4px 9px}
.wishbox textarea{flex-basis:100%;font:inherit;font-size:.85rem;padding:7px 9px;border:1px solid var(--line);border-radius:5px;
  background:var(--paper);color:var(--ink);resize:vertical;min-width:0}

.banner{display:block;margin:14px 0 4px;padding:11px 14px;border-radius:6px;background:var(--late-soft);color:var(--late);border:1px solid var(--late);font-size:.9rem;text-decoration:none}
.banner[hidden]{display:none}
.banner b{font-weight:700}
.banner:hover{background:var(--late);color:var(--paper)}
.empty{background:var(--card);border:1px dashed var(--line);border-radius:6px;padding:28px 16px;text-align:center;color:var(--ink-3)}
.empty strong{display:block;color:var(--ink-2);font-size:.95rem;margin-bottom:5px}

footer.note{margin-top:30px;padding-top:14px;border-top:1px solid var(--line);font-size:.76rem;color:var(--ink-3)}
footer.note p{margin:4px 0}

/* 로그인 · 비밀번호 변경 */
.login{max-width:380px;margin:9vh auto 0;padding-inline:16px}
.login .box{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:22px 20px;margin-top:16px}
.login label{display:block;font-size:.78rem;color:var(--ink-2);margin:12px 0 4px}
.login label:first-of-type{margin-top:0}
input[type=text],input[type=password],select{font:inherit;font-size:1rem;width:100%;padding:9px 10px;border:1px solid var(--line);
  border-radius:5px;background:var(--paper);color:var(--ink)}
input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.btn{font:inherit;font-size:.9rem;font-weight:700;padding:10px 14px;border-radius:5px;border:1px solid var(--accent);
  background:var(--accent);color:var(--paper);cursor:pointer}
.login .btn{width:100%;margin-top:16px}
.btn[disabled]{opacity:.5;cursor:default}
.btn.ghost{background:transparent;color:var(--accent);font-weight:500;font-size:.78rem;padding:5px 10px}
.err{background:var(--late-soft);color:var(--late);border-radius:5px;padding:8px 10px;font-size:.8rem;margin-top:12px}
.ok{background:var(--go-soft);color:var(--go);border-radius:5px;padding:8px 10px;font-size:.8rem;margin-top:12px}
.hint{font-size:.74rem;color:var(--ink-3);margin-top:10px}

/* 관리 화면 */
.panel{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:14px;margin-bottom:22px}
.panel h2{font-size:.82rem;font-weight:700;letter-spacing:.06em;color:var(--ink-3);margin:0 0 10px}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:.8rem}
th,td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-size:.72rem;color:var(--ink-3);font-weight:500}
td.num{font-family:var(--font-num);font-variant-numeric:tabular-nums}
td input[type=date],td select{font:inherit;font-size:.8rem;width:auto;padding:4px 6px;border:1px solid var(--line);border-radius:5px;background:var(--paper);color:var(--ink)}
td .fix{color:var(--go);font-weight:700}
td .late{color:var(--late);font-weight:700}
td .wait{color:var(--wait);font-weight:700}
.addrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;align-items:center}
.addrow input,.addrow select{width:auto;flex:1 1 130px;font-size:.85rem;padding:7px 9px}
.pwonce{font-family:var(--font-num);font-size:1rem;font-weight:600;user-select:all}

@media (max-width:560px){
  .row{grid-template-columns:auto 1fr}
  .acts{grid-column:1/-1;justify-content:flex-start}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* 목록 카드 간단히(팀장 10/23): 한 사람당 2줄, 메모는 한 줄 말줄임, 전문·판정 기록은 「자세히」 */
.who{min-width:0}
.who .nm .pos{font-size:.76rem;color:var(--ink-3);font-weight:500;margin-right:2px}
.who .nmbtn{cursor:pointer}
.who .nmbtn:hover{text-decoration:underline}
.who .note.clip{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.decided.notefull{color:var(--wait);white-space:pre-wrap}