/* 기업 회원(채용포털, 2026-09-24) — 앱 CSS 와 분리. 색·간격·글자는 디자인 토큰(/css/ds-tokens.css)만 쓴다.
   누르는 것은 44px 이상, 입력 글자는 16px(아이폰 확대 방지). */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--o-surface-page); color: var(--o-text-title);
  font-family: var(--o-font-family-sans); font-size: var(--o-font-size-body); line-height: 1.55; }
.wrap { max-width: 880px; margin: 0 auto; padding: var(--o-space-16) var(--o-space-16) var(--o-space-40); }
.head { padding: var(--o-space-8) var(--o-space-4) var(--o-space-12); }
.brand { display: flex; align-items: center; gap: var(--o-space-8); font-size: var(--o-font-size-caption); font-weight: 700; color: var(--o-primary); }
.brand-ic { width: 26px; height: 26px; border-radius: var(--o-radius-s); }
.head-row { display: flex; align-items: center; justify-content: space-between; gap: var(--o-space-8); }
h1 { font-size: var(--o-font-size-h3); margin: var(--o-space-4) 0; }
h2 { font-size: var(--o-font-size-h4); margin: 0 0 var(--o-space-8); }
h3 { font-size: var(--o-font-size-subtitle); margin: var(--o-space-16) 0 var(--o-space-8); }
.lead, .note { margin: 0; color: var(--o-text-subtle); }
.note { font-size: var(--o-font-size-table); }
a { color: var(--o-primary-text); }
.card { background: var(--o-surface-card); border: 1px solid var(--o-border-divider); border-radius: var(--o-radius-l);
  padding: var(--o-space-16); box-shadow: var(--o-shadow-xs); margin-bottom: var(--o-space-12); }
.center { text-align: center; }
.center p { color: var(--o-text-subtle); }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--o-space-12); }
.fld { display: flex; flex-direction: column; gap: var(--o-space-4); margin: var(--o-space-8) 0; font-size: var(--o-font-size-table);
  font-weight: 600; color: var(--o-text-body); }
.fld input, .fld select, .fld textarea { width: 100%; min-height: 44px; padding: var(--o-space-8) var(--o-space-12);
  border: 1px solid var(--o-border-strong); border-radius: var(--o-radius-m); background: var(--o-surface-card);
  color: var(--o-text-title); font: inherit; font-weight: 400; font-size: var(--o-font-size-input-touch); }
.fld textarea { resize: vertical; line-height: 1.5; }
.fld input:disabled { background: var(--o-surface-subtle); color: var(--o-text-muted); }
.row { display: flex; gap: var(--o-space-8); align-items: center; flex-wrap: wrap; }
.row input { flex: 1; min-width: 0; }
.consent { display: flex; gap: var(--o-space-8); align-items: flex-start; margin: var(--o-space-12) 0; font-size: var(--o-font-size-table);
  color: var(--o-text-body); }
.consent input { width: 20px; height: 20px; margin-top: 2px; flex: none; }
.err { min-height: 1.2em; margin: var(--o-space-4) 0; color: var(--o-danger-text); font-size: var(--o-font-size-table); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--o-space-6); min-height: 44px; padding: 0 var(--o-space-16);
  border: 1px solid var(--o-border-strong); border-radius: var(--o-radius-m); background: var(--o-surface-card); color: var(--o-text-body);
  font: inherit; font-weight: 700; cursor: pointer; white-space: nowrap; }
.btn.primary { background: var(--o-primary); border-color: var(--o-primary); color: var(--o-on-primary); }
.btn.ghost { background: transparent; }
.btn.danger { color: var(--o-danger-text); }
.btn.is-armed { background: var(--o-danger); border-color: var(--o-danger); color: var(--o-on-primary); }
.btn.wide { width: 100%; }
.btn:disabled { opacity: .6; cursor: default; }
.tabs { display: flex; gap: var(--o-space-4); border-bottom: 1px solid var(--o-border-divider); margin-bottom: var(--o-space-12); }
.tab { min-height: 44px; padding: 0 var(--o-space-16); border: 0; border-bottom: 2px solid transparent; background: none;
  color: var(--o-text-subtle); font: inherit; font-weight: 700; cursor: pointer; }
.tab[aria-selected="true"] { color: var(--o-primary-text); border-bottom-color: var(--o-primary); }
.bar { display: flex; align-items: center; gap: var(--o-space-12); flex-wrap: wrap; margin-bottom: var(--o-space-12); }
.post { display: flex; flex-direction: column; gap: var(--o-space-6); }
.post-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--o-space-8); }
.post-head h3 { margin: 0; word-break: keep-all; }
.meta { color: var(--o-text-muted); font-size: var(--o-font-size-table); }
.tag { flex: none; display: inline-block; padding: 2px var(--o-space-8); border-radius: var(--o-radius-full);
  font-size: var(--o-font-size-caption); font-weight: 700; background: var(--o-surface-subtle); color: var(--o-text-subtle); }
.tag[data-tone="success"] { background: var(--o-success-subtle); color: var(--o-success-text); }
.tag[data-tone="warning"] { background: var(--o-warning-subtle); color: var(--o-warning-text); }
.toast { position: fixed; left: 50%; bottom: calc(var(--o-space-16) + env(safe-area-inset-bottom)); transform: translateX(-50%);
  max-width: calc(100% - var(--o-space-32)); padding: var(--o-space-12) var(--o-space-16); border-radius: var(--o-radius-m);
  background: var(--o-surface-inverse); color: var(--o-on-primary); box-shadow: var(--o-shadow-l); z-index: var(--o-z-toast); }
.toast[data-tone="danger"] { background: var(--o-danger); }
@media screen and (max-width: 640px) {
  .grid2 { grid-template-columns: minmax(0, 1fr); }
}
/* 지원자·인재 찾기(2026-09-24, 단계 E-2) */
.fld.inline { flex-direction: row; align-items: center; margin: 0; }
.fld.inline select { width: auto; min-width: 200px; }
.search-in { flex: 1 1 240px; min-width: 0; min-height: 44px; padding: 0 var(--o-space-12); border: 1px solid var(--o-border-strong);
  border-radius: var(--o-radius-m); background: var(--o-surface-card); color: var(--o-text-title); font: inherit;
  font-size: var(--o-font-size-input-touch); }
.person dl { display: grid; grid-template-columns: 7em minmax(0, 1fr); gap: var(--o-space-4) var(--o-space-12); margin: var(--o-space-8) 0; }
.person dt { color: var(--o-text-muted); font-size: var(--o-font-size-table); }
.person dd { margin: 0; white-space: pre-wrap; word-break: break-word; }
.person .status { display: flex; gap: var(--o-space-8); flex-wrap: wrap; align-items: flex-end; border-top: 1px solid var(--o-border-divider);
  padding-top: var(--o-space-8); }
.person .status .fld { flex: 1 1 180px; margin: 0; }
.tag[data-tone="info"] { background: var(--o-info-subtle); color: var(--o-info-text); }
@media screen and (max-width: 640px) {
  .person dl { grid-template-columns: minmax(0, 1fr); }
  .fld.inline select { min-width: 0; width: 100%; }
}
/* 훈련 출결(2026-09-24, 단계 E-3) */
.att { margin-top: var(--o-space-12); padding-top: var(--o-space-8); border-top: 1px solid var(--o-border-divider); }
.att h4 { margin: 0 0 var(--o-space-4); font-size: var(--o-font-size-body); }
/* 이용약관·지원 제안·협약(2026-09-24, 단계 E-4) */
.terms { max-height: 320px; overflow: auto; padding: var(--o-space-12); border: 1px solid var(--o-border-divider);
  border-radius: var(--o-radius-m); background: var(--o-surface-subtle); font-size: var(--o-font-size-table); color: var(--o-text-body); }
.terms h4 { margin: var(--o-space-8) 0 var(--o-space-4); font-size: var(--o-font-size-table); color: var(--o-text-title); }
.terms h4:first-child { margin-top: 0; }
.terms p { margin: 0 0 var(--o-space-4); }
.terms .is-key { padding: var(--o-space-8); border-radius: var(--o-radius-s); background: var(--o-primary-subtle); }
.consent.mou { padding: var(--o-space-8); border-radius: var(--o-radius-m); background: var(--o-primary-subtle); }
details.card > summary { min-height: 44px; display: flex; align-items: center; font-weight: 700; cursor: pointer; }
.offer-form { display: flex; flex-direction: column; gap: var(--o-space-8); margin-top: var(--o-space-8); padding-top: var(--o-space-8);
  border-top: 1px solid var(--o-border-divider); }
.offer-form select, .offer-form textarea { width: 100%; min-height: 44px; padding: var(--o-space-8) var(--o-space-12);
  border: 1px solid var(--o-border-strong); border-radius: var(--o-radius-m); background: var(--o-surface-card);
  color: var(--o-text-title); font: inherit; font-size: var(--o-font-size-input-touch); }
.mini-row { display: flex; align-items: center; justify-content: space-between; gap: var(--o-space-8); min-height: 44px;
  border-bottom: 1px dashed var(--o-border-divider); }
.mini-row:last-child { border-bottom: 0; }
/* 아이디 안내·사업자번호 확인·채용 담당자(2026-10-07) — 앱 ds.css 의 .o-icon·.o-callout 과 같은 모양(이 화면은 ds.css 를 싣지 않는다) */
.o-icon { width: 1.1em; height: 1.1em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round;
  stroke-linejoin: round; vertical-align: -0.2em; }
.o-callout { display: flex; align-items: flex-start; gap: var(--o-space-8); margin: 0 0 var(--o-space-12); padding: var(--o-space-12);
  font-size: var(--o-font-size-table); color: var(--o-info-text); background: var(--o-info-subtle);
  border: 1px solid var(--o-info-border); border-radius: var(--o-radius-m); }
.o-callout > .o-icon { margin-top: 2px; }
.o-callout__body { flex: 1; min-width: 0; }
.o-callout__title { display: block; font-weight: 700; }
.o-callout a { color: inherit; font-weight: 700; }
.hint { font-size: var(--o-font-size-caption); font-weight: 400; color: var(--o-text-muted); }
.biz-res { grid-column: 1 / -1; margin: 0; padding: var(--o-space-8) var(--o-space-12); border-radius: var(--o-radius-m);
  font-size: var(--o-font-size-table); color: var(--o-danger-text); background: var(--o-danger-subtle); }
.biz-res:empty { display: none; }
.login-info { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--o-space-4) var(--o-space-12);
  max-width: 520px; margin: var(--o-space-12) auto 0; text-align: left; font-size: var(--o-font-size-table); }
.login-info dt { color: var(--o-text-muted); }
.login-info dd { margin: 0; color: var(--o-text-title); font-weight: 700; overflow-wrap: anywhere; }
.contact-line { color: var(--o-text-body); font-size: var(--o-font-size-table); overflow-wrap: anywhere; }
/* 맨 끝에 둔다 — .btn 등이 display 를 정해 hidden 을 이기지 않게 */
[hidden], [hidden].btn, [hidden].card { display: none; }