*{box-sizing:border-box;}
body{
  margin:0;
  background:#070b1a !important;
  color:#e6edf7 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* 星空背景底层 */
#star-bg{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  background:
    radial-gradient(1px 1px at 8% 12%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 18% 42%, #dbeafe 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 28% 22%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 38% 52%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 48% 18%, #e0e7ff 50%, transparent 51%),
    radial-gradient(2px 2px at 58% 38%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 68% 8%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 78% 48%, #c7d2fe 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 88% 28%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 92% 62%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 12% 72%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 32% 82%, #e0e7ff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 52% 72%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 72% 82%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 82% 88%, #cbd5e1 50%, transparent 51%),
    radial-gradient(1px 1px at 22% 92%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 62% 92%, #fff 50%, transparent 51%),
    linear-gradient(180deg, #070b1a 0%, #0a1030 45%, #070b1a 100%) !important;
  z-index:-2;
  pointer-events:none;
}

/* 纯CSS 01代码雨 */
#code-rain{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  pointer-events:none;
  opacity:.25;
  overflow:hidden;
}
.code-col{
  position:absolute;
  top:-120%;
  font-family: monospace;
  font-size:14px;
  color:#7dd3fc;
  text-shadow:0 0 6px #7dd3fc;
  white-space:pre;
  line-height:1.3;
  animation: codeFall linear infinite;
}
@keyframes codeFall{
  0%{ transform: translateY(0); }
  100%{ transform: translateY(220vh); }
}

/* 纯CSS打字机效果 */
#typewriter{
  display:inline-block;
  width:0;
  overflow:hidden;
  white-space:nowrap;
  animation: typing 3.2s steps(16) 1.2s infinite;
  vertical-align:bottom;
}
.type-cursor{
  display:inline-block;
  width:8px;
  height:14px;
  background:#86efac;
  margin-left:2px;
  vertical-align:middle;
  animation: blink 1s step-end infinite;
}
@keyframes typing{
  0%{ width:0; }
  55%{ width:16em; }
  85%{ width:16em; }
  100%{ width:0; }
}
@keyframes blink{
  0%,50%{ opacity:1; }
  51%,100%{ opacity:0; }
}

/* 闪烁星星 */
@keyframes twinkle{
  0%,100%{ opacity:.2; }
  50%{ opacity:1; }
}
.star{
  position:fixed;
  width:3px;
  height:3px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 0 8px #fff;
  animation: twinkle 3s ease-in-out infinite;
  z-index:0;
  pointer-events:none;
}

/* 主内容 */
.main-wrap{
  position: relative;
  z-index: 1;
  max-width:1200px;
  margin:0 auto;
  padding:72px 24px 40px;
}

/* 代码窗口 */
.code-window{
  background: linear-gradient(180deg, rgba(15,23,42,0.92), rgba(15,23,42,0.78)) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  backdrop-filter: blur(14px) !important;
  border-radius:16px;
  overflow:hidden;
}

/* 链接按钮 6个一排 */
.link-grid{
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  gap:16px;
  margin-top:52px;
}
.link-grid a{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px 10px;
  border-radius:14px;
  text-decoration:none !important;
  color:#e6edf7 !important;
  font-weight:500;
  font-size:14px;
  background: linear-gradient(135deg, rgba(28,42,70,0.98), rgba(18,28,48,0.98)) !important;
  border:1px solid rgba(120,160,255,0.4) !important;
  box-shadow:
    0 0 0 1px rgba(90,130,255,0.15) inset,
    0 8px 24px rgba(0,0,0,0.45),
    0 0 18px rgba(56,120,255,0.15) !important;
  backdrop-filter: blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  transition: all .2s ease;
}
.link-grid a:hover{
  transform:translateY(-2px);
  background: linear-gradient(135deg, rgba(44,64,110,0.98), rgba(28,42,72,0.98)) !important;
  border-color: rgba(140,180,255,0.55) !important;
}

/* 模型大卡片 */
.glass-card{
  background: linear-gradient(180deg, rgba(22,34,58,0.96), rgba(14,22,40,0.96)) !important;
  border: 1px solid rgba(120,160,255,0.3) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  box-shadow:
    0 10px 30px rgba(0,0,0,0.45),
    inset 0 1px 0 rgba(255,255,255,0.1) !important;
  border-radius: 16px;
  padding:30px;
  text-align:center;
  margin-top:36px;
}

/* 模型列表 5列居中 */
#modelListBox{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:16px;
  font-size:14px;
}
#modelListBox > div{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background: linear-gradient(135deg, rgba(28,42,70,0.98), rgba(18,28,48,0.98)) !important;
  border:1px solid rgba(120,160,255,0.35) !important;
  border-radius:10px;
  padding:12px 14px;
  color:#e6edf7 !important;
  box-shadow:
    0 0 0 1px rgba(90,130,255,0.12) inset,
    0 6px 18px rgba(0,0,0,0.4) !important;
}

/* 按钮 */
.btn-blue{
  display:inline-block;
  color:#fff !important;
  padding:11px 24px;
  border-radius:10px;
  text-decoration:none !important;
  margin-right:12px;
  font-size:14px;
  font-weight:500;
  background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
  box-shadow: 0 8px 24px rgba(59,130,246,0.45) !important;
}
.btn-gray{
  display:inline-block;
  color:#fff !important;
  padding:11px 24px;
  border-radius:10px;
  text-decoration:none !important;
  margin-right:12px;
  font-size:14px;
  font-weight:500;
  background: linear-gradient(135deg, rgba(255,255,255,0.12), rgba(255,255,255,0.04)) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  backdrop-filter: blur(10px) !important;
}

/* 下载小链接 */
.download-links{
  display:flex;
  gap:18px;
  margin-top:16px;
  flex-wrap:wrap;
}
.download-links a{
  color:#7dd3fc !important;
  font-size:14px;
  text-decoration:none !important;
  border-bottom:1px dashed rgba(125,211,252,0.5);
  padding-bottom:1px;
  transition: all .2s ease;
}
.download-links a:hover{
  color:#fff !important;
  border-bottom-color:#fff;
}

/* 手机端响应式 */
@media (max-width: 768px){
  .main-wrap{ padding:48px 16px 32px; }
  h1{ font-size:32px !important; }
  .link-grid{ grid-template-columns: repeat(3, 1fr); gap:12px; margin-top:40px; }
  #modelListBox{ grid-template-columns: repeat(2, 1fr); gap:12px; }
  .glass-card{ padding:24px 16px; }
  .code-window{ margin-top:24px; }
}
/* 与站点框架整合 */
body.cases-page { background: #070b1a !important; }
#star-bg { z-index: 0; }
#code-rain { z-index: 1; }
.main-wrap { z-index: 2; }
.footer { z-index: 2; }
@media (max-width: 768px) {
  .main-wrap { padding-top: 36px; }
}