:root {
  --brand: #0fdc78; --brand-deep: #0ab861; --brand-dark: #02743b;
  --brand-soft: #e5fff2; --brand-mist: #f7fff8;
  --n50: #fafafa; --n100: #f4f4f5; --n200: #e4e4e7; --n400: #a1a1aa;
  --n500: #71717a; --n600: #52525b; --n700: #374151;
  --red: #dc2626; --red-bg: #fef2f2; --amber-bg: #fef3c7; --amber: #b45309;
}
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: #f0f1f3; color: #18181b; min-height: 100vh;
}
main { max-width: 480px; margin: 0 auto; padding: 0 16px 40px; }
.loading { text-align: center; padding: 60px 0; color: var(--n400); font-size: 14px; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; border: none; cursor: pointer; background: none; }
input, textarea { font-family: inherit; font-size: 15px; }

/* 横幅 */
.banner { margin-top: 24px; border-radius: 16px; padding: 20px; color: #fff;
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
  box-shadow: 0 10px 25px rgba(15, 220, 120, .25); }
.banner .tag { font-size: 12px; letter-spacing: 3px; color: var(--brand-soft); font-weight: 500; }
.banner h1 { margin-top: 6px; font-size: 24px; font-weight: 800; letter-spacing: 1px; }
.banner p { margin-top: 4px; font-size: 14px; color: var(--brand-soft); }

.section-title { margin: 18px 0 12px; font-size: 14px; font-weight: 600; color: var(--n500);
  display: flex; align-items: center; gap: 8px; }
.section-title::before { content: ""; width: 4px; height: 14px; border-radius: 2px; background: var(--brand); }

.card { background: #fff; border-radius: 16px; padding: 16px; box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.list { display: grid; gap: 12px; }
.empty { padding: 40px 16px; text-align: center; font-size: 14px; color: var(--n400); }

/* 岗位卡片 */
.job-top { display: flex; justify-content: space-between; gap: 12px; }
.job-top h3 { font-size: 16px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-meta { margin-top: 4px; font-size: 12px; color: var(--n500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pay { text-align: right; flex-shrink: 0; }
.pay .num { font-size: 20px; font-weight: 900; color: var(--brand); }
.pay .unit { font-size: 12px; color: var(--n500); }
.job-foot { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--n100);
  display: flex; align-items: center; justify-content: space-between; }
.job-foot .cnt { font-size: 12px; color: var(--n500); }
.job-foot .cnt b { color: var(--brand-dark); }
.pill { border-radius: 999px; padding: 4px 16px; font-size: 12px; font-weight: 700; }
.pill-go { background: var(--brand); color: #fff; }
.pill-full { background: var(--n100); color: var(--n400); }
.pill-soft { background: var(--brand-soft); color: var(--brand-dark); font-weight: 600; padding: 4px 12px; }
.pill-gray { background: var(--n100); color: var(--n400); font-weight: 600; padding: 4px 12px; }
.pill-amber { background: var(--amber-bg); color: var(--amber); font-weight: 600; padding: 4px 12px; }

/* 详情页 */
.back { display: inline-block; margin: 20px 0 12px; font-size: 14px; color: var(--n500); }
.detail h1 { font-size: 20px; font-weight: 800; }
.payline { margin-top: 8px; display: flex; align-items: baseline; }
.payline .num { font-size: 36px; font-weight: 900; color: var(--brand); }
.payline .unit { margin-left: 4px; font-size: 14px; color: var(--n500); }
.payline .pill-soft { margin-left: auto; }
.dl { margin-top: 16px; padding-top: 16px; border-top: 1px dashed var(--n100);
  display: grid; gap: 10px; font-size: 14px; }
.dl .row { display: flex; gap: 8px; }
.dl dt { width: 64px; flex-shrink: 0; color: var(--n400); }
.dl dd { flex: 1; }
.block-title { font-size: 14px; font-weight: 700; color: var(--n700); margin-bottom: 6px; }
.desc { margin-top: 16px; }
.desc p { font-size: 14px; line-height: 1.7; color: var(--n600); white-space: pre-wrap; }
.req { margin-top: 16px; background: var(--brand-mist); border-radius: 12px; padding: 16px; }
.req .block-title { color: var(--brand-dark); }

/* 表单 */
form { display: grid; gap: 16px; }
label.f { display: block; }
label.f .lb { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 500; }
label.f .lb i { color: var(--red); font-style: normal; }
label.f .lb span { font-size: 12px; color: var(--n400); font-weight: 400; }
input.in, textarea.in { width: 100%; border: 1px solid var(--n200); background: var(--n50);
  border-radius: 12px; padding: 12px 16px; outline: none; transition: border-color .15s, background .15s; }
input.in:focus, textarea.in:focus { border-color: var(--brand); background: #fff; }
textarea.in { resize: none; }
.err { background: var(--red-bg); color: var(--red); border-radius: 12px; padding: 10px 16px; font-size: 14px; }
.btn-primary { width: 100%; border-radius: 12px; padding: 14px; font-size: 16px; font-weight: 700; color: #fff;
  background: linear-gradient(90deg, var(--brand), var(--brand-deep));
  box-shadow: 0 8px 20px rgba(15, 220, 120, .3); }
.btn-primary:disabled { opacity: .6; }
.hint { text-align: center; font-size: 12px; color: var(--n400); }
.success { background: var(--brand-mist); border-radius: 16px; padding: 24px; text-align: center;
  box-shadow: inset 0 0 0 1px rgba(15,220,120,.3); }
.success .ok { width: 56px; height: 56px; margin: 0 auto; border-radius: 50%; background: var(--brand);
  color: #fff; font-size: 24px; display: flex; align-items: center; justify-content: center; }
.success h3 { margin-top: 12px; font-size: 18px; color: var(--brand-dark); }
.success p { margin-top: 4px; font-size: 14px; color: var(--n500); }

/* 管理端 */
.center-box { max-width: 384px; margin: 0 auto; padding: 40px 24px; }
.center-box h1 { text-align: center; font-size: 24px; font-weight: 800; }
.center-box .sub { text-align: center; margin-top: 4px; font-size: 14px; color: var(--n400); }
.admin-head { display: flex; align-items: center; justify-content: space-between; padding-top: 20px; }
.admin-head h1 { font-size: 20px; font-weight: 800; }
.admin-head button { font-size: 14px; color: var(--n400); }
.tabs { margin-top: 16px; display: grid; grid-template-columns: 1fr 1fr; background: rgba(228,228,227,.6);
  border-radius: 12px; padding: 4px; font-size: 14px; font-weight: 600; }
.tabs button { border-radius: 8px; padding: 8px 0; color: var(--n500); }
.tabs button.on { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.08); color: #18181b; }
.tip { margin-top: 12px; background: var(--brand-soft); color: var(--brand-dark); border-radius: 12px;
  padding: 8px 16px; text-align: center; font-size: 14px; }
.btn-grad { width: 100%; border-radius: 12px; padding: 12px; font-weight: 700; color: #fff;
  background: linear-gradient(90deg, var(--brand), var(--brand-deep));
  box-shadow: 0 8px 20px rgba(15,220,120,.25); }
.btn-dark { border-radius: 12px; padding: 12px; font-weight: 700; color: #fff; background: var(--brand-dark); }
.btn-muted { border-radius: 8px; padding: 6px 0; font-size: 14px; color: var(--n600); background: var(--n100); }
.btn-red { border-radius: 8px; padding: 6px 0; font-size: 14px; color: var(--red); }
.form-card { margin-top: 12px; background: #fff; border-radius: 16px; padding: 16px; box-shadow: 0 1px 3px rgba(0,0,0,.05); display: grid; gap: 12px; }
.form-card label.f .lb { font-size: 12px; color: var(--n500); }
.form-card input.in, .form-card textarea.in { padding: 10px 14px; font-size: 14px; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.job-actions { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--n100);
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; font-size: 14px; }
.apps-bar { display: flex; gap: 8px; margin-top: 16px; }
.apps-bar a.btn-dark { flex: 1; text-align: center; font-size: 14px; padding: 10px 0; text-decoration: none; }
.apps-bar .btn-muted { padding: 10px 16px; border-radius: 12px; }
.app-item .name { font-weight: 700; }
.app-item .name small { margin-left: 8px; font-size: 12px; font-weight: 400; color: var(--n400); }
.app-item .for { margin-top: 2px; font-size: 12px; color: var(--n500); }
.app-item .phone { display: block; margin-top: 6px; font-size: 14px; color: var(--brand-dark); }
.app-item .note { margin-top: 6px; background: var(--n50); border-radius: 8px; padding: 8px 12px; font-size: 12px; color: var(--n500); }
.review { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.review .ok { border-radius: 8px; padding: 8px 0; font-size: 14px; font-weight: 700; color: #fff; background: var(--brand); }
.review .no { border-radius: 8px; padding: 8px 0; font-size: 14px; font-weight: 700; color: var(--n500); background: var(--n100); }
footer { margin-top: 40px; text-align: center; font-size: 12px; color: var(--n400); }
footer a { color: #d4d4d8; display: inline-block; margin-top: 4px; }
