:root{--blue:#356fa8;--blue-dark:#274a6e;--blue-soft:#eef3f9;--heading:#2e4a70;--bg:#f4f5f8;--card:#ffffff;--text:#49545f;--muted:#76859a;--line:#e8edf4;--dots:#f1f3f7;--moon1:#ffffff;--moon2:#dce9f8;--moon3:#b3cde9;--shadow:0 2px 10px rgba(30,56,92,.04);--shadow-lg:0 10px 30px rgba(30,56,92,.07);color-scheme:light}
@media (prefers-color-scheme: dark){:root:not([data-theme]){--blue:#7fb0e8;--blue-dark:#9fc1e8;--blue-soft:#1b2a3d;--heading:#dbe7f5;--bg:#0f1720;--card:#18222e;--text:#e5edf5;--muted:#9fb0c2;--line:#263442;--dots:#1a2633;--moon1:#f5f8ff;--moon2:#c9d7ef;--moon3:#93aed6;--shadow:0 2px 10px rgba(0,0,0,.35);--shadow-lg:0 10px 30px rgba(0,0,0,.5);color-scheme:dark}}
:root[data-theme="dark"]{--blue:#7fb0e8;--blue-dark:#9fc1e8;--blue-soft:#1b2a3d;--heading:#dbe7f5;--bg:#0f1720;--card:#18222e;--text:#e5edf5;--muted:#9fb0c2;--line:#263442;--dots:#1a2633;--moon1:#f5f8ff;--moon2:#c9d7ef;--moon3:#93aed6;--shadow:0 2px 10px rgba(0,0,0,.35);--shadow-lg:0 10px 30px rgba(0,0,0,.5);color-scheme:dark}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{font-family:"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;background-color:var(--bg);background-image:radial-gradient(var(--dots) 1px,transparent 1px);background-size:26px 26px;background-position:0 0;color:var(--text);line-height:1.75;-webkit-tap-highlight-color:transparent;text-rendering:optimizeLegibility}
::selection{background:var(--blue-soft);color:var(--blue-dark)}
.container{max-width:1000px;margin:0 auto;padding:0 20px}
a{color:var(--blue);text-decoration:none}
img{max-width:100%;height:auto}
.skip-link{position:absolute;left:12px;top:-60px;z-index:100;background:var(--blue);color:#fff;padding:8px 16px;border-radius:0 0 8px 8px;font-size:14px;transition:top .2s}
.skip-link:focus{top:0}
header{position:sticky;top:0;background:var(--card);border-bottom:1px solid var(--line);z-index:40;animation:top-in .55s .05s cubic-bezier(.16,.84,.32,1) both}
@keyframes top-in{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
nav{display:flex;justify-content:space-between;align-items:center;height:60px;gap:10px}
.brand{font-weight:700;font-size:18px;color:var(--heading);display:flex;align-items:center;white-space:nowrap}
.brand-logo{display:inline-block;margin-right:7px;color:var(--blue);flex-shrink:0}
.brand-sub{font-size:11px;letter-spacing:2px;color:var(--muted);margin-left:8px}
.nav-links{display:flex;align-items:center;gap:22px;margin-left:auto}
.nav-links a{color:var(--muted);font-size:14.5px;white-space:nowrap}
.nav-links a:hover{color:var(--blue)}
.nav-tools{display:flex;align-items:center;gap:4px;margin-left:6px}
.icon-btn{width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;color:var(--muted);transition:background .15s,color .15s}
.icon-btn:hover{background:var(--blue-soft);color:var(--blue)}
.icon-btn svg{width:19px;height:19px;transition:transform .2s}
.icon-btn:hover svg{transform:scale(1.1)}
#btn-menu{display:none}
.icon-sun{display:none}
:root[data-theme="dark"] .icon-sun{display:block}
:root[data-theme="dark"] .icon-moon{display:none}
@media (prefers-color-scheme: dark){:root:not([data-theme]) .icon-sun{display:block}:root:not([data-theme]) .icon-moon{display:none}}
.nav-menu{display:none}
.hero{position:relative;overflow:hidden;background:linear-gradient(160deg,#edf1f8 0%,#f4f6fa 38%,#fafbfd 64%,var(--bg) 80%);padding:96px 0 92px}
:root[data-theme="dark"] .hero{background:linear-gradient(160deg,#16233f 0%,#131e36 42%,#0f1720 68%,var(--bg) 84%)}
@media (prefers-color-scheme: dark){:root:not([data-theme]) .hero{background:linear-gradient(160deg,#16233f 0%,#131e36 42%,#0f1720 68%,var(--bg) 84%)}}
.hero-court{position:absolute;right:-4%;bottom:-6%;width:min(820px,78%);color:var(--blue);opacity:.16;z-index:3;pointer-events:none;animation:court-in 1.8s .15s cubic-bezier(.16,.84,.32,1) both,court-float 11s 2.2s ease-in-out infinite alternate}
@keyframes court-in{from{opacity:0;transform:translateY(44px)}to{opacity:.15;transform:none}}
@keyframes court-float{from{transform:translateY(0)}to{transform:translateY(-9px)}}
.hero-stars,.hero-stars2{position:absolute;inset:0;pointer-events:none;animation:twinkle 5s ease-in-out infinite}
.hero-stars{background-image:
radial-gradient(1.5px circle at 30px 50px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 150px 90px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 280px 40px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 420px 70px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 560px 40px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 700px 95px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 840px 60px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 980px 45px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1120px 85px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1260px 50px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1400px 90px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 80px 160px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 240px 140px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 400px 170px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 540px 150px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 680px 180px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 820px 140px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 960px 175px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1100px 150px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1240px 170px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1380px 160px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 180px 250px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 460px 240px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 760px 230px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1060px 250px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1340px 240px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 320px 330px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 620px 320px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 920px 330px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1220px 310px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 200px 420px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 540px 410px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 860px 400px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1180px 420px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 60px 350px, var(--blue) 100%, transparent),
radial-gradient(1.5px circle at 1440px 390px, var(--blue) 100%, transparent);
opacity:.75}
.hero-stars2{background-image:radial-gradient(1.5px circle at 100px 120px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 360px 110px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 620px 130px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 900px 110px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 1160px 130px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 1350px 110px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 200px 300px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 500px 290px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 800px 300px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 1100px 290px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 1400px 300px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 60px 220px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 1300px 210px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 700px 380px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 1020px 370px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 300px 460px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 980px 430px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 460px 60px, var(--blue) 100%, transparent);opacity:.65;animation-delay:1.2s;animation-duration:5s}
.hero-haze{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 62% 46% at 12% 0%,rgba(112,152,214,.15),transparent 70%),radial-gradient(ellipse 56% 42% at 90% 2%,rgba(126,168,228,.13),transparent 70%);filter:blur(30px)}
.comet{position:absolute;left:0;top:0;z-index:0;pointer-events:none}
.comet-fly{display:block;opacity:0}
.comet-body{display:block;width:150px;height:3px;position:relative;background:linear-gradient(90deg,transparent,rgba(165,195,240,.8) 55%,#e8f1ff);border-radius:3px}
.comet-body::after{content:"";position:absolute;right:-5px;top:-3px;width:9px;height:9px;border-radius:50%;background:#eef4ff;box-shadow:0 0 14px 5px rgba(150,190,245,.85)}
@keyframes hero-drift{from{transform:translate(0,0)}to{transform:translate(30px,-20px)}}

.hero-inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:32px;text-align:left}
.hero-main{flex:1;min-width:0;max-width:640px;padding-left:clamp(16px,5vw,84px);margin-top:36px;position:relative}
.hero-title{font-size:clamp(44px,7.4vw,80px);font-weight:800;letter-spacing:8px;line-height:1.2;margin-bottom:18px;background:linear-gradient(180deg,var(--heading) 0%,var(--blue) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;animation:rise-in 1.1s .1s cubic-bezier(.16,.84,.32,1) both,title-glow 6s 2s ease-in-out infinite}
@keyframes title-glow{0%,100%{filter:drop-shadow(0 4px 14px rgba(43,108,176,.18))}50%{filter:drop-shadow(0 6px 26px rgba(43,108,176,.42))}}
.hero-tagline{display:flex;align-items:center;gap:12px;font-size:clamp(16px,2.4vw,22px);color:var(--blue);font-weight:600;letter-spacing:4px;margin-bottom:12px;animation:rise-in .8s .3s cubic-bezier(.16,.84,.32,1) both}
.hero-tagline::before{content:"";width:28px;height:3px;border-radius:2px;background:var(--blue);flex-shrink:0}
.hero-sub{color:var(--muted);font-size:15px;max-width:520px;animation:rise-in .7s .44s cubic-bezier(.16,.84,.32,1) both}
.hero-art{pointer-events:none}
.hero-art *{pointer-events:none}
.orbit-dot.lit::before{pointer-events:auto}
.hero-scale .scale-hot{pointer-events:all}
.hero-art{position:relative;flex-shrink:0;width:clamp(260px,32vw,360px);height:clamp(260px,32vw,360px);animation:art-in 1.2s .3s cubic-bezier(.16,.84,.32,1) both}
.hero-rings{position:absolute;inset:0;border-radius:50%;pointer-events:none}
.hero-rings::before{content:"";position:absolute;inset:2%;border-radius:50%;border:1px solid rgba(43,108,176,.16)}
.hero-rings::after{content:"";position:absolute;inset:10%;border-radius:50%;border:1px dashed rgba(43,108,176,.11)}
.hero-ring-art{position:absolute;inset:2%;color:var(--blue);pointer-events:none}
.orbit-dot{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:var(--blue);opacity:.25;transform:translate(-50%,-50%);pointer-events:none;will-change:transform}
.orbit-dot.lit{opacity:.9;box-shadow:0 0 6px 3px rgba(43,108,176,.45)}
.orbit-dot::before{content:"";position:absolute;left:-9px;top:-9px;width:23px;height:23px;border-radius:50%;pointer-events:none}
.orbit-dot.lit::before{pointer-events:auto}
.orbit-dot:not(.lit){animation:breathe 7s ease-in-out 1.8s infinite alternate}
@keyframes breathe{from{opacity:.16}to{opacity:.4}}
.orbit-dot.burst{opacity:1;box-shadow:0 0 14px 4px rgba(43,108,176,.7)}
.orbit-dot.out{opacity:0}
.orbit-dot.boom{opacity:.8;box-shadow:0 0 10px 4px rgba(90,150,230,.5);filter:brightness(1.3);animation:none}
.shock-ring{position:absolute;left:50%;top:50%;border:2px solid rgba(120,175,240,.55);border-radius:50%;pointer-events:none;opacity:0}
.orbit-tip{position:fixed;left:0;top:0;padding:2px 6px;background:transparent;border:none;box-shadow:none;color:var(--heading);font-size:12.5px;letter-spacing:1px;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(3px);transition:opacity .25s ease,transform .25s ease,visibility .25s;z-index:60;white-space:nowrap;text-shadow:0 1px 4px rgba(16,26,42,.22)}
.orbit-tip.tip-card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:7px;padding:4px 11px;text-shadow:none}
.orbit-tip.show{opacity:1;visibility:visible;transform:translateY(0)}
.orbit-drift{position:absolute;left:50%;top:50%;width:3px;height:3px;border-radius:50%;background:var(--blue);opacity:.5;transform:translate(-50%,-50%);pointer-events:none;animation:breathe 7s ease-in-out 1.8s infinite alternate}
.hero-scale.scale-lit{filter:drop-shadow(0 0 12px rgba(43,108,176,.8)) drop-shadow(0 0 32px rgba(43,108,176,.45))}
.hero-scale.charge{animation:charge-up 7s ease-in-out forwards}
.hero-scale.charge-drop{animation:charge-down 4.667s ease-in forwards}
@keyframes charge-up{from{transform:translateY(0)}to{transform:translateY(-14px)}}
@keyframes charge-down{from{transform:translateY(-14px)}to{transform:translateY(0)}}
.hero-rings.shock{animation:shockwave .9s cubic-bezier(.36,.07,.19,.97)}
@keyframes shockwave{0%{transform:scale(1)}25%{transform:scale(1.08) rotate(.8deg)}55%{transform:scale(.97) rotate(-.5deg)}80%{transform:scale(1.02)}100%{transform:scale(1)}}

.hero-glow{position:absolute;inset:10%;border-radius:50%;background:radial-gradient(circle,rgba(43,108,176,.11),transparent 65%);pointer-events:none}
.hero-scale-echo{position:absolute;left:12%;top:17%;width:76%;color:var(--blue);opacity:.12;pointer-events:none}
.hero-scale-wrap{position:absolute;left:16%;top:20%;width:68%;animation:float-y 7s 1.8s ease-in-out infinite alternate;pointer-events:none}
.hero-scale{display:block;width:100%;height:auto;color:var(--blue);opacity:.85;filter:drop-shadow(0 10px 24px rgba(43,108,176,.3));transition:filter .5s;pointer-events:none}
.hero-scale .scale-hot{pointer-events:all;cursor:default}
.hero-star{position:absolute;border-radius:50%;background:var(--blue);opacity:.75;animation:twinkle 3.6s ease-in-out infinite}
.hs1{width:6px;height:6px;top:6%;left:74%}
.hs2{width:4px;height:4px;top:16%;left:88%;animation-delay:.8s}
.hs3{width:5px;height:5px;top:64%;left:92%;animation-delay:1.5s}
.hs4{width:3px;height:3px;top:80%;left:76%;animation-delay:2.2s}
.hs5{width:4px;height:4px;top:2%;left:56%;animation-delay:2.8s}
.hero-constellation{position:absolute;top:-124px;left:clamp(16px,5vw,84px);width:176px;height:88px;opacity:.55;color:var(--blue)}
.firefly{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--blue);opacity:0;pointer-events:none;box-shadow:0 0 10px 3px rgba(43,108,176,.4);animation:firefly-drift 9s ease-in-out infinite}
.ff1{left:8%;bottom:18%}
.ff2{left:20%;bottom:6%;animation-delay:3.5s}
.ff3{left:32%;bottom:12%;animation-delay:6s}
.ff4{left:12%;bottom:26%;animation-delay:1.5s}
@keyframes firefly-drift{0%{opacity:0;transform:translate(0,0)}15%{opacity:.95}55%{opacity:.4}100%{opacity:0;transform:translate(40px,-90px)}}
@keyframes art-in{from{opacity:0;transform:translateY(26px) scale(.95)}to{opacity:1;transform:none}}
@keyframes rise-in{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes float-y{from{transform:translateY(0)}to{transform:translateY(-22px)}}
.about-actions{margin-top:22px;display:flex;gap:10px;flex-wrap:wrap}
.about-actions .btn{font-family:inherit;padding:9px 20px;font-size:14px}
@media (max-width:720px){
  .hero{padding:70px 0 64px}
  .hero-main{padding-left:0;margin-top:0}
  .hero-art{pointer-events:none}
.hero-art *{pointer-events:none}
.orbit-dot.lit::before{pointer-events:auto}
.hero-scale .scale-hot{pointer-events:all}
.hero-art{position:absolute;right:-70px;top:-10px;width:190px;height:190px;opacity:.45;animation:none}
  .hero-scale-echo{display:none}
  .orbit-dot{width:3.5px;height:3.5px}
  .orbit-drift{width:2px;height:2px}
  .hero-court{display:none}
  .hero-stars{background-image:radial-gradient(1.5px circle at 30px 40px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 90px 90px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 170px 30px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 250px 80px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 330px 50px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 60px 150px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 150px 190px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 240px 230px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 320px 160px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 90px 280px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 200px 320px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 300px 270px, var(--blue) 100%, transparent);opacity:.75}
  .hero-stars2{background-image:radial-gradient(1.5px circle at 120px 110px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 280px 150px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 60px 210px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 340px 240px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 200px 260px, var(--blue) 100%, transparent),radial-gradient(1.5px circle at 160px 60px, var(--blue) 100%, transparent);opacity:.65;animation-delay:1.2s;animation-duration:5s}
}




.btn{font-family:inherit;display:inline-block;padding:11px 26px;border-radius:8px;font-size:15px;transition:transform .12s,filter .12s,background .15s;cursor:pointer;border:1.5px solid transparent}
.btn-primary{background:var(--blue-dark);color:var(--bg);border-color:var(--blue-dark)}
.btn-primary:hover{filter:brightness(1.08);color:var(--bg)}
.btn-ghost{background:transparent;color:var(--blue);border-color:var(--blue)}
.btn-ghost:hover{background:var(--blue-soft)}
.btn-sm{padding:6px 14px;font-size:13px;border-radius:7px}
.btn:active{transform:translateY(1px)}
a:focus-visible,.btn:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.notice-bar{display:none;position:relative;margin-top:30px;padding:12px 42px 12px 18px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:8px;color:var(--text);font-size:14px;text-align:left;box-shadow:var(--shadow)}
.notice-close{position:absolute;top:9px;right:12px;border:none;background:transparent;color:var(--muted);font-size:17px;line-height:1;cursor:pointer;padding:2px 7px;border-radius:6px}
.notice-close:hover{color:var(--blue);background:var(--blue-soft)}
section{padding:66px 0}
h2{font-size:25px;color:var(--heading);border-left:5px solid var(--blue);padding-left:12px;margin-top:8px;margin-bottom:22px}
.sec-en{display:inline-block;font-family:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-size:12.5px;font-weight:600;letter-spacing:2.5px;color:var(--blue);text-transform:uppercase;margin-left:10px;opacity:.8}
.center-box h2{border-left:none;padding-left:0}
h3{color:var(--heading)}
.lead{color:var(--muted);max-width:760px;line-height:1.9}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:16px}
.card{display:block;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:20px;box-shadow:var(--shadow);transition:transform .15s,border-color .15s,box-shadow .15s;color:var(--text)}
.card:hover{transform:translateY(-3px);border-color:var(--blue);box-shadow:var(--shadow-lg)}
.card h3{font-size:16.5px;margin-bottom:8px;color:var(--heading)}
.card h4{font-size:15px;margin-bottom:6px;color:var(--heading)}
.card p{color:var(--muted);font-size:13.5px}
.card-tag{display:inline-block;background:var(--blue-soft);color:var(--blue);border-radius:6px;font-size:11.5px;padding:2px 8px;margin-bottom:10px}
.card-domain{display:block;margin-top:8px;font-size:11.5px;color:var(--muted);opacity:.85}
.card-warn{margin-top:10px;font-size:12px;color:#c5564e;line-height:1.7}
:root[data-theme="dark"] .card-warn{color:#e58a80}
.card-go{display:inline-block;margin-top:10px;font-size:12.5px;font-weight:600;color:var(--blue)}
.card-links{margin-top:8px;font-size:13px;font-weight:600}
.card-links a{margin-right:8px}
.card-links span{color:var(--muted);margin-right:8px;opacity:.6;font-weight:400}
.more-link{display:inline-block;margin-top:18px;font-size:14px;font-weight:600}
.section-note{font-size:13px;color:var(--muted);margin-top:14px}
.res-cat{margin:24px 0 2px;font-size:17px;color:var(--heading);scroll-margin-top:76px}
.cat-nav{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px}
.cat-label{font-size:12.5px;letter-spacing:3px;color:var(--blue);font-weight:600;margin:16px 0 8px}
.cat-nav a{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:7px 18px;transition:color .15s,border-color .15s,background .15s,transform .15s,box-shadow .15s}
.cat-nav a:hover{color:var(--blue);border-color:var(--blue);background:var(--blue-soft);transform:translateY(-2px);box-shadow:var(--shadow)}
.cat-num{font-size:11px;color:#c8923f;font-weight:700}
.song-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.song-grid.swap{animation:warm-in .6s ease}
.song-card{background:var(--card);border:1px solid var(--line);border-left:4px solid #c8923f;border-radius:10px;padding:14px 16px;box-shadow:var(--shadow)}
.song-card .song-name{font-size:14px;color:var(--text);font-weight:600;margin-bottom:4px}
.song-card .song-artist{font-size:12px;color:var(--muted)}
.song-full{margin-top:16px;max-height:70vh;overflow-y:auto;border:1px solid var(--line);border-radius:10px;padding:6px 14px}
@media (max-width:640px){.song-grid{grid-template-columns:repeat(2,1fr)}}
.tool-links{margin-top:12px;border-top:1px dashed var(--line);padding-top:8px;display:flex;flex-direction:column;gap:2px}
.tl-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;font-size:13px;color:var(--text);transition:background .15s}
.tl-item:hover{background:var(--blue-soft)}
.tl-label{font-size:11px;color:var(--blue);background:var(--blue-soft);border-radius:6px;padding:1px 7px;flex-shrink:0}
.tl-text{color:var(--text);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-pwd{margin-left:auto;font-size:11.5px;color:var(--muted);flex-shrink:0}
.tl-arrow{color:var(--blue);flex-shrink:0}
.rss-box{margin-top:16px}
.rss-toggle{background:transparent;border:1px dashed var(--line);color:var(--muted);font-size:13px;border-radius:999px;padding:4px 14px;cursor:pointer;transition:color .15s,border-color .15s}
.rss-toggle:hover{color:var(--blue);border-color:var(--blue)}
.rss-panel{display:none;margin-top:12px;padding:14px 16px;background:var(--card);border:1px solid var(--line);border-radius:10px;max-width:560px}
.rss-panel.open{display:block}
.rss-desc{font-size:13px;color:var(--muted);margin-bottom:10px}
.rss-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rss-row code{flex:1;min-width:220px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:12.5px;color:var(--text);word-break:break-all;font-family:Consolas,Menlo,monospace}
.connect-box{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:26px 28px;margin-top:16px;display:grid;grid-template-columns:1fr 1.15fr .85fr;gap:20px}
.connect-col h3{font-size:16.5px;margin-bottom:10px}
.connect-col p{color:var(--muted);font-size:14px;margin-bottom:10px}
.connect-divider{border-left:1px solid var(--line);padding-left:26px}
.connect-wechat{display:flex;gap:18px;align-items:flex-start}
.connect-qr{width:112px;height:112px;border-radius:10px;border:1px solid var(--line);flex-shrink:0}
.connect-wechat h4{font-size:15.5px;color:var(--heading);margin-bottom:4px}
.connect-wechat .wechat-id{font-size:13px;color:var(--muted);margin-bottom:8px}
.connect-wechat .btn{margin-top:10px}
@media (max-width:920px){.connect-box{grid-template-columns:1fr}.connect-divider{border-left:none;border-top:1px solid var(--line);padding-left:0;padding-top:18px}}
.follow-strip{border-top:1px solid var(--line);padding:12px 0;background:var(--card)}
.follow-inner{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.follow-inner p{font-size:13.5px;color:var(--muted)}
.search-panel{position:fixed;top:68px;left:50%;transform:translateX(-50%);width:min(560px,calc(100vw - 24px));background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);z-index:50;display:none;overflow:hidden}
.search-panel.open{display:block;animation:sp-in .16s ease}
@keyframes sp-in{from{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%,0)}}
.search-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line)}
.search-head svg{width:17px;height:17px;color:var(--muted);flex-shrink:0}
.search-input{flex:1;border:none;outline:none;background:transparent;color:var(--text);font-size:14.5px;font-family:inherit}
.search-results{max-height:min(380px,60vh);overflow-y:auto;padding:6px}
.sr-hint{padding:18px 16px;font-size:13.5px;color:var(--muted);text-align:center}
.sr-item{display:block;padding:10px 12px;border-radius:9px}
.sr-item:hover{background:var(--blue-soft)}
.sr-top{display:flex;align-items:center;gap:8px;margin-bottom:2px}
.sr-cat{font-size:10.5px;color:var(--blue);background:var(--blue-soft);border-radius:999px;padding:1px 8px;flex-shrink:0}
.sr-title{font-size:14px;color:var(--text);font-weight:600}
.sr-desc{font-size:12.5px;color:var(--muted);line-height:1.6;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
mark{background:transparent;color:var(--blue-dark);font-weight:700;padding:0}
.books-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;margin-top:16px}
.book-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:var(--shadow);transition:transform .15s,border-color .15s}
.book-card:hover{transform:translateY(-3px);border-color:var(--blue)}
.book-cover{width:100%;height:170px;object-fit:cover;object-position:top;display:block;background:var(--blue-soft)}
.book-cover-empty{display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px}
.book-body{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1}
.book-body h4{font-size:15px;color:var(--heading);margin-bottom:4px}
.book-author{font-size:12.5px;color:var(--muted);margin-bottom:6px}
.book-tag{display:inline-block;font-size:11px;color:var(--blue);background:var(--blue-soft);border-radius:6px;padding:1px 7px;margin-bottom:8px}
.book-note{font-size:13px;color:var(--muted);line-height:1.7;flex:1}
.form-box{max-width:560px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:22px;box-shadow:var(--shadow);margin-top:18px}
.form-box label{display:block;font-size:14px;color:var(--heading);margin:14px 0 8px}
.form-box input[type=text],.form-box textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);font-size:14.5px;font-family:inherit}
.form-box textarea{min-height:120px;resize:vertical}
.form-box input[type=text]:focus,.form-box textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.form-box button{margin-top:16px;cursor:pointer;border:none}
.form-tip{font-size:12.5px;color:var(--muted);margin-top:10px}
.hidden-field{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
#msg-hint{display:none;color:#c53030;font-size:13px;margin-top:6px}
.wall{margin-top:16px}
.wall-item{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px 22px;margin-bottom:14px;box-shadow:var(--shadow)}
.wall-name{font-size:13px;color:var(--blue);margin-bottom:6px}
.wall-text{font-size:14.5px;color:var(--text);white-space:pre-wrap;word-break:break-word;line-height:1.9}
.wall-date{font-size:12px;color:var(--muted);margin-top:8px}
.wall-empty{color:var(--muted);padding:24px;text-align:center}
.center-box{max-width:560px;margin:60px auto;text-align:center}
.code-404{font-size:72px;font-weight:700;color:var(--blue);letter-spacing:6px;line-height:1.2}
.btn-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.to-top{position:fixed;right:22px;bottom:26px;width:42px;height:42px;border-radius:50%;background:var(--blue-dark);color:var(--bg);font-size:18px;border:none;cursor:pointer;box-shadow:0 4px 14px rgba(26,54,93,.35);opacity:0;pointer-events:none;transition:opacity .25s;z-index:20}
.to-top.show{opacity:.92;pointer-events:auto}
footer{border-top:1px solid var(--line);padding:26px 0;color:var(--muted);font-size:13px}
.footer-inner{text-align:center}
.footer-links{margin-bottom:10px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.footer-links a{color:var(--muted);font-size:13.5px}
.footer-links a:hover{color:var(--blue)}
.footer-note{margin-top:4px;opacity:.8}
.footer-hand{margin-top:8px;font-size:12px;opacity:.6;letter-spacing:1px}
.reveal-pre{opacity:0;transform:translateY(16px)}
.reveal-in{opacity:1;transform:none;transition:opacity .55s ease,transform .55s ease}
/* ---- 微光同行 ---- */
/* 标题字体：站酷庆科黄油体 ZCOOL QingKe HuangYou（OFL-1.1 开源许可），已子集化内嵌 weiguang.woff2 */
/* 标题字体：马善政楷书 Ma Shan Zheng（OFL-1.1 开源许可），子集化内嵌 weiguang5.woff2 */
@font-face{font-family:"WeiGuang";src:url("weiguang5.woff2") format("woff2");font-display:swap}
:root{--sky1:#3a4a78;--sky2:#5d6f9f;--sky3:#9fb0d0;--sky-star:rgba(255,255,255,.72);--sky-subc:rgba(255,255,255,.94)}
:root[data-theme="dark"]{--sky1:#070d20;--sky2:#101a38;--sky3:#223460;--sky-star:#fff;--sky-subc:rgba(255,255,255,.8)}
@media (prefers-color-scheme: dark){:root:not([data-theme]){--sky1:#070d20;--sky2:#101a38;--sky3:#223460;--sky-star:#fff;--sky-subc:rgba(255,255,255,.8)}}
.nav-links a.nav-glow{color:#c8923f;font-weight:600}
.nav-links a.nav-glow:hover{color:var(--blue)}
.nav-links a.nav-glow svg{width:12px;height:12px;vertical-align:-1px;margin-right:3px}
:root[data-theme="dark"] .nav-links a.nav-glow{color:#e2b25e}
.nav-menu a.nav-glow{color:#c8923f;font-weight:600}
.nav-menu a.nav-glow svg{width:12px;height:12px;vertical-align:-1px;margin-right:3px}
.sky{position:relative;overflow:hidden;min-height:500px;background:linear-gradient(180deg,var(--sky1) 0%,var(--sky2) 46%,var(--sky3) 100%);display:flex;align-items:center;padding:70px 0 80px}
.sky::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 74% 6%,rgba(150,175,235,.2),transparent 52%),radial-gradient(ellipse at 16% 88%,rgba(130,155,225,.14),transparent 50%);pointer-events:none}
.sky::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:220px;background:linear-gradient(180deg,transparent,var(--bg));pointer-events:none}
.sky-stars,.sky-stars2{position:absolute;inset:0;animation:twinkle 4s ease-in-out infinite}
.sky-stars{box-shadow:120px 60px 0 var(--sky-star),340px 90px 0 var(--sky-star),560px 40px 0 var(--sky-star),800px 110px 0 var(--sky-star),1040px 60px 0 var(--sky-star),220px 180px 0 var(--sky-star),460px 200px 0 var(--sky-star),700px 170px 0 var(--sky-star),940px 210px 0 var(--sky-star),90px 300px 0 var(--sky-star),330px 330px 0 var(--sky-star),620px 300px 0 var(--sky-star),880px 320px 0 var(--sky-star),1100px 280px 0 var(--sky-star),170px 420px 0 var(--sky-star),520px 430px 0 var(--sky-star),760px 400px 0 var(--sky-star),1010px 430px 0 var(--sky-star)}
.sky-stars2{box-shadow:60px 140px 0 rgba(255,255,255,.8),430px 60px 0 rgba(255,255,255,.7),680px 120px 0 rgba(255,255,255,.7),930px 70px 0 rgba(255,255,255,.8),260px 250px 0 rgba(255,255,255,.6),580px 260px 0 rgba(255,255,255,.7),840px 260px 0 rgba(255,255,255,.6),150px 370px 0 rgba(255,255,255,.7),400px 380px 0 rgba(255,255,255,.6),700px 360px 0 rgba(255,255,255,.7),960px 370px 0 rgba(255,255,255,.6),1080px 200px 0 rgba(255,255,255,.7);animation-delay:1.6s;animation-duration:5s}
@keyframes twinkle{0%,100%{opacity:.9}50%{opacity:.35}}
.sky-drift{position:absolute;inset:0;pointer-events:none;opacity:.55;animation:sky-drift 16s ease-in-out infinite alternate}
.sky-drift::before{content:"";position:absolute;inset:0;background-image:radial-gradient(9px circle at 26% 46%, rgba(255,233,184,.4) 0%, rgba(255,233,184,0) 70%),radial-gradient(8px circle at 70% 16%, rgba(255,240,200,.4) 0%, rgba(255,240,200,0) 70%),radial-gradient(7px circle at 49% 8%, rgba(255,233,184,.36) 0%, rgba(255,233,184,0) 70%),radial-gradient(8px circle at 90% 64%, rgba(255,240,200,.36) 0%, rgba(255,240,200,0) 70%),radial-gradient(7px circle at 12% 74%, rgba(255,233,184,.34) 0%, rgba(255,233,184,0) 70%),radial-gradient(8px circle at 58% 80%, rgba(255,240,200,.32) 0%, rgba(255,240,200,0) 70%),radial-gradient(2.5px circle at 8% 32%, #ffe9b8 100%, transparent),radial-gradient(1.5px circle at 18% 10%, #fff3d6 100%, transparent),radial-gradient(3px circle at 26% 46%, #ffdf9e 100%, transparent),radial-gradient(1.5px circle at 35% 18%, #fff8e6 100%, transparent),radial-gradient(2px circle at 42% 58%, #ffe9b8 100%, transparent),radial-gradient(2.5px circle at 49% 8%, #fff3d6 100%, transparent),radial-gradient(1.5px circle at 55% 36%, #ffdf9e 100%, transparent),radial-gradient(2px circle at 63% 52%, #fff8e6 100%, transparent),radial-gradient(3px circle at 70% 16%, #ffe9b8 100%, transparent),radial-gradient(1.5px circle at 76% 60%, #fff3d6 100%, transparent),radial-gradient(2px circle at 84% 26%, #ffdf9e 100%, transparent),radial-gradient(2.5px circle at 90% 64%, #ffe9b8 100%, transparent),radial-gradient(1.5px circle at 94% 40%, #fff8e6 100%, transparent),radial-gradient(2px circle at 12% 74%, #fff3d6 100%, transparent),radial-gradient(1.5px circle at 58% 80%, #ffdf9e 100%, transparent),radial-gradient(2.5px circle at 30% 88%, #ffe9b8 100%, transparent),radial-gradient(1.5px circle at 4% 56%, #fff8e6 100%, transparent),radial-gradient(2px circle at 15% 92%, #ffe9b8 100%, transparent),radial-gradient(2.5px circle at 38% 2%, #fff3d6 100%, transparent),radial-gradient(1.5px circle at 66% 90%, #ffdf9e 100%, transparent),radial-gradient(2px circle at 82% 2%, #fff8e6 100%, transparent),radial-gradient(2.5px circle at 97% 18%, #ffe9b8 100%, transparent),radial-gradient(1.5px circle at 44% 96%, #fff3d6 100%, transparent),radial-gradient(2px circle at 99% 80%, #ffdf9e 100%, transparent);animation:twinkle 6s ease-in-out infinite}
.sky-drift::after{content:"";position:absolute;inset:0;background-image:radial-gradient(2px circle at 6% 20%, #fff8e6 100%, transparent),radial-gradient(1.5px circle at 22% 30%, #ffe9b8 100%, transparent),radial-gradient(2.5px circle at 32% 66%, #fff3d6 100%, transparent),radial-gradient(1.5px circle at 46% 26%, #ffdf9e 100%, transparent),radial-gradient(2px circle at 60% 44%, #ffe9b8 100%, transparent),radial-gradient(2.5px circle at 74% 74%, #fff8e6 100%, transparent),radial-gradient(1.5px circle at 88% 48%, #fff3d6 100%, transparent),radial-gradient(2px circle at 54% 14%, #ffdf9e 100%, transparent),radial-gradient(1.5px circle at 10% 82%, #ffe9b8 100%, transparent),radial-gradient(2.5px circle at 80% 88%, #fff8e6 100%, transparent);animation:twinkle 7.5s 1.2s ease-in-out infinite}
@keyframes sky-drift{from{transform:translate(0,0)}to{transform:translate(22px,-14px)}}
.sky-haze{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 46% 34% at 78% 8%,rgba(150,178,228,.16),transparent 70%),radial-gradient(ellipse 40% 30% at 28% 6%,rgba(172,194,234,.12),transparent 70%);filter:blur(22px)}
.sky-scene{position:absolute;right:-1%;top:-30%;width:min(84%,860px);z-index:1;pointer-events:none;opacity:0;animation:rise-in 1.4s 1.05s cubic-bezier(.16,.84,.32,1) forwards}
.sky-constellation{display:block;width:100%;height:auto;pointer-events:none}
.sky-constellation polyline{stroke-dasharray:400;stroke-dashoffset:400;opacity:0;animation:draw-line 1.1s ease forwards}
.sky-constellation polyline:nth-of-type(1){animation-delay:4.8s}
.sky-constellation polyline:nth-of-type(2){animation-delay:5.4s}
.sky-constellation polyline:nth-of-type(3){animation-delay:6.0s}
.sky-constellation polyline:nth-of-type(4){animation-delay:6.6s}
.sky-constellation polyline:nth-of-type(5){animation-delay:7.2s}
.sky-constellation polyline:nth-of-type(6){animation-delay:7.8s}
@keyframes draw-line{to{stroke-dashoffset:0;opacity:1}}
@keyframes dot-in{to{opacity:.7}}
.meteor{display:block;position:absolute;width:0;height:0;opacity:0;cursor:pointer;pointer-events:auto}
.meteor::before{content:"";position:absolute;left:-15px;top:-15px;width:30px;height:30px}
.m-line{display:block;position:absolute;left:0;top:-1.5px;width:190px;height:3px;border-radius:999px;background:linear-gradient(90deg,rgba(255,252,242,.98) 0%,rgba(255,222,150,.75) 30%,rgba(255,214,140,.25) 60%,rgba(255,214,140,0) 100%);transform-origin:left center;filter:drop-shadow(0 0 6px rgba(255,220,152,.9))}
.m-dot{display:block;position:absolute;left:-6px;top:-6px;width:12px;height:12px;border-radius:50%;background:#fffdf4;box-shadow:0 0 14px 5px rgba(255,229,170,.95)}
.meteor.pulse .m-dot{box-shadow:0 0 18px 7px rgba(255,242,206,1)}
.m-faint .m-line{width:140px;height:2.5px;background:linear-gradient(90deg,rgba(255,250,238,.92) 0%,rgba(255,214,140,.5) 32%,rgba(255,214,140,0) 100%);filter:drop-shadow(0 0 4px rgba(255,216,148,.7))}
.m-faint .m-dot{width:9px;height:9px;left:-4.5px;top:-4.5px}
.m1{left:21%;top:57.7%;animation:m1-fly 1.5s .3s cubic-bezier(.3,.5,.3,1) forwards}
.m1 .m-line{animation:tail-shrink .9s 2.0s ease-out forwards}
.m1 .m-dot{animation:head-pulse 2.6s 2.0s ease-in-out infinite}
.m2{left:36.75%;top:67.3%;animation:m2-fly 1.3s .8s cubic-bezier(.3,.5,.3,1) forwards}
.m2 .m-line{animation:tail-shrink .9s 2.3s ease-out forwards}
.m2 .m-dot{animation:head-pulse 2.6s 2.3s ease-in-out infinite}
.m3{left:41.25%;top:87.3%;animation:m3-fly 1.6s 1.3s cubic-bezier(.3,.5,.3,1) forwards}
.m3 .m-line{animation:tail-shrink .9s 3.1s ease-out forwards}
.m3 .m-dot{animation:head-pulse 2.6s 3.1s ease-in-out infinite}
.m4{left:25.25%;top:80.4%;animation:m4-fly 1.8s 1.8s cubic-bezier(.3,.5,.3,1) forwards}
.m4 .m-line{animation:tail-shrink .9s 3.8s ease-out forwards}
.m4 .m-dot{animation:head-pulse 2.6s 3.8s ease-in-out infinite}
.m5{left:52.5%;top:75.4%;animation:m5-fly 1.2s 2.2s cubic-bezier(.3,.5,.3,1) forwards}
.m5 .m-line{animation:tail-shrink .9s 3.6s ease-out forwards}
.m5 .m-dot{animation:head-pulse 2.6s 3.6s ease-in-out infinite}
.m6{left:64.75%;top:64.6%;animation:m6-fly 1.7s 2.6s cubic-bezier(.3,.5,.3,1) forwards}
.m6 .m-line{animation:tail-shrink .9s 4.5s ease-out forwards}
.m6 .m-dot{animation:head-pulse 2.6s 4.5s ease-in-out infinite}
.m7{left:77%;top:49.6%;animation:m7-fly 1.5s 3s cubic-bezier(.3,.5,.3,1) forwards}
.m7 .m-line{animation:tail-shrink .9s 4.7s ease-out forwards}
.m7 .m-dot{animation:head-pulse 2.6s 4.7s ease-in-out infinite}
@keyframes m1-fly{0%{opacity:0;transform:translate(56vw,-30vh) rotate(-35deg)}8%{opacity:1}100%{opacity:1;transform:translate(0,0) rotate(-35deg)}}
@keyframes m2-fly{0%{opacity:0;transform:translate(44vw,-36vh) rotate(-32deg)}8%{opacity:1}100%{opacity:1;transform:translate(0,0) rotate(-32deg)}}
@keyframes m3-fly{0%{opacity:0;transform:translate(64vw,-26vh) rotate(-38deg)}8%{opacity:1}100%{opacity:1;transform:translate(0,0) rotate(-38deg)}}
@keyframes m4-fly{0%{opacity:0;transform:translate(50vw,-42vh) rotate(-35deg)}8%{opacity:1}100%{opacity:1;transform:translate(0,0) rotate(-35deg)}}
@keyframes m5-fly{0%{opacity:0;transform:translate(68vw,-32vh) rotate(-30deg)}8%{opacity:1}100%{opacity:1;transform:translate(0,0) rotate(-30deg)}}
@keyframes m6-fly{0%{opacity:0;transform:translate(46vw,-24vh) rotate(-40deg)}8%{opacity:1}100%{opacity:1;transform:translate(0,0) rotate(-40deg)}}
@keyframes m7-fly{0%{opacity:0;transform:translate(60vw,-44vh) rotate(-35deg)}8%{opacity:1}100%{opacity:1;transform:translate(0,0) rotate(-35deg)}}
@keyframes tail-shrink{from{transform:scaleX(1);opacity:1}to{transform:scaleX(.06);opacity:.3}}
@keyframes head-pulse{0%,100%{box-shadow:0 0 8px 3px rgba(255,226,168,.8)}50%{box-shadow:0 0 16px 6px rgba(255,236,190,1)}}
.meteor-word{position:fixed;left:var(--fx);top:var(--fy);color:#f0c778;font-size:13px;letter-spacing:2px;pointer-events:none;z-index:60;text-shadow:0 1px 8px rgba(10,16,36,.85);animation:word-rise 2.4s ease-out forwards}
@keyframes word-rise{0%{opacity:0;transform:translateY(6px)}12%{opacity:1}100%{opacity:0;transform:translateY(-48px)}}
.sky-inner{position:relative;z-index:2;width:100%;max-width:1000px;margin:0 auto;padding:0 20px;text-align:left;pointer-events:none}
.sky-badge{display:inline-block;margin-bottom:20px;padding:5px 16px;border:1px solid rgba(255,220,160,.45);border-radius:999px;color:#ffd994;font-size:12.5px;letter-spacing:2px;animation:rise-in .8s .05s cubic-bezier(.16,.84,.32,1) both}
.sky-title{font-family:"WeiGuang","Ma Shan Zheng","STXingkai","华文行楷","Kaiti SC","KaiTi",serif;font-size:clamp(50px,9vw,94px);font-weight:400;letter-spacing:.08em;line-height:1.3;background:linear-gradient(180deg,#ffedc4 0%,#ffd98e 48%,#f2c272 100%);-webkit-background-clip:text;background-clip:text;color:transparent;animation:rise-in 1.1s .1s cubic-bezier(.16,.84,.32,1) both,sky-glow 5.5s 1.8s ease-in-out infinite}
@keyframes sky-glow{0%,100%{filter:drop-shadow(0 6px 16px rgba(240,192,112,.26))}50%{filter:drop-shadow(0 6px 30px rgba(246,204,134,.5))}}
.sky-title .bracket{font-size:.72em;opacity:.82;letter-spacing:0}
.sky-sub-line{display:flex;align-items:center;gap:18px;margin-top:28px}
.sky-rule{width:48px;height:2px;background:linear-gradient(90deg,#ffd994,rgba(255,217,148,0));flex-shrink:0;animation:rise-in .8s .7s cubic-bezier(.16,.84,.32,1) both}
.sky-sub{margin-top:0;color:var(--sky-subc);font-size:16px;letter-spacing:4px;animation:rise-in .9s .5s cubic-bezier(.16,.84,.32,1) both}
.hot-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:16px}
.hot-card{background:var(--card);border:1px solid var(--line);border-left:4px solid #c8923f;border-radius:10px;padding:18px 20px;box-shadow:var(--shadow);transition:transform .15s,border-color .15s}
.hot-card:hover{transform:translateY(-3px);border-color:#c8923f}
.hot-num{font-size:22px;font-weight:700;color:var(--heading);letter-spacing:1px}
.hot-num a{color:inherit}
.hot-name{font-size:14.5px;color:var(--blue);margin:2px 0 6px;font-weight:600}
.hot-desc{font-size:13px;color:var(--muted);line-height:1.7}
.guide-item{background:var(--card);border:1px solid var(--line);border-left:4px solid rgba(200,146,63,.65);border-radius:10px;padding:18px 22px;margin-top:14px;box-shadow:var(--shadow)}
.guide-item h4{font-size:14.5px;color:var(--heading);margin-bottom:8px}
.guide-item p{font-size:13.5px;color:var(--muted);line-height:1.9}
.warm-box{max-width:560px;background:var(--card);border:1px solid var(--line);border-left:4px solid #c8923f;border-radius:10px;padding:22px 26px;box-shadow:var(--shadow)}
.warm-text{font-size:16px;color:var(--text);min-height:30px;margin-bottom:14px}
.warm-text.swap{animation:warm-in .6s ease}
@keyframes warm-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.warm-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.warm-actions .btn:disabled{opacity:.5;cursor:default;pointer-events:none}
.indent-p{text-indent:2em}
@media (max-width:640px){
  .sky-stars{box-shadow:40px 40px 0 var(--sky-star),120px 90px 0 var(--sky-star),200px 30px 0 var(--sky-star),280px 110px 0 var(--sky-star),350px 60px 0 var(--sky-star),60px 150px 0 var(--sky-star),150px 190px 0 var(--sky-star),240px 230px 0 var(--sky-star),320px 160px 0 var(--sky-star),90px 280px 0 var(--sky-star),200px 320px 0 var(--sky-star),300px 270px 0 var(--sky-star)}
  .sky-stars2{box-shadow:20px 100px 0 rgba(255,255,255,.7),110px 30px 0 rgba(255,255,255,.7),190px 140px 0 rgba(255,255,255,.6),270px 60px 0 rgba(255,255,255,.7),340px 200px 0 rgba(255,255,255,.6),40px 220px 0 rgba(255,255,255,.7),140px 340px 0 rgba(255,255,255,.6),250px 380px 0 rgba(255,255,255,.7),330px 330px 0 rgba(255,255,255,.6)}
  .sky-scene{width:62%;right:1%;top:2%}
}
.song-list{margin-top:16px}
.song-item{display:flex;align-items:baseline;gap:12px;padding:10px 14px;border-bottom:1px dashed var(--line);font-size:14px}
.song-item:last-child{border-bottom:none}
.song-no{color:#c8923f;font-size:12px;flex-shrink:0;letter-spacing:1px}
.song-name{color:var(--text);font-weight:600}
.song-artist{color:var(--muted);font-size:12.5px}
.song-note{margin-top:14px;font-size:12.5px;color:var(--muted)}
.group-note{margin-top:8px;font-size:12.5px;color:var(--muted)}
@media (max-width:640px){
  .sky{min-height:430px;padding:56px 0 70px}
  .sky-title{letter-spacing:.18em}
}

@media (max-width:720px){
  .nav-links{display:none}
  #btn-menu{display:flex}
  .nav-menu{display:none;border-bottom:1px solid var(--line);background:var(--card)}
  .nav-menu.open{display:block}
  .nav-menu-inner{padding:4px 20px 12px}
  .nav-menu a{display:block;padding:12px 2px;border-bottom:1px solid var(--line);color:var(--text);font-size:15px}
  .nav-menu a:last-child{border-bottom:none}
  .nav-menu a:hover{color:var(--blue)}
  .connect-box{grid-template-columns:1fr}
  .connect-divider{border-left:none;border-top:1px solid var(--line);padding-left:0;padding-top:20px}
}
@media (max-width:640px){
  .brand-sub{display:none}
  section{padding:40px 0}
  .hero{padding:56px 0 46px}
  .to-top{right:16px;bottom:18px}
  .hero-actions .btn{font-family:inherit;padding:10px 20px;font-size:14.5px}
  .connect-wechat{flex-direction:column;align-items:center;text-align:center}
  .search-panel{top:64px}
}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
.egg{position:absolute;right:16px;bottom:12px;font-size:11px;letter-spacing:2px;color:var(--muted);opacity:.32;pointer-events:none;transition:opacity .5s ease;z-index:2;white-space:nowrap;user-select:none}

.no-sel,.no-sel *{-webkit-user-select:none;user-select:none}
.no-sel #connect,.no-sel #connect *{-webkit-user-select:text;user-select:text}
.no-sel input,.no-sel textarea{-webkit-user-select:text;user-select:text}
@media (max-width:720px){.hero-constellation{top:-66px;left:14px;width:108px;height:54px;opacity:.5}}

.mail-lead{color:var(--muted);font-size:14px;line-height:1.85;margin-bottom:14px}
.mail-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.mail-hint{display:none;margin-top:10px;font-size:13px;color:var(--blue);word-break:break-all}

/* ---- 手机端排版优化（2026-10） ---- */
@media (max-width:720px){
  .hero{padding:74px 0 60px}
  .hero-title{font-size:clamp(30px,8.8vw,42px);letter-spacing:4px;margin-bottom:12px}
  .hero-tagline{font-size:14px;letter-spacing:3px;gap:8px;margin-bottom:10px}
  .hero-tagline::before{width:20px;height:2px}
  .hero-sub{font-size:14px;line-height:1.75;max-width:100%}
  .hero-art{right:-4px;top:6px;width:150px;height:150px;opacity:.5}
  .brand{font-size:16px}
  .icon-btn{width:34px;height:34px}
  nav{gap:6px}
}
@media (max-width:480px){
  .hero{padding:70px 0 56px}
  .hero-title{font-size:clamp(28px,9.6vw,34px);letter-spacing:3px}
  .hero-art{right:0;top:4px;width:122px;height:122px;opacity:.45}
  .hero-constellation{width:92px;height:46px;top:-54px}
  .notice-bar{font-size:13px}
  .mail-actions .btn{flex:1 1 auto;text-align:center}
}
.mail-label{display:block;color:var(--muted);font-size:13.5px;line-height:1.7;margin-bottom:8px}
#mail-body{width:100%;min-height:110px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);font-size:14px;font-family:inherit;resize:vertical;margin-bottom:12px}

/* ================= 手机端专属版式（2026-10） ================= */
@media (max-width:720px){
  /* 1) 菜单改为浮层：打开不再把正文顶下去 */
  .nav-menu{position:fixed;left:0;right:0;top:60px;z-index:45;background:var(--card);border-bottom:1px solid var(--line);
    box-shadow:0 12px 28px rgba(15,25,45,.18);max-height:calc(100vh - 60px);overflow-y:auto}
  .nav-menu-inner{padding:6px 20px 14px}
  .nav-menu a{padding:13px 2px;font-size:15px}
  body.menu-open{overflow:hidden}

  /* 2) 首页：整屏构图（文字上半，天平下半，居中协调） */
  .hero{min-height:100vh;min-height:100svh;padding:78px 0 30px;display:flex;flex-direction:column;justify-content:center}
  .hero-main{padding-left:0;margin:0 auto;max-width:min(100%,540px);width:100%}
  .hero-title{font-size:clamp(26px,7.8vw,34px);letter-spacing:2.5px;line-height:1.28;margin-bottom:9px}
  .hero-tagline{font-size:12.5px;letter-spacing:2.5px;gap:7px;margin-bottom:7px}
  .hero-tagline::before{width:16px;height:2px}
  .hero-sub{font-size:13px;line-height:1.72;max-width:100%}
  .notice-bar{font-size:12.5px;padding:8px 12px;margin-top:12px}
  .hero-art{position:relative;right:auto;top:auto;width:min(62vw,232px);height:min(62vw,232px);
    margin:16px auto 0;opacity:.58;animation:art-in 1.1s .25s cubic-bezier(.16,.84,.32,1) both}
  .hero-constellation{left:50%;transform:translateX(-50%);top:-62px;width:112px;height:56px;opacity:.55}
  .egg{right:12px;bottom:9px;font-size:9.5px;letter-spacing:1px;opacity:.26}
  .brand{font-size:15.5px}
  .brand-logo{width:22px;height:19px}
  .icon-btn{width:33px;height:33px}
}
@media (max-width:480px){
  .hero{padding:74px 0 26px}
  .hero-art{width:min(66vw,206px);height:min(66vw,206px);margin-top:14px}
  .hero-constellation{top:-56px;width:96px;height:48px}
  .egg{font-size:9px;right:10px;bottom:8px}
}

/* 3) 微光同行：手机端整屏 + 北斗七星移到下半区，不再压标题 */
@media (max-width:720px){
  .sky{min-height:100vh;min-height:100svh;padding:66px 0 46px;display:flex;align-items:center}
  .sky-scene{top:auto;bottom:-6%;right:-10%;width:min(96%,470px);opacity:.85;max-height:56vh}
  .sky-title{font-size:clamp(40px,11.5vw,60px);letter-spacing:.12em}
  .sky-sub{font-size:13.5px;letter-spacing:3px}
  .sky-badge{font-size:12px;padding:4px 12px;margin-bottom:16px}
  .sky-sub-line{gap:12px;margin-top:20px}
}

.form-status{display:none;margin-top:12px;font-size:13px;line-height:1.7;color:var(--blue)}
.form-status.warn{color:#c0562f}

/* ---- 页面底部边界与悬浮按钮（2026-10 修复） ---- */
footer{border-top:none}
@media (max-width:720px){
  footer{padding:22px 0 78px}
  .follow-strip{padding:11px 0}
  .to-top{right:14px;bottom:14px;width:38px;height:38px;font-size:15px}
  .mail-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
  .mail-actions .btn{width:100%;text-align:center;margin:0}
}
@media (min-width:721px){
  .mail-actions .btn{min-width:140px;text-align:center}
}

/* ================= 手机端版式 v2（2026-10 精修） ================= */
@media (max-width:720px){
  /* 首页：文字居中在上、天平居下，自然高度不再拉长 */
  .hero{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:auto;padding:72px 0 28px;text-align:center}
  .hero-main{padding:0 20px;margin:0;max-width:100%;width:100%;text-align:center}
  .hero-title{font-size:clamp(30px,9vw,40px);letter-spacing:3px;line-height:1.3;margin-bottom:8px}
  .hero-tagline{justify-content:center;font-size:13px;letter-spacing:3px;gap:8px;margin-bottom:6px}
  .hero-tagline::before{width:16px;height:2px}
  .hero-sub{font-size:13.5px;line-height:1.7;margin:0 auto;max-width:100%}
  .notice-bar{font-size:12.5px;margin-top:12px}
  .hero-art{width:min(56vw,200px);height:min(56vw,200px);margin:18px auto 0;opacity:.6}
  .hero-constellation{left:50%;transform:translateX(-50%);top:-50px;width:92px;height:46px;opacity:.5}
  .egg{right:12px;bottom:8px;font-size:9.5px;letter-spacing:1px}

  /* 微光同行：文字在上、北斗七星完整在下，节与节之间不留大片空白 */
  .sky{display:flex;flex-direction:column;min-height:auto;padding:64px 0 34px}
  .sky-inner{order:1;padding:0 20px}
  .sky-scene{order:2;position:relative;left:auto;right:auto;top:auto;bottom:auto;width:min(94%,420px);margin:22px auto 0;opacity:.92;max-height:none}
  .sky-title{font-size:clamp(38px,11vw,52px);letter-spacing:.1em;margin-bottom:6px}
  .sky-sub{font-size:13px;letter-spacing:2.5px}
  .sky-badge{font-size:11.5px;padding:4px 12px;margin-bottom:14px}
  .sky-sub-line{gap:12px;margin-top:16px}
}
@media (max-width:480px){
  .hero{padding:68px 0 24px}
  .hero-art{width:min(60vw,180px);height:min(60vw,180px);margin-top:16px}
  .hero-constellation{top:-46px;width:84px;height:42px}
  .sky{padding:58px 0 28px}
  .sky-title{font-size:clamp(34px,12vw,46px)}
  .sky-scene{width:96%;margin-top:18px}
}

/* ================= 手机端版式 v3（2026-10 终版） ================= */
@media (max-width:720px){
  /* 首页：标题横向、左对齐但整块居中；小字副标题同样横排；天平居中在下 */
  .hero{display:block;min-height:auto;padding:70px 0 26px;text-align:left}
  .hero-main{display:block;width:auto;max-width:min(100%,470px);margin:0 auto;padding:0 22px;text-align:left}
  .hero-title{display:block;font-size:clamp(30px,8.6vw,38px);letter-spacing:3px;line-height:1.25;margin-bottom:8px;white-space:nowrap}
  .hero-tagline{display:flex;align-items:center;justify-content:flex-start;gap:8px;font-size:13px;letter-spacing:3px;margin-bottom:6px}
  .hero-tagline::before{width:16px;height:2px}
  .hero-sub{font-size:13.5px;line-height:1.7;max-width:none}
  .notice-bar{font-size:12.5px;margin-top:12px}
  .hero-art{position:relative;width:min(58vw,208px);height:min(58vw,208px);margin:20px auto 0;opacity:.62;animation:art-in 1s .2s cubic-bezier(.16,.84,.32,1) both}
  .hero-constellation{left:50%;transform:translateX(-50%);top:-46px;width:88px;height:44px;opacity:.5}
  .egg{right:12px;bottom:8px;font-size:9.5px;letter-spacing:1px}

  /* 微光同行：北斗七星在上、标题紧随其下 */
  .sky{display:flex;flex-direction:column;min-height:auto;padding:56px 0 30px}
  .sky-scene{order:1;position:relative;left:auto;right:auto;top:auto;bottom:auto;width:min(88%,380px);margin:0 auto 12px;opacity:.92;max-height:none}
  .sky-inner{order:2;padding:0 22px;text-align:left}
  .sky-title{font-size:clamp(36px,10.5vw,50px);letter-spacing:.1em;margin-bottom:6px}
  .sky-sub{font-size:13px;letter-spacing:2.5px}
  .sky-badge{font-size:11.5px;padding:4px 12px;margin-bottom:12px}
  .sky-sub-line{gap:12px;margin-top:14px}
}
@media (max-width:480px){
  .hero{padding:66px 0 22px}
  .hero-main{padding:0 18px}
  .hero-title{font-size:clamp(28px,9.4vw,34px);letter-spacing:2px}
  .hero-art{width:min(62vw,186px);height:min(62vw,186px);margin-top:18px}
  .hero-constellation{top:-42px;width:80px;height:40px}
  .sky{padding:52px 0 26px}
  .sky-title{font-size:clamp(32px,11.5vw,44px)}
  .sky-scene{width:90%;margin-bottom:10px}
}

/* ================= 手机端版式 v4（2026-10 定稿） ================= */
@media (max-width:720px){
  /* 首页：背景恢复整屏；文字在上（左对齐、整块居中）；天平居中在下 */
  .hero{min-height:100svh;display:flex;align-items:center;padding:78px 0 44px}
  .hero-inner{flex:1;flex-direction:column;align-items:stretch;justify-content:center;gap:0;padding:0 22px;max-width:100%}
  .hero-main{flex:0 0 auto;max-width:none;width:100%;padding:0;margin:0;text-align:left}
  .hero-title{font-size:clamp(30px,8.6vw,38px);letter-spacing:3px;line-height:1.25;margin-bottom:8px;white-space:nowrap}
  .hero-tagline{display:flex;align-items:center;justify-content:flex-start;gap:8px;font-size:13px;letter-spacing:3px;margin-bottom:6px}
  .hero-tagline::before{width:16px;height:2px}
  .hero-sub{font-size:13.5px;line-height:1.7}
  .notice-bar{font-size:12.5px;margin-top:12px}
  .hero-art{align-self:center;position:relative;right:auto;top:auto;width:min(58vw,208px);height:min(58vw,208px);margin:24px auto 0;opacity:.62;animation:art-in 1s .2s cubic-bezier(.16,.84,.32,1) both}
  .hero-constellation{left:50%;transform:translateX(-50%);top:-46px;width:88px;height:44px;opacity:.5}
  .egg{right:12px;bottom:10px;font-size:9.5px;letter-spacing:1px}

  /* 微光同行：整体在背景中垂直居中；裁掉七星上方空白并上移，标题紧随其下 */
  .sky{display:flex;flex-direction:column;justify-content:center;min-height:92svh;padding:56px 0 52px}
  .sky-scene{order:1;position:relative;left:auto;right:auto;top:auto;bottom:auto;width:min(88%,380px);margin:-26% auto 6px;opacity:.92}
  .sky-inner{order:2;padding:0 22px;text-align:left}
  .sky-title{font-size:clamp(36px,10.5vw,50px);letter-spacing:.1em;margin-bottom:6px}
  .sky-sub{font-size:13px;letter-spacing:2.5px}
  .sky-badge{font-size:11.5px;padding:4px 12px;margin-bottom:12px}
  .sky-sub-line{gap:12px;margin-top:14px}
}
@media (max-width:480px){
  .hero{padding:74px 0 38px}
  .hero-title{font-size:clamp(28px,9.4vw,34px);letter-spacing:2px}
  .hero-art{width:min(62vw,186px);height:min(62vw,186px);margin-top:20px}
  .hero-constellation{top:-42px;width:80px;height:40px}
  .sky{min-height:90svh;padding:50px 0 46px}
  .sky-title{font-size:clamp(32px,11.5vw,44px)}
  .sky-scene{width:92%;margin-top:-24%}
}

/* ================= 手机端版式 v5（2026-10 最终修正） ================= */
@media (max-width:720px){
  /* 关键：hero 为纵向 flex 时必须 stretch，否则内层容器塌成窄条（文字被挤成竖排的真凶） */
  .hero{align-items:stretch;justify-content:center;min-height:100svh;padding:78px 0 44px}
  .hero-inner{width:100%;max-width:100%;padding:0 22px}
  .hero-main{width:100%;max-width:none;text-align:left}
  .hero-art{align-self:center}
  /* 微光同行：整屏居中，七星裁掉上方空白后上移，标题紧随其下 */
  .sky{min-height:92svh;padding:56px 0 50px;justify-content:center}
  .sky-scene{margin:-25% auto 8px}
  .sky-inner{width:100%;padding:0 22px}
}
@media (max-width:480px){
  .hero{padding:74px 0 38px}
  .sky{min-height:90svh;padding:50px 0 44px}
  .sky-scene{margin-top:-24%}
}