
:root{
  --bg:#0a1428;
  --bg2:#0e1a33;
  --panel:rgba(20,34,64,.58);
  --card:rgba(26,44,80,.50);
  --bdr:rgba(212,168,67,.42);
  --bds:rgba(140,170,220,.18);
  --gold:#d9a94a;
  --goldb:#f2cd6b;
  --goldd:rgba(212,168,67,.18);
  --jade:#35b8a8;
  --jaded:rgba(53,184,168,.18);
  --tx:#e6dcc4;
  --txs:#f6efdb;
  --mu:#61779d;
  --mu2:#93a6ca;
  --hl:rgba(212,168,67,.10);
  --red:#d05a4d;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{font-size:15px;scroll-behavior:smooth;}
body{
  background:var(--bg);color:var(--tx);
  font-family:"Microsoft YaHei","PingFang SC","Hiragino Sans GB",system-ui,sans-serif;
  line-height:1.7;min-height:100vh;overflow-x:hidden;
  background-image:url('../images/bj.jpg');
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
  background-repeat:no-repeat;
  animation:kenburns 48s ease-in-out infinite alternate;
}
@keyframes kenburns{0%{background-position:50% 42%;}100%{background-position:50% 58%;}}
body::before{
  content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(1400px 900px at 50% -12%, rgba(255,255,255,.10), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(12,22,42,.12) 55%, rgba(8,14,28,.30) 100%);
}
body::after{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:
    linear-gradient(rgba(140,170,220,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140,170,220,.028) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(ellipse at 50% 0%, #000 0%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 0%, #000 0%, transparent 75%);
}
#bgfx{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;}
#prog{
  position:fixed;top:0;left:0;height:2px;width:0;z-index:100;
  background:linear-gradient(90deg,var(--gold),var(--goldb),var(--jade));
  box-shadow:0 0 10px rgba(242,205,107,.7);
}
.pt{
  position:absolute;border-radius:50%;
  background:radial-gradient(circle, rgba(242,205,107,.9) 0%, rgba(242,205,107,0) 72%);
  animation:drift linear infinite;
  opacity:var(--op);
}
@keyframes drift{
  0%,100%{transform:translate(0,0);opacity:calc(var(--op)*.7);}
  25%{transform:translate(18px,-26px);opacity:calc(var(--op)*1.35);}
  50%{transform:translate(-14px,-52px);opacity:calc(var(--op)*.45);}
  75%{transform:translate(10px,-24px);opacity:calc(var(--op)*1.1);}
}
::selection{background:rgba(217,169,74,.28);color:#fff;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:rgba(20,32,60,.35);}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--gold),#8a5f0a);border-radius:5px;border:2px solid rgba(10,18,34,.4);}
button:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}

/* ===== Sticky nav block (阶段条 + 页签) ===== */
.stick-nav{
  position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg, rgba(16,28,54,.80), rgba(16,28,54,.72));
  box-shadow:0 10px 30px rgba(20,35,70,.35), inset 0 -1px 0 var(--bdr);
  backdrop-filter:blur(6px);
}

/* ===== Header ===== */
.hdr{
  position:relative;text-align:center;
  padding:1.6rem 1.2rem 1.5rem;
  overflow:hidden;
}
.hdr::before{
  content:'';position:absolute;inset:auto 0 0;height:3px;
  background:linear-gradient(90deg, transparent, var(--gold) 18%, var(--goldb) 50%, var(--gold) 82%, transparent);
  opacity:.8;
}
.hdr::after{
  content:'';position:absolute;left:50%;bottom:6px;transform:translateX(-50%);
  width:120px;height:7px;background:var(--gold);
  clip-path:polygon(50% 0, 58% 50%, 50% 100%, 42% 50%);
  opacity:.55;filter:drop-shadow(0 0 8px rgba(242,205,107,.8));
}
.c{position:absolute;width:30px;height:30px;border-color:var(--gold);border-style:solid;opacity:.5;filter:drop-shadow(0 0 6px rgba(217,169,74,.5));}
.c.tl{top:14px;left:14px;border-width:2px 0 0 2px;}
.c.tr{top:14px;right:14px;border-width:2px 2px 0 0;}
.c.bl{bottom:14px;left:14px;border-width:0 0 2px 2px;}
.c.br{bottom:14px;right:14px;border-width:0 2px 2px 0;}
.ray{
  position:absolute;top:-25%;left:-35%;width:24%;height:150%;
  background:linear-gradient(90deg, transparent, rgba(242,205,107,.13), transparent);
  transform:skewX(-18deg);animation:ray 8s ease-in-out infinite;pointer-events:none;
}
@keyframes ray{0%,55%{left:-35%;}100%{left:135%;}}
.hero{position:relative;display:flex;flex-direction:column;align-items:center;}
.halo{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(580px,92vw);height:min(580px,92vw);pointer-events:none;
  background:radial-gradient(circle, rgba(217,169,74,.18), rgba(53,184,168,.07) 46%, transparent 72%);
  filter:blur(3px);
}
.logo-row{
  display:flex;align-items:center;gap:1.15rem;position:relative;z-index:1;
  width:100%;max-width:min(760px,96%);
}
.lside{flex:1;height:1px;min-width:46px;background:linear-gradient(90deg,transparent,var(--gold));opacity:.7;}
.lside:last-child{background:linear-gradient(90deg,var(--gold),transparent);}
.seal{
  width:auto;height:300px;max-width:88%;object-fit:contain;margin:0 auto;
  position:relative;z-index:1;
  animation:bob 6s ease-in-out infinite, glowPulse 3.2s ease-in-out infinite;
}
@keyframes glowPulse{
  0%,100%{filter:drop-shadow(0 0 12px rgba(217,169,74,.5));}
  50%{filter:drop-shadow(0 0 36px rgba(242,205,107,1));}
}
.logo-wrap{position:relative;display:inline-flex;flex-shrink:0;z-index:1;}
.lg-ring{
  position:absolute;left:50%;top:50%;width:118%;height:142%;transform:translate(-50%,-50%);
  border:1px dashed rgba(212,168,67,.55);border-radius:50%;pointer-events:none;
  animation:ringSpin 26s linear infinite;
}
@keyframes ringSpin{to{transform:translate(-50%,-50%) rotate(360deg);}}
.lg-spark{
  position:absolute;z-index:3;color:var(--goldb);font-style:normal;font-size:14px;pointer-events:none;
  text-shadow:0 0 10px rgba(255,255,255,.9), 0 0 14px rgba(242,205,107,.8);animation:spark 2.6s ease-in-out infinite;
}
.lg-spark.s1{top:-10%;left:4%;}
.lg-spark.s2{top:10%;right:0;font-size:11px;color:#35b8a8;animation-delay:.65s;}
.lg-spark.s3{bottom:-4%;left:10%;font-size:12px;animation-delay:1.3s;}
.lg-spark.s4{top:-6%;right:12%;font-size:10px;animation-delay:1.95s;}
@keyframes spark{
  0%,100%{opacity:.15;transform:scale(.7) rotate(0deg);}
  50%{opacity:1;transform:scale(1.3) rotate(90deg);}
}
.logo-wrap{
  animation:logoBurst 1s cubic-bezier(.2,.9,.3,1.1) both;
  transition:transform .18s ease-out;
  transform-style:preserve-3d;
}
@keyframes logoBurst{
  0%{opacity:0;filter:brightness(2.4) blur(8px);}
  100%{opacity:1;filter:brightness(1) blur(0);}
}
.lg-rays{
  position:absolute;left:50%;top:50%;width:135%;height:135%;transform:translate(-50%,-50%);
  background:repeating-conic-gradient(from 0deg, rgba(242,205,107,.30) 0deg 5deg, transparent 5deg 22deg);
  -webkit-mask-image:radial-gradient(circle, #000 0%, transparent 60%);
  mask-image:radial-gradient(circle, #000 0%, transparent 60%);
  opacity:.45;pointer-events:none;z-index:0;
  animation:raySpin 46s linear infinite;
}
@keyframes raySpin{to{transform:translate(-50%,-50%) rotate(360deg);}}
.lg-orb{
  --or:320px;
  position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;
  border-radius:50%;pointer-events:none;z-index:3;
  background:radial-gradient(circle at 35% 35%, #fffbe6, #f2cd6b 45%, rgba(242,205,107,0) 75%);
  box-shadow:0 0 12px rgba(242,205,107,.95), 0 0 30px rgba(242,205,107,.5);
  animation:orbA 6s linear infinite;
}
.lg-orb.o2{
  --or:250px;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;
  background:radial-gradient(circle at 35% 35%, #eafffb, #35b8a8 45%, rgba(53,184,168,0) 75%);
  box-shadow:0 0 10px rgba(53,184,168,.95), 0 0 24px rgba(53,184,168,.5);
  animation:orbB 9s linear infinite;
}
@keyframes orbA{from{transform:rotate(0deg) translateX(var(--or)) rotate(0deg);}to{transform:rotate(360deg) translateX(var(--or)) rotate(-360deg);}}
@keyframes orbB{from{transform:rotate(180deg) translateX(var(--or)) rotate(0deg);}to{transform:rotate(540deg) translateX(var(--or)) rotate(-360deg);}}
@media(max-width:560px){
  .lg-orb{--or:200px;}
  .lg-orb.o2{--or:155px;}
}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-4px);}}
.kicker{
  display:flex;align-items:center;justify-content:center;gap:.95rem;
  position:relative;z-index:1;margin-top:-1.4rem;
  animation:rise .75s ease .1s both;
}
.kicker::before,.kicker::after{content:'';width:96px;height:2px;border-radius:2px;}
.kicker::before{background:linear-gradient(90deg,transparent,#e8a03a 42%,#35b8a8);}
.kicker::after{background:linear-gradient(90deg,#35b8a8,#e8a03a 58%,transparent);}
.kicker span{
  font-family:"STXingkai","华文行楷","STKaiti","KaiTi","楷体","Microsoft YaHei",serif;
  font-size:1.05rem;font-weight:700;letter-spacing:.18em;color:#fff;
  padding:.34rem 1.15rem;border:1px solid rgba(255,255,255,.45);border-radius:6px;
  background:linear-gradient(120deg,#6b4305,#b8860b,#e8a03a,#d04b4b,#7a4da0,#35b8a8,#2a8f83,#6b4305);
  background-size:320% 100%;
  box-shadow:0 2px 16px rgba(50,25,60,.4), inset 0 1px 0 rgba(255,255,255,.3);
  text-shadow:0 1px 3px rgba(40,10,40,.55);
  animation:kickFlow 7s linear infinite, kickGlow 3.2s ease-in-out infinite;
}
.kicker span::before{content:'✦';margin-right:.55em;font-size:.68em;color:#fff;text-shadow:0 0 8px rgba(255,255,255,.85);}
.kicker span::after{content:'✦';margin-left:.55em;font-size:.68em;color:#fff;text-shadow:0 0 8px rgba(255,255,255,.85);}
@keyframes kickFlow{to{background-position:320% 0;}}
@keyframes kickGlow{
  0%,100%{box-shadow:0 2px 14px rgba(50,25,60,.3), 0 0 14px rgba(232,160,58,.35), inset 0 1px 0 rgba(255,255,255,.25);}
  50%{box-shadow:0 2px 18px rgba(50,25,60,.4), 0 0 30px rgba(53,184,168,.55), inset 0 1px 0 rgba(255,255,255,.35);}
}
.stage{
  position:relative;max-width:960px;margin:0 auto;
  padding:1rem 2rem 1rem;border-radius:12px;
  animation:stageIn .85s cubic-bezier(.2,.85,.25,1) both;
}
@keyframes stageIn{from{opacity:0;transform:translateY(26px) scale(.985);}to{opacity:1;transform:none;}}
@keyframes rise{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
.title{
  position:relative;font-size:3.8rem;font-weight:700;letter-spacing:.14em;line-height:1.3;
  margin-bottom:.3rem;text-wrap:balance;
  font-family:"STXingkai","华文行楷","STKaiti","KaiTi","楷体","Microsoft YaHei",serif;
  background:linear-gradient(115deg,#4a2d02 0%,#a8780f 14%,#e8bc4a 30%,#fff3c9 46%,#ffe9a8 52%,#f2cd6b 64%,#b8860b 84%,#5a3604 100%);
  background-size:240% auto;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  -webkit-text-stroke:1.3px rgba(74,45,2,.4);
  animation:shine 6s linear infinite, rise .8s ease .18s both, glowBreath 3.6s ease-in-out infinite;
}
.t-orn{
  display:inline-block;font-size:.42em;color:var(--gold);margin:0 .5em;
  text-shadow:0 0 16px rgba(242,205,107,.95), 0 0 30px rgba(255,255,255,.8);
  animation:pulse 2.4s ease-in-out infinite;vertical-align:.18em;
}
@keyframes glowBreath{
  0%,100%{filter:drop-shadow(0 1px 2px rgba(255,255,255,.95)) drop-shadow(0 2px 10px rgba(255,255,255,.7)) drop-shadow(0 0 18px rgba(242,205,107,.5));}
  50%{filter:drop-shadow(0 1px 2px rgba(255,255,255,1)) drop-shadow(0 2px 12px rgba(255,255,255,.85)) drop-shadow(0 0 34px rgba(242,205,107,.95));}
}
.title::after{
  content:'';display:block;width:min(380px,66vw);height:3px;margin:.6rem auto 0;border-radius:3px;
  background:linear-gradient(90deg,transparent,rgba(217,169,74,.35),rgba(242,205,107,.95) 42%,#fff3c9 50%,rgba(242,205,107,.95) 58%,rgba(217,169,74,.35),transparent);
  box-shadow:0 0 14px rgba(242,205,107,.55);
}
@keyframes shine{to{background-position:240% center;}}
.sub{
  color:#2e3a55;font-size:.95rem;letter-spacing:.28em;margin-bottom:.8rem;
  animation:rise .8s ease .26s both;
  display:inline-block;padding:.34rem 1.4rem;border-radius:999px;
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.5));
  border:1px solid rgba(255,255,255,.65);
  box-shadow:0 2px 14px rgba(255,255,255,.35), 0 1px 4px rgba(90,60,10,.08);
  text-shadow:0 1px 0 rgba(255,255,255,.85);
}
.sred{color:#c04438;font-weight:700;}
.tags{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center;margin-bottom:.75rem;}
.tags span{
  font-size:.8rem;color:#fff;letter-spacing:.1em;
  padding:.2rem .72rem;border:1px solid rgba(242,205,107,.65);border-radius:3px;
  background:linear-gradient(180deg, rgba(30,46,84,.92), rgba(20,32,62,.92));
  box-shadow:0 2px 10px rgba(10,20,40,.28), inset 0 1px 0 rgba(255,255,255,.14);
  text-shadow:0 1px 2px rgba(0,0,0,.35);
  animation:rise .6s ease both;
}
.tags span:nth-child(1){animation-delay:.34s;}
.tags span:nth-child(2){animation-delay:.42s;}
.tags span:nth-child(3){animation-delay:.5s;}
.tags span:nth-child(4){animation-delay:.58s;}
.tags span:nth-child(5){animation-delay:.66s;}
.tags span:nth-child(6){animation-delay:.74s;}
.tags span::before{content:'◆';font-size:.5rem;margin-right:.42rem;color:var(--goldb);vertical-align:1px;}
.tags span:first-child,.tags span:last-child{
  color:#fff;font-weight:700;
  background:linear-gradient(180deg,#b07c12,#8a5f0a);
  border-color:#f2cd6b;
  box-shadow:0 2px 12px rgba(140,95,10,.4), inset 0 1px 0 rgba(255,255,255,.25);
}
.orn{display:flex;align-items:center;justify-content:center;gap:.65rem;color:#a8781a;}
.orn::before,.orn::after{content:'';width:64px;height:1px;}
.orn::before{background:linear-gradient(90deg,transparent,var(--gold));}
.orn::after{background:linear-gradient(90deg,var(--gold),transparent);}
.orn span{font-size:.8rem;letter-spacing:.2em;}

/* ===== Stage bar ===== */
.sbar{
  display:flex;justify-content:center;padding:.5rem .8rem;gap:.1rem;
  border-top:1px solid var(--bds);overflow-x:auto;scrollbar-width:none;
}
.sbar::-webkit-scrollbar{display:none;}
.si{
  display:flex;flex-direction:column;align-items:center;
  padding:.35rem .9rem;position:relative;border-radius:6px;
  transition:transform .18s ease, box-shadow .18s ease, background .2s;
  transform-origin:center bottom;min-width:6.3rem;cursor:default;
}
.si::before{
  content:'';position:absolute;inset:0;border-radius:6px;
  border:1px solid transparent;transition:border-color .2s;
}
.si:hover{transform:scale(1.1);box-shadow:0 8px 22px rgba(0,0,0,.5);z-index:5;}
.si:hover::before{border-color:rgba(217,169,74,.55);}
.si:hover .slv{color:var(--goldb);text-shadow:0 0 16px rgba(242,205,107,.8);}
.si:not(:last-child)::after{
  content:'›';position:absolute;right:-.32rem;top:40%;
  transform:translateY(-50%);color:var(--gold);opacity:.35;font-size:.8rem;
}
.slb{font-size:.7rem;color:#dbe4f5;font-weight:700;letter-spacing:.12em;margin-bottom:.12rem;}
.slv{font-size:1.24rem;font-weight:700;color:var(--gold);font-variant-numeric:tabular-nums;line-height:1.15;}
.sdt{font-size:.7rem;color:#b8c6e2;font-variant-numeric:tabular-nums;letter-spacing:.02em;margin-top:.12rem;}
.cnt{font-size:.62rem;color:var(--jade);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.03em;margin-top:.05rem;min-height:.9em;}
.si.done{opacity:.4;}
.si.done .slv{color:var(--mu);}
.si.done .sdt{text-decoration:line-through;}
.si.up{
  background:linear-gradient(180deg, rgba(217,169,74,.08), rgba(217,169,74,.18));
  box-shadow:inset 0 0 0 1px rgba(217,169,74,.45), 0 0 22px rgba(217,169,74,.12);
}
.si.up::before{border-color:rgba(217,169,74,.45);animation:breath 2.4s ease-in-out infinite;}
.si.up .slv{color:var(--goldb);text-shadow:0 0 12px rgba(242,205,107,.7);}
.si.up .sdt{color:var(--goldb);font-weight:700;}
.si.up .cnt{color:var(--jade);animation:pulse 1.6s ease-in-out infinite;}
@keyframes breath{0%,100%{box-shadow:inset 0 0 0 1px rgba(217,169,74,.45);}50%{box-shadow:inset 0 0 0 1px rgba(217,169,74,.9), 0 0 26px rgba(217,169,74,.3);}}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.5;}}
.regbtn{
  margin:0 .6rem 0 0;align-self:center;white-space:nowrap;
  padding:.58rem 1.4rem;border-radius:10px;cursor:pointer;
  background:linear-gradient(180deg,#f6d478,#c99a3f);
  color:#2a1605;font-weight:800;font-size:1.02rem;letter-spacing:.18em;
  border:1px solid rgba(255,255,255,.4);
  box-shadow:0 4px 14px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.55);
  text-decoration:none;transition:transform .18s ease, box-shadow .18s ease, filter .2s;
}
.regbtn:hover{transform:scale(1.08);filter:brightness(1.12);box-shadow:0 6px 20px rgba(242,205,107,.35), inset 0 1px 0 rgba(255,255,255,.55);}
.regbtn:active{transform:scale(.98);}
.dlbtn{
  margin:0 0 0 .6rem;
  background:linear-gradient(180deg,#57d9c4,#1f8f7d);
  box-shadow:0 4px 14px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.5);
}
.dlbtn:hover{box-shadow:0 6px 20px rgba(87,217,196,.35), inset 0 1px 0 rgba(255,255,255,.5);}

/* ===== Tabs ===== */
.tw{border-top:1px solid var(--bds);overflow-x:auto;scrollbar-width:none;position:relative;}
.tw::-webkit-scrollbar{display:none;}
.tnav{display:flex;min-width:max-content;padding:0 .6rem;gap:.06rem;position:relative;}
@media(min-width:768px){.tnav{justify-content:center;}}
.ind{
  position:absolute;bottom:0;left:0;width:0;height:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--goldb) 30%,var(--goldb) 70%,transparent);
  box-shadow:0 0 12px rgba(242,205,107,.85);
  transition:left .25s ease,width .25s ease;
}
.tb{
  margin:.32rem .16rem;padding:.72rem .9rem;border-radius:9px;
  border:1px solid rgba(140,170,220,.28);
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
  color:#dbe4f5;font-size:1.02rem;font-weight:600;font-family:inherit;cursor:pointer;
  white-space:nowrap;letter-spacing:.04em;display:flex;align-items:center;gap:.42rem;
  transition:color .18s,border-color .18s,transform .18s,text-shadow .18s,background .18s,box-shadow .18s;
}
.tb svg{width:16px;height:16px;flex-shrink:0;opacity:.9;transition:transform .18s;}
.tb:hover{
  color:#fff;border-color:rgba(242,205,107,.55);
  background:rgba(242,205,107,.14);
  transform:translateY(-2px);
  text-shadow:0 0 12px rgba(242,205,107,.7);
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.tb:hover svg{transform:scale(1.15);}
.tb.on{
  color:#fff;border-color:rgba(242,205,107,.75);
  background:linear-gradient(180deg, rgba(242,205,107,.24), rgba(217,169,74,.12));
  font-weight:700;text-shadow:0 0 12px rgba(242,205,107,.6);
  box-shadow:0 0 16px rgba(217,169,74,.28), inset 0 1px 0 rgba(255,255,255,.18);
}
.tb.on svg{color:var(--gold);}

/* ===== Content ===== */
.wrap{max-width:900px;margin:0 auto;padding:1.5rem 1.1rem 3.5rem;}
.tp{display:none;}
.tp.on{display:block;animation:fu .22s ease;}
@keyframes fu{from{opacity:0;transform:translateY(7px);}to{opacity:1;transform:none;}}

.fg{display:grid;grid-template-columns:1fr;gap:.55rem;}
.fc{
  position:relative;background:var(--card);border:1px solid var(--bds);border-radius:4px;
  padding:.85rem 1.1rem;display:grid;grid-template-columns:auto 1fr;
  gap:0 .9rem;align-items:baseline;
}
.fc::before,.fc::after{
  content:'';position:absolute;width:11px;height:11px;opacity:0;
  transition:opacity .2s;pointer-events:none;
}
.fc::before{top:5px;left:5px;border-top:1px solid var(--gold);border-left:1px solid var(--gold);}
.fc::after{bottom:5px;right:5px;border-bottom:1px solid var(--gold);border-right:1px solid var(--gold);}
.fc:hover{border-color:var(--bdr);}
.fc:hover::before,.fc:hover::after{opacity:.75;}
.fc.hi{border-color:var(--bdr);background:linear-gradient(135deg, var(--goldd), var(--card) 55%);}
.fc.hi::before,.fc.hi::after{opacity:.6;}
.fn{font-size:.84rem;font-weight:700;color:var(--gold);white-space:nowrap;letter-spacing:.06em;display:flex;align-items:center;gap:.42rem;text-shadow:0 0 10px rgba(217,169,74,.2);}
#tab-exclusive .fn{font-size:1rem;}
#tab-basic .fc, #tab-exclusive .fc, #tab-equip .fc, #tab-dungeon .fc, #tab-refine .fc, #tab-quest .fc, #tab-act .fc, #tab-war .fc{
  background:linear-gradient(180deg, rgba(30,46,84,.92), rgba(18,30,60,.92));
  border:1px solid rgba(242,205,107,.45);
  border-radius:8px;
  box-shadow:0 2px 14px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.12);
}
.fn.red{color:#ff0000;text-shadow:0 0 12px rgba(255,0,0,.5);}
.fn::before{content:'◆';font-size:.55rem;color:var(--goldb);}
.fc.hi .fn{color:var(--goldb);}
.fd{font-size:.92rem;color:var(--tx);line-height:1.72;}
.fd.def{color:var(--tx);}
#tab-basic .fd{color:var(--tx);}
#tab-basic .fd.purple{color:#c77dff;}
#tab-basic .fd.red{color:#ff5a4a;}
#tab-basic .fd.pink{color:#ff9ecb;}
#tab-dungeon .fd{color:var(--tx);}
#tab-dungeon .fd .red-t,#tab-dungeon .fd .purple-t,#tab-dungeon .fd .pink,#tab-dungeon .fd .green-t{color:var(--tx);text-shadow:none;font-weight:400;}
.fd.red{color:#ff5a4a;}
.fd.purple{color:#c77dff;}
.fd.pink{color:#ff9ecb;}
.fd .pink{color:#ff9ecb;font-weight:700;}
.fd .purple-t{color:#c77dff;font-weight:700;}
.fd .green-t{color:#52ff9d;font-weight:700;text-shadow:0 0 10px rgba(82,255,157,.4);}
.fd .red-t{color:#ff5a4a;font-weight:700;text-shadow:0 0 10px rgba(255,90,74,.4);}
.fd .blue-t{color:#4da3ff;font-weight:700;text-shadow:0 0 10px rgba(77,163,255,.45);}
.fd a.red-t,.fd a.blue-t,#tab-basic .fd.purple a{text-decoration:none;}
.fd a.red-t:hover,.fd a.blue-t:hover,#tab-basic .fd.purple a:hover{text-decoration:underline;}
#tab-basic .fd.purple a{color:inherit;}
.fd .book{color:#52ff9d;font-weight:700;text-shadow:0 0 10px rgba(82,255,157,.4);}
.fd br{display:block;content:'';margin:.12rem 0;}
.fc.hi .fd{color:var(--txs);}

.lbl{
  font-size:.96rem;font-weight:700;letter-spacing:.2em;color:var(--gold);
  margin:1.6rem 0 .7rem;display:flex;align-items:center;gap:.55rem;
  text-shadow:0 0 12px rgba(217,169,74,.28);
}
.lbl::before{content:'◆';font-size:.6rem;}
.lbl::after{content:'';flex:1;height:1px;background:linear-gradient(90deg, var(--bdr), var(--bds), transparent);}
.lbl.red{color:#ff5a4a;}

/* ===== Suit table ===== */
.suit{
  width:100%;border-collapse:collapse;margin-top:.7rem;font-size:.8rem;
  background:var(--card);border:1px solid var(--bdr);border-radius:4px;overflow:hidden;
}
.suit-title{
  display:inline-block;font-size:1.2rem;font-weight:700;letter-spacing:.08em;color:#ff5a4a;
  margin:0 0 .6rem;text-align:left;padding:.45rem 1.2rem;border-radius:8px;
  background:linear-gradient(180deg, rgba(30,46,84,.94), rgba(18,30,60,.94));
  border:1px solid rgba(255,90,74,.65);
  box-shadow:0 2px 14px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.15);
  text-shadow:0 1px 3px rgba(0,0,0,.45);
}
.suit th,.suit td{
  padding:.5rem .65rem;text-align:left;border-bottom:1px solid var(--bds);
  border-right:1px solid var(--bds);white-space:nowrap;
}
.suit th{
  background:linear-gradient(180deg, rgba(217,169,74,.16), rgba(217,169,74,.06));
  color:var(--goldb);font-weight:700;letter-spacing:.06em;font-size:.92rem;
}
.suit td:first-child{font-weight:700;color:var(--txs);}
.suit tbody td:nth-child(6){font-weight:700;}
.suit tbody tr:hover{background:var(--hl);}
.suit th:nth-child(1),.suit td:nth-child(1){width:32%;}
.suit th:nth-child(2),.suit td:nth-child(2){width:16%;}
.suit th:nth-child(3),.suit td:nth-child(3){width:52%;white-space:normal;}
.suit tbody td:nth-child(1){color:#ff9a3d;font-weight:700;text-shadow:0 0 10px rgba(255,154,61,.35);}
.suit tbody td:nth-child(1).name-w{color:#ffffff;}
.suit tbody td:nth-child(1).name-y{color:#ffd94a;}
.suit tbody td:nth-child(1).name-p{color:#ff9ecb;}
.suit tbody td:nth-child(1).name-r{color:#ff5a4a;}
.suit tbody td:nth-child(2){color:#52ff9d;font-weight:700;text-shadow:0 0 10px rgba(82,255,157,.4);}
.suit .rmb{color:#ff5a4a;font-weight:700;}
.suit .gap{border-right:none;border-bottom:none;width:1.3rem;background:transparent;}
.suit tbody tr:last-child td{border-bottom:none;}

/* ===== Boss grid ===== */
.bg{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.8rem;margin-top:.7rem;}
.bc{
  position:relative;background:var(--card);border:1px solid var(--bds);border-radius:4px;
  padding:1rem 1.1rem;overflow:hidden;
}
.bc::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--jade),transparent);
}
.bc::after{
  content:'';position:absolute;top:6px;right:6px;width:22px;height:22px;opacity:.5;
  background:linear-gradient(135deg, var(--jade), transparent 60%);
  clip-path:polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
.bn{font-size:1.06rem;font-weight:700;color:var(--txs);margin-bottom:.65rem;letter-spacing:.06em;}
.bicon{display:inline-flex;width:22px;height:22px;color:var(--jade);vertical-align:-5px;margin-right:.4rem;transition:transform .2s,color .2s;}
.bc:hover .bicon{color:var(--goldb);transform:scale(1.15);}
.bicon svg{width:100%;height:100%;}
.bs{display:grid;grid-template-columns:auto 1fr;gap:.24rem .75rem;font-size:.86rem;}
.bk{color:#dbe4f5;font-weight:700;}
.bv{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.35);}
.bv.t{color:#4fe0cd;font-weight:700;font-variant-numeric:tabular-nums;}
.bv.d{color:#f2cd6b;font-weight:600;}

/* ===== Schedule ===== */
.sch{display:flex;flex-direction:column;gap:.65rem;margin-top:.7rem;}
.sci{
  display:grid;grid-template-columns:118px 1fr;
  background:var(--card);border:1px solid var(--bds);border-radius:4px;overflow:hidden;
}
.scd{
  background:linear-gradient(160deg, rgba(217,169,74,.13), var(--panel));
  padding:.8rem .9rem;border-right:1px solid var(--bds);
  display:flex;flex-direction:column;justify-content:center;
}
.sdn{font-size:.95rem;font-weight:700;color:var(--goldb);letter-spacing:.12em;}
.stm{font-size:.68rem;color:#dbe4f5;font-weight:600;font-variant-numeric:tabular-nums;margin-top:.1rem;line-height:1.45;text-shadow:0 1px 3px rgba(0,0,0,.3);}
.scc{padding:.7rem .9rem;}
.sev{font-size:.95rem;font-weight:700;color:#ff5a4a;margin-bottom:.24rem;display:flex;align-items:center;text-shadow:0 0 10px rgba(255,90,74,.35);}
.srw{font-size:.84rem;color:#ff9ecb;line-height:1.65;}
.srw .red-t{color:#ff5a4a;font-weight:700;text-shadow:0 0 10px rgba(255,90,74,.4);}
.srw.purple{color:#c77dff;}
.tag{
  display:inline-block;background:linear-gradient(180deg,#0f7a6c,#0a5f54);color:#fff;
  border-radius:4px;padding:.16em .55em;font-size:.74rem;font-weight:700;
  white-space:nowrap;margin-left:.5rem;vertical-align:middle;
  border:1px solid rgba(255,255,255,.4);text-shadow:0 1px 2px rgba(0,0,0,.35);
}

/* ===== Rules ===== */
.rul{display:flex;flex-direction:column;gap:.45rem;margin-top:.7rem;}
.ri{
  display:grid;grid-template-columns:1.5rem 1fr;gap:0 .7rem;
  padding:.68rem .95rem;background:var(--card);
  border:1px solid var(--bds);border-radius:4px;font-size:.87rem;align-items:baseline;
}
.rn{
  color:var(--jade);font-weight:700;font-variant-numeric:tabular-nums;
  display:flex;align-items:center;justify-content:center;
  width:1.45rem;height:1.45rem;border:1px solid rgba(53,184,168,.4);border-radius:3px;
  font-size:.72rem;background:var(--jaded);
}

/* ===== Level rewards ===== */
.lvg{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.7rem;}
.lvc{
  display:grid;grid-template-columns:3.2rem 1fr;background:var(--card);
  border:1px solid var(--bds);border-radius:4px;overflow:hidden;align-items:stretch;
}
.lvn{
  background:linear-gradient(160deg, rgba(217,169,74,.28), rgba(217,169,74,.08));
  display:flex;align-items:center;justify-content:center;
  font-size:.95rem;font-weight:700;color:#241502;
  border-right:1px solid rgba(217,169,74,.35);padding:.45rem;font-variant-numeric:tabular-nums;
  text-shadow:0 1px 0 rgba(255,255,255,.15);
}
.lvr{padding:.48rem .7rem;font-size:.78rem;color:var(--tx);line-height:1.6;}

/* ===== Hover lift ===== */
.fc,.bc,.sci,.ri,.lvc{
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
  transform-origin:center top;
}
.fc:hover,.bc:hover,.sci:hover,.ri:hover,.lvc:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 36px rgba(0,0,0,.4), 0 0 36px rgba(242,205,107,.7), 0 0 0 1px rgba(242,205,107,.9);
  border-color:#f2cd6b;
  z-index:10;
}
.fc:hover{filter:brightness(1.14);}
.fc,.bc,.sci,.ri,.lvc,.suit{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}

/* ===== Reveal ===== */
.rv{opacity:0;transform:translateY(16px);transition:opacity .5s ease, transform .5s ease;}
.rv.in{opacity:1;transform:none;}

/* ===== Footer ===== */
.foot{
  border-top:1px solid var(--bdr);text-align:center;padding:1.4rem 1rem 5.4rem;
  color:#cdd9f0;font-size:.86rem;letter-spacing:.12em;
  font-family:"STKaiti","KaiTi","楷体","Microsoft YaHei",serif;
  background:linear-gradient(180deg, transparent 0%, rgba(8,14,28,.45) 30%, rgba(8,14,28,.68) 100%);
  text-shadow:0 1px 4px rgba(0,0,0,.4), 0 0 12px rgba(255,255,255,.22);
}
.foot{position:relative;}
.foot::before{
  content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);
  width:240px;height:2px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.foot .slogan{
  display:block;margin:0 auto .55rem;
  font-family:"STXingkai","华文行楷","STKaiti","KaiTi","楷体",serif;
  color:#ff6b5e;font-size:1.6rem;font-weight:700;letter-spacing:.2em;
  -webkit-text-stroke:.6px rgba(255,255,255,.4);
  text-shadow:0 0 12px rgba(255,255,255,.9), 0 0 26px rgba(255,120,100,.7), 0 1px 3px rgba(60,10,5,.4);
}
.foot .qq{
  display:block;width:max-content;max-width:92%;margin:0 auto .45rem;padding:.3rem 1.2rem;border-radius:999px;
  font-size:1.08rem;font-weight:700;letter-spacing:.18em;color:#ffe9a8;
  background:linear-gradient(180deg, rgba(30,46,84,.95), rgba(18,30,60,.95));
  border:1px solid rgba(242,205,107,.65);
  box-shadow:0 2px 14px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.14);
  font-variant-numeric:tabular-nums;
  text-shadow:0 1px 3px rgba(0,0,0,.5);
}
.foot .qq a{color:inherit;text-decoration:none;display:inline-block;}
.foot .qq a:hover{color:#fff;text-shadow:0 0 12px rgba(255,255,255,.9);}
.foot .copy{
  font-size:.92rem;color:#c3d0ea;letter-spacing:.14em;
  text-shadow:0 1px 4px rgba(0,0,0,.5);
}

/* ===== Floaters ===== */
.flt{
  position:fixed;bottom:26px;right:26px;z-index:90;
  display:flex;flex-direction:column;align-items:center;gap:.45rem;
}
.flt a,.qflt{
  display:flex;align-items:center;gap:.5rem;
  padding:.68rem 1.35rem;
  color:#1a0e00;font-family:inherit;font-size:.9rem;font-weight:700;
  border-radius:4px;text-decoration:none;letter-spacing:.06em;
  box-shadow:0 6px 24px rgba(217,169,74,.35), 0 0 0 1px rgba(242,205,107,.45);
  transition:transform .15s, box-shadow .15s;white-space:nowrap;
  background:linear-gradient(135deg,#b97f12 0%,#e8b63c 45%,#f2cd6b 100%);
  position:relative;overflow:hidden;
}
.flt a::after,.qflt::after{
  content:'';position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);
  transform:skewX(-20deg);animation:sweep 3.6s ease-in-out infinite;
}
@keyframes sweep{0%,55%{left:-80%;}90%,100%{left:135%;}}
.flt a:hover,.qflt:hover{transform:translateY(-2px);}
.flt a:active,.qflt:active{transform:translateY(0);}
.qflt{
  position:fixed;bottom:96px;right:26px;z-index:89;
  background:linear-gradient(135deg,#0ea5e9 0%,#2563eb 100%);color:#fff;
  box-shadow:0 6px 24px rgba(37,99,235,.35), 0 0 0 1px rgba(96,165,250,.45);
}
.flt-tip{font-size:.7rem;color:var(--mu);letter-spacing:.05em;}
@media(max-width:560px){
  .flt{bottom:14px;right:12px;}
  .qflt{bottom:64px;right:12px;}
  .flt a,.qflt{padding:.55rem 1rem;font-size:.82rem;}
}

/* ===== To top ===== */
#totop{
  position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(70px);
  z-index:80;border:1px solid var(--bdr);background:var(--panel);color:var(--goldb);
  width:42px;height:42px;border-radius:50%;cursor:pointer;font-size:1.05rem;
  display:flex;align-items:center;justify-content:center;
  transition:transform .3s ease, box-shadow .2s;opacity:0;pointer-events:none;
}
#totop.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto;}
#totop:hover{box-shadow:0 6px 22px rgba(217,169,74,.4);}
@media(max-width:560px){#totop{left:auto;right:12px;transform:translateY(70px);}#totop.show{transform:translateY(0);}}

@media(max-width:560px){
  .lvg{grid-template-columns:1fr;}
  .bg{grid-template-columns:1fr;}
  .sci{grid-template-columns:1fr;}
  .scd{border-right:none;border-bottom:1px solid var(--bds);}
  .stage{padding:.8rem .8rem .9rem;}
  .title{font-size:2.2rem;letter-spacing:.1em;}
  .sub{font-size:.8rem;letter-spacing:.14em;}
  .seal{height:172px;max-width:88%;}
  .logo-row{gap:.7rem;}
  .lside{min-width:20px;}
  .kicker{margin-top:-.9rem;gap:.6rem;}
  .kicker::before,.kicker::after{width:38px;}
  .kicker span{font-size:.78rem;letter-spacing:.26em;padding:.22rem .6rem;}
  .hdr{padding:1.3rem 1rem 1.2rem;}
}
