/* ============ 潮汐守望者 · 圣火双神 首页 ============ */
:root{
  --void:#070403; --ash:#120a07; --coal:#1b0f0a; --char:#26150d;
  --ember:#ff5a1f; --flame:#ff8a2a; --gold:#f2b552; --gold-hi:#ffe2a3;
  --blood:#9b1a0c; --bone:#f3e6cf; --mute:#a08c74; --dim:#6b5a48;
  --line:rgba(242,181,82,.16); --line-hi:rgba(242,181,82,.45);
  --ease:cubic-bezier(.2,.8,.2,1); --ease-io:cubic-bezier(.7,0,.2,1);
  --sky:#8fc4ee; --sky-hi:#d8ecff; --sky-deep:#2b5b8c; --steel:#c9d3dc;
  --mx:.5; --my:.5;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--void)}
body{font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;
  background:var(--void);color:var(--bone);overflow-x:hidden;-webkit-font-smoothing:antialiased}
.sans{font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
body.is-loading{overflow:hidden}
main{overflow-x:clip}
::selection{background:var(--ember);color:#000}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}

/* ---------- 全局氛围层 ---------- */
#embers{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;mix-blend-mode:screen}
.grain{position:fixed;inset:-50%;z-index:60;pointer-events:none;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.cursor-glow{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;
  pointer-events:none;z-index:2;background:radial-gradient(circle,rgba(255,110,40,.13),transparent 62%);
  transform:translate3d(var(--cx,-999px),var(--cy,-999px),0);transition:opacity .4s}
.scroll-line{position:fixed;left:0;top:0;height:2px;width:100%;z-index:90;pointer-events:none}
.scroll-line i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(var(--sp,0));
  background:linear-gradient(90deg,var(--blood),var(--ember),var(--gold-hi));box-shadow:0 0 12px var(--ember)}

/* ---------- 开场 ---------- */
.intro{position:fixed;inset:0;z-index:200;background:var(--void);display:grid;place-items:center;
  transition:clip-path 1.1s var(--ease-io),visibility 0s 1.1s;clip-path:circle(150% at 50% 50%)}
.intro.done{clip-path:circle(0% at 50% 50%);visibility:hidden}
.intro>*{grid-area:1/1}
.intro-core{width:14px;height:14px;border-radius:50%;background:var(--gold-hi);
  box-shadow:0 0 30px 10px var(--ember),0 0 120px 40px rgba(255,90,31,.5);animation:core 1.6s var(--ease) both}
@keyframes core{0%{transform:scale(0)}40%{transform:scale(1.4)}100%{transform:scale(1)}}
.intro-ring{width:240px;height:240px;border-radius:50%;border:1px solid var(--line-hi);
  animation:ring 1.6s .2s var(--ease) both}
@keyframes ring{0%{transform:scale(.2);opacity:0}60%{opacity:1}100%{transform:scale(1.3);opacity:0}}
.intro-logo{width:min(300px,64vw);opacity:0;filter:drop-shadow(0 0 30px rgba(255,90,31,.5));animation:introLogo 1s .5s var(--ease) forwards}
@keyframes introLogo{from{opacity:0;transform:translateY(20px) scale(.92);filter:blur(10px)}to{opacity:1;transform:none;filter:drop-shadow(0 0 30px rgba(255,90,31,.5))}}
.intro-bar{align-self:end;margin-bottom:12vh;width:160px;height:1px;background:rgba(255,255,255,.08);overflow:hidden}
.intro-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,transparent,var(--gold),transparent);
  transform:translateX(-100%);animation:bar 1.4s .3s var(--ease-io) infinite}
@keyframes bar{to{transform:translateX(100%)}}
/* ---------- 导航 ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:80;transition:background .5s,backdrop-filter .5s,border-color .5s;border-bottom:1px solid transparent}
.nav::before{content:"";position:absolute;inset:0 0 -40px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(7,4,3,.85),rgba(7,4,3,0));transition:opacity .5s}
.nav.scrolled::before{opacity:0}
.nav-links a{text-shadow:0 1px 6px rgba(0,0,0,.9)}
.nav.scrolled{background:rgba(9,5,4,.72);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-color:var(--line)}
.nav-in{max-width:1440px;margin:0 auto;height:76px;padding:0 clamp(16px,4vw,48px);display:flex;align-items:center;gap:28px}
.nav-logo img{height:44px;width:auto;filter:drop-shadow(0 0 12px rgba(255,90,31,.25));transition:transform .4s var(--ease)}
.nav-logo:hover img{transform:scale(1.05)}
.nav-links{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav-links a{position:relative;padding:10px 14px;font-size:.88rem;letter-spacing:.08em;color:#d8c6a8;transition:color .3s}
.nav-links a::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);transition:transform .45s var(--ease)}
.nav-links a:hover{color:var(--bone)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-links .hot{color:var(--flame)}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 26px;
  font-size:.92rem;font-weight:700;letter-spacing:.14em;white-space:nowrap;border-radius:2px;isolation:isolate;overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s,color .3s,border-color .3s}
.btn svg{width:16px;height:16px;transition:transform .4s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-fire{color:#1a0802;background:linear-gradient(135deg,#ffd27a 0%,#ff8a2a 45%,#e2400f 100%);
  box-shadow:0 0 0 1px rgba(255,210,122,.5) inset,0 10px 40px -8px rgba(255,90,31,.7)}
.btn-fire::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);
  transform:translateX(-120%);animation:sheen 3.6s 2s var(--ease-io) infinite}
@keyframes sheen{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.btn-fire:hover{box-shadow:0 0 0 1px rgba(255,230,170,.8) inset,0 16px 60px -6px rgba(255,90,31,.95)}
.btn-ghost{color:var(--bone);border:1px solid var(--line-hi);background:rgba(20,10,6,.4);backdrop-filter:blur(8px)}
.btn-ghost::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,rgba(255,138,42,.22),rgba(155,26,12,.25));opacity:0;transition:opacity .4s}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-hi)}
.btn-ghost:hover::before{opacity:1}
.btn-sm{height:40px;padding:0 20px;font-size:.82rem}
.burger{display:none;margin-left:auto;width:44px;height:44px;border:1px solid var(--line-hi);background:transparent;color:var(--bone);border-radius:2px;cursor:pointer;position:relative}
.burger i{position:absolute;left:12px;right:12px;height:1.5px;background:currentColor;transition:transform .4s var(--ease),opacity .3s}
.burger i:nth-child(1){top:16px}.burger i:nth-child(2){top:21px}.burger i:nth-child(3){top:26px}
.menu-open .burger i:nth-child(1){transform:translateY(5px) rotate(45deg)}
.menu-open .burger i:nth-child(2){opacity:0}
.menu-open .burger i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:79;background:rgba(7,4,3,.96);backdrop-filter:blur(20px);display:flex;flex-direction:column;justify-content:center;gap:6px;padding:90px 32px 40px;
  clip-path:circle(0% at calc(100% - 40px) 38px);transition:clip-path .7s var(--ease-io);visibility:hidden}
.menu-open .drawer{clip-path:circle(150% at calc(100% - 40px) 38px);visibility:visible}
.drawer a{font-size:1.6rem;font-weight:700;letter-spacing:.12em;padding:12px 0;border-bottom:1px solid var(--line);
  opacity:0;transform:translateY(20px);transition:opacity .5s,transform .5s var(--ease)}
.menu-open .drawer a{opacity:1;transform:none}
.drawer a small{display:block;font-size:.7rem;letter-spacing:.3em;color:var(--dim);font-weight:400;margin-top:2px}
/* ---------- HERO：圣火 × 天光 ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:680px;overflow:hidden;isolation:isolate;--seam:52%}
.hero-bg{position:absolute;inset:-4%;z-index:-3;background:url(hero/poster.webp) center/cover no-repeat;
  filter:saturate(1.15) brightness(.55) blur(2px);transform:scale(1.08) translate3d(calc((var(--mx) - .5) * -24px),calc((var(--my) - .5) * -16px),0);transition:transform .2s linear}
.hero-inferno,.hero-heaven{position:absolute;inset:0;z-index:-2;pointer-events:none}
.hero-inferno{background:
  radial-gradient(60% 80% at 18% 60%,rgba(255,96,24,.55),transparent 60%),
  radial-gradient(40% 50% at 30% 100%,rgba(255,170,60,.55),transparent 70%),
  linear-gradient(90deg,rgba(60,10,2,.85),rgba(60,10,2,0) 60%);
  clip-path:polygon(0 0,calc(var(--seam) + 6%) 0,calc(var(--seam) - 6%) 100%,0 100%);mix-blend-mode:screen;animation:breathe 5s ease-in-out infinite}
.hero-heaven{background:
  radial-gradient(55% 70% at 82% 30%,rgba(143,196,238,.55),transparent 65%),
  linear-gradient(270deg,rgba(18,40,70,.8),rgba(18,40,70,0) 60%);
  clip-path:polygon(calc(var(--seam) + 6%) 0,100% 0,100% 100%,calc(var(--seam) - 6%) 100%);mix-blend-mode:screen}
@keyframes breathe{50%{opacity:.75}}
.hero-seam{position:absolute;z-index:-1;top:-10%;bottom:-10%;left:var(--seam);width:2px;transform:translateX(-50%) rotate(12deg);
  background:linear-gradient(180deg,transparent,var(--gold-hi) 30%,#fff 50%,var(--gold-hi) 70%,transparent);
  box-shadow:0 0 30px 8px rgba(255,210,140,.55),0 0 120px 40px rgba(255,140,60,.25);animation:seam 4s ease-in-out infinite}
@keyframes seam{50%{opacity:.6;box-shadow:0 0 20px 4px rgba(255,210,140,.4),0 0 80px 20px rgba(255,140,60,.18)}}
.hero-vignette{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 40%,transparent 45%,rgba(7,4,3,.85) 100%),linear-gradient(0deg,var(--void) 0%,rgba(7,4,3,.0) 34%)}

.hero-char{position:absolute;z-index:0;pointer-events:none;will-change:transform}
.hero-char img{width:100%;height:auto;user-select:none}
.char-j{left:-3vw;bottom:-6vh;width:min(46vw,760px);
  transform:translate3d(calc((var(--mx) - .5) * 36px),calc((var(--my) - .5) * 20px + var(--hy,0px)),0)}
.char-j img{filter:drop-shadow(0 0 40px rgba(255,90,31,.55)) drop-shadow(0 30px 40px rgba(0,0,0,.6))}
.char-g{right:-8vw;bottom:-8vh;width:min(70vw,1180px);
  transform:translate3d(calc((var(--mx) - .5) * 56px),calc((var(--my) - .5) * 26px + var(--hy2,0px)),0)}
.char-g img{filter:drop-shadow(0 0 50px rgba(143,196,238,.45)) drop-shadow(0 30px 40px rgba(0,0,0,.6))}
.char-in{opacity:0;transition:opacity 1.4s var(--ease),transform 1.6s var(--ease),filter 1.6s var(--ease)}
.char-j .char-in{transform:translateX(-12%) scale(1.05);filter:blur(12px)}
.char-g .char-in{transform:translateX(12%) scale(1.05);filter:blur(12px)}
.ready .char-in{opacity:1;transform:none;filter:none}
.ready .char-g .char-in{transition-delay:.18s}
.char-float{animation:float 7s ease-in-out infinite}
.char-g .char-float{animation-duration:8.5s;animation-delay:-3s}
@keyframes float{50%{transform:translateY(-14px)}}

.hero-copy::before{content:"";position:absolute;z-index:-1;left:50%;top:55%;width:150%;height:150%;transform:translate(-50%,-50%);pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(7,4,3,.82),rgba(7,4,3,.45) 55%,transparent 75%)}
.hero-copy{position:absolute;z-index:4;left:50%;bottom:clamp(64px,11vh,130px);transform:translateX(-50%);width:min(980px,92vw);text-align:center}
.hero-kicker{display:inline-flex;align-items:center;gap:14px;font-size:.78rem;letter-spacing:.5em;color:var(--gold-hi);text-shadow:0 0 12px #000,0 0 4px #000;text-transform:uppercase;margin-bottom:18px}
.hero-kicker::before,.hero-kicker::after{content:"";width:46px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.hero-kicker::after{transform:scaleX(-1)}
.hero-title{font-size:clamp(3.2rem,10.5vw,9.6rem);font-weight:900;line-height:.95;letter-spacing:.06em;perspective:800px;
  filter:drop-shadow(0 6px 0 rgba(60,12,2,.6)) drop-shadow(0 0 40px rgba(255,90,31,.45))}
.hero-title .ch{display:inline-block;background:linear-gradient(180deg,#fff8e8 0%,#ffd88e 38%,#ff8a2a 70%,#b8300c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0;transform:translateY(60%) rotateX(-70deg);filter:blur(10px);
  transition:opacity 1s var(--ease),transform 1.1s var(--ease),filter 1s var(--ease);transition-delay:calc(var(--i) * 90ms + .35s)}
.ready .hero-title .ch{opacity:1;transform:none;filter:none}
.hero-sub{margin:22px auto 0;max-width:620px;font-size:clamp(.92rem,1.4vw,1.05rem);line-height:1.9;color:#e9d8bf;text-shadow:0 2px 10px #000}
.hero-sub b{color:var(--flame);font-weight:700}
.hero-sub em{font-style:normal;color:var(--sky-hi)}
.hero-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:30px auto 0;max-width:760px}
.fade-up{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.ready .fade-up{opacity:1;transform:none}
.ready .d1{transition-delay:1s}.ready .d2{transition-delay:1.15s}.ready .d3{transition-delay:1.3s}
.hero-side{position:absolute;z-index:4;top:50%;font-size:.7rem;letter-spacing:.6em;writing-mode:vertical-rl;color:rgba(243,230,207,.5)}
.hero-side.l{left:clamp(14px,2.4vw,36px);transform:translateY(-50%)}
.hero-side.r{right:clamp(14px,2.4vw,36px);transform:translateY(-50%)}
.hero-side b{color:var(--flame);font-weight:400}
.hero-side.r b{color:var(--sky)}
.hero-scroll{position:absolute;z-index:4;left:50%;bottom:22px;transform:translateX(-50%);width:22px;height:36px;border:1px solid var(--line-hi);border-radius:12px}
.hero-scroll::after{content:"";position:absolute;left:50%;top:7px;width:2px;height:7px;margin-left:-1px;background:var(--gold);border-radius:2px;animation:wheel 1.8s infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(-3px)}40%{opacity:1}100%{opacity:0;transform:translateY(10px)}}
/* ---------- 跑马灯 ---------- */
.marquee{position:relative;z-index:5;overflow:hidden;padding:18px 0;transform:rotate(-2deg) scale(1.04);margin:-30px 0 0;
  background:linear-gradient(90deg,#7c1607,#e2400f 30%,#ff8a2a 50%,#e2400f 70%,#7c1607);box-shadow:0 0 60px rgba(255,90,31,.45)}
.marquee-track{display:flex;width:max-content;gap:34px;align-items:center;animation:mq 34s linear infinite}
.marquee span{font-size:clamp(1.1rem,2.4vw,1.8rem);font-weight:900;letter-spacing:.2em;color:#1a0602;white-space:nowrap}
.marquee i{font-style:normal;color:#ffe2a3;font-size:1rem}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- 通用区块 ---------- */
.sec{position:relative;z-index:4;max-width:1320px;margin:0 auto;padding:clamp(80px,12vw,150px) clamp(18px,4vw,48px) 0}
.sec-head{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:24px;margin-bottom:clamp(36px,5vw,64px);padding-bottom:22px;border-bottom:1px solid var(--line)}
.sec-no{font-size:clamp(3rem,7vw,5.6rem);font-weight:900;line-height:.8;color:transparent;-webkit-text-stroke:1px var(--line-hi)}
.sec-en{font-size:.72rem;letter-spacing:.5em;text-transform:uppercase;color:var(--flame);margin-bottom:10px}
.sec-title{font-size:clamp(2rem,4.6vw,3.6rem);font-weight:900;letter-spacing:.06em;line-height:1.1}
.sec-title span{background:linear-gradient(180deg,#ffe2a3,#ff8a2a 70%,#c23a10);-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-desc{max-width:300px;font-size:.88rem;line-height:1.8;color:var(--mute);text-align:right}
.reveal{opacity:0;transform:translateY(50px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- 数据 ---------- */
.stats{position:relative;z-index:4;max-width:1320px;margin:0 auto;padding:90px clamp(18px,4vw,48px) 0;display:grid;grid-template-columns:repeat(4,1fr)}
.stat{text-align:center;padding:14px 10px;border-left:1px solid var(--line)}
.stat:first-child{border-left:0}
.stat b{display:block;font-size:clamp(2.4rem,5.4vw,4.4rem);font-weight:900;line-height:1;
  background:linear-gradient(180deg,#fff3d6,#f2b552 60%,#b0560f);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{display:block;margin-top:10px;font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:.8rem;letter-spacing:.3em;color:var(--mute)}
.stats .stat:nth-child(2){transition-delay:.1s}.stats .stat:nth-child(3){transition-delay:.2s}.stats .stat:nth-child(4){transition-delay:.3s}

.tag{display:inline-block;font-size:.68rem;letter-spacing:.3em;padding:6px 12px;border:1px solid var(--line-hi);color:var(--gold-hi);background:rgba(7,4,3,.5)}
.ev-go{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:.82rem;letter-spacing:.2em;color:var(--flame)}
.ev-go svg{width:16px;height:16px;transition:transform .4s var(--ease)}
.dot{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 0 rgba(74,222,128,.6);animation:ping 2s infinite;flex-shrink:0}
@keyframes ping{70%{box-shadow:0 0 0 10px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}

/* ---------- 双神卡池 ---------- */
.pools{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pool{position:relative;display:flex;align-items:flex-end;min-height:560px;padding:clamp(24px,3vw,40px);overflow:hidden;isolation:isolate;
  border:1px solid var(--line);transition:border-color .4s,box-shadow .5s,transform .5s var(--ease)}
.pool-fire{background:radial-gradient(80% 70% at 70% 30%,rgba(255,96,24,.5),transparent 65%),linear-gradient(160deg,#3a0d04,#120604 70%)}
.pool-sky{background:radial-gradient(80% 70% at 30% 25%,rgba(143,196,238,.45),transparent 65%),linear-gradient(200deg,#13304e,#0a0c12 70%)}
.pool-fire:hover{border-color:rgba(255,138,42,.7);box-shadow:0 30px 90px -30px rgba(255,90,31,.8)}
.pool-sky:hover{border-color:rgba(143,196,238,.7);box-shadow:0 30px 90px -30px rgba(143,196,238,.6)}
.pool::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(7,4,3,.97) 10%,rgba(7,4,3,.55) 42%,transparent 70%)}
.pool-art{position:absolute;z-index:-2;inset:0;display:flex;justify-content:center;align-items:flex-start}
.pool-art img{height:118%;width:auto;max-width:none;object-fit:contain;transform:translateY(-4%) scale(1);transition:transform 1.4s var(--ease),filter .8s}
.pool-sky .pool-art img{height:100%;transform:translate(8%,-2%)}
.pool:hover .pool-art img{transform:translateY(-7%) scale(1.06);filter:brightness(1.12) saturate(1.15)}
.pool-sky:hover .pool-art img{transform:translate(8%,-5%) scale(1.06)}
.pool-body{position:relative;width:100%}
.pool h3{font-size:clamp(2.4rem,4.6vw,4rem);font-weight:900;letter-spacing:.1em;margin:14px 0 4px;line-height:1.05}
.pool-fire h3{background:linear-gradient(180deg,#fff2d0,#ff9a3a 60%,#d23a0c);-webkit-background-clip:text;background-clip:text;color:transparent}
.pool-sky h3{background:linear-gradient(180deg,#ffffff,#cfe6ff 50%,#7fb2e0);-webkit-background-clip:text;background-clip:text;color:transparent}
.pool-sky .tag{color:var(--sky-hi);border-color:rgba(143,196,238,.45)}
.pool-sky .ev-go{color:var(--sky)}
.pool-name{font-size:.86rem;letter-spacing:.3em;color:var(--mute)}
.pool-pts{list-style:none;margin-top:18px;display:grid;gap:8px}
.pool-pts li{display:flex;gap:12px;align-items:baseline;font-size:.86rem;color:#d9c8ad}
.pool-pts b{flex-shrink:0;min-width:56px;font-size:.74rem;letter-spacing:.1em;padding:3px 8px;text-align:center;color:#1a0802;background:linear-gradient(135deg,#ffd27a,#ff8a2a)}
.pool-sky .pool-pts b{background:linear-gradient(135deg,#eaf5ff,#8fc4ee);color:#0b1a2a}
.pool:hover .ev-go svg{transform:translateX(6px)}
.feats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:18px;background:var(--line);border:1px solid var(--line)}
.feat{padding:24px 22px;background:var(--void);display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center}
.feat i{grid-row:span 2;font-style:normal;font-size:1.6rem;color:var(--gold);text-shadow:0 0 18px rgba(255,138,42,.6)}
.feat b{font-size:1rem;letter-spacing:.08em}
.feat span{font-size:.76rem;color:var(--dim);margin-top:3px}
.feats .feat:nth-child(2){transition-delay:.08s}.feats .feat:nth-child(3){transition-delay:.16s}.feats .feat:nth-child(4){transition-delay:.24s}
.tool.big .t-art{position:absolute;z-index:-1;right:-12%;top:-6%;height:118%;width:auto;max-width:none;opacity:.55;
  -webkit-mask:linear-gradient(270deg,#000 30%,transparent 90%);mask:linear-gradient(270deg,#000 30%,transparent 90%);transition:transform 1.2s var(--ease),opacity .6s}
.tool.big:hover .t-art{transform:translateX(-4%) scale(1.04);opacity:.8}
.minor{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;margin-top:18px;background:var(--line);border:1px solid var(--line)}
.minor a{display:flex;align-items:center;gap:12px;padding:18px 22px;background:var(--ash);font-size:.88rem;transition:background .4s}
.minor a:hover{background:#2a140b}
.minor em{margin-left:auto;font-style:normal;font-size:.74rem;color:var(--gold);white-space:nowrap}
.m-tag{font-size:.66rem;letter-spacing:.2em;padding:3px 8px;border:1px solid var(--line-hi);color:var(--gold-hi)}

/* ---------- 抽卡展示 ---------- */
.summon{position:relative;z-index:4;margin-top:clamp(90px,12vw,150px);padding:clamp(70px,9vw,120px) clamp(18px,4vw,48px);
  display:grid;grid-template-columns:minmax(280px,.8fr) 1.6fr;gap:clamp(30px,5vw,70px);align-items:center;max-width:1440px;margin-left:auto;margin-right:auto;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.summon-glow{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(40% 60% at 70% 50%,rgba(255,90,31,.22),transparent 70%),
  radial-gradient(30% 50% at 90% 20%,rgba(143,196,238,.14),transparent 70%)}
.summon-glow::before{content:"";position:absolute;left:70%;top:50%;width:900px;height:900px;margin:-450px 0 0 -450px;border-radius:50%;
  background:repeating-conic-gradient(from 0deg,rgba(242,181,82,.06) 0 4deg,transparent 4deg 12deg);animation:spin 80s linear infinite;
  -webkit-mask:radial-gradient(circle,#000 30%,transparent 70%);mask:radial-gradient(circle,#000 30%,transparent 70%)}
@keyframes spin{to{transform:rotate(360deg)}}
.summon-copy .sec-no{display:block;margin-bottom:18px}
.summon-copy>p.sans{margin-top:18px;font-size:.95rem;line-height:1.9;color:#cdbba2}
.summon-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.summon-tip{margin-top:16px;font-size:.8rem!important;color:var(--mute)!important;letter-spacing:.1em;min-height:1.4em}
.summon-tip.gold{color:var(--gold-hi)!important}
.deck{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(8px,1.2vw,16px);perspective:1400px}
.card{position:relative;aspect-ratio:666/1024;cursor:pointer;padding:0;border:0;background:none;color:inherit;font:inherit;overflow:visible;
  transition:transform .4s var(--ease)}
.card-rot{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .9s var(--ease)}
.card.flip .card-rot{transform:rotateY(180deg)}
.card.deal{animation:deal .7s var(--ease) both;animation-delay:calc(var(--i) * 60ms)}
@keyframes deal{from{opacity:0;transform:translateY(-80px) rotate(calc((var(--i) - 5) * 6deg)) scale(.7)}}
.card:hover:not(.flip){transform:translateY(-8px)}
.card-face{display:block;position:absolute;inset:0;transform:rotateY(0deg) translateZ(1px);backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:6px;overflow:hidden}
.card-back{background:url(cards/back.webp) center/cover;box-shadow:0 14px 30px -10px rgba(0,0,0,.8)}
.card-front{transform:rotateY(180deg) translateZ(1px);background:#140b07 center/cover;border:1px solid rgba(242,181,82,.3);display:flex;align-items:flex-end}
.card-front img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%}
.card-front span{display:block;position:relative;width:100%;padding:18px 4px 8px;text-align:center;font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:clamp(.6rem,1vw,.8rem);font-weight:700;
  background:linear-gradient(0deg,rgba(0,0,0,.9),transparent)}
.card.ssr .card-front{border:2px solid var(--gold);box-shadow:0 0 30px rgba(255,170,60,.8),0 0 80px rgba(255,90,31,.5)}
.card.ssr .card-front::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,240,200,.55) 48%,transparent 62%);
  background-size:250% 100%;animation:holo 2.4s linear infinite;mix-blend-mode:overlay}
@keyframes holo{from{background-position:120% 0}to{background-position:-120% 0}}
.card.sr .card-front{border-color:#b388ff;box-shadow:0 0 20px rgba(179,136,255,.5)}
.card .burst{position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px;border-radius:50%;pointer-events:none;z-index:3;transform:translateZ(1px)}
.card.ssr.flip .burst{animation:burst .9s var(--ease) both;animation-delay:.35s;background:radial-gradient(circle,#fff,var(--gold) 30%,transparent 70%)}
@keyframes burst{0%{transform:scale(0);opacity:1}100%{transform:scale(40);opacity:0}}

/* ---------- 工具 ---------- */
.tabs{position:relative;display:flex;flex-wrap:wrap;gap:4px;margin-bottom:28px}
.tab{position:relative;z-index:1;height:42px;padding:0 20px;background:transparent;border:0;color:var(--mute);font:inherit;font-size:.86rem;letter-spacing:.12em;cursor:pointer;transition:color .3s}
.tab.on{color:#1a0802;font-weight:700}
.tab-ink{position:absolute;z-index:0;top:0;left:0;height:42px;background:linear-gradient(135deg,#ffd27a,#ff8a2a 50%,#e2400f);transition:transform .55s var(--ease),width .55s var(--ease);box-shadow:0 8px 30px -8px rgba(255,90,31,.8)}
.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.tool{position:relative;display:flex;flex-direction:column;min-height:240px;padding:28px 24px;background:var(--void);overflow:hidden;isolation:isolate;
  transition:opacity .5s,transform .5s var(--ease),filter .5s}
.tool::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .5s;
  background:radial-gradient(260px circle at var(--x,50%) var(--y,50%),rgba(255,110,40,.28),transparent 70%)}
.tool:hover::before{opacity:1}
.tool::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--ember),var(--gold-hi));transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.tool:hover::after{transform:scaleX(1)}
.tool.big{grid-column:span 2;grid-row:span 2;background:radial-gradient(90% 90% at 100% 100%,rgba(226,64,15,.35),transparent 60%),radial-gradient(60% 60% at 0 0,rgba(43,91,140,.3),transparent 60%),var(--ash)}
.tool.big h3{font-size:clamp(1.8rem,3vw,2.6rem)}
.tool.big .t-ico{font-size:4rem}
.tool.dim{opacity:.18;filter:grayscale(1);pointer-events:none}
.t-no{font-size:.7rem;letter-spacing:.3em;color:var(--dim)}
.t-ico{margin:auto 0 14px;font-size:2rem;color:var(--gold);line-height:1;transition:transform .6s var(--ease),color .4s;text-shadow:0 0 20px rgba(255,138,42,.5)}
.tool:hover .t-ico{transform:translateY(-6px) rotate(-8deg) scale(1.1);color:var(--gold-hi)}
.tool h3{font-size:1.14rem;font-weight:900;letter-spacing:.04em;margin-bottom:8px}
.tool p{font-size:.8rem;line-height:1.7;color:var(--mute)}
.t-go{position:absolute;right:22px;top:22px;font-size:1.2rem;color:var(--gold);opacity:0;transform:translate(-10px,10px);transition:all .5s var(--ease)}
.tool:hover .t-go{opacity:1;transform:none}
/* ---------- 阵营轨道 ---------- */
.orbit-wrap{display:grid;place-items:center;padding:20px 0}
.orbit{position:relative;width:min(760px,92vw);aspect-ratio:1}
.orbit-ring{position:absolute;inset:0;border-radius:50%;border:1px solid var(--line)}
.orbit-ring.r1{inset:9%;border-style:dashed;animation:spin 120s linear infinite}
.orbit-ring.r2{inset:24%;border-color:rgba(242,181,82,.1);background:radial-gradient(circle,rgba(255,90,31,.14),transparent 70%)}
.orbit-ring.r3{inset:-2%;border:0;background:conic-gradient(from 0deg,transparent,rgba(255,138,42,.35) 8%,transparent 16%);
  -webkit-mask:radial-gradient(circle,transparent 69%,#000 70%,#000 71%,transparent 72%);mask:radial-gradient(circle,transparent 69%,#000 70%,#000 71%,transparent 72%);animation:spin 9s linear infinite}
.orbit-core{position:absolute;inset:30%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.orbit-core img{width:58%;filter:drop-shadow(0 0 30px rgba(255,138,42,.55));transition:transform .7s var(--ease),opacity .35s,filter .7s}
.orbit-core img.swap{opacity:0;transform:scale(.6) rotate(-20deg);filter:blur(8px)}
.fx-no{margin-top:12px;font-size:.7rem;letter-spacing:.4em;color:var(--dim)}
.orbit-core h3{margin-top:6px;font-size:clamp(1.3rem,2.6vw,2rem);font-weight:900;letter-spacing:.14em;
  background:linear-gradient(180deg,#fff3d6,#f2b552);-webkit-background-clip:text;background-clip:text;color:transparent}
.orbit-spin{position:absolute;inset:0;animation:spin 70s linear infinite}
.orbit:hover .orbit-spin,.orbit:hover .fx img{animation-play-state:paused}
.fx{position:absolute;left:50%;top:50%;width:13%;aspect-ratio:1;margin:-6.5% 0 0 -6.5%;padding:0;border:0;cursor:pointer;border-radius:50%;
  background:radial-gradient(circle,rgba(30,16,10,.95),rgba(10,6,4,.95));box-shadow:0 0 0 1px var(--line-hi);
  transform:rotate(var(--a)) translateY(-330%) rotate(calc(var(--a) * -1))}
@keyframes counter{to{rotate:-360deg}}
.fx img{width:100%;height:100%;object-fit:contain;padding:12%;animation:counter 70s linear infinite;transition:transform .5s var(--ease),filter .5s;filter:grayscale(.5) brightness(.8)}
.fx:hover img,.fx.on img{transform:scale(1.2);filter:none drop-shadow(0 0 12px rgba(255,138,42,.9))}
.fx.on{box-shadow:0 0 0 2px var(--gold),0 0 30px rgba(255,138,42,.6)}

/* ---------- 作者 ---------- */
.author{position:relative;z-index:4;max-width:1320px;margin:0 auto;padding:clamp(90px,12vw,150px) clamp(18px,4vw,48px)}
.author-card{position:relative;display:grid;grid-template-columns:minmax(220px,360px) 1fr;gap:clamp(24px,5vw,70px);align-items:center;
  padding:clamp(28px,4vw,56px);border:1px solid var(--line);overflow:hidden;
  background:radial-gradient(70% 120% at 0% 50%,rgba(226,64,15,.25),transparent 60%),radial-gradient(60% 120% at 100% 50%,rgba(43,91,140,.25),transparent 60%),var(--ash)}
.author-card::before{content:"";position:absolute;inset:-1px;padding:1px;border-radius:inherit;pointer-events:none;
  background:conic-gradient(from var(--ang,0deg),transparent 70%,var(--gold) 85%,var(--ember) 92%,transparent);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:ang 6s linear infinite}
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes ang{to{--ang:360deg}}
.author-pic{position:relative;aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px var(--line-hi),0 0 80px rgba(255,90,31,.35)}
.author-pic img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1s var(--ease)}
.author-card:hover .author-pic img{transform:scale(1.16)}
.author-txt>p.sans{margin-top:18px;font-size:.95rem;line-height:1.9;color:#cdbba2;max-width:560px}
.author-stats{display:flex;gap:44px;margin-top:30px}
.author-stats b{display:block;font-size:2rem;font-weight:900;color:var(--gold-hi)}
.author-stats span{font-size:.74rem;letter-spacing:.3em;color:var(--dim)}

/* ---------- 页脚 ---------- */
.foot{position:relative;z-index:4;border-top:1px solid var(--line);overflow:hidden}
.foot-big{font-family:"Noto Serif SC",serif;font-weight:900;font-size:clamp(3rem,11vw,10rem);line-height:1;white-space:nowrap;text-align:center;padding-top:40px;
  color:transparent;-webkit-text-stroke:1px rgba(242,181,82,.18);background:linear-gradient(180deg,rgba(255,138,42,.12),transparent);-webkit-background-clip:text;background-clip:text}
.foot-row{max-width:1320px;margin:0 auto;padding:26px clamp(18px,4vw,48px) 34px;display:flex;align-items:center;gap:24px;font-size:.78rem;color:var(--dim)}
.foot-row img{height:34px;width:auto;opacity:.8}
.foot-row a{margin-left:auto;color:var(--gold);letter-spacing:.15em}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .nav-links{display:none}
  .burger{display:block;margin-left:12px}
  .nav-cta{margin-left:auto}
  .tools{grid-template-columns:repeat(2,1fr)}
  .summon{grid-template-columns:1fr}
  .minor{grid-template-columns:1fr}
}
@media (max-width:767px){
  .hero{min-height:620px}
  .char-j{left:-14vw;bottom:auto;top:9vh;width:78vw;opacity:.95}
  .char-g{right:-34vw;bottom:auto;top:20vh;width:128vw}
  .hero-side{display:none}
  .hero-copy{bottom:76px}
  .hero-cta .btn{flex:1 1 calc(50% - 6px);padding:0 10px;font-size:.88rem;min-width:0}
  .hero-cta{max-width:none;padding:0 12px}
  .sec-head{grid-template-columns:auto 1fr}
  .sec-desc{grid-column:1/-1;text-align:left;max-width:none}
  .stats{grid-template-columns:repeat(2,1fr);row-gap:24px;padding-top:70px}
  .stat:nth-child(3){border-left:0}
  .pools{grid-template-columns:1fr}
  .pool{min-height:520px}
  .feats{grid-template-columns:1fr 1fr}
  .minor{grid-template-columns:1fr}
  .deck{grid-template-columns:repeat(5,1fr);gap:6px}
  .tools{grid-template-columns:1fr}
  .tool.big{grid-column:auto;grid-row:auto}
  .tool{min-height:180px}
  .author-card{grid-template-columns:1fr;text-align:center}
  .author-pic{max-width:220px;margin:0 auto}
  .author-txt>p.sans{margin-inline:auto}
  .author-stats{justify-content:center}
  .foot-row{flex-direction:column;text-align:center}
  .foot-row a{margin:0}
  .nav-cta{display:none}
  .burger{margin-left:auto}
  .cursor-glow{display:none}
  .orbit{width:96vw}
  .fx{width:16%;margin:-8% 0 0 -8%;transform:rotate(var(--a)) translateY(-265%) rotate(calc(var(--a) * -1))}
  .orbit-core{inset:26%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .grain,#embers{display:none}
}
