/* ============================================================
   AI 验真面试 · 设计系统基座
   视觉世界：简约高级 · 灵动部件
   - 色彩策略 Restrained：冷调中性底 + 全站唯一强调色 #2B5CE6
   - 评级色固定映射 A=#12B76A B=#2B5CE6 C=#F59E0B（全站不得换色）
   - 圆角锁：按钮 999 · 卡片 16 · 输入 12 · 微构件 6
   - 阴影系统：双层软阴影（1px 贴地 + 大范围环境影），禁纯黑硬影
   - 部件微交互机制参考 Uiverse.io（MIT），经调性皮肤化重制
   ============================================================ */
:root{
  --ink:#0B1120;
  --text-1:#131A2B;
  --text-2:#4A5266;
  --text-3:#8B93A8;
  --line:#E9EBF1;
  --line-strong:#D8DCE7;
  --bg:#F7F8FB;
  --fill:#F2F4F9;
  --track:#E9ECF3;
  --card:#FFFFFF;
  --brand:#2B5CE6;
  --brand-dark:#1E43B8;
  --brand-soft:#EEF2FF;
  --brand-line:#C9D6FF;
  --brand-light:#9DB4FF;
  --a-green:#12B76A;
  --b-blue:#2B5CE6;
  --c-amber:#F59E0B;
  --red:#DC2626;
  --r-card:16px;
  --r-input:12px;
  --r-pill:999px;
  --r-xs:6px;
  --shadow-card:0 1px 2px rgba(11,17,32,.04),0 10px 30px -10px rgba(11,17,32,.10);
  --shadow-lift:0 2px 4px rgba(11,17,32,.05),0 18px 44px -12px rgba(11,17,32,.16);
  --shadow-brand:0 1px 2px rgba(43,92,230,.06),0 12px 32px -10px rgba(43,92,230,.28);
  --shadow-sheet:0 -8px 40px rgba(11,17,32,.14);
  --ring:0 0 0 3px rgba(43,92,230,.16);
  --pad-x:20px;
  --container:1160px;
  --read:680px;
  --nav-h:56px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC","WenQuanYi Micro Hei","Segoe UI",sans-serif;
  --mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scrollbar-width:thin;scrollbar-color:#D4D9E5 transparent}
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--text-1);
  font-size:15px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* 浏览器原生表面纳入设计：选区 / 光标 / 滚动条 */
::selection{background:rgba(43,92,230,.2);color:inherit}
input,textarea{caret-color:var(--brand)}
img,svg{display:block;max-width:100%}
button{font-family:inherit}
a{color:var(--brand);text-decoration:none}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.num{font-variant-numeric:tabular-nums}

/* ---------- 布局 ---------- */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--pad-x)}
.read{max-width:var(--read);margin:0 auto}
.page{padding-top:var(--nav-h);min-height:100dvh}
.page--flush{padding-top:0}
.section{padding:52px 0}
.section--tight{padding:32px 0}
.section-title{font-size:22px;font-weight:800;letter-spacing:-.015em;line-height:1.4;color:var(--text-1)}
.section-sub{font-size:13.5px;color:var(--text-2);margin-top:6px}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);font-weight:600}

/* ---------- 排版 ---------- */
h1,h2,h3,h4{font-weight:800;color:var(--text-1);letter-spacing:-.015em}
p{color:var(--text-2)}
.muted{color:var(--text-3)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* ---------- 按钮 ----------
   灵动机制（Uiverse CTA 扫光/圆形填充扩散，重皮肤）：
   主按钮 hover 光泽扫过；深底白钮 hover 墨色圆形从右侧扩散填充 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:52px;padding:0 28px;border-radius:var(--r-pill);
  font-size:16px;font-weight:700;line-height:1;
  border:1px solid transparent;background:none;cursor:pointer;
  white-space:nowrap;user-select:none;text-decoration:none;
  transition:background .18s ease,color .25s ease,border-color .18s ease,transform .12s var(--ease),opacity .18s ease,box-shadow .25s ease;
  position:relative;isolation:isolate;overflow:hidden;
}
.btn:active{transform:scale(.97)}
.btn[disabled],.btn.is-disabled{opacity:.45;pointer-events:none}
.btn--brand{background:var(--brand);color:#fff}
.btn--white{background:#fff;color:var(--ink)}
/* 光泽扫过（主按钮） */
.btn--brand::before{
  content:"";position:absolute;top:-20%;right:-60%;bottom:-20%;left:-60%;inset:-20% -60%;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.32) 50%,transparent 65%);
  transform:translateX(-70%);transition:transform .7s var(--ease);
}
/* 墨色圆形扩散（深底白钮） */
.btn--white::before{
  content:"";position:absolute;right:-6px;top:50%;z-index:-1;pointer-events:none;
  width:44px;height:44px;border-radius:50%;background:var(--ink);
  transform:translateY(-50%) scale(0);transition:transform .55s var(--ease);
}
.btn--ghost{background:transparent;color:var(--text-1);border-color:var(--line-strong);font-weight:600}
.btn--danger{background:var(--red);color:#fff}
.btn--danger-ghost{background:transparent;color:var(--red);border-color:rgba(220,38,38,.4);font-weight:600}
.btn--block{width:100%}
.btn--sm{height:44px;font-size:14.5px;padding:0 20px}
.btn.is-loading{pointer-events:none}
.btn.is-loading .btn__t{visibility:hidden}
.btn.is-loading::after{
  content:"";position:absolute;left:50%;top:50%;width:17px;height:17px;margin:-8.5px 0 0 -8.5px;
  border:2px solid currentColor;border-top-color:transparent;border-radius:50%;
  opacity:.75;animation:spin .7s linear infinite;
}
@media (hover:hover){
  .btn--brand:hover{background:var(--brand-dark);box-shadow:0 8px 24px -8px rgba(43,92,230,.5)}
  .btn--brand:hover::before{transform:translateX(70%)}
  .btn--white:hover{color:#fff;box-shadow:0 8px 24px -10px rgba(11,17,32,.45)}
  .btn--white:hover::before{transform:translateY(-50%) scale(14)}
  .btn--ghost:hover{border-color:var(--text-3);background:#fff;box-shadow:var(--shadow-card);transform:translateY(-1px)}
  .btn--danger:hover{background:#B91C1C}
  .btn--danger-ghost:hover{background:rgba(220,38,38,.06)}
}
/* 文字按钮 */
.link-btn{
  font-size:13.5px;color:var(--text-2);background:none;border:none;cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;padding:6px 2px;
}
.link-btn:hover,.link-btn:active{color:var(--brand)}
.link-btn--dark{color:rgba(232,236,245,.8)}
.link-btn--dark:hover{color:#fff}

/* ---------- 表单 ---------- */
.field{display:flex;flex-direction:column;gap:6px;margin-top:14px}
.field__label{font-size:13px;font-weight:600;color:var(--text-1)}
.input,.textarea{
  width:100%;height:48px;padding:0 14px;font-size:15px;font-family:inherit;color:var(--text-1);
  background:#fff;border:1px solid var(--line-strong);border-radius:var(--r-input);
  transition:border-color .15s,box-shadow .2s var(--ease),background .15s;
}
.textarea{height:auto;min-height:160px;padding:12px 14px;line-height:1.7;resize:vertical}
.input::placeholder,.textarea::placeholder{color:var(--text-3)}
.input:hover,.textarea:hover{border-color:#C6CCDA}
.input:focus,.textarea:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
.input.is-error,.textarea.is-error{border-color:var(--red)}
.input.is-error:focus,.textarea.is-error:focus{box-shadow:0 0 0 3px rgba(220,38,38,.14)}
.field__err{font-size:12.5px;color:var(--red);min-height:0}
.field__hint{font-size:12.5px;color:var(--text-3)}
.field__count{font-size:12px;color:var(--text-3);font-family:var(--mono);text-align:right}
/* 勾选：描线弹入（机制参考 Uiverse checkbox，重皮肤） */
.checkline{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--text-2);margin-top:18px;line-height:1.6;cursor:pointer}
.checkline input,.checkitem input{
  appearance:none;-webkit-appearance:none;
  width:18px;height:18px;margin-top:2px;flex-shrink:0;cursor:pointer;
  background:#fff;border:1.5px solid var(--line-strong);border-radius:var(--r-xs);
  transition:background .18s var(--ease),border-color .18s var(--ease);
}
.checkline input:hover,.checkitem input:hover{border-color:var(--brand-light)}
.checkline input:checked,.checkitem input:checked{
  background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.2 4.7 8.9 10 3.3' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;
  border-color:var(--brand);
  animation:checkPop .3s var(--ease);
}
.checkline a{text-decoration:underline;text-underline-offset:2px}
@keyframes checkPop{55%{transform:scale(1.18)}}

/* ---------- 标签 / chip ---------- */
.tag{
  display:inline-flex;align-items:center;gap:4px;
  font-size:11px;font-weight:600;line-height:1.5;
  border-radius:var(--r-pill);padding:2px 9px;
  background:var(--brand-soft);color:var(--brand);white-space:nowrap;
}
.tag--g{background:#E7F8F0;color:#0B7A4D}
.tag--a{background:#FEF3DC;color:#96600A}
.tag--red{background:#FEE9E9;color:#B42318}
.tag--gray{background:var(--fill);color:var(--text-3)}
.tag--outline{background:transparent;border:1px solid var(--line-strong);color:var(--text-2)}

/* ---------- 卡片 ---------- */
.card{
  background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-card);padding:18px;box-shadow:var(--shadow-card);
}
.card + .card{margin-top:14px}
.card__head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.card__title{font-size:15px;font-weight:700;color:var(--text-1)}
.card__desc{font-size:13px;color:var(--text-2);margin-top:4px}

/* ---------- 顶栏 ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:60;
  display:flex;align-items:center;
  transition:background .3s var(--ease),border-color .3s var(--ease),box-shadow .3s var(--ease);
  border-bottom:1px solid transparent;
}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:16px}
.nav__links{display:flex;align-items:center;gap:6px}
.nav__link{
  font-size:13.5px;color:var(--text-2);background:none;border:none;cursor:pointer;
  padding:8px 10px;border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:5px;
  transition:color .18s,background .18s,transform .18s var(--ease);
}
.nav__link--wide{display:none}
.nav__link:hover{color:var(--brand);background:rgba(43,92,230,.07);transform:translateY(-1px)}
.logo{font-size:16px;font-weight:800;letter-spacing:-.01em;color:var(--text-1);display:inline-flex;align-items:center}
.logo i{font-style:normal;color:var(--brand)}
/* 浮于深色首屏上的透明态 */
.nav--overlay{color:#fff}
.nav--overlay .logo{color:#fff}
.nav--overlay .logo i{color:var(--brand-light)}
.nav--overlay .nav__link{color:rgba(255,255,255,.78)}
.nav--overlay .nav__link:hover{color:#fff;background:rgba(255,255,255,.1)}
.nav--overlay.is-solid{
  background:rgba(255,255,255,.78);border-bottom-color:rgba(11,17,32,.07);
  backdrop-filter:blur(16px) saturate(1.6);-webkit-backdrop-filter:blur(16px) saturate(1.6);
}
.nav--overlay.is-solid .logo{color:var(--text-1)}
.nav--overlay.is-solid .logo i{color:var(--brand)}
.nav--overlay.is-solid .nav__link{color:var(--text-2)}
.nav--overlay.is-solid .nav__link:hover{color:var(--brand);background:rgba(43,92,230,.07)}
/* 浅色页 */
.nav--solid{
  background:rgba(255,255,255,.78);border-bottom-color:rgba(11,17,32,.07);
  backdrop-filter:blur(16px) saturate(1.6);-webkit-backdrop-filter:blur(16px) saturate(1.6);
}
/* 深色页 */
.nav--dark{background:transparent}
.nav--dark .logo{color:#fff}
.nav--dark .logo i{color:var(--brand-light)}
.nav--dark .nav__link{color:rgba(255,255,255,.78)}
.nav--dark .nav__link:hover{color:#fff;background:rgba(255,255,255,.1)}

/* ---------- 底部抽屉 / 模态 ---------- */
.overlay{
  position:fixed;top:0;right:0;bottom:0;left:0;inset:0;background:rgba(11,17,32,.52);z-index:80;
  opacity:0;transition:opacity .25s ease;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
}
.overlay.is-open{opacity:1}
.sheet{
  position:fixed;left:0;right:0;bottom:0;z-index:90;
  background:#fff;border-radius:22px 22px 0 0;box-shadow:var(--shadow-sheet);
  padding:8px 20px calc(20px + env(safe-area-inset-bottom));
  max-height:88dvh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#D4D9E5 transparent;
  transform:translateY(100%);transition:transform .34s var(--ease);
}
.sheet.is-open{transform:translateY(0)}
.sheet::-webkit-scrollbar{width:6px}
.sheet::-webkit-scrollbar-thumb{background:#D4D9E5;border-radius:99px}
.sheet__grip{width:40px;height:4px;border-radius:99px;background:#DCE0EA;margin:6px auto 12px;cursor:grab}
.sheet__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.sheet__title{font-size:17px;font-weight:800;letter-spacing:-.01em}
.sheet__close{
  width:34px;height:34px;border-radius:50%;border:none;background:var(--fill);
  color:var(--text-2);cursor:pointer;display:grid;place-items:center;
  transition:background .15s,transform .18s var(--ease);
}
.sheet__close:hover{background:var(--line);transform:rotate(90deg)}
@media (min-width:768px){
  .sheet{
    left:50%;right:auto;bottom:auto;top:50%;
    width:min(400px,calc(100vw - 48px));
    border-radius:var(--r-card);
    box-shadow:0 32px 80px -20px rgba(11,17,32,.35);
    padding:22px 24px 24px;
    transform:translate(-50%,-46%);opacity:0;
    transition:transform .3s var(--ease),opacity .25s ease;
  }
  .sheet.is-open{transform:translate(-50%,-50%);opacity:1}
  .sheet--md{width:min(460px,calc(100vw - 48px))}
  .sheet--lg{width:min(560px,calc(100vw - 48px))}
  .sheet__grip{display:none}
}

/* ---------- Toast ---------- */
.toast{
  position:fixed;top:calc(14px + env(safe-area-inset-top));left:50%;
  transform:translate(-50%,-20px);opacity:0;pointer-events:none;
  background:var(--ink);color:#fff;font-size:13.5px;font-weight:500;
  padding:10px 20px;border-radius:var(--r-pill);z-index:120;
  box-shadow:0 16px 44px -12px rgba(11,17,32,.5);
  transition:opacity .28s ease,transform .32s var(--ease);
  max-width:calc(100vw - 40px);text-align:center;
}
.toast.is-in{opacity:1;transform:translate(-50%,0)}

/* ---------- 步骤条（材料→岗位→面试） ---------- */
.steps{display:flex;gap:6px;padding:10px 0 4px}
.steps__it{flex:1;font-size:11.5px;color:var(--text-3);text-align:center}
.steps__it b{display:block;height:4px;border-radius:99px;background:var(--line);margin-bottom:6px;transition:background .35s var(--ease),transform .35s var(--ease);transform-origin:left}
.steps__it.on b{background:var(--brand);transform:scaleX(1)}
.steps__it.on{color:var(--brand);font-weight:700}
.steps__it.done b{background:var(--brand);opacity:.4}
.steps__it.done{color:var(--text-2)}
.steps__it.done b::after{content:"";display:block}

/* ---------- 信任等级条 ---------- */
.tier{display:flex;gap:8px;margin-top:12px}
.tier__it{
  flex:1;text-align:center;font-size:11.5px;padding:9px 4px;border-radius:12px;
  background:var(--fill);color:var(--text-3);line-height:1.5;
  border:1px solid transparent;transition:background .3s var(--ease),color .3s,border-color .3s,transform .3s var(--ease);
}
.tier__it b{display:block;font-size:14px;font-weight:800}
.tier__it.on{background:var(--brand-soft);color:var(--brand);border-color:var(--brand-line);transform:translateY(-2px);box-shadow:var(--shadow-card)}

/* ---------- 评级徽章 ----------
   评级色固定映射：A=绿 B=蓝 C=橙，全站（列表徽章/报告头/PDF）不得换色 */
.rb{
  display:grid;place-items:center;border-radius:18px;
  font-weight:900;color:var(--ink);font-family:var(--font);
  width:64px;height:64px;font-size:32px;flex-shrink:0;
  box-shadow:0 6px 20px -8px rgba(11,17,32,.35);
}
.rb--A{background:var(--a-green);color:var(--ink)}
.rb--B{background:var(--b-blue);color:#fff}
.rb--C{background:var(--c-amber);color:var(--ink)}
.rb--sm{width:32px;height:32px;border-radius:9px;font-size:15px;box-shadow:none}
.rb--line{background:#fff;border:1.5px solid var(--line)}
.rb--line.rb--B{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand)}

/* ---------- 免责条 ---------- */
.disclaimer{
  font-size:11px;color:var(--text-3);text-align:center;line-height:1.7;
  padding:12px 20px;background:var(--fill);border-top:1px solid var(--line);
}
.disclaimer--fixed{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  padding-bottom:calc(12px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}

/* ---------- 页脚（P1） ---------- */
.foot{border-top:1px solid var(--line);background:#fff;padding:28px 0 calc(34px + env(safe-area-inset-bottom));margin-top:8px}
.foot__dis{font-size:12.5px;color:var(--text-3);line-height:1.8;max-width:640px}
.foot__links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px}
.foot__links a,.foot__links button{
  font-size:13px;color:var(--text-2);background:none;border:none;cursor:pointer;padding:0;
  transition:color .15s;
}
.foot__links a:hover,.foot__links button:hover{color:var(--brand)}
.foot__meta{font-size:12px;color:var(--text-3);margin-top:14px;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center}

/* ---------- 骨架屏 ---------- */
.skel{background:var(--track);border-radius:8px;position:relative;overflow:hidden}
.skel::after{
  content:"";position:absolute;top:0;right:0;bottom:0;left:0;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);
  transform:translateX(-100%);animation:shimmer 1.4s infinite;
}
@keyframes shimmer{100%{transform:translateX(100%)}}
@keyframes spin{100%{transform:rotate(360deg)}}
@keyframes blink{50%{opacity:.25}}

/* ---------- 入场动效 ----------
   .enter：即时元素（气泡等）
   .rv：滚动 reveal（JS 按组加 --rv-i 错峰） */
.enter{animation:enter .35s var(--ease) both}
@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.rv{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--rv-i,0) * 70ms)}
.rv.rv-in{opacity:1;transform:none}

/* ---------- 空态 ---------- */
.empty{text-align:center;padding:44px 20px}
.empty__art{margin:0 auto 18px;color:var(--line-strong)}
.empty__title{font-size:16px;font-weight:700;color:var(--text-1)}
.empty__desc{font-size:13.5px;color:var(--text-2);margin:6px auto 20px;max-width:280px}

/* ---------- reduced-motion：循环动画与 reveal 全部停止 ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .btn:active{transform:none}
  .rv{opacity:1;transform:none}
}