/* ============ 火狐赛场 · 共享样式表 /assets/site.css ============ */

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;}
body,h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0;}
ul,ol{padding:0;list-style:none;}
a{color:inherit;text-decoration:none;}
img,svg,video{max-width:100%;display:block;}
button{font:inherit;color:inherit;}
table{border-collapse:collapse;width:100%;}

/* ---------- 变量 ---------- */
:root{
  --flare:#FF4D1C;
  --flare-deep:#D92E12;
  --night:#0B1437;
  --void:#050A1F;
  --cyan:#17E6C8;
  --mint:#A8FFF0;
  --gold:#FFC24B;
  --warm:#FFF6EF;
  --graphite:#1F2533;
  --glass:rgba(255,255,255,.08);
  --glass-line:rgba(255,255,255,.14);
  --line-soft:rgba(31,37,51,.14);
  --line-dark:rgba(255,255,255,.14);
  --rail:clamp(196px,22vw,300px);
  --header-h:76px;
  --shell-max:1460px;
  --gutter:clamp(16px,3.4vw,48px);
  --radius-glass:12px;
  --radius-solid:4px;
  --font-display:"Noto Sans SC","Source Han Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-mono:"JetBrains Mono","Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;
  --font-num:"Roboto Condensed","JetBrains Mono","Roboto Mono",ui-monospace,Menlo,Consolas,monospace;
}

/* ---------- 中文排版底座 ---------- */
body{
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.75;
  color:var(--graphite);
  background:var(--warm);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:900;line-height:1.14;letter-spacing:-.015em;}
h1{font-size:clamp(34px,5.2vw,64px);line-height:1.06;}
h2{font-size:clamp(26px,3.4vw,42px);}
h3{font-size:clamp(19px,2vw,24px);font-weight:700;}
strong,b{font-weight:700;}
code,kbd,pre{font-family:var(--font-mono);}
::selection{background:var(--flare);color:#fff;}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:2px;}
.fx-header :focus-visible,.fx-footer :focus-visible{outline-color:var(--gold);}

/* ---------- 布局工具 ---------- */
.fx-container{width:min(100% - var(--gutter)*2,var(--shell-max));margin-inline:auto;}
.fx-shell{
  display:grid;
  grid-template-columns:var(--rail) minmax(0,1fr);
  gap:clamp(22px,3vw,56px);
  width:min(100% - var(--gutter)*2,var(--shell-max));
  margin-inline:auto;
  padding-block:clamp(30px,4.6vw,68px);
  align-items:start;
}
.fx-rail{position:relative;}
.fx-rail::after{
  content:"";position:absolute;top:0;bottom:0;right:calc(-1 * clamp(11px,1.5vw,28px));
  width:1px;background:linear-gradient(180deg,transparent,var(--line-soft) 10%,var(--line-soft) 90%,transparent);
}
.fx-main{min-width:0;}
.fx-band{position:relative;padding-block:clamp(40px,6vw,88px);}
.fx-band--night{background:radial-gradient(130% 130% at 6% 0%,#14245c 0%,var(--night) 46%,var(--void) 100%);color:var(--warm);}
.fx-band--glass{background:linear-gradient(180deg,rgba(11,20,55,.97),rgba(5,10,31,.99));color:var(--warm);}
.fx-band--warm{background:var(--warm);}
.fx-band--night .fx-prose,.fx-band--glass .fx-prose{color:rgba(255,246,239,.8);}
.fx-band--night .fx-section__head,.fx-band--glass .fx-section__head{border-bottom-color:var(--line-dark);}
.fx-section{margin-block:clamp(30px,4.4vw,64px);}
.fx-section:first-child{margin-top:0;}
.fx-section__head{
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px;
  margin-bottom:clamp(18px,2.4vw,30px);padding-bottom:14px;border-bottom:1px solid var(--line-soft);
}
.fx-slash{
  display:block;height:clamp(34px,5.4vw,78px);
  background:linear-gradient(180deg,var(--night) 0%,var(--night) 56%,transparent 56%);
  clip-path:polygon(0 0,100% 0,100% 60%,0 100%);
}
.fx-slash--flip{transform:scaleX(-1);}

/* ---------- 网格 ---------- */
.fx-grid{display:grid;gap:clamp(14px,1.8vw,24px);}
.fx-grid--2{grid-template-columns:repeat(2,minmax(0,1fr));}
.fx-grid--3{grid-template-columns:repeat(3,minmax(0,1fr));}
.fx-grid--auto{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}

/* ---------- 排版 / 内容组件 ---------- */
.fx-eyebrow{
  display:inline-flex;align-items:center;gap:.55em;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--flare);margin:0 0 12px;
}
.fx-eyebrow::before{content:"";width:24px;height:2px;background:linear-gradient(90deg,var(--flare),var(--gold));}
.fx-band--night .fx-eyebrow,.fx-band--glass .fx-eyebrow{color:var(--cyan);}
.fx-chapter{display:flex;gap:clamp(10px,1.4vw,20px);align-items:flex-start;}
.fx-chapter__no{
  font-family:var(--font-mono);font-weight:700;font-size:clamp(40px,6.4vw,72px);line-height:.86;
  color:var(--flare);opacity:.3;letter-spacing:-.05em;flex:0 0 auto;
}
.fx-chapter__title{font-size:clamp(21px,2.3vw,30px);font-weight:900;line-height:1.2;}
.fx-band--night .fx-chapter__no,.fx-band--glass .fx-chapter__no{color:var(--gold);opacity:.9;}
.fx-prose{max-width:72ch;font-size:17px;}
.fx-prose p{margin-bottom:1.15em;}
.fx-prose p:last-child{margin-bottom:0;}
.fx-prose a{color:var(--flare-deep);text-decoration:underline;text-decoration-color:rgba(255,77,28,.42);text-underline-offset:3px;}
.fx-prose a:hover{color:var(--flare);text-decoration-color:var(--flare);}
.fx-prose h3{margin:1.5em 0 .55em;}
.fx-prose ul,.fx-prose ol{padding-left:1.15em;margin-bottom:1.15em;}
.fx-prose ul{list-style:none;}
.fx-prose ul li{position:relative;}
.fx-prose ul li::before{content:"";position:absolute;left:-1.1em;top:.72em;width:7px;height:2px;background:var(--flare);}
.fx-prose ol{list-style:decimal;}
.fx-card{
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-solid);
  padding:clamp(18px,2.2vw,28px);
}
.fx-card--accent{border-left:4px solid var(--flare);}
.fx-panel{
  background:var(--glass);border:1px solid var(--glass-line);border-radius:var(--radius-glass);
  padding:clamp(18px,2.2vw,28px);backdrop-filter:blur(14px) saturate(140%);
}
.fx-tag{
  display:inline-block;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;
  padding:4px 10px;border-radius:999px;background:var(--mint);color:var(--night);border:1px solid rgba(23,230,200,.5);
}
.fx-tag--flare{background:rgba(255,77,28,.14);color:var(--flare-deep);border-color:rgba(255,77,28,.4);}
.fx-data{font-family:var(--font-num);font-variant-numeric:tabular-nums;letter-spacing:-.01em;}
.fx-stat{display:flex;flex-direction:column;gap:4px;}
.fx-stat__num{font-family:var(--font-num);font-weight:700;font-size:clamp(26px,3.4vw,40px);line-height:1;color:var(--gold);font-variant-numeric:tabular-nums;}
.fx-stat__label{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.14em;color:rgba(31,37,51,.6);}
.fx-band--night .fx-stat__label,.fx-band--glass .fx-stat__label{color:rgba(168,255,240,.66);}
.fx-media{
  position:relative;overflow:hidden;border-radius:var(--radius-solid);
  background:linear-gradient(135deg,var(--night),var(--void));isolation:isolate;
}
.fx-media img{width:100%;height:100%;object-fit:cover;}
.fx-media::after{
  content:"";position:absolute;inset:auto -20% -60% auto;width:70%;height:120%;
  background:linear-gradient(115deg,rgba(255,77,28,.35),transparent 62%);
  transform:skewX(-12deg);pointer-events:none;mix-blend-mode:screen;
}
.fx-media--16x9{aspect-ratio:16/9;}
.fx-media--4x3{aspect-ratio:4/3;}
.fx-media--1x1{aspect-ratio:1/1;}
.fx-media--3x4{aspect-ratio:3/4;}
.fx-media--21x9{aspect-ratio:21/9;}
.fx-media--glass{border-radius:var(--radius-glass);border:1px solid var(--glass-line);}
.fx-media__caption{
  display:block;margin-top:8px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;
  color:rgba(31,37,51,.55);
}
.fx-band--night .fx-media__caption,.fx-band--glass .fx-media__caption{color:rgba(255,246,239,.6);}
.fx-breadcrumb{
  display:flex;flex-wrap:wrap;gap:.55em;margin-bottom:18px;padding:0;list-style:none;
  font-family:var(--font-mono);font-size:12.5px;letter-spacing:.06em;color:rgba(31,37,51,.58);
}
.fx-breadcrumb li{display:flex;gap:.55em;align-items:center;}
.fx-breadcrumb li+li::before{content:"/";color:var(--flare);}
.fx-breadcrumb a:hover{color:var(--flare);}
.fx-band--night .fx-breadcrumb,.fx-band--glass .fx-breadcrumb{color:rgba(255,246,239,.62);}

/* ---------- 按钮 ---------- */
.fx-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:.02em;
  padding:.78em 1.5em;border:1px solid transparent;border-radius:var(--radius-solid);
  cursor:pointer;transition:transform .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease;
  white-space:nowrap;
}
.fx-btn--primary{background:linear-gradient(120deg,var(--flare),var(--flare-deep));color:#fff;box-shadow:0 8px 22px rgba(255,77,28,.3);}
.fx-btn--primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(255,77,28,.4);}
.fx-btn--ghost{background:transparent;border-color:rgba(23,230,200,.6);color:var(--cyan);}
.fx-btn--ghost:hover{background:rgba(23,230,200,.14);color:var(--mint);}
.fx-btn--light{background:#fff;color:var(--night);border-color:var(--line-soft);}
.fx-btn--light:hover{border-color:var(--flare);color:var(--flare-deep);}
.fx-btn--sm{padding:.55em 1.05em;font-size:13px;}
.fx-btn--block{width:100%;}
.fx-visually-hidden{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* ---------- 显现动效 ---------- */
.fx-anim [data-reveal]{opacity:0;transform:translateY(20px);}
.fx-anim [data-reveal].is-visible{
  opacity:1;transform:none;
  transition:opacity .65s ease,transform .65s cubic-bezier(.22,.9,.2,1);
  transition-delay:calc(var(--stagger,0) * 80ms);
}

/* ---------- 头部 · 框架式导航 ---------- */
.fx-skip{
  position:fixed;top:10px;left:10px;z-index:200;
  transform:translateY(-180%);
  background:var(--cyan);color:var(--void);font-family:var(--font-display);font-weight:700;
  font-size:14px;padding:10px 16px;border-radius:var(--radius-solid);
  transition:transform .22s ease;
}
.fx-skip:focus{transform:translateY(0);}
.fx-header{
  position:sticky;top:0;z-index:80;isolation:isolate;
  background:rgba(5,10,31,.94);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  backdrop-filter:blur(16px) saturate(150%);
  border-bottom:1px solid rgba(23,230,200,.24);
  color:var(--warm);
}
.fx-header__flame{
  position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--flare-deep),var(--flare) 26%,var(--gold) 54%,var(--cyan) 100%);
  background-size:220% 100%;
  animation:fx-flame 9s linear infinite;
}
@keyframes fx-flame{
  0%{background-position:0% 50%;}
  100%{background-position:220% 50%;}
}
.fx-header__inner{
  width:min(100% - var(--gutter)*2,var(--shell-max));
  margin-inline:auto;
  min-height:var(--header-h);
  display:flex;align-items:center;gap:clamp(14px,2vw,32px);
}
.fx-header__progress{
  position:absolute;left:0;bottom:-1px;width:100%;height:2px;
  background:linear-gradient(90deg,var(--flare),var(--gold) 55%,var(--cyan));
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform .12s linear;
}
.fx-brand{display:flex;align-items:center;gap:12px;flex:0 0 auto;}
.fx-brand__mark{
  position:relative;width:34px;height:34px;flex:0 0 auto;display:block;
  background:linear-gradient(135deg,var(--flare),var(--flare-deep) 58%,var(--gold));
  border-radius:10px 3px 10px 3px;transform:rotate(-6deg);
  box-shadow:0 6px 18px rgba(255,77,28,.36);
}
.fx-brand__mark::before{
  content:"";position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;
  background:var(--void);border-radius:50% 50% 50% 0;transform:rotate(45deg);
}
.fx-brand__mark::after{
  content:"";position:absolute;right:-3px;top:-3px;width:7px;height:7px;border-radius:50%;
  background:var(--cyan);box-shadow:0 0 0 2px rgba(5,10,31,.92);
}
.fx-brand__text{display:block;}
.fx-brand__name{display:block;font-family:var(--font-display);font-weight:900;font-size:19px;line-height:1.1;letter-spacing:.04em;color:var(--warm);}
.fx-brand__tag{display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:rgba(168,255,240,.7);}
.fx-nav-toggle{
  display:none;margin-left:auto;align-items:center;gap:9px;
  background:rgba(255,255,255,.06);border:1px solid rgba(23,230,200,.38);color:var(--warm);
  border-radius:var(--radius-solid);padding:9px 13px;cursor:pointer;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;
  transition:background-color .2s ease,border-color .2s ease;
}
.fx-nav-toggle__bars{display:grid;gap:4px;width:18px;}
.fx-nav-toggle__bars i{display:block;height:2px;background:var(--cyan);transition:transform .25s ease,opacity .2s ease;}
.fx-nav-toggle[aria-expanded="true"]{background:rgba(23,230,200,.16);border-color:var(--cyan);}
.fx-nav-toggle[aria-expanded="true"] .fx-nav-toggle__bars i:nth-child(1){transform:translateY(6px) rotate(45deg);}
.fx-nav-toggle[aria-expanded="true"] .fx-nav-toggle__bars i:nth-child(2){opacity:0;}
.fx-nav-toggle[aria-expanded="true"] .fx-nav-toggle__bars i:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
.fx-nav{margin-left:auto;display:flex;align-items:center;gap:clamp(12px,1.6vw,26px);}
.fx-nav__list{display:flex;align-items:center;gap:clamp(10px,1.4vw,22px);}
.fx-nav__link{
  position:relative;display:inline-block;padding:6px 2px;
  font-size:15px;font-weight:500;color:rgba(255,246,239,.82);
  transition:color .2s ease;
}
.fx-nav__link::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--flare));
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform .28s cubic-bezier(.22,.9,.2,1);
}
.fx-nav__link::before{content:"";position:absolute;left:50%;top:-9px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--gold);opacity:0;transition:opacity .2s ease;}
.fx-nav__link:hover{color:#fff;}
.fx-nav__link:hover::after{transform:scaleX(1);}
.fx-nav__link[aria-current="page"]{color:#fff;}
.fx-nav__link[aria-current="page"]::after{transform:scaleX(1);background:linear-gradient(90deg,var(--cyan),var(--cyan));}
.fx-nav__link[aria-current="page"]::before{opacity:1;}
.fx-nav__aside{
  display:flex;align-items:center;gap:14px;
  padding-left:clamp(12px,1.4vw,20px);border-left:1px solid var(--line-dark);
}
.fx-header__search{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;white-space:nowrap;
  color:rgba(168,255,240,.62);border:1px dashed rgba(23,230,200,.36);
  border-radius:999px;padding:5px 12px;
}
.fx-nav-backdrop{
  display:none;position:fixed;left:0;right:0;top:var(--header-h);bottom:0;z-index:85;
  background:radial-gradient(circle at 82% 6%,rgba(255,77,28,.3),rgba(5,10,31,.84) 62%);
  opacity:0;pointer-events:none;transition:opacity .3s ease;
}

/* ---------- 页脚 ---------- */
.fx-footer{
  position:relative;overflow:hidden;
  background:var(--void);color:rgba(255,246,239,.78);
  margin-top:clamp(44px,7vw,110px);
}
.fx-footer::before{
  content:"";position:absolute;top:-140px;right:-160px;width:540px;height:540px;pointer-events:none;
  background:radial-gradient(circle,rgba(255,77,28,.32),transparent 68%);
}
.fx-footer__edge{
  display:block;height:clamp(28px,4.6vw,60px);
  background:linear-gradient(90deg,var(--flare),var(--gold) 46%,var(--cyan));
  clip-path:polygon(0 0,100% 0,100% 16%,0 100%);
}
.fx-footer__inner{
  position:relative;
  width:min(100% - var(--gutter)*2,var(--shell-max));
  margin-inline:auto;
  padding:clamp(36px,5.4vw,68px) 0 clamp(20px,2.6vw,34px);
  display:grid;
  grid-template-columns:minmax(250px,1.5fr) repeat(4,minmax(120px,1fr));
  gap:clamp(24px,3vw,46px);
}
.fx-footer__col{min-width:0;}
.fx-footer__col--brand{max-width:420px;}
.fx-brand--footer .fx-brand__name{font-size:20px;}
.fx-brand__desc{
  margin-top:16px;font-size:14.5px;line-height:1.8;color:rgba(255,246,239,.72);max-width:36ch;
}
.fx-footer__stats{
  display:flex;flex-wrap:wrap;gap:clamp(12px,2vw,26px);
  margin-top:20px;padding-top:16px;border-top:1px dashed var(--line-dark);
}
.fx-footer__stats li{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:rgba(168,255,240,.6);}
.fx-footer__stats b{display:block;font-family:var(--font-num);font-size:20px;line-height:1.2;color:var(--gold);letter-spacing:0;}
.fx-footer__contact{margin-top:20px;font-size:13.5px;line-height:1.9;color:rgba(255,246,239,.68);}
.fx-footer__contact li{display:flex;gap:10px;align-items:baseline;}
.fx-footer__label{
  flex:0 0 auto;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;
  color:rgba(23,230,200,.78);min-width:56px;
}
.fx-footer__title{
  font-family:var(--font-mono);font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cyan);margin-bottom:14px;
}
.fx-footer__list{display:grid;gap:9px;}
.fx-footer__list a{
  display:inline-block;font-size:14.5px;color:rgba(255,246,239,.78);
  transition:color .2s ease,transform .2s ease;
}
.fx-footer__list a:hover{color:var(--gold);transform:translateX(3px);}
.fx-footer__bottom{
  position:relative;
  width:min(100% - var(--gutter)*2,var(--shell-max));
  margin-inline:auto;
  border-top:1px solid rgba(255,255,255,.1);
  padding:18px 0 30px;
  display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;align-items:center;
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;color:rgba(255,246,239,.52);
}

/* ---------- 平板 ---------- */
@media (max-width:1024px){
  :root{--header-h:66px;}
  .fx-nav-backdrop{display:block;}
  .fx-nav-toggle{display:inline-flex;}
  .fx-nav{
    position:fixed;top:var(--header-h);right:0;bottom:0;z-index:90;
    margin:0;width:min(86vw,350px);
    flex-direction:column;align-items:stretch;gap:20px;
    padding:26px 22px 40px;overflow-y:auto;
    background:linear-gradient(180deg,rgba(11,20,55,.99),rgba(5,10,31,.995));
    border-left:1px solid rgba(23,230,200,.32);
    transform:translateX(103%);
    transition:transform .36s cubic-bezier(.22,.9,.2,1);
  }
  .fx-nav[data-open]{transform:translateX(0);}
  .fx-nav__list{flex-direction:column;align-items:stretch;gap:0;}
  .fx-nav__link{
    display:block;padding:14px 6px;font-size:17px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .fx-nav__link::after{display:none;}
  .fx-nav__link[aria-current="page"]{color:var(--cyan);padding-left:20px;}
  .fx-nav__link[aria-current="page"]::before{left:3px;top:50%;margin-top:-2.5px;opacity:1;}
  .fx-nav__aside{
    flex-direction:column;align-items:stretch;gap:14px;
    padding:20px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.12);
  }
  .fx-nav__aside .fx-btn{width:100%;}
  .fx-shell{grid-template-columns:1fr;gap:clamp(20px,4vw,36px);}
  .fx-rail::after{display:none;}
  .fx-footer__inner{grid-template-columns:repeat(2,minmax(0,1fr));}
  .fx-footer__col--brand{grid-column:1 / -1;max-width:none;}
}

/* ---------- 手机 ---------- */
@media (max-width:760px){
  body{font-size:16px;}
  .fx-grid--2,.fx-grid--3{grid-template-columns:1fr;}
  .fx-grid--auto{grid-template-columns:1fr;}
  .fx-footer__inner{grid-template-columns:1fr;gap:26px;}
  .fx-footer__bottom{flex-direction:column;align-items:flex-start;gap:8px;}
  .fx-chapter{flex-direction:column;gap:6px;}
  .fx-chapter__no{font-size:clamp(38px,13vw,56px);}
  .fx-header__inner{gap:12px;}
  .fx-brand__name{font-size:17px;}
  .fx-brand__tag{font-size:9px;letter-spacing:.18em;}
}

/* ---------- 动效偏好 ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  .fx-anim [data-reveal]{opacity:1;transform:none;}
  .fx-header__flame{background-position:0% 50%;}
}