/* ============================================================================
   星辉雨官网 v3 · 通用页面样式（404.html）
   依赖 style.css 的设计变量与 .page-hero 深色底；无图片依赖
   ========================================================================== */

.nf{padding-bottom:clamp(56px,7vw,100px);text-align:center}
.nf-inner{max-width:900px;margin:0 auto}
.nf-code{
  font-family:var(--font-num);font-weight:800;line-height:.8;letter-spacing:-.07em;
  font-size:clamp(112px,19vw,224px);color:#fff;margin:0 auto 14px;
  user-select:none;
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .nf-code{
    color:transparent;
    background:linear-gradient(180deg,#FFFFFF 6%,#A9CCF6 58%,rgba(46,123,214,.22) 100%);
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;
    filter:drop-shadow(0 26px 60px rgba(46,123,214,.32));
  }
}
.nf .eyebrow{color:var(--brand-200);letter-spacing:.22em}
.nf-title{color:#fff;margin-top:12px;font-size:clamp(28px,3.6vw,44px);letter-spacing:-.03em}
.nf-sub{max-width:34em;margin:16px auto 0}
.nf-act{justify-content:center;margin-top:clamp(26px,3.4vw,36px)}

.nf-links{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:clamp(36px,5vw,58px);text-align:left}
.nf-link{
  display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:var(--r);
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  transition:background .24s var(--ease),border-color .24s var(--ease),transform .24s var(--ease);
}
.nf-link:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);transform:translateY(-2px)}
.nf-link-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:rgba(46,123,214,.22);color:#A9CCF6;flex:none}
.nf-link-ico .ic{width:20px;height:20px}
.nf-link-txt{flex:1;min-width:0}
.nf-link-txt b{display:block;font-size:14.5px;color:#fff}
.nf-link-txt small{display:block;margin-top:2px;font-size:12px;color:rgba(255,255,255,.5)}
.nf-link>.ic{width:17px;height:17px;flex:none;color:rgba(255,255,255,.4);transition:transform .24s var(--ease)}
.nf-link:hover>.ic{transform:translateX(3px);color:var(--brand-200)}

.nf-help{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin-top:26px;font-size:13px;color:rgba(255,255,255,.55)}
.nf-help span{display:inline-flex;align-items:center;gap:7px}
.nf-help .ic{width:15px;height:15px;flex:none;color:rgba(255,255,255,.4)}
.nf-help a{color:#fff;font-weight:700;border-bottom:1px solid rgba(255,255,255,.3);transition:color .2s,border-color .2s}
.nf-help a:hover{color:var(--brand-200);border-bottom-color:var(--brand-200)}

@media (max-width:900px){
  .nf-code{font-size:clamp(104px,24vw,168px)}
}
@media (max-width:640px){
  .nf-code{font-size:clamp(92px,30vw,140px);margin-bottom:8px}
  .nf-title{font-size:clamp(26px,7.6vw,34px)}
  .nf-links{grid-template-columns:1fr}
  .nf-help{flex-direction:column;align-items:center;gap:8px}
}