:root{
  --navy:#0f2f5c;
  --blue:#1b5fbf;
  --blue-l:#e8f0fd;
  --red:#c9232f;
  --red-l:#fdecec;
  --green:#0f8a5f;
  --green-l:#e6f6f0;
  --amber:#b5741a;
  --amber-l:#fdf3e2;
  --bg:#eef2f7;
  --card:#fff;
  --text:#16202e;
  --muted:#66758c;
  --line:#e0e7f1;
  --radius:14px;
  --shadow:0 1px 2px rgba(16,32,56,.06),0 6px 20px rgba(16,32,56,.06);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Segoe UI",Roboto,sans-serif;
  background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;
  font-size:14px;
}
a{color:var(--blue);text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit;color:inherit}
input,select{font-family:inherit;font-size:14px;color:var(--text)}

/* ---------- Hero ---------- */
.hero{
  background:linear-gradient(135deg,#0f2f5c 0%,#1b5fbf 62%,#2a7ad4 100%);
  color:#fff;padding:26px 20px 22px;position:relative;overflow:hidden;
}
.hero::after{
  content:"";position:absolute;right:-60px;top:-70px;width:260px;height:260px;
  border-radius:50%;background:rgba(255,255,255,.07);
}
.hero-in{max-width:1180px;margin:0 auto;position:relative;z-index:1}
.hero h1{font-size:21px;font-weight:700;letter-spacing:.3px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.hero .badge{background:var(--red);color:#fff;font-size:11px;padding:2px 8px;border-radius:20px;font-weight:600;letter-spacing:0}
.hero p{margin-top:7px;font-size:13px;color:rgba(255,255,255,.8);max-width:760px}
.hero .stats{display:flex;gap:22px;margin-top:14px;flex-wrap:wrap}
.hero .stats div b{font-size:19px;font-weight:700;display:block;line-height:1.25}
.hero .stats div span{font-size:11.5px;color:rgba(255,255,255,.72)}

/* ---------- Layout ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:16px 16px 60px}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line)}

/* ---------- Filters ---------- */
.filters{padding:16px 18px 18px;margin-bottom:14px}
.filters h2{font-size:14.5px;font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:14px}
.filters h2::before{content:"";width:3px;height:15px;border-radius:2px;background:var(--blue)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px 16px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label{font-size:12.5px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:5px}
.field>label .req{color:var(--red);font-weight:700}
.field>label .hint{font-weight:400;color:#9aa7b8;font-size:11px}
.field select,.field input[type=text]{
  width:100%;padding:9px 11px;border:1.5px solid var(--line);border-radius:9px;
  background:#fff;outline:none;transition:.15s;appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2366758c'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:30px;
}
.field select:focus,.field input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(27,95,191,.1)}
.field.wide{grid-column:span 2}

/* 专业联想 */
.ac-wrap{position:relative}
.ac-list{
  position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:1px solid var(--line);
  border-radius:10px;box-shadow:0 10px 30px rgba(16,32,56,.16);max-height:260px;overflow:auto;z-index:60;display:none;
}
.ac-list.on{display:block}
.ac-item{padding:8px 12px;cursor:pointer;display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:13px}
.ac-item:hover,.ac-item.act{background:var(--blue-l)}
.ac-item .k{color:var(--muted);font-size:11px;flex:none}
.ac-item mark{background:#fff2a8;color:inherit;padding:0}

/* 地区 chips */
.region-box{border:1.5px solid var(--line);border-radius:10px;padding:9px 10px;background:#fff}
.region-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px;gap:8px;flex-wrap:wrap}
.region-top .mini{font-size:12px;color:var(--blue);font-weight:600}
.region-top .mini.gray{color:var(--muted);font-weight:400}
.chips{display:flex;flex-wrap:wrap;gap:6px;max-height:118px;overflow:auto}
.chip{
  padding:4px 10px;border-radius:20px;background:#f2f5fa;border:1px solid transparent;
  font-size:12.5px;color:#41506a;transition:.13s;white-space:nowrap;
}
.chip:hover{background:#e6ecf6}
.chip.on{background:var(--blue);color:#fff}
.chip.on:hover{background:#174ea6}
.chips::-webkit-scrollbar,.ac-list::-webkit-scrollbar{width:6px;height:6px}
.chips::-webkit-scrollbar-thumb,.ac-list::-webkit-scrollbar-thumb{background:#ccd6e4;border-radius:6px}

/* 更多筛选 */
.more-toggle{
  margin-top:13px;font-size:13px;color:var(--blue);font-weight:600;display:inline-flex;
  align-items:center;gap:5px;
}
.more-toggle .arw{transition:.2s;display:inline-block}
.more-toggle.open .arw{transform:rotate(90deg)}
.more-body{display:none;margin-top:12px;padding-top:13px;border-top:1px dashed var(--line)}
.more-body.on{display:block}

.actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;align-items:center}
.btn{
  padding:10px 22px;border-radius:10px;background:var(--blue);color:#fff;font-weight:600;font-size:14px;
  transition:.15s;box-shadow:0 2px 8px rgba(27,95,191,.28);
}
.btn:hover{background:#174ea6}
.btn.ghost{background:#fff;color:var(--muted);border:1.5px solid var(--line);box-shadow:none}
.btn.ghost:hover{color:var(--text);border-color:#c7d2e2;background:#fafcff}
.btn.sm{padding:7px 14px;font-size:13px;border-radius:9px}

/* ---------- Results ---------- */
.res-bar{
  display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  padding:13px 18px;margin-bottom:12px;position:sticky;top:0;z-index:40;
  background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-radius:var(--radius);
  border:1px solid var(--line);box-shadow:var(--shadow);
}
/* ---- 报名人数 ---- */
.appl-tip{
  background:linear-gradient(135deg,#fff7ed,#fef2f2);
  border:1.5px solid #f6d5c4;border-radius:12px;padding:11px 15px;margin-bottom:14px;
  font-size:13px;color:#7c4a2d;line-height:1.6;
}
.appl-tip.warn{
  background:linear-gradient(135deg,#fffbeb,#fef2f2);
  border-color:#f3c3c3;color:#8a3b3b;
}
.appl-tip.warn a{color:var(--blue);text-decoration:underline}
.appl-tip b{color:var(--red);font-size:15px;margin:0 2px}
.appl-tip .ts{color:#a18072;font-size:12px}
.appl-row{align-items:center}
.tag.hot{background:var(--red-l);color:var(--red);font-weight:600}
.tag.cool{background:var(--green-l);color:var(--green);font-weight:600}
.ratio{
  display:inline-block;padding:3px 8px;border-radius:6px;font-size:11.5px;font-weight:700;
}
.ratio.r1{background:var(--green-l);color:var(--green)}
.ratio.r2{background:#fff4e0;color:var(--amber)}
.ratio.r3{background:var(--red-l);color:var(--red)}

.res-count{font-size:14px;font-weight:600}
.res-count b{color:var(--blue);font-size:19px;margin:0 3px}
.res-count em{font-style:normal;color:var(--red);font-weight:700}
.res-count .lv-hint{font-size:12.5px;color:var(--muted);font-weight:400;margin-left:12px}
.res-count .lv-hint b{font-size:12.5px;color:#33415a;margin:0 1px}
.res-count .ms{font-size:11.5px;color:#b6c0ce;margin-left:9px;font-weight:400}
.res-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.res-tools select,.res-tools input{
  padding:7px 10px;border:1.5px solid var(--line);border-radius:9px;outline:none;background:#fff;font-size:13px;
}
.res-tools input{width:150px}
.res-tools select{appearance:none;padding-right:26px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2366758c'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center;}

.jobs{display:flex;flex-direction:column;gap:10px}
.job{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:15px 17px;
  transition:.16s;position:relative;box-shadow:0 1px 2px rgba(16,32,56,.04);
}
.job:hover{border-color:#bcd2ef;box-shadow:0 6px 22px rgba(16,32,56,.1);transform:translateY(-1px)}
.job-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.job-title{font-size:15.5px;font-weight:700;line-height:1.45;flex:1;min-width:0}
.job-unit{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.5}
.job-unit b{color:var(--blue);font-weight:600}
.job-num{
  flex:none;text-align:center;background:var(--blue-l);color:var(--blue);border-radius:10px;
  padding:5px 11px;min-width:58px;
}
.job-num b{display:block;font-size:17px;font-weight:700;line-height:1.15}
.job-num span{font-size:10.5px;opacity:.75}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.tag{
  font-size:12px;padding:3px 9px;border-radius:6px;background:#f3f6fb;color:#48566e;
  display:inline-flex;align-items:center;gap:4px;line-height:1.5;
}
.tag.lab{background:#eef2f8;color:#7b8aa2;font-size:11px;padding:3px 7px}
.tag.blue{background:var(--blue-l);color:#1550a4}
.tag.green{background:var(--green-l);color:var(--green)}
.tag.red{background:var(--red-l);color:var(--red)}
.tag.amber{background:var(--amber-l);color:var(--amber)}
.tag.violet{background:#efe7ff;color:#6b3fd4;font-weight:600}
.tag b{font-weight:700}
.job-note{
  margin-top:11px;padding-top:10px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--muted);
  line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.job-foot{display:flex;justify-content:space-between;align-items:center;margin-top:11px;gap:10px;flex-wrap:wrap}
.job-code{font-size:11.5px;color:#9aa7b8;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.job-ops{display:flex;gap:8px}
.op{font-size:12.5px;color:var(--blue);font-weight:600;padding:4px 9px;border-radius:8px;background:#f4f8ff;transition:.13s}
.op:hover{background:var(--blue-l)}
.op.on{background:var(--red-l);color:var(--red)}
.match-pill{
  position:absolute;top:-1px;right:-1px;font-size:10.5px;font-weight:700;padding:2px 10px;
  border-radius:0 13px 0 12px;letter-spacing:.3px;
}
.match-pill.exact{background:var(--green);color:#fff}
.match-pill.cat{background:var(--amber);color:#fff}
.match-pill.any{background:#8c98ab;color:#fff}

.empty{text-align:center;padding:56px 20px;color:var(--muted)}
.empty .ico{font-size:40px;margin-bottom:12px;opacity:.5}
.empty h3{font-size:16px;color:var(--text);margin-bottom:7px}

.more-row{text-align:center;margin-top:16px}
.more-row .btn{min-width:200px}

/* ---------- Modal ---------- */
.mask{
  position:fixed;inset:0;background:rgba(11,22,40,.5);backdrop-filter:blur(2px);
  z-index:100;display:none;align-items:flex-end;justify-content:center;padding:0;
}
.mask.on{display:flex}
.sheet{
  background:#fff;width:100%;max-width:720px;max-height:88vh;border-radius:20px 20px 0 0;
  display:flex;flex-direction:column;animation:up .22s ease-out;
}
@keyframes up{from{transform:translateY(28px);opacity:.4}to{transform:none;opacity:1}}
.sheet-h{
  padding:17px 20px 13px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;
  gap:12px;align-items:flex-start;
}
.sheet-h h3{font-size:16px;font-weight:700;line-height:1.45}
.sheet-h p{font-size:12.5px;color:var(--muted);margin-top:3px}
.sheet-x{font-size:22px;color:#9aa7b8;line-height:1;padding:0 4px;flex:none}
.sheet-b{padding:16px 20px 26px;overflow:auto}
.kv{display:grid;grid-template-columns:88px 1fr;gap:9px 12px;font-size:13.5px}
.kv dt{color:var(--muted);font-size:12.5px}
.kv dd{word-break:break-word;line-height:1.65}
.block{margin-top:18px}
.block h4{font-size:13px;font-weight:700;color:var(--blue);margin-bottom:8px;display:flex;align-items:center;gap:6px}
.block h4::before{content:"";width:3px;height:12px;background:var(--blue);border-radius:2px}
.block .txt{font-size:13px;line-height:1.75;color:#3c4a60;white-space:pre-wrap;word-break:break-word}
.block.warn h4{color:var(--red)}
.block.warn h4::before{background:var(--red)}
.block.warn .txt{background:var(--red-l);padding:11px 13px;border-radius:10px;color:#8d1f27}

/* ---------- Loading ---------- */
#loading{
  position:fixed;inset:0;background:linear-gradient(160deg,#0f2f5c,#1b5fbf);color:#fff;z-index:200;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:.4s;
}
#loading.off{opacity:0;pointer-events:none}
.spin{width:42px;height:42px;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
#loading .t{font-size:15px;font-weight:600;letter-spacing:.4px}
#loading .s{font-size:12.5px;color:rgba(255,255,255,.7);margin-top:-12px}
.pbar{width:220px;height:4px;background:rgba(255,255,255,.2);border-radius:4px;overflow:hidden}
.pbar i{display:block;height:100%;width:0;background:#fff;border-radius:4px;transition:.3s}

.toast{
  position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(20px);background:#16202e;color:#fff;
  padding:10px 20px;border-radius:10px;font-size:13.5px;z-index:300;opacity:0;transition:.25s;pointer-events:none;
}
.toast.on{opacity:1;transform:translateX(-50%)}

footer{text-align:center;color:#94a1b4;font-size:12px;padding:26px 16px 40px;line-height:1.8}
footer a{color:#7d8ca0}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .field.wide{grid-column:span 2}
}
@media(max-width:640px){
  .hero{padding:20px 16px 18px}
  .hero h1{font-size:18px}
  .hero .stats{gap:16px}
  .hero .stats div b{font-size:17px}
  .wrap{padding:12px 11px 50px}
  .grid{grid-template-columns:1fr;gap:11px}
  .field.wide{grid-column:span 1}
  .filters{padding:14px}
  .res-bar{padding:11px 13px;gap:9px}
  .res-count{font-size:13px;width:100%}
  .res-count b{font-size:17px}
  .res-tools{width:100%}
  .res-tools input{flex:1;width:auto;min-width:0}
  .job{padding:13px 14px}
  .job-title{font-size:14.5px}
  .job-num{padding:4px 9px;min-width:52px}
  .job-num b{font-size:15px}
  .mask{align-items:flex-end}
  .sheet{max-height:92vh;border-radius:18px 18px 0 0}
  .kv{grid-template-columns:76px 1fr;font-size:13px}
}
