/* 网易云音乐 下载客户端页 —— 几何值取自原站样式表 index.5b4c729bda1ef383c4a1.css */

:root{
  /* 原站 JS：WH = min(max(innerHeight-75,100),982) —— 上限 982px */
  --WH: clamp(100px, calc(100vh - 75px), 982px);
  --UnlimitRH: 128vh;
}

*{margin:0;padding:0;box-sizing:border-box;list-style:none}
/* 原站：背景 #F1F3F5 / 字体 PingFangSC-Regular / 内容宽 1192px */
body{font-family:PingFangSC-Regular,"PingFang SC","Microsoft YaHei",Arial,sans-serif;
  background:#F1F3F5;min-width:1192px;color:#333;font-size:12px}
a{text-decoration:none;color:inherit}
img{display:block;border:0}

/* 原站下载页无黑色顶栏，直接渲染首屏，故此处不含导航样式 */

/* ========== 首屏（原站：scroll-content 128vh / overflow hidden / bg #f1f3f5） ========== */
.firstPage{position:relative;height:128vh;overflow:hidden;background:#f1f3f5}

/* 两层背景：normal 静态 + roll 随滚动缩放淡入（70→180 scale .8→1，70→270 opacity 0→1） */
.fp-bg,.fp-bg-roll{
  position:fixed;top:0;left:0;width:100%;height:100vh;background-color:#050507;
  background-size:cover;background-repeat:no-repeat;background-position:top center;
}
.fp-bg{background-image:url("img/fp_bg.png");z-index:0}
.fp-bg-roll{
  background-image:url("img/fp_bg_roll.png");z-index:1;
  transform-origin:top center;opacity:0;
}

/* 第一段标题图：原站 503.75×82，top = 12*UnlimitRH/100 - 40px */
.fp-first-title{
  position:absolute;top:calc(12 * var(--UnlimitRH) / 100 - 40px);left:50%;
  transform:translate(-50%,-50%);width:503.75px;height:82px;z-index:11;
  background:url("img/first_title.png") no-repeat center/cover;
}

/* 首屏按钮：原站 420×52 / gap 20 / bottom = 8*WH/100 + 80px */
.fp-buttons{
  position:absolute;width:420px;height:52px;left:50%;transform:translate(-50%,0);
  bottom:calc(8 * var(--WH) / 100 + 80px);display:flex;justify-content:space-between;
  align-items:center;z-index:10;gap:20px;
}
.fp-btn{
  width:200px;flex:0 0 200px;box-sizing:border-box;border-radius:6px;border:1px solid;
  font-size:18px;height:52px;display:flex;justify-content:center;align-items:center;
  cursor:pointer;color:#283248;font-weight:500;
}
.fp-btn img{width:20px;height:20px;margin-right:7px}
.fp-main-btn{background:linear-gradient(180deg,rgba(255,255,255,.9) 0%,#fff 100%);border-color:transparent}
.fp-sub-btn{background:rgba(255,255,255,.1);color:rgba(255,255,255,.9);border:none!important}

/* 电脑：原站 88.5×58 WH，top = 20.2*UnlimitRH/100 - 70px */
.fp-computer{
  position:absolute;width:calc(88.5 * var(--WH) / 100);height:calc(58 * var(--WH) / 100);
  top:calc(20.2 * var(--UnlimitRH) / 100 - 70px);left:50%;transform:translate(-50%,0);
  z-index:1;opacity:1;display:flex;justify-content:center;
  background:url("img/fp_computer.png") no-repeat center/cover;box-shadow:none!important;
}
.fp-computer-mask{
  position:relative;background:transparent;overflow:hidden;top:11%;
  width:calc(71.2 * var(--WH) / 100);height:calc(46.5 * var(--WH) / 100);
  box-shadow:0 0 102.75px 0 rgba(0,0,0,.3);
}
.fp-computer-player{
  position:relative;left:50%;transform:translate(-50%,0);opacity:0;z-index:2;
  width:calc(71.2 * var(--WH) / 100);height:calc(46.5 * var(--WH) / 100);top:373px;
  background:url("img/fp_computer_player.png") no-repeat center/contain;
}

/* 第二段标题：原站 775px / 44px + 18px / top = 44*UnlimitRH/100 - 80px */
.fp-second-title{
  position:absolute;top:calc(44 * var(--UnlimitRH) / 100 - 80px);left:50%;
  transform:translate(-50%,0);width:775px;height:86px;text-align:center;opacity:0;z-index:9;
}
.fp-second-title-text{color:#fff;font-size:44px;position:absolute;top:0;width:100%;text-align:center}
.fp-second-title-subtext{
  color:rgba(255,255,255,.6);width:100%;font-size:18px;position:absolute;bottom:0;
}

/* 设备：原站 .devices 基类。运行时 react-spring 用内联 transform（translateX/scale）
   覆盖此处的 translate(-50%,-50%)，故 top 即“上边缘”、x 即“左边缘”。JS 全量接管 transform。 */
.fp-dev{
  position:absolute;left:0;background-size:cover;background-repeat:no-repeat;opacity:0;
  box-shadow:50px -20px 102.75px -70px rgba(0,0,0,.3);
}
/* TV：原站唯一用 left:50% + margin-left 定位者，运行时仅 scale 动画 */
#dev-TV{
  top:calc(56 * var(--UnlimitRH) / 100);left:50%;
  margin-left:calc(-33.5 * var(--WH) / 100);
  width:calc(60.4 * var(--WH) / 100);height:calc(38.3 * var(--WH) / 100);z-index:0;
  background-image:url("img/fp_tv.png");
}
/* car/pad/phone/watch：无 left，运行时靠 translateX(x) 定位左边缘 */
#dev-car{
  top:calc(68.8 * var(--UnlimitRH) / 100);
  width:calc(50.3 * var(--WH) / 100);height:calc(28 * var(--WH) / 100);z-index:3;
  background-image:url("img/fp_car.png");
}
#dev-pad{
  top:calc(58.4 * var(--UnlimitRH) / 100);
  width:calc(34.77 * var(--WH) / 100);height:calc(48 * var(--WH) / 100);z-index:4;
  background-image:url("img/fp_pad.png");
}
#dev-phone{
  top:calc(69.4 * var(--UnlimitRH) / 100);
  width:calc(19 * var(--WH) / 100);height:calc(33 * var(--WH) / 100);z-index:5;
  background-image:url("img/fp_phone.png");
}
#dev-watch{
  top:calc(79.5 * var(--UnlimitRH) / 100);
  width:calc(15 * var(--WH) / 100);height:calc(19.5 * var(--WH) / 100);z-index:6;
  background-image:url("img/fp_watch.png");
}
/* 首屏底部向下箭头：原站 28×28 / position fixed / bottom 3vh，345→390 淡出 */
.fp-bottom-more{
  position:fixed;width:28px;height:28px;bottom:3vh;left:50%;transform:translate(-50%,0);
  z-index:8;background:url("img/fp_bottom_arrow.png") no-repeat center/cover;
}

/* ========== 了解网易云音乐 ==========
   原站：container 满宽（无宽度限制、height 816、margin-top 160），
   仅 first-line 为 1192px 居中；images 轨道满视口宽横向滚动，卡片可溢出视口右侧。 */
.intro-outer{background:#F1F3F5}
.intro-container{background:#F1F3F5;width:100%;height:816px;position:relative;margin-top:160px}
/* 标题行：1192px 居中，与下方内容列左边缘对齐 */
.intro-first-line{height:116px;width:1192px;margin:0 auto;position:relative}
/* 原站：title 高 100% / 48px bold / flex column space-between；每个 p 高 48px */
.intro-title{
  height:100%;text-align:left;font-size:48px;font-weight:bold;position:relative;top:0;
  width:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;
  color:#283248;
}
.intro-title p{height:48px;line-height:48px}
.intro-icons{
  position:absolute;bottom:0;right:0;height:116px;display:flex;align-items:flex-end;
  gap:10px;padding-right:10px;
}
/* 原站：40×40 的 icon_more_ok.png，next 旋转 180deg；禁用态换 icon_more_disable */
.intro-arrow{
  width:40px;height:40px;cursor:pointer;
  background:url("img/ico_arrow_ok.png") no-repeat center/contain;
}
.intro-arrow:hover{opacity:.7}
.intro-arrow.disabled{
  background-image:url("img/ico_arrow_disable.png");cursor:default;
}
.intro-arrow.disabled:hover{opacity:1}
#introNext{transform:rotate(180deg)}

/* 轨道：满视口宽横向滚动。原站 padding-right + 首卡 margin-left 均为
   calc((100vw - 1192px) / 2)，使内容左边缘对齐 1192 内容列、卡片向右溢出视口。 */
.intro-images{
  margin-top:80px;display:flex;justify-content:flex-start;gap:20px;
  overflow-x:scroll;scrollbar-width:none;-ms-overflow-style:none;
  padding-right:calc((100vw - 1192px) / 2);
}
.intro-images::-webkit-scrollbar{display:none}
.intro-item:first-child{margin-left:calc((100vw - 1192px) / 2)}
/* 原站 media：min-width 586 / height 620，不被压缩 */
.intro-item{flex:0 0 auto;min-width:586px;width:586px;height:620px;
  display:flex;flex-direction:column;background:#fff;border-radius:10px;
  box-sizing:border-box;overflow:hidden}
/* 原站：title margin-top 40 / margin-left 40 / 36px 600；subtitle margin-top 20 / 18px */
.intro-item-title{margin-top:40px;margin-left:40px;font-size:36px;font-weight:600;line-height:36px;color:#283248}
.intro-item-sub{margin-top:20px;margin-left:40px;font-size:18px;font-weight:400;line-height:18px;color:#283248}
/* 原站：video-container 590×470，比卡片(586)略宽，被卡片 overflow 裁掉两侧 */
.intro-media{
  margin-top:40px;width:590px;height:470px;
  overflow:hidden;position:relative;pointer-events:none;background:#e8ebee;
}
.intro-media video{
  width:100%;height:102%;margin-top:-3px;display:block;
  border:none!important;outline:none!important;object-fit:fill;pointer-events:none;
}
/* 原站真实素材 intro6.png */
.im-6{background:url("img/intro6.png") no-repeat center/cover}

/* ========== 下载客户端卡片（原站 384×486 / 封面 288 / 内容 324×198） ========== */
.dl-outer{background:#F1F3F5;display:flex;justify-content:center}
.dl-container{width:1192px;margin-top:160px}
/* 原站：与介绍区同款标题 —— 116px 容器 / 48px bold / 每行 48px */
.dl-head{
  height:116px;font-size:48px;font-weight:bold;color:#283248;
  display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;
}
.dl-head p{height:48px;line-height:48px}
/* 原站 card-container：gap 20 / margin-top 80 / margin-bottom 120；cards 用 flex-wrap */
.dl-rows{display:flex;flex-direction:column;gap:20px;margin-top:80px;margin-bottom:120px}
.dl-row{display:flex;flex-wrap:wrap;gap:20px}

.dcard{
  width:384px;height:486px;background:#fff;position:relative;display:flex;
  flex-direction:column;align-items:center;border-radius:10px;transition:all .3s ease;
  box-shadow:0 2px 14px rgba(40,50,72,.08);
}
.dcard:hover{box-shadow:0 8px 28px rgba(40,50,72,.16)}
.dcard-cover{width:384px;height:288px;border-radius:10px 10px 0 0;background:#EDEFF2;
  background-size:cover;background-position:center;background-repeat:no-repeat}
.dcard-content{width:324px;height:198px;margin:24px 30px 0 30px;display:flex;flex-direction:column}
.dcard-title{font-size:20px;color:#283248;font-weight:500;text-align:left}
.dcard-sub{margin-top:12px;font-size:16px;font-weight:400;text-align:left;
  color:rgba(40,50,72,.6);min-height:70px}
.dcard-sub p{margin-bottom:5px;line-height:1.45}
.dcard-btns{display:flex;justify-content:flex-start;align-items:center;gap:10px;
  cursor:pointer;margin-top:auto;padding-bottom:14px}
.dbtn{display:inline-flex;align-items:center;font-size:16px;color:#507daf;
  border:0;background:none;cursor:pointer;border-radius:4px}
.dbtn span{color:#507daf;font-size:16px;font-weight:400}
.dcard-btns:hover{opacity:.8}
.dbtn-line{color:rgba(0,0,0,.1);font-size:16px;position:relative;top:1px}

/* 原站 download.svg / view-more.svg */
.ico-dl{width:20px;height:20px;margin-right:4px;position:relative;top:0;
  background:url("img/ico_download.svg") no-repeat center/contain}
.ico-more{width:20px;height:20px;margin-left:4px;position:relative;top:0;
  background:url("img/ico_viewmore.svg") no-repeat center/contain}

/* 九个端的封面图（原站 assets/img/device/*.png，已下载到本地） */
.cover-pc{background-image:url("img/dev_pc.png")}
.cover-phone{background-image:url("img/dev_phone.png")}
.cover-pad{background-image:url("img/dev_pad.png")}
.cover-car{background-image:url("img/dev_car.png")}
.cover-tv{background-image:url("img/dev_tv.png")}
.cover-wisdom{background-image:url("img/dev_wisdom.png")}
.cover-watch{background-image:url("img/dev_watch.png")}
.cover-vbox{background-image:url("img/dev_vbox.png")}
.cover-chrome{background-image:url("img/dev_chrome.png")}

/* ========== 底部（原站真实值：170px 高 / 980px 宽 / border-top #d3d3d3 / bg #f2f2f2） ========== */
.g-ft{position:relative;height:170px;overflow:hidden;border-top:1px solid #d3d3d3;background:#f2f2f2}
.m-ft{width:980px;margin:0 auto}
/* 右侧四个入口：unit 60×70 / margin-left 30 */
.ft-enter{float:right;width:330px;margin-top:33px}
.ft-unit{float:left;width:60px;height:70px;margin-left:30px;text-align:center;color:#666}
.ft-unit:first-child{margin-left:0}
/* sprite：logo 50×45，图 110×450；tt 52×14，图 180×100 */
.ft-logo{
  display:block;float:none;width:50px;height:45px;margin:0 auto;
  background:url("img/foot_enter_new.png") no-repeat;background-size:110px 450px;
}
.logo-musician{background-position:0 0}
.logo-reward{background-position:-60px -50px}
.logo-cash{background-position:0 -101px}
.logo-auth{background-position:-63px -101px}
.ft-tt{
  display:inline-block;margin:5px 5px 0;width:52px;height:14px;font-style:normal;
  background:url("img/foot_enter_tt.png") no-repeat;background-size:180px 100px;
}
.tt-musician{background-position:0 0}
.tt-reward{background-position:0 -54px}
.tt-cash{background-position:-1px -72px}
.tt-auth{background-position:-1px -91px}
/* 左侧版权：560px / line-height 22 */
.ft-copy{float:left;width:560px;padding-top:15px;line-height:22px}
.ft-copy p{line-height:22px}
.ft-copy .fc1{color:#333}
.ft-copy .fc2{color:#666}
.ft-copy .fc1:hover,.ft-copy .fc2:hover{text-decoration:underline}
.ft-copy .line{margin:0 8px 0 10px;color:#c2c2c2}

/* ========== FAQ 列表（问答摘要在本页，全文在 article.html） ========== */
.faq-outer{background:#F1F3F5;display:flex;justify-content:center}
.faq-container{width:1192px;padding-bottom:120px}
.faq-head{height:116px;font-size:48px;font-weight:bold;color:#283248;
  display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}
.faq-head p{height:48px;line-height:48px}
/* 分类筛选 */
.faq-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:44px}
.faq-tab{height:36px;padding:0 18px;border-radius:18px;background:#fff;color:rgba(40,50,72,.7);
  font-size:15px;display:inline-flex;align-items:center;cursor:pointer;user-select:none;
  border:1px solid transparent;transition:all .2s ease}
.faq-tab:hover{color:#283248}
.faq-tab.on{background:#283248;color:#fff}
.faq-count{margin-left:6px;font-size:13px;opacity:.6}
/* 列表项 */
.faq-list{margin-top:28px;display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border-radius:10px;overflow:hidden;transition:box-shadow .25s ease}
.faq-item:hover{box-shadow:0 4px 18px rgba(40,50,72,.08)}
.faq-item.open{box-shadow:0 6px 24px rgba(40,50,72,.10)}
.faq-q{display:flex;align-items:center;gap:16px;padding:26px 32px;cursor:pointer}
.faq-q-idx{flex:0 0 auto;font-size:13px;color:rgba(40,50,72,.35);width:26px}
.faq-q-text{flex:1;font-size:20px;font-weight:500;color:#283248;line-height:1.5}
.faq-q-cat{flex:0 0 auto;font-size:13px;color:rgba(40,50,72,.45);
  background:#F1F3F5;border-radius:4px;padding:4px 10px}
.faq-toggle{flex:0 0 auto;width:20px;height:20px;position:relative}
.faq-toggle::before,.faq-toggle::after{content:'';position:absolute;background:rgba(40,50,72,.4);
  transition:transform .25s ease,opacity .25s ease}
.faq-toggle::before{left:0;top:9px;width:20px;height:2px}
.faq-toggle::after{left:9px;top:0;width:2px;height:20px}
.faq-item.open .faq-toggle::after{transform:rotate(90deg);opacity:0}
/* 摘要区（外层只放简短回答） */
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-a-inner{padding:0 32px 26px 74px}
.faq-a-sum{font-size:16px;line-height:1.85;color:rgba(40,50,72,.75)}
.faq-a-sum p{margin-bottom:8px}
.faq-a-sum p:last-child{margin-bottom:0}
.faq-a-sum b{color:#283248;font-weight:500}
.faq-a-stat{margin-top:14px;font-size:13px;color:rgba(40,50,72,.45)}
.faq-more{display:inline-flex;align-items:center;margin-top:10px;font-size:16px;color:#507daf}
.faq-more:hover{opacity:.75}
.faq-more i{width:20px;height:20px;margin-left:4px;
  background:url("img/ico_viewmore.svg") no-repeat center/contain}
.faq-empty{padding:60px 0;text-align:center;color:rgba(40,50,72,.45);font-size:16px}
.faq-all{display:inline-flex;align-items:center;justify-content:center;margin-top:32px;
  height:48px;padding:0 32px;border-radius:24px;background:#c20c0c;color:#fff;
  font-size:16px;font-weight:500;transition:background .2s}
.faq-all:hover{background:#a90a0a}
.faq-all i{width:18px;height:18px;margin-left:6px;
  background:url("img/ico_viewmore.svg") no-repeat center/contain;filter:brightness(0) invert(1)}
/* ========== 文章页（article.html） ========== */
body.art{background:#F1F3F5}
/* 顶部吸顶条 */
.art-bar{position:sticky;top:0;z-index:50;height:60px;background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);border-bottom:1px solid rgba(40,50,72,.08)}
.art-bar-in{width:1192px;margin:0 auto;height:60px;display:flex;align-items:center;gap:14px}
.art-back{display:inline-flex;align-items:center;font-size:15px;color:#283248;cursor:pointer}
.art-back:hover{opacity:.7}
.art-back-ico{width:16px;height:16px;margin-right:6px;border-left:2px solid #283248;
  border-bottom:2px solid #283248;transform:rotate(45deg) scale(.7)}
.art-bar-sep{color:rgba(40,50,72,.2)}
.art-bar-cat{font-size:14px;color:rgba(40,50,72,.5)}
/* 头图 */
.art-hero{height:320px;background:url("img/fp_bg.png") no-repeat center/cover;
  background-color:#050507;position:relative;display:flex;align-items:flex-end}
.art-hero::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(5,5,7,.15) 0%,rgba(5,5,7,.75) 100%)}
.art-hero-in{width:1192px;margin:0 auto;padding-bottom:44px;position:relative;z-index:1}
.art-tag{display:inline-block;font-size:13px;color:rgba(255,255,255,.85);
  border:1px solid rgba(255,255,255,.35);border-radius:4px;padding:4px 12px;margin-bottom:18px}
.art-h1{font-size:40px;line-height:1.35;color:#fff;font-weight:600;max-width:900px}
.art-meta{margin-top:16px;font-size:14px;color:rgba(255,255,255,.6)}
.art-stat{margin-top:8px;font-size:14px;color:rgba(255,255,255,.45)}
/* 正文布局：左目录 + 右正文 */
.art-wrap{width:1192px;margin:0 auto;display:flex;gap:40px;
  align-items:flex-start;padding:48px 0 100px}
.art-toc{flex:0 0 220px;position:sticky;top:92px;background:#fff;border-radius:10px;padding:24px 22px}
.art-toc-t{font-size:13px;color:rgba(40,50,72,.45);margin-bottom:14px;letter-spacing:.5px}
.art-toc a{display:block;font-size:14px;line-height:1.6;color:rgba(40,50,72,.7);
  padding:7px 0 7px 12px;border-left:2px solid rgba(40,50,72,.10)}
.art-toc a:hover{color:#283248}
.art-toc a.on{color:#283248;border-left-color:#283248;font-weight:500}
.art-body{flex:1;min-width:0;background:#fff;border-radius:10px;padding:56px 64px 64px}
/* 摘要卡 */
.art-lead{font-size:18px;line-height:1.9;color:#283248;padding:22px 26px;
  background:#F7F8FA;border-radius:8px;border-left:3px solid #283248;margin-bottom:40px}
/* 正文排印 */
.art-body h2{font-size:26px;font-weight:600;color:#283248;margin:48px 0 18px;
  line-height:1.4;scroll-margin-top:92px}
.art-body h2:first-child{margin-top:0}
.art-body h3{font-size:19px;font-weight:600;color:#283248;margin:32px 0 12px}
.art-body p{font-size:16px;line-height:1.95;color:rgba(40,50,72,.85);margin-bottom:18px}
.art-body b,.art-body strong{color:#283248;font-weight:600}
.art-body ul,.art-body ol{margin:0 0 20px;padding-left:0}
.art-body li{font-size:16px;line-height:1.9;color:rgba(40,50,72,.85);
  margin-bottom:10px;padding-left:20px;position:relative}
.art-body ul>li::before{content:'';position:absolute;left:4px;top:13px;
  width:5px;height:5px;border-radius:50%;background:rgba(40,50,72,.35)}
.art-body ol{counter-reset:oli}
.art-body ol>li{counter-increment:oli;padding-left:26px}
.art-body ol>li::before{content:counter(oli) '.';position:absolute;left:0;top:0;
  color:rgba(40,50,72,.45);font-size:15px}
.art-body code{font-family:Consolas,Monaco,"Courier New",monospace;font-size:14px;
  background:#F1F3F5;color:#c0392b;padding:2px 6px;border-radius:4px;word-break:break-all}
.art-body a.ln{color:#507daf;word-break:break-all}
.art-body a.ln:hover{text-decoration:underline}
/* 表格 */
.art-table{width:100%;border-collapse:collapse;margin:8px 0 24px;font-size:15px}
.art-table th,.art-table td{border:1px solid rgba(40,50,72,.10);
  padding:12px 14px;text-align:left;line-height:1.7}
.art-table th{background:#F7F8FA;color:#283248;font-weight:600;font-size:14px}
.art-table td{color:rgba(40,50,72,.85)}
.art-table tr:hover td{background:#FAFBFC}
/* 图片 */
.art-fig{margin:28px 0}
.art-fig-img{width:100%;border-radius:8px;background:#EDEFF2 no-repeat center/cover;height:340px}
.art-fig-cap{margin-top:10px;font-size:13px;color:rgba(40,50,72,.5);text-align:center}
.art-fig.sm .art-fig-img{height:240px;background-size:contain}
/* 参数化 SVG 配图（生成器产出，自包含、无 marker） */
.art-fig.ded{background:#fff;border:1px solid rgba(40,50,72,.08);border-radius:10px;padding:18px 18px 12px;margin:28px 0}
.art-fig-svg{width:100%}
.art-fig-svg svg{display:block;width:100%;height:auto;border-radius:6px}
/* 提示框 */
.art-note{border-radius:8px;padding:18px 22px;margin:24px 0;font-size:15px;line-height:1.85}
.art-note>b:first-child{display:block;margin-bottom:6px;font-size:14px}
.art-note.info{background:#F0F5FA;color:#3d5a7a}
.art-note.info b{color:#2c4a6e}
.art-note.warn{background:#FDF6EC;color:#8a6116}
.art-note.warn b{color:#7a5410}
.art-note.tip{background:#F1F8F2;color:#3d6b45}
.art-note.tip b{color:#2f5637}
/* 来源 */
.art-src{margin-top:52px;padding-top:28px;border-top:1px solid rgba(40,50,72,.10)}
.art-src-t{font-size:15px;font-weight:600;color:#283248;margin-bottom:14px}
.art-src ol>li{font-size:14px;line-height:1.8;color:rgba(40,50,72,.6)}
.art-src a{color:#507daf;word-break:break-all}
.art-src a:hover{text-decoration:underline}
/* 上下篇 */
.art-nav{display:flex;gap:20px;margin-top:32px}
.art-nav-c{flex:1;background:#fff;border-radius:10px;padding:24px 28px;min-width:0}
.art-nav-c.ph{background:transparent}
.art-nav-l{font-size:13px;color:rgba(40,50,72,.45);margin-bottom:8px}
.art-nav-q{font-size:17px;color:#283248;line-height:1.55;font-weight:500}
.art-nav-c:not(.ph):hover .art-nav-q{color:#507daf}
.art-nav-c.next{text-align:right}
/* 相关问题 */
.art-rel{background:#fff;border-radius:10px;padding:32px 36px;margin-top:20px}
.art-rel-t{font-size:20px;font-weight:600;color:#283248;margin-bottom:18px}
.art-rel a{display:block;font-size:16px;line-height:1.7;color:rgba(40,50,72,.8);
  padding:11px 0;border-bottom:1px solid rgba(40,50,72,.07)}
.art-rel a:last-child{border-bottom:0}
.art-rel a:hover{color:#507daf}
.art-miss{width:1192px;margin:100px auto;background:#fff;border-radius:10px;
  padding:60px;text-align:center;color:#283248;font-size:18px}
.art-miss .faq-more{justify-content:center}
/* 步骤列表（有序感更强的圆点步骤） */
.art-body ul.art-steps{margin:8px 0 22px}
.art-body ul.art-steps>li{padding-left:22px}
.art-body ul.art-steps>li::before{background:#c20c0c;width:6px;height:6px;top:12px}
/* 相关问题 + 底部返回容器 */
.art-relwrap{width:1192px;margin:0 auto;padding-bottom:100px}
.art-back-btm{margin-top:24px;font-size:15px}

/* ================= 帮助中心 hub（help.html，网易云红主题） ================= */
body.hub{background:#F1F3F5;color:#283248}
.hub-nav{background:#fff;border-bottom:1px solid rgba(40,50,72,.08);position:sticky;top:0;z-index:50}
.hub-nav-in{max-width:1192px;margin:0 auto;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 20px}
.hub-brand{display:flex;align-items:center;font-size:19px;font-weight:600;color:#283248}
.hub-brand .dot{width:30px;height:30px;border-radius:50%;background:#c20c0c;display:inline-flex;align-items:center;justify-content:center;margin-right:10px}
.hub-brand .dot svg{width:20px;height:20px}
.hub-nav-links{display:flex;gap:26px;font-size:15px}
.hub-nav-links a{color:rgba(40,50,72,.7)}
.hub-nav-links a:hover{color:#283248}
.hub-nav-links a.on{color:#c20c0c;font-weight:600}
/* hero */
.hub-hero{background:linear-gradient(135deg,#c20c0c 0%,#9e0a0a 100%);color:#fff;padding:56px 20px 64px}
.hub-hero-in{max-width:820px;margin:0 auto;text-align:center}
.hub-hero h1{font-size:34px;font-weight:700;margin-bottom:12px}
.hub-hero .sub{font-size:15px;color:rgba(255,255,255,.85);margin-bottom:28px}
.hub-search{display:flex;max-width:680px;margin:0 auto;background:#fff;border-radius:26px;padding:6px;box-shadow:0 10px 30px rgba(158,10,10,.25)}
.hub-search input{flex:1;border:0;outline:0;background:transparent;font-size:15px;padding:0 20px;color:#283248}
.hub-search button{border:0;background:#c20c0c;color:#fff;font-size:15px;padding:0 30px;height:44px;border-radius:22px;cursor:pointer}
.hub-search button:hover{background:#a90a0a}
.hub-hot{margin-top:20px;font-size:13px;display:flex;flex-wrap:wrap;gap:10px 16px;justify-content:center;align-items:center}
.hub-hot .hot-l{color:rgba(255,255,255,.7)}
.hub-hot a{color:rgba(255,255,255,.9);border-bottom:1px solid rgba(255,255,255,.3)}
.hub-hot a:hover{color:#fff;border-color:#fff}
/* main */
.hub-wrap{max-width:1000px;margin:0 auto;padding:36px 20px 80px}
.hub-cats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.hub-cat{padding:8px 18px;border-radius:18px;background:#fff;color:rgba(40,50,72,.72);font-size:14px;cursor:pointer;user-select:none;border:1px solid transparent;transition:all .2s}
.hub-cat:hover{color:#283248}
.hub-cat.on{background:#c20c0c;color:#fff}
.hub-count{font-size:13px;color:rgba(40,50,72,.5);margin-bottom:16px}
.hub-list{display:flex;flex-direction:column;gap:12px}
.hub-item{display:block;background:#fff;border-radius:12px;padding:22px 26px;transition:box-shadow .2s,transform .2s}
.hub-item:hover{box-shadow:0 6px 22px rgba(40,50,72,.10);transform:translateY(-1px)}
.hub-q{font-size:18px;font-weight:600;color:#283248;line-height:1.5}
.hub-a{margin-top:8px;font-size:14px;line-height:1.75;color:rgba(40,50,72,.65)}
.hub-m{margin-top:14px;font-size:12.5px;color:rgba(40,50,72,.45);display:flex;align-items:center;gap:8px}
.hub-tag{background:#fdf1f1;color:#c20c0c;border-radius:4px;padding:3px 10px;font-size:12px}
.hub-m .sp{color:rgba(40,50,72,.25)}
.hub-item mark,.hub-q mark{background:#ffe9b0;color:#a5590a;padding:0 2px;border-radius:2px}
.hub-empty{padding:70px 0;text-align:center;color:rgba(40,50,72,.45);font-size:16px}
/* pager */
.hub-pager{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:center;margin-top:32px}
.hub-pager button{min-width:38px;height:38px;padding:0 12px;border:1px solid rgba(40,50,72,.14);background:#fff;color:#283248;border-radius:8px;cursor:pointer;font-size:14px}
.hub-pager button:hover:not(:disabled){border-color:#c20c0c;color:#c20c0c}
.hub-pager button.on{background:#c20c0c;color:#fff;border-color:#c20c0c}
.hub-pager button:disabled{opacity:.4;cursor:default}
.hub-pager .pg-gap{color:rgba(40,50,72,.4)}
.hub-pager .pg-jump{font-size:13px;color:rgba(40,50,72,.55);margin-left:8px}
.hub-pager .pg-jump input{width:52px;height:34px;border:1px solid rgba(40,50,72,.14);border-radius:6px;text-align:center;margin:0 6px}
/* foot */
.hub-foot{background:#fff;border-top:1px solid rgba(40,50,72,.08);padding:28px 20px}
.hub-foot-in{max-width:1000px;margin:0 auto;font-size:12.5px;line-height:1.9;color:rgba(40,50,72,.5)}
.hub-foot-in a{color:#507daf}
@media(max-width:1080px){
  body.hub{min-width:0}
  .hub-wrap,.hub-nav-in{max-width:100%}
  .art-wrap,.art-relwrap,.art-bar-in{width:auto;max-width:100%;padding-left:20px;padding-right:20px}
  .art-toc{display:none}
}
