/* ============================================================
   CQFISH 软件与资源开源镜像站 - 浅色半磨砂玻璃 x 琥珀渐变边缘
   设计约束：无阴影 / 无浮动特效 / 无 emoji / 禁蓝紫色
   CQFISH & 喵酱出品
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Cascadia Code','JetBrains Mono','PingFang SC','Microsoft YaHei','Consolas',monospace;
  color:var(--fg);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

:root{
  /* 基础色（浅色暖调） */
  --bg:#f5f1ea;
  --bg-soft:#efe9e0;
  --panel:rgba(255,255,255,.6);
  --fg:#2b261f;
  --fg-dim:#6f675a;
  --fg-faint:#9d9587;
  --line:rgba(43,38,31,.09);
  --on-grad:#221c14;

  /* 琥珀渐变（避开蓝紫） */
  --amber:#c97f1a;
  --amber-hi:#e8a33d;
  --amber-lo:#a96410;
  --gold:#b8922f;
  --grad:linear-gradient(135deg,var(--amber-hi),var(--amber) 30%,var(--amber-lo) 70%,var(--gold));
  --grad-soft:linear-gradient(135deg,rgba(232,163,61,.55),rgba(201,127,26,.20) 32%,rgba(169,100,16,.18) 66%,rgba(184,146,47,.45));

  --font-mono:'Cascadia Code','JetBrains Mono','Consolas',monospace;
  --font-cn:'PingFang SC','Microsoft YaHei',sans-serif;
}

/* ===== 背景纹理 ===== */
.bg{position:fixed;inset:0;z-index:-1;overflow:hidden}
.bg-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(43,38,31,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(43,38,31,.05) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(ellipse 90% 80% at 50% 0%,#000 40%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 90% 80% at 50% 0%,#000 40%,transparent 100%);
}
.bg-glow{position:absolute;border-radius:50%;filter:blur(90px)}
.bg-glow--a{
  width:560px;height:560px;top:-220px;right:6%;
  background:radial-gradient(circle,rgba(232,163,61,.20),transparent 68%);
}
.bg-glow--b{
  width:520px;height:520px;bottom:-260px;left:2%;
  background:radial-gradient(circle,rgba(201,127,26,.13),transparent 66%);
}
.bg-noise{
  position:absolute;inset:0;opacity:.05;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.9'/%3E%3C/svg%3E");
}

/* ===== 顶部导航栏（磨砂玻璃条） ===== */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(18px) saturate(1.15);
  -webkit-backdrop-filter:blur(18px) saturate(1.15);
  border-bottom:1px solid var(--line);
}
.topbar::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(201,127,26,.30) 22%,rgba(201,127,26,.06) 55%,transparent 82%);
}
.topbar-inner{
  max-width:860px;margin:0 auto;padding:0 24px;height:56px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{
  font-size:11px;font-weight:800;letter-spacing:1px;color:var(--on-grad);
  background:var(--grad);padding:4px 8px;
}
.brand-text{font-size:15px;font-weight:700;letter-spacing:1px;color:var(--fg)}
.brand-text em{font-style:normal;color:var(--fg-faint);font-weight:500;font-size:12px;letter-spacing:2px}
.topnav{display:flex;gap:2px}
.topnav a{
  font-size:12px;letter-spacing:1px;color:var(--fg-dim);
  padding:8px 14px;position:relative;transition:color .15s;
}
.topnav a:hover{color:var(--fg)}
.topnav a.active{color:var(--amber-lo)}
.topnav a.active::after{
  content:'';position:absolute;left:14px;right:14px;bottom:2px;height:1px;
  background:var(--grad);
}
.topbar-status{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--fg-dim);letter-spacing:1px}
.status-dot{width:7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 0 rgba(201,127,26,.4);animation:pulse 2.4s infinite}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(201,127,26,.35)}
  60%{box-shadow:0 0 0 8px rgba(201,127,26,0)}
  100%{box-shadow:0 0 0 0 rgba(201,127,26,0)}
}

/* ===== 磨砂玻璃面板（渐变描边 + 羽化） ===== */
.panel{
  position:relative;
  background:var(--panel);
  backdrop-filter:blur(16px) saturate(1.1);
  -webkit-backdrop-filter:blur(16px) saturate(1.1);
  border-radius:4px;
  padding:22px;
  margin-bottom:16px;
  animation:rise .5s ease both;
}
.panel:nth-of-type(2){animation-delay:.08s}
.panel:nth-of-type(3){animation-delay:.16s}
.panel:nth-of-type(4){animation-delay:.24s}
.panel:nth-of-type(5){animation-delay:.32s}
/* 渐变描边：1px 渐变边框，无阴影 */
.panel::before{
  content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:var(--grad-soft);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
          mask-composite:exclude;
  pointer-events:none;
}
/* 边缘羽化：四角渐隐 */
.panel::after{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(135deg,rgba(232,163,61,.07),transparent 30%,transparent 68%,rgba(184,146,47,.05));
}
.panel-title{
  display:flex;align-items:center;gap:10px;
  font-size:12px;font-weight:700;letter-spacing:2px;color:var(--fg);
  margin-bottom:16px;
}
.panel-title-bar{
  width:14px;height:2px;flex-shrink:0;
  background:var(--grad);
}

@keyframes rise{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

/* ===== 页面布局（单栏居中） ===== */
.page{
  max-width:760px;margin:0 auto;padding:0 24px 8px;
}

/* ===== Hero ===== */
.hero{
  padding:64px 4px 44px;
  animation:rise .5s ease both;
}
.hero-eyebrow{
  font-size:11px;letter-spacing:3px;color:var(--amber-lo);margin-bottom:14px;
}
.hero-title{
  font-size:44px;font-weight:800;line-height:1.12;letter-spacing:1px;color:var(--fg);
}
.hero-title em{
  font-style:normal;
  background:var(--grad);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero-sub{font-size:14px;color:var(--fg-dim);margin-top:14px;max-width:560px;font-family:var(--font-cn)}

/* ===== 关于 ===== */
.about-text{
  font-size:13px;color:var(--fg-dim);line-height:1.9;font-family:var(--font-cn);
  margin-bottom:18px;
}
.about-meta{
  border-top:1px solid var(--line);
  padding-top:14px;
  display:flex;flex-direction:column;gap:8px;
}
.meta-item{display:flex;align-items:baseline;gap:16px;font-size:12px}
.meta-item .meta-k{
  flex-shrink:0;width:64px;
  font-size:10px;letter-spacing:1px;color:var(--fg-faint);
}
.meta-item .meta-v{color:var(--fg-dim);font-family:var(--font-cn)}
.meta-item .meta-v a{color:var(--amber-lo)}
.meta-item .meta-v a:hover{text-decoration:underline}

/* ===== 资源下载 ===== */
.dl-card{
  display:flex;align-items:center;gap:16px;
  padding:18px;border-radius:3px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.35);
}
.dl-mark{
  flex-shrink:0;width:64px;height:64px;
  border-radius:4px;object-fit:contain;
  border:1px solid var(--line);
}
.dl-body{flex:1;min-width:0}
.dl-name{font-size:15px;font-weight:700;color:var(--fg);letter-spacing:.5px}
.dl-desc{font-size:12px;color:var(--fg-dim);line-height:1.7;margin-top:4px;font-family:var(--font-cn)}
.dl-meta{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin-top:10px;font-size:10px;color:var(--fg-faint);letter-spacing:.5px;
}
.dl-meta span{display:flex;align-items:center;gap:5px;white-space:nowrap}
.dl-dot{width:3px;height:3px;border-radius:50%;background:var(--amber-lo);flex-shrink:0}
.dl-sub{display:flex;align-items:center;gap:14px;margin-top:8px;font-size:11px;color:var(--fg-dim);flex-wrap:wrap}
.dl-sub a{color:var(--amber);border-bottom:1px solid transparent;transition:border-color .15s}
.dl-sub a:hover{border-bottom-color:var(--amber)}
.dl-btn{
  flex-shrink:0;
  display:inline-flex;align-items:center;
  font-size:12px;font-weight:700;letter-spacing:1px;color:var(--on-grad);
  background:var(--grad);border-radius:3px;padding:10px 20px;
  transition:filter .15s;
}
.dl-btn:hover{filter:brightness(1.05)}

/* ===== 站点导航 ===== */
.link-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;
}
.link-card{
  display:flex;align-items:center;gap:14px;
  padding:14px 16px;border-radius:3px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.35);
  transition:border-color .15s;
}
.link-card:hover{border-color:rgba(201,127,26,.45)}
.link-mark{
  flex-shrink:0;font-size:9px;font-weight:800;letter-spacing:1px;
  color:var(--on-grad);background:var(--grad);padding:3px 6px;border-radius:2px;
}
.link-body{flex:1;min-width:0;display:flex;flex-direction:column}
.link-name{font-size:13px;font-weight:600;color:var(--fg);font-family:var(--font-cn);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.link-url{font-size:10px;color:var(--fg-faint);letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.link-arrow{font-size:14px;color:var(--fg-faint);flex-shrink:0}

/* ===== 公告 ===== */
.notice-box{
  font-size:12px;color:var(--fg-dim);line-height:1.9;font-family:var(--font-cn);
}
.notice-box p{margin-bottom:8px}
.notice-box p:last-child{margin-bottom:0}
.notice-box a{color:var(--amber-lo)}
.notice-box a:hover{text-decoration:underline}

/* ===== 底部版权栏 ===== */
.footer{
  margin-top:36px;border-top:1px solid var(--line);
  position:relative;
}
.footer::before{
  content:'';position:absolute;top:-1px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(201,127,26,.30) 50%,transparent);
}
.footer-inner{
  max-width:860px;margin:0 auto;padding:18px 24px 26px;
  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
  font-size:11px;letter-spacing:1px;color:var(--fg-faint);
}
.footer-divider{color:rgba(201,127,26,.40)}
.footer-inner a:hover{color:var(--amber-lo)}

/* ===== 响应式 ===== */
@media(max-width:640px){
  .topnav{display:none}
  .topbar-status{display:none}
  .page{padding:0 14px 4px}
  .hero{padding:44px 2px 34px}
  .hero-title{font-size:32px}
  .link-grid{grid-template-columns:1fr}
  .dl-card{flex-direction:column;align-items:flex-start;gap:14px}
  .dl-btn{align-self:stretch;justify-content:center}
}
