/* roulang page: index */
:root{
  --fa:#d8a24a;
  --fb:#f3ce8a;
  --fbody:#0c0b0a;
  --ftxt:#f6f0e5;
  --fmute:#a99c88;
  --fline:rgba(216,162,74,.2);
  --fr:16px;
  --fsh:0 18px 44px rgba(0,0,0,.5);
  --fgap:clamp(40px,6vw,64px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--fbody);color:var(--ftxt);font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.75}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol{margin:0;padding:0}
li{list-style:none}
:focus-visible{outline:2px solid var(--fb);outline-offset:3px}

.vcdyxfhk-wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 18px}

/* 顶栏 */
.vcdyxfhk-head{position:sticky;top:0;z-index:40;background:rgba(12,11,10,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--fline)}
.vcdyxfhk-headin{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:10px 0}
.vcdyxfhk-logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:16px;letter-spacing:.5px}
.vcdyxfhk-mark{width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:linear-gradient(140deg,var(--fb),var(--fa));color:#231705;display:grid;place-items:center;font-size:17px;font-weight:900}
.vcdyxfhk-nav{order:3;width:100%;display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.vcdyxfhk-nav::-webkit-scrollbar{display:none}
.vcdyxfhk-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:10px;color:var(--fmute);font-size:14px;white-space:nowrap;transition:color .2s ease,background .2s ease}
.vcdyxfhk-nav a:hover,.vcdyxfhk-nav a.is-on{color:var(--fb);background:rgba(216,162,74,.1)}
.vcdyxfhk-join{margin-left:auto;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:700;color:#231705;background:linear-gradient(135deg,var(--fb),var(--fa));box-shadow:0 8px 20px rgba(216,162,74,.24);transition:transform .2s ease}
.vcdyxfhk-join:hover{transform:translateY(-1px)}

/* 首屏 */
.vcdyxfhk-hero{position:relative;isolation:isolate;overflow:hidden}
.vcdyxfhk-herobg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;opacity:.52}
.vcdyxfhk-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(12,11,10,.55),rgba(12,11,10,.9) 68%,var(--fbody))}
.vcdyxfhk-heroin{padding:50px 0 56px;max-width:800px}
.vcdyxfhk-kicker{display:inline-flex;align-items:center;padding:6px 14px;border-radius:999px;border:1px solid var(--fline);background:rgba(216,162,74,.08);color:var(--fb);font-size:13px;letter-spacing:1px}
.vcdyxfhk-heroh1{margin:18px 0 10px;font-size:clamp(28px,7vw,52px);line-height:1.2;font-weight:900;letter-spacing:1px}
.vcdyxfhk-heroh1 em{font-style:normal;color:var(--fb)}
.vcdyxfhk-herosub{color:#e6d8bd;font-size:14.5px;letter-spacing:1px}
.vcdyxfhk-herolead{margin-top:14px;max-width:660px;color:var(--fmute);font-size:14.5px}
.vcdyxfhk-ranks{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.vcdyxfhk-rank{display:inline-flex;align-items:baseline;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--fline);background:rgba(255,255,255,.03);color:var(--fmute);font-size:13px}
.vcdyxfhk-rank b{color:var(--fb);font-size:13px;font-weight:800}
.vcdyxfhk-rank.is-top{border-color:rgba(243,206,138,.6);background:linear-gradient(135deg,rgba(216,162,74,.22),rgba(243,206,138,.06));color:#fff8e8}
.vcdyxfhk-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.vcdyxfhk-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:999px;font-size:15px;font-weight:700;color:#231705;background:linear-gradient(135deg,var(--fb),var(--fa));box-shadow:0 12px 26px rgba(216,162,74,.28);transition:transform .2s ease,box-shadow .2s ease}
.vcdyxfhk-btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(216,162,74,.36)}
.vcdyxfhk-btn--ghost{background:transparent;border:1px solid var(--fline);color:var(--ftxt);box-shadow:none}
.vcdyxfhk-btn--ghost:hover{border-color:var(--fb);color:var(--fb);box-shadow:none}

/* 通用板块 */
.vcdyxfhk-sec{padding:var(--fgap) 0;border-top:1px solid rgba(255,255,255,.05)}
.vcdyxfhk-sec--dim{background:#100e0b}
.vcdyxfhk-h2{font-size:clamp(21px,4.4vw,30px);font-weight:800;letter-spacing:.5px}
.vcdyxfhk-lead{margin-top:12px;max-width:760px;color:var(--fmute);font-size:14px}

.vcdyxfhk-kpis{display:grid;gap:14px;grid-template-columns:1fr;margin-top:26px}
.vcdyxfhk-kpi{padding:20px;border-radius:var(--fr);border:1px solid rgba(255,255,255,.06);background:linear-gradient(160deg,#161310,#0f0d0b)}
.vcdyxfhk-kpi b{display:block;color:var(--fb);font-size:17px;font-weight:800}
.vcdyxfhk-kpi span{display:block;margin-top:8px;color:var(--fmute);font-size:13.5px}

.vcdyxfhk-cats{display:grid;gap:14px;grid-template-columns:1fr;margin-top:24px}
.vcdyxfhk-cat{padding:18px;border-radius:var(--fr);border:1px solid rgba(255,255,255,.06);background:#14110d}
.vcdyxfhk-cat h3{font-size:16px;font-weight:700;color:var(--fb)}
.vcdyxfhk-cat p{margin-top:8px;color:var(--fmute);font-size:13.5px}

.vcdyxfhk-grid{display:grid;gap:14px;grid-template-columns:1fr;margin-top:24px}
.vcdyxfhk-card{border-radius:var(--fr);border:1px solid rgba(255,255,255,.06);background:#14110d;overflow:hidden;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.vcdyxfhk-card:hover{transform:translateY(-4px);border-color:var(--fline);box-shadow:var(--fsh)}
.vcdyxfhk-thumb{position:relative;aspect-ratio:3/4;overflow:hidden;background:#1b1610}
.vcdyxfhk-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.vcdyxfhk-card:hover .vcdyxfhk-thumb img,.vcdyxfhk-topic:hover .vcdyxfhk-thumb img{transform:scale(1.05)}
.vcdyxfhk-badge{position:absolute;top:10px;left:10px;padding:3px 9px;border-radius:999px;border:1px solid var(--fline);background:rgba(12,11,10,.8);color:var(--fb);font-size:12px;backdrop-filter:blur(4px)}
.vcdyxfhk-cbody{padding:12px 14px 16px}
.vcdyxfhk-cname{font-size:15px;font-weight:700;line-height:1.5}
.vcdyxfhk-cmeta{margin-top:6px;color:var(--fmute);font-size:13px}

.vcdyxfhk-ranklist{display:grid;gap:9px;grid-template-columns:1fr;margin-top:24px}
.vcdyxfhk-rankitem{display:flex;align-items:center;gap:10px;min-height:56px;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.05);background:#131110}
.vcdyxfhk-no{flex:0 0 30px;text-align:center;font-size:14px;font-weight:800;color:var(--fmute)}
.vcdyxfhk-rankitem:nth-child(-n+3) .vcdyxfhk-no{color:var(--fb)}
.vcdyxfhk-rtitle{flex:1;min-width:0;font-size:14.5px;font-weight:600}
.vcdyxfhk-rtag{display:none;padding:2px 8px;border-radius:999px;border:1px solid var(--fline);color:#e9c98f;font-size:12px;white-space:nowrap}
.vcdyxfhk-rhot{color:var(--fmute);font-size:12.5px;white-space:nowrap}

.vcdyxfhk-tiers{display:grid;gap:14px;grid-template-columns:1fr;margin-top:24px}
.vcdyxfhk-tier{display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:var(--fr);border:1px solid rgba(255,255,255,.07);background:#14110d}
.vcdyxfhk-tier.is-top{border-color:rgba(243,206,138,.55);background:linear-gradient(170deg,rgba(216,162,74,.16),#14110d 62%)}
.vcdyxfhk-tier h3{font-size:16px;font-weight:800;color:var(--fb)}
.vcdyxfhk-tier li{position:relative;padding-left:16px;color:var(--fmute);font-size:13.5px;line-height:1.9}
.vcdyxfhk-tier li::before{content:"·";position:absolute;left:2px;color:var(--fa);font-weight:900}

.vcdyxfhk-topics{display:grid;gap:16px;grid-template-columns:1fr;margin-top:24px}
.vcdyxfhk-topic{border-radius:var(--fr);border:1px solid rgba(255,255,255,.06);background:#14110d;overflow:hidden;transition:transform .25s ease,border-color .25s ease}
.vcdyxfhk-topic:hover{transform:translateY(-4px);border-color:var(--fline)}
.vcdyxfhk-topic .vcdyxfhk-thumb{aspect-ratio:16/10}
.vcdyxfhk-topicbody{padding:14px 16px 18px}
.vcdyxfhk-topicbody h3{font-size:16px;font-weight:700;color:var(--fb)}
.vcdyxfhk-topicbody p{margin-top:8px;color:var(--fmute);font-size:13.5px}

.vcdyxfhk-rows{display:grid;gap:10px;grid-template-columns:1fr;margin-top:22px}
.vcdyxfhk-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:13px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.05);background:#131110}
.vcdyxfhk-row b{font-size:14.5px;font-weight:600}
.vcdyxfhk-row span{color:var(--fmute);font-size:12.5px;white-space:nowrap}

.vcdyxfhk-news{display:grid;gap:0;margin-top:22px}
.vcdyxfhk-news li{display:flex;align-items:baseline;gap:14px;padding:14px 0;border-bottom:1px dashed rgba(255,255,255,.08)}
.vcdyxfhk-news h3{flex:1;font-size:14.5px;font-weight:600;line-height:1.6}
.vcdyxfhk-ndesc{display:block;margin-top:4px;color:var(--fmute);font-size:13px;font-weight:400}
.vcdyxfhk-ndate{color:var(--fa);font-size:12.5px;white-space:nowrap}

.vcdyxfhk-guards{display:grid;gap:14px;grid-template-columns:1fr;margin-top:24px}
.vcdyxfhk-guard{padding:18px;border-radius:var(--fr);border:1px solid rgba(255,255,255,.06);background:#12100d}
.vcdyxfhk-guard h3{font-size:15px;font-weight:700;color:var(--fb)}
.vcdyxfhk-guard p{margin-top:8px;color:var(--fmute);font-size:13.5px}

.vcdyxfhk-quotes{display:grid;gap:14px;grid-template-columns:1fr;margin-top:24px}
.vcdyxfhk-quote{padding:18px;border-radius:var(--fr);border:1px solid rgba(255,255,255,.06);background:#14110d}
.vcdyxfhk-quote p{color:#e8ddc9;font-size:14px}
.vcdyxfhk-quote cite{display:block;margin-top:10px;font-style:normal;color:var(--fmute);font-size:12.5px}

.vcdyxfhk-faq{display:grid;gap:10px;margin-top:24px}
.vcdyxfhk-faq details{padding:0 16px;border-radius:14px;border:1px solid rgba(255,255,255,.07);background:#131110}
.vcdyxfhk-faq summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:15px 0;font-size:14.5px;font-weight:600;cursor:pointer;list-style:none}
.vcdyxfhk-faq summary::-webkit-details-marker{display:none}
.vcdyxfhk-faq summary::after{content:"+";color:var(--fb);font-size:18px;font-weight:400}
.vcdyxfhk-faq details[open] summary::after{content:"−"}
.vcdyxfhk-faq p{padding:0 0 16px;color:var(--fmute);font-size:13.5px}

.vcdyxfhk-cta{position:relative;isolation:isolate;overflow:hidden;padding:36px 22px;border-radius:20px;border:1px solid rgba(243,206,138,.28);background:url("/assets/images/backpic/back-2.webp") center/cover no-repeat;text-align:center}
.vcdyxfhk-cta::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(140deg,rgba(12,11,10,.92),rgba(12,11,10,.78))}
.vcdyxfhk-cta h2{font-size:clamp(20px,4.2vw,28px);font-weight:800}
.vcdyxfhk-cta p{margin:12px auto 22px;max-width:640px;color:#e4d9c4;font-size:14px}

/* 页脚 */
.vcdyxfhk-foot{margin-top:0;padding:42px 0 24px;border-top:1px solid var(--fline);background:#0a0908}
.vcdyxfhk-fgrid{display:grid;gap:24px;grid-template-columns:1fr}
.vcdyxfhk-fbrand p{margin-top:12px;max-width:340px;color:var(--fmute);font-size:13.5px}
.vcdyxfhk-fgrid h3{margin-bottom:10px;color:var(--fb);font-size:14px;letter-spacing:.5px}
.vcdyxfhk-fgrid li a{display:inline-flex;align-items:center;min-height:44px;color:var(--fmute);font-size:13.5px;transition:color .2s ease}
.vcdyxfhk-fgrid li a:hover{color:var(--fb)}
.vcdyxfhk-copy{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:26px;padding-top:18px;border-top:1px solid rgba(255,255,255,.06);color:#8c8172;font-size:12.5px}

@media (min-width:520px){
  .vcdyxfhk-grid{grid-template-columns:repeat(2,1fr)}
  .vcdyxfhk-kpis{grid-template-columns:repeat(2,1fr)}
  .vcdyxfhk-rtag{display:inline-block}
  .vcdyxfhk-rows{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:768px){
  .vcdyxfhk-headin{padding:12px 0}
  .vcdyxfhk-nav{order:0;width:auto;margin-left:16px;overflow:visible;padding-bottom:0}
  .vcdyxfhk-heroin{padding:72px 0 84px}
  .vcdyxfhk-cats{grid-template-columns:repeat(2,1fr)}
  .vcdyxfhk-grid{grid-template-columns:repeat(3,1fr)}
  .vcdyxfhk-ranklist{grid-template-columns:repeat(2,1fr);gap:10px 18px}
  .vcdyxfhk-tiers{grid-template-columns:repeat(2,1fr)}
  .vcdyxfhk-topics{grid-template-columns:repeat(3,1fr)}
  .vcdyxfhk-guards{grid-template-columns:repeat(2,1fr)}
  .vcdyxfhk-quotes{grid-template-columns:repeat(2,1fr)}
  .vcdyxfhk-fgrid{grid-template-columns:2fr 1fr 1fr 1fr}
  .vcdyxfhk-cta{padding:50px 32px}
}
@media (min-width:1024px){
  .vcdyxfhk-grid{grid-template-columns:repeat(4,1fr)}
  .vcdyxfhk-cats{grid-template-columns:repeat(3,1fr)}
  .vcdyxfhk-kpis{grid-template-columns:repeat(4,1fr)}
  .vcdyxfhk-tiers{grid-template-columns:repeat(4,1fr)}
  .vcdyxfhk-guards{grid-template-columns:repeat(4,1fr)}
}