/* =========================================================
   Q+ Hub — Q+ 开源平台（深色开发者风格）
   ========================================================= */
:root{
  --bg:#05080F; --bg-2:#080F1C; --panel:#0A1428;
  --line:rgba(143,196,255,.14); --line-2:rgba(143,196,255,.30);
  --ice:#8FC4FF; --silver:#E8F2FF; --gold:#E9B95C; --violet:#6E8BFF;
  --muted:#8A99B5; --muted-2:#5E6B82;
  --sans:"Noto Sans SC","Microsoft YaHei",-apple-system,"Segoe UI",sans-serif;
  --mono:"Cascadia Mono","Consolas","SFMono-Regular",ui-monospace,monospace;
  --max:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--silver);font-family:var(--sans);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
code{font-family:var(--mono);font-size:.9em;color:var(--ice)}
.wrap{width:min(var(--max),calc(100% - 96px));margin:0 auto}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.26em;color:var(--ice);text-transform:uppercase;display:flex;align-items:center;gap:12px}
.kicker::before{content:"";width:26px;height:2px;background:var(--ice)}
section{position:relative}
.section{padding:96px 0}
.section-alt{background:linear-gradient(180deg,rgba(10,20,40,.55),rgba(5,8,15,0));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:44px}
.sec-head h2{font-size:clamp(28px,3vw,40px);font-weight:900;letter-spacing:-.01em;line-height:1.3;margin-top:14px;color:var(--silver)}
.sec-head p{max-width:430px;color:var(--muted);font-size:14px;line-height:1.95}
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 26px;border-radius:4px;font-size:14.5px;font-weight:600;transition:.2s;border:1px solid transparent;cursor:pointer}
.btn-primary{background:linear-gradient(96deg,#9CC8FF,#6E9BFF);color:#03101F;box-shadow:0 10px 34px rgba(143,196,255,.22)}
.btn-primary:hover{box-shadow:0 14px 44px rgba(143,196,255,.32)}
.btn-ghost{border-color:var(--line-2);color:var(--silver);background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:var(--ice)}
.btn .arw{transition:transform .2s}
.btn:hover .arw{transform:translateX(3px)}
.link-more{display:inline-block;margin-top:22px;color:var(--ice);font-size:13.5px;letter-spacing:.02em}
.link-more:hover{color:#fff}
.badge{display:inline-block;border:1px solid var(--line);padding:4px 11px;border-radius:3px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:var(--muted)}
.version-line{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}

/* ---------- 背景 ---------- */
.hero{position:relative;padding:88px 0 84px;overflow:hidden;border-bottom:1px solid var(--line)}
.hero-grid-bg{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(1100px 560px at 75% -12%, rgba(35,58,120,.55) 0%, rgba(5,8,15,0) 62%),
  radial-gradient(800px 500px at 8% 10%, rgba(110,139,255,.10) 0%, rgba(5,8,15,0) 60%),
  var(--bg)}
.hero-grid-bg::after{content:"";position:absolute;inset:0;opacity:.5;background-image:
  linear-gradient(rgba(143,196,255,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(143,196,255,.05) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(900px 500px at 70% 0%,#000 0%,transparent 78%);
  -webkit-mask-image:radial-gradient(900px 500px at 70% 0%,#000 0%,transparent 78%)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(38px,4.4vw,58px);line-height:1.2;font-weight:900;letter-spacing:-.02em;margin:22px 0 20px}
.grad{background:linear-gradient(96deg,#E8F2FF 6%,var(--ice) 46%,var(--gold) 96%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{max-width:560px;color:var(--muted);font-size:15.5px;line-height:2}
.hero .lead b{color:var(--silver);font-weight:600}
.hero .btns{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.hero-art{position:relative}

/* ---------- 代码窗口 ---------- */
.code-window{background:#050B16;border:1px solid #16233D;border-radius:10px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.code-window .cw-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid rgba(142,170,220,.14)}
.code-window .cw-bar .dots{display:flex;gap:7px}
.code-window .cw-bar .dots i{width:9px;height:9px;border-radius:50%;display:block;background:#243049}
.code-window .cw-bar .dots i:nth-child(1){background:#FF6B6B}
.code-window .cw-bar .dots i:nth-child(2){background:#FFC857}
.code-window .cw-bar .dots i:nth-child(3){background:#3FE0FF}
.code-window .cw-f{margin-left:8px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:#6F84A6}
.code-window pre{padding:22px 24px 26px;font-family:var(--mono);font-size:12.5px;line-height:1.95;color:#C6D6EE;overflow:auto}
.code-window .kw{color:#8FC4FF}.code-window .ty{color:#F3D08A}.code-window .num{color:#7FE3B4}.code-window .fn{color:#C6A8FF}.code-window .cm{color:#5B6E8C}

/* ---------- 快速开始 ---------- */
.quick-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
.quick-side{display:flex;flex-direction:column;gap:0}
.qs-item{border-left:1px solid var(--line-2);padding:0 0 22px 18px;position:relative}
.qs-item::before{content:"";position:absolute;left:-4px;top:8px;width:7px;height:7px;border-radius:50%;background:var(--ice);box-shadow:0 0 10px var(--ice)}
.qs-item b{display:block;font-size:15.5px;margin-bottom:6px}
.qs-item p{color:var(--muted);font-size:13.5px;line-height:1.9}

/* ---------- 入口卡片 ---------- */
.entry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.entry{border:1px solid var(--line);background:linear-gradient(180deg,rgba(10,20,40,.7),rgba(5,8,15,.5));padding:28px 26px;transition:.25s;display:flex;flex-direction:column;min-height:220px}
.entry:hover{border-color:var(--line-2);transform:translateY(-3px);box-shadow:0 20px 50px rgba(0,0,0,.35)}
.entry .e-no{font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--muted-2)}
.entry h3{font-size:18px;font-weight:800;margin:14px 0 8px}
.entry p{color:var(--muted);font-size:13px;line-height:1.9;flex:1}
.entry .e-more{margin-top:18px;color:var(--ice);font-size:13px}

/* ---------- 证据 ---------- */
.proof{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start}
.proof h2{font-size:clamp(26px,3vw,36px);font-weight:900;line-height:1.35;margin:14px 0 16px}
.proof p{color:var(--muted);font-size:14.5px;line-height:2}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:26px}
.stat{background:var(--bg);padding:22px 24px}
.stat b{display:block;font-family:var(--mono);font-size:22px;font-weight:600;color:var(--ice)}
.stat span{display:block;margin-top:4px;font-size:11.5px;color:var(--muted-2);letter-spacing:.04em}
.terminal{background:#050B16;border:1px solid #16233D;border-radius:10px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.4)}
.terminal .bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid rgba(142,170,220,.14)}
.terminal .bar i{width:9px;height:9px;border-radius:50%;background:#33415C;display:block}
.terminal .bar i:nth-child(1){background:#FF6B6B}
.terminal .bar i:nth-child(2){background:#FFC857}
.terminal .bar i:nth-child(3){background:#3FE0FF}
.terminal .bar .t{margin-left:8px;font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:#6F84A6}
.terminal pre{padding:22px 24px 26px;font-family:var(--mono);font-size:12.5px;line-height:2;color:#9FB3CC;overflow:auto}
.terminal .p{color:#8FC4FF}.terminal .ok{color:#57E6A5}.terminal .dim{color:#4A5A73}

/* ---------- 发布卡 ---------- */
.release-card{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;border:1px solid var(--line-2);background:
  radial-gradient(700px 260px at 20% 0%,rgba(143,196,255,.12),transparent 70%),
  linear-gradient(180deg,rgba(10,20,40,.75),rgba(5,8,15,.6));padding:44px 44px}
.rc-badge{font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--gold)}
.release-card h3{font-size:30px;font-weight:900;margin:14px 0 10px}
.release-card .rc-left p{color:var(--muted);font-size:14px;line-height:1.95}
.rc-links{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.rc-right{border-left:1px solid var(--line);padding-left:34px;display:flex;flex-direction:column;gap:14px;justify-content:center}
.rc-row{display:flex;justify-content:space-between;gap:16px;font-size:13px;border-bottom:1px dashed var(--line);padding-bottom:10px}
.rc-row span{color:var(--muted-2)}
.rc-row b{font-family:var(--mono);font-weight:500;color:var(--silver);font-size:12.5px;text-align:right}

/* ---------- 子页 ---------- */
.page-hero{position:relative;padding:84px 0 56px;border-bottom:1px solid var(--line);background:
  radial-gradient(900px 420px at 80% -20%, rgba(35,58,120,.5), rgba(5,8,15,0) 62%), var(--bg);overflow:hidden}
.page-hero h1{font-size:clamp(30px,3.6vw,46px);font-weight:900;letter-spacing:-.015em;margin:16px 0 14px}
.page-hero .lead{max-width:720px;color:var(--muted);font-size:15.5px;line-height:2}
.table-wrap{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:rgba(10,20,40,.35)}
.file-table{width:100%;border-collapse:collapse;font-size:13.5px}
.file-table th{text-align:left;padding:14px 20px;background:rgba(10,20,40,.7);border-bottom:1px solid var(--line);font-weight:600;color:var(--muted);font-size:12px;letter-spacing:.06em}
.file-table td{padding:14px 20px;border-bottom:1px solid var(--line);color:var(--muted)}
.file-table tr:last-child td{border-bottom:0}
.file-table .fname a{color:var(--ice);font-family:var(--mono);font-size:12.5px}
.file-table .fname a:hover{text-decoration:underline}
.mono{font-family:var(--mono);font-size:12px;color:var(--muted-2)}
.notes-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:30px}
.note{border:1px solid var(--line);padding:24px 26px;background:rgba(10,20,40,.3)}
.note h3{font-size:15.5px;font-weight:800;margin-bottom:8px}
.note p{color:var(--muted);font-size:13.5px;line-height:1.9}
.contact-box{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:36px;border:1px solid var(--line-2);padding:30px 34px;background:rgba(10,20,40,.4)}
.contact-box h3{font-size:18px;font-weight:800;margin-bottom:6px}
.contact-box p{color:var(--muted);font-size:13.5px}
.contact-box a{color:var(--ice)}

/* ---------- Header ---------- */
header{position:sticky;top:0;z-index:50;background:rgba(5,8,15,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:11px}
.brand .mark{width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(143,196,255,.3))}
.brand .txt{display:flex;flex-direction:column;gap:3px}
.brand .cn{font-size:15.5px;font-weight:800;letter-spacing:.1em;line-height:1.05}
.brand .en{font-family:var(--mono);font-size:8px;letter-spacing:.3em;color:var(--muted-2)}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{font-size:13.5px;color:var(--muted);padding:6px 0;border-bottom:2px solid transparent}
.nav-links a:hover,.nav-links a.active{color:var(--silver);border-bottom-color:var(--ice)}
.nav-right{display:flex;align-items:center;gap:18px}
.nav-link-ext{font-size:12.5px;color:var(--muted-2)}
.nav-link-ext:hover{color:var(--ice)}
.nav-cta{background:linear-gradient(96deg,#9CC8FF,#6E9BFF);color:#03101F;font-size:13px;padding:9px 18px;border-radius:4px;font-weight:700}
.nav-cta:hover{box-shadow:0 8px 24px rgba(143,196,255,.3)}

/* ---------- Footer ---------- */
footer{border-top:1px solid var(--line);padding:56px 0 30px;background:linear-gradient(180deg,rgba(6,11,22,.6),rgba(5,8,15,0))}
.f-top{display:flex;justify-content:space-between;gap:60px;padding-bottom:40px;border-bottom:1px solid var(--line)}
.f-brand{max-width:380px}
.f-brand .brand{margin-bottom:16px}
.f-brand p{color:var(--muted-2);font-size:12.5px;line-height:1.9}
.f-cols{display:flex;gap:64px}
.f-col h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:var(--muted-2);margin-bottom:14px;font-weight:400}
.f-col a{display:block;color:var(--muted);font-size:13px;margin-bottom:10px}
.f-col a:hover{color:var(--ice)}
.f-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:22px;color:var(--muted-2);font-size:11.5px}

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
  .hero-grid,.proof,.quick-grid,.release-card{grid-template-columns:1fr;gap:36px}
  .entry-grid{grid-template-columns:1fr 1fr}
  .rc-right{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:24px}
  .nav-links{display:none}
  .f-top{flex-direction:column;gap:36px}
}
@media (max-width:720px){
  .wrap{width:calc(100% - 40px)}
  .section{padding:64px 0}
  .entry-grid,.notes-grid{grid-template-columns:1fr}
  .hero{padding:56px 0 60px}
  .release-card{padding:30px 24px}
  .f-cols{flex-wrap:wrap;gap:36px}
  .nav-right .nav-link-ext{display:none}
}

/* 仓库根目录 */
.tree-list{border:1px solid var(--line);background:rgba(10,20,40,.4);padding:20px 24px;font-family:var(--mono);font-size:12.5px;line-height:2.2;color:var(--muted);word-break:break-all}
