:root{
  --cyber-cyan:#00e5ff;
  --cyber-magenta:#ff00a0;
  --bg-dark:#070a12;
  --bg-panel:rgba(10,16,30,.85);
  --text-main:#e6f1ff;
  --text-dim:#8b9bb4;
  --border-glow:rgba(0,229,255,.25);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg-dark);
  color:var(--text-main);
  font-family:"PingFang SC","Microsoft YaHei",monospace,sans-serif;
  line-height:1.6;
  overflow-x:hidden;
  background-image:
    radial-gradient(circle at 10% 10%,rgba(0,229,255,.08) 0,transparent 40%),
    radial-gradient(circle at 90% 30%,rgba(255,0,160,.08) 0,transparent 40%);
  background-attachment:fixed;
}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
.mono{font-family:"Courier New",Courier,monospace;letter-spacing:.05em;}

/* 切角边框通用 */
.clip-panel{
  background:var(--bg-panel);
  border:1px solid var(--border-glow);
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));
  position:relative;
}
.clip-panel::before{
  content:'';position:absolute;top:0;left:0;width:16px;height:16px;
  border-bottom:1px solid var(--cyber-magenta);border-right:1px solid var(--cyber-magenta);
  opacity:.5;
}

/* 顶部导航 */
header.top-nav{
  position:sticky;top:0;z-index:100;
  background:rgba(7,10,18,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,229,255,.2);
}
.nav-inner{
  max-width:1200px;margin:0 auto;padding:0 20px;
  display:flex;align-items:center;justify-content:space-between;
  height:64px;
}
.brand-wrap{display:flex;align-items:center;gap:10px;}
.brand-wrap img{height:32px;width:auto;border-radius:4px;}
.brand-wrap span{font-weight:700;font-size:1.1rem;color:#fff;letter-spacing:1px;}
.nav-links{display:flex;gap:16px;overflow-x:auto;white-space:nowrap;scrollbar-width:none;}
.nav-links::-webkit-scrollbar{display:none;}
.nav-links a{
  font-size:.85rem;color:var(--text-dim);transition:color .2s;
  font-family:"Courier New",monospace;
}
.nav-links a:hover{color:var(--cyber-cyan);text-shadow:0 0 8px var(--cyber-cyan);}
.nav-download-btn{
  display:none;padding:6px 14px;border:1px solid var(--cyber-magenta);
  color:var(--cyber-magenta);font-size:.8rem;border-radius:2px;font-family:monospace;
}
@media(min-width:768px){
  .nav-download-btn{display:inline-block;}
}

/* 主视觉 */
section.hero{
  min-height:85vh;display:flex;align-items:center;justify-content:center;
  padding:80px 20px;position:relative;text-align:center;
}
.hero-content{max-width:800px;z-index:2;}
.hero-tag{
  display:inline-block;padding:4px 12px;border:1px solid var(--cyber-cyan);
  color:var(--cyber-cyan);font-size:.75rem;margin-bottom:20px;
  letter-spacing:2px;font-family:monospace;
  box-shadow:0 0 15px rgba(0,229,255,.2);
}
.hero h1{
  font-size:clamp(2rem,5vw,3.5rem);font-weight:800;line-height:1.2;
  margin-bottom:20px;
  background:linear-gradient(90deg,var(--cyber-cyan),#fff,var(--cyber-magenta));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero p{color:var(--text-dim);font-size:1.05rem;margin-bottom:36px;max-width:600px;margin-left:auto;margin-right:auto;}
.hero-btns{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;}
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:12px 32px;
  font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s;
  border:1px solid transparent;font-family:inherit;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
}
.btn-primary{
  background:linear-gradient(135deg,rgba(0,229,255,.15),rgba(0,229,255,.05));
  border-color:var(--cyber-cyan);color:var(--cyber-cyan);
}
.btn-primary:hover{background:var(--cyber-cyan);color:#000;box-shadow:0 0 20px var(--cyber-cyan);}
.btn-secondary{
  background:linear-gradient(135deg,rgba(255,0,160,.15),rgba(255,0,160,.05));
  border-color:var(--cyber-magenta);color:var(--cyber-magenta);
}
.btn-secondary:hover{background:var(--cyber-magenta);color:#fff;box-shadow:0 0 20px var(--cyber-magenta);}
.hero-deco{
  position:absolute;bottom:20px;left:50%;transform:translateX(-50%);
  font-family:monospace;color:var(--text-dim);font-size:.7rem;
  display:flex;gap:30px;opacity:.6;
}

/* 通用区块 */
.section-wrap{max-width:1200px;margin:0 auto;padding:80px 20px;}
.section-title{
  font-size:1.6rem;margin-bottom:8px;display:flex;align-items:center;gap:12px;
}
.section-title::before{
  content:'';display:block;width:4px;height:24px;background:var(--cyber-cyan);
  box-shadow:0 0 10px var(--cyber-cyan);
}
.section-desc{color:var(--text-dim);font-size:.9rem;margin-bottom:40px;font-family:monospace;}
.grid-2{display:grid;grid-template-columns:1fr;gap:24px;}
@media(min-width:768px){.grid-2{grid-template-columns:1fr 1fr;}}
.grid-3{display:grid;grid-template-columns:1fr;gap:24px;}
@media(min-width:768px){.grid-3{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.grid-3{grid-template-columns:repeat(3,1fr);}}

/* 卡片 */
.card{padding:24px;transition:transform .3s,border-color .3s;}
.card:hover{transform:translateY(-4px);border-color:var(--cyber-cyan);}
.card h3{font-size:1.1rem;margin-bottom:12px;color:#fff;}
.card p{font-size:.88rem;color:var(--text-dim);}
.card-img{width:100%;aspect-ratio:3/4;object-fit:cover;margin-bottom:16px;border:1px solid rgba(255,255,255,.1);}

/* 截图墙/横滑区 */
.scroll-wall{
  display:flex;gap:16px;overflow-x:auto;padding-bottom:16px;
  scroll-snap-type:x mandatory;
}
.scroll-wall::-webkit-scrollbar{height:4px;}
.scroll-wall::-webkit-scrollbar-thumb{background:var(--cyber-cyan);}
.scroll-wall img{
  flex:0 0 200px;width:200px;aspect-ratio:3/4;object-fit:cover;
  scroll-snap-align:start;border:1px solid var(--border-glow);
  transition:transform .3s;
}
.scroll-wall img:hover{transform:scale(1.03);border-color:var(--cyber-magenta);}

/* 列表 */
.info-list{list-style:none;}
.info-list li{
  padding:16px 0;border-bottom:1px solid rgba(255,255,255,.05);
  display:flex;gap:16px;align-items:flex-start;
}
.info-list .idx{font-family:monospace;color:var(--cyber-magenta);font-size:1.2rem;line-height:1.2;}
.info-list .txt p{font-size:.88rem;color:var(--text-dim);}
.info-list .txt h4{font-size:.95rem;color:#fff;margin-bottom:4px;}

/* 分割线 */
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--cyber-cyan),transparent);margin:0 auto;max-width:1200px;opacity:.3;}

/* 底部 */
footer{
  border-top:1px solid rgba(0,229,255,.15);padding:40px 20px;
  text-align:center;color:var(--text-dim);font-size:.75rem;
}
footer p{margin-bottom:8px;}
footer a{color:var(--text-dim);text-decoration:underline;}
footer a:hover{color:var(--cyber-cyan);}

/* 弹窗 */
.modal-mask{
  position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:200;
  display:none;align-items:center;justify-content:center;padding:20px;
}
.modal-mask.active{display:flex;}
.modal-box{
  background:#0b1120;border:1px solid var(--cyber-cyan);
  padding:30px 24px;max-width:420px;width:100%;text-align:center;
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));
}
.modal-box p.warn{color:var(--cyber-magenta);font-size:.9rem;margin-bottom:16px;line-height:1.5;}
.modal-box .link-text{
  background:rgba(255,255,255,.05);padding:12px;word-break:break-all;
  border:1px dashed var(--text-dim);text-align:left;font-family:monospace;
  font-size:.8rem;color:var(--cyber-cyan);margin-bottom:16px;
}
.modal-box button{
  background:var(--cyber-cyan);color:#000;border:none;padding:10px 24px;
  cursor:pointer;font-weight:600;width:100%;
}