/* roulang page: index */
:root{
  --limec:#C9F24D;
  --coralc:#FF6B4A;
  --sandbg:#F6F1E7;
  --inkc:#14161A;
  --dimc:#6B6F76;
  --linec:#E3DCCC;
  --rds:18px;
  --maxw:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--sandbg);color:var(--inkc);font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",system-ui,sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
h1,h2,h3,h4,p,ul,li,figure{margin:0;padding:0}
ul{list-style:none}
.duijnjpy-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.duijnjpy-wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* 顶栏 */
.duijnjpy-topbar{position:sticky;top:0;z-index:60;background:rgba(246,241,231,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--linec)}
.duijnjpy-topbar .duijnjpy-wrap{display:flex;align-items:center;gap:20px;min-height:64px}
.duijnjpy-brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.02em;font-size:17px;flex:none}
.duijnjpy-mark{width:40px;height:40px;border-radius:12px;background:var(--limec);display:grid;place-items:center;font-size:14px;font-weight:800;letter-spacing:-.04em;color:var(--inkc)}
.duijnjpy-nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.duijnjpy-navlink{padding:9px 13px;border-radius:999px;font-size:14px;color:#3a3d43;transition:background .16s ease,color .16s ease}
.duijnjpy-navlink:hover,.duijnjpy-navlink:focus-visible{background:#fff;color:var(--inkc)}
.duijnjpy-pill{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 22px;border-radius:999px;border:1px solid var(--inkc);background:transparent;color:var(--inkc);font-size:14px;font-weight:600;cursor:pointer;transition:background .16s ease,color .16s ease,transform .16s ease,border-color .16s ease}
.duijnjpy-pill:hover{background:var(--inkc);color:var(--sandbg);transform:translateY(-2px)}
.duijnjpy-pill--lime{background:var(--limec);border-color:var(--limec);color:var(--inkc)}
.duijnjpy-pill--lime:hover{background:var(--inkc);color:var(--limec);border-color:var(--inkc)}
.duijnjpy-pill--ghost{border-color:rgba(243,239,229,.55);color:#F3EFE5}
.duijnjpy-pill--ghost:hover{background:#F3EFE5;color:var(--inkc);border-color:#F3EFE5}
.duijnjpy-tog{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.duijnjpy-burger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;margin-left:auto;border:1px solid var(--linec);border-radius:12px;cursor:pointer;background:#fff}
.duijnjpy-burger i{display:block;width:18px;height:2px;background:var(--inkc);border-radius:2px}
.duijnjpy-drawer{display:none;border-top:1px solid var(--linec);background:var(--sandbg);padding:6px 24px 18px}
.duijnjpy-drawer a{display:flex;align-items:center;min-height:44px;font-size:15px;border-bottom:1px dashed var(--linec)}
.duijnjpy-drawer .duijnjpy-pill{margin-top:14px;width:100%}

/* 首屏 */
.duijnjpy-hero{position:relative;overflow:hidden;padding:64px 0 76px}
.duijnjpy-hero::before{content:"";position:absolute;left:-8%;right:-8%;top:-90px;height:400px;background:var(--limec);opacity:.42;transform:skewY(-4deg);border-radius:52px;z-index:0}
.duijnjpy-hero::after{content:"";position:absolute;right:-50px;top:-30px;width:240px;height:240px;border-radius:50%;background:var(--limec);opacity:.3;z-index:0}
.duijnjpy-hero .duijnjpy-wrap{position:relative;z-index:1}
.duijnjpy-h1{font-size:clamp(30px,4.4vw,56px);line-height:1.15;font-weight:800;letter-spacing:-.02em;max-width:15em}
.duijnjpy-hl{background:var(--limec);padding:0 .12em;border-radius:8px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.duijnjpy-lead{margin-top:14px;font-size:17px;font-weight:600;color:#31343a}
.duijnjpy-intro{margin-top:16px;max-width:62ch;font-size:15px;color:#4a4e55}
.duijnjpy-search{display:flex;align-items:center;gap:8px;margin-top:28px;max-width:560px;background:#fff;border:1px solid var(--linec);border-radius:999px;padding:6px 6px 6px 4px}
.duijnjpy-search:focus-within{box-shadow:0 0 0 3px rgba(201,242,77,.65)}
.duijnjpy-search input{flex:1;min-width:0;min-height:44px;border:0;outline:none;background:transparent;padding:0 18px;font-size:15px;color:var(--inkc)}
.duijnjpy-search input::placeholder{color:#9a9d9f}
.duijnjpy-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;font-size:13px;color:var(--dimc)}
.duijnjpy-tags span{border:1px dashed #cfc7b3;border-radius:999px;padding:4px 13px;background:rgba(255,255,255,.55)}

/* 板块基础 */
.duijnjpy-sec{padding:72px 0}
.duijnjpy-h2{font-size:clamp(22px,2.6vw,30px);line-height:1.25;font-weight:800;letter-spacing:-.02em}
.duijnjpy-sub{margin-top:10px;margin-bottom:32px;max-width:66ch;color:var(--dimc);font-size:15px}
.duijnjpy-more{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;border-bottom:1px solid var(--inkc);padding-bottom:2px}

/* 分类频道 */
.duijnjpy-cats{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.duijnjpy-cat{border-left:3px solid var(--limec);padding:4px 0 4px 14px}
.duijnjpy-cat span{display:block;font-size:17px;font-weight:700;margin-bottom:6px}
.duijnjpy-cat p{font-size:13px;line-height:1.6;color:var(--dimc)}

/* 频道精选 */
.duijnjpy-row{display:grid;grid-template-columns:64px 1fr;gap:22px;padding:30px 0;border-top:1px solid var(--linec)}
.duijnjpy-row:first-child{border-top:0;padding-top:0}
.duijnjpy-rowno{font-size:30px;font-weight:800;line-height:1;letter-spacing:-.05em;color:#CFC6AE}
.duijnjpy-rowtitle{font-size:16px;font-weight:700;margin-bottom:16px}
.duijnjpy-rowgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

/* 卡片 */
.duijnjpy-card{background:#fff;border:1px solid var(--linec);border-radius:var(--rds);overflow:hidden;transition:transform .16s ease,box-shadow .16s ease}
.duijnjpy-card:hover{transform:translateY(-4px);box-shadow:4px 4px 0 var(--inkc)}
.duijnjpy-cover{position:relative;aspect-ratio:16/9;overflow:hidden;background:#eae4d6}
.duijnjpy-cover img{width:100%;height:100%;object-fit:cover}
.duijnjpy-badge{position:absolute;left:10px;top:10px;background:rgba(20,22,26,.78);color:#fff;font-size:12px;line-height:1;padding:6px 9px;border-radius:6px;letter-spacing:.02em}
.duijnjpy-cbody{padding:14px}
.duijnjpy-cname{font-size:15px;font-weight:700;line-height:1.4;margin-bottom:6px}
.duijnjpy-meta{font-size:13px;color:var(--dimc);letter-spacing:.02em}
.duijnjpy-g4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

/* 观看场景 */
.duijnjpy-scene{display:grid;grid-template-columns:repeat(4,1fr)}
.duijnjpy-scene > div{padding:0 22px;border-left:1px solid var(--linec)}
.duijnjpy-scene > div:first-child{border-left:0;padding-left:0}
.duijnjpy-scene img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;margin-bottom:14px;border:1px solid var(--linec)}
.duijnjpy-scene h3{font-size:16px;font-weight:700;margin-bottom:8px}
.duijnjpy-scene p{font-size:14px;color:var(--dimc);line-height:1.65}

/* 深色演示块 */
.duijnjpy-dark{background:#14161A;color:#F3EFE5;padding:76px 0}
.duijnjpy-dark .duijnjpy-h2{color:#F3EFE5}
.duijnjpy-darkgrid{display:grid;grid-template-columns:45% 1fr;gap:44px;align-items:center}
.duijnjpy-dark p{margin:14px 0 24px;font-size:15px;line-height:1.75;color:#b8b5ad}
.duijnjpy-shot{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.16)}
.duijnjpy-shot img{width:100%;height:100%;object-fit:cover}
.duijnjpy-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(20,22,26,.18)}
.duijnjpy-play::before{content:"";width:0;height:0;border-left:22px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent;margin-left:6px;opacity:.92}

/* 混剪专题 */
.duijnjpy-specials{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}
.duijnjpy-sp{position:relative;display:flex;align-items:flex-end;min-height:200px;border-radius:var(--rds);overflow:hidden;border:1px solid var(--linec);transition:transform .16s ease,box-shadow .16s ease}
.duijnjpy-sp:hover{transform:translateY(-4px);box-shadow:4px 4px 0 var(--inkc)}
.duijnjpy-sp--lead{grid-row:span 2;min-height:420px}
.duijnjpy-sp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.duijnjpy-sp::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,22,26,0) 28%,rgba(20,22,26,.9) 100%)}
.duijnjpy-spin{position:relative;z-index:1;padding:22px;color:#fff;width:100%}
.duijnjpy-spin h3{font-size:19px;font-weight:700;margin-bottom:8px}
.duijnjpy-spin p{font-size:13px;color:#ddd8cd;line-height:1.6;margin-bottom:12px}
.duijnjpy-spmeta{display:inline-block;font-size:12px;color:#cfc9bd;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:3px 10px;margin-right:10px}
.duijnjpy-spmore{font-size:13px;font-weight:700;color:var(--limec);border-bottom:1px solid var(--limec);padding-bottom:1px}

/* 口碑 */
.duijnjpy-voices{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.duijnjpy-voice{background:#fff;border:1px solid var(--linec);border-radius:var(--rds);padding:18px;display:flex;gap:14px;transition:transform .16s ease,box-shadow .16s ease}
.duijnjpy-voice:hover{transform:translateY(-4px);box-shadow:4px 4px 0 var(--inkc)}
.duijnjpy-ava{width:44px;height:44px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:16px;font-weight:700;color:#fff}
.duijnjpy-voice:nth-child(1) .duijnjpy-ava{background:#FF6B4A}
.duijnjpy-voice:nth-child(2) .duijnjpy-ava{background:#14161A}
.duijnjpy-voice:nth-child(3) .duijnjpy-ava{background:#8CA83C}
.duijnjpy-voice:nth-child(4) .duijnjpy-ava{background:#4A6E8C}
.duijnjpy-voice:nth-child(5) .duijnjpy-ava{background:#9B6B3A}
.duijnjpy-voice:nth-child(6) .duijnjpy-ava{background:#6D5A8C}
.duijnjpy-vname{font-size:14px;font-weight:700}
.duijnjpy-vtext{font-size:14px;color:#4a4e55;margin-top:4px;line-height:1.65}
.duijnjpy-stars{margin-top:8px;font-size:12px;letter-spacing:2px;color:var(--coralc)}

/* 连载 */
.duijnjpy-serial{display:flex;align-items:center;gap:26px;padding:22px 0;border-top:1px solid var(--linec)}
.duijnjpy-serial:nth-child(even){flex-direction:row-reverse;text-align:right}
.duijnjpy-thumb{width:150px;flex:none;aspect-ratio:3/4;border-radius:14px;overflow:hidden;border:1px solid var(--linec)}
.duijnjpy-thumb img{width:100%;height:100%;object-fit:cover}
.duijnjpy-serial h3{font-size:18px;font-weight:700;margin-bottom:8px}
.duijnjpy-serial p{font-size:14px;color:var(--dimc);max-width:46ch;line-height:1.65}
.duijnjpy-serial:nth-child(even) p{margin-left:auto}
.duijnjpy-state{display:inline-block;margin-top:10px;font-size:12px;padding:3px 10px;border-radius:6px;background:rgba(20,22,26,.85);color:#fff}

/* 横滑 */
.duijnjpy-rail{display:flex;gap:16px;overflow-x:auto;padding-bottom:10px;scrollbar-width:none}
.duijnjpy-rail::-webkit-scrollbar{display:none}
.duijnjpy-rail .duijnjpy-card{min-width:220px;width:220px;flex:none}
.duijnjpy-railfoot{display:flex;justify-content:flex-end;margin-top:14px}

/* 排行榜 */
.duijnjpy-rank{counter-reset:rk}
.duijnjpy-rank li{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--linec)}
.duijnjpy-rank li::before{counter-increment:rk;content:counter(rk);display:grid;place-items:center;width:52px;height:52px;flex:none;font-size:24px;font-weight:800;line-height:1;border-radius:12px;border:1.5px solid #d9d1bd;color:#b9b09a}
.duijnjpy-rank li:nth-child(-n+3)::before{background:var(--limec);border-color:var(--limec);color:var(--inkc)}
.duijnjpy-rtitle{flex:1;font-size:15px;font-weight:600;min-width:0}
.duijnjpy-rtags{display:flex;gap:8px;flex:none}
.duijnjpy-rtag{font-size:12px;padding:3px 10px;border-radius:6px;border:1px solid var(--linec);color:var(--dimc);white-space:nowrap}
.duijnjpy-rtag--hot{border-color:rgba(255,107,74,.45);color:#c9482c;background:rgba(255,107,74,.08)}

/* 资讯 */
.duijnjpy-news li{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--linec)}
.duijnjpy-news img{width:64px;height:64px;flex:none;border-radius:10px;object-fit:cover;border:1px solid var(--linec)}
.duijnjpy-nbody{flex:1;min-width:0}
.duijnjpy-ntitle{font-size:15px;font-weight:600;line-height:1.5}
.duijnjpy-ndate{font-size:12px;color:var(--dimc);margin-top:4px;letter-spacing:.02em}
.duijnjpy-arrow{flex:none;font-size:18px;color:#b9b09a}

/* 问答 */
.duijnjpy-faq details{background:#fff;border:1px solid var(--linec);border-radius:14px;padding:0 18px;margin-bottom:12px}
.duijnjpy-faq summary{display:flex;align-items:center;gap:10px;min-height:54px;cursor:pointer;font-weight:600;font-size:15px;list-style:none}
.duijnjpy-faq summary::-webkit-details-marker{display:none}
.duijnjpy-faq summary::before{content:"";width:10px;height:10px;flex:none;background:var(--limec);border-radius:3px}
.duijnjpy-faq p{margin:0 0 18px 20px;font-size:14px;color:var(--dimc);line-height:1.75}

/* 收尾 */
.duijnjpy-cta{background:var(--limec);padding:58px 0;text-align:center}
.duijnjpy-cta h2{font-size:clamp(21px,2.4vw,28px);font-weight:800;letter-spacing:-.02em;margin-bottom:22px}

/* 页脚 */
.duijnjpy-foot{background:#14161A;color:#c8c3b8;padding:56px 0 26px}
.duijnjpy-footgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:36px}
.duijnjpy-fbrand{display:flex;align-items:center;gap:10px;color:#F3EFE5;font-weight:800;font-size:17px;letter-spacing:-.02em;margin-bottom:14px}
.duijnjpy-foot p{font-size:14px;line-height:1.7;color:#9d9890;max-width:34ch}
.duijnjpy-fh{font-size:14px;font-weight:700;color:#F3EFE5;margin-bottom:14px}
.duijnjpy-flinks a{display:block;min-height:36px;font-size:14px;color:#9d9890;transition:color .16s ease}
.duijnjpy-flinks a:hover{color:var(--limec)}
.duijnjpy-copy{margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;color:#7d7970}

/* 1024 */
@media (max-width:1024px){
  .duijnjpy-nav{display:none}
  .duijnjpy-burger{display:flex}
  .duijnjpy-tog:checked ~ .duijnjpy-drawer{display:block}
  .duijnjpy-cats{grid-template-columns:repeat(3,1fr);gap:20px}
  .duijnjpy-rowgrid{grid-template-columns:repeat(2,1fr)}
  .duijnjpy-g4{grid-template-columns:repeat(3,1fr)}
  .duijnjpy-scene{grid-template-columns:repeat(2,1fr);gap:28px 0}
  .duijnjpy-scene > div:nth-child(odd){border-left:0;padding-left:0}
  .duijnjpy-darkgrid{grid-template-columns:1fr;gap:32px}
  .duijnjpy-specials{grid-template-columns:1fr;gap:16px}
  .duijnjpy-sp--lead{grid-row:auto;min-height:280px}
  .duijnjpy-footgrid{grid-template-columns:1fr 1fr;gap:28px}
}
/* 768 */
@media (max-width:768px){
  .duijnjpy-wrap{padding:0 20px}
  .duijnjpy-sec{padding:58px 0}
  .duijnjpy-hero{padding:52px 0 60px}
  .duijnjpy-hero::before{height:320px;top:-70px}
  .duijnjpy-g4{grid-template-columns:repeat(2,1fr)}
  .duijnjpy-voices{grid-template-columns:1fr}
  .duijnjpy-row{grid-template-columns:1fr;gap:10px}
  .duijnjpy-rowno{font-size:24px}
  .duijnjpy-serial{gap:18px}
  .duijnjpy-thumb{width:110px}
  .duijnjpy-rtags{display:none}
}
/* 520 */
@media (max-width:520px){
  .duijnjpy-wrap{padding:0 16px}
  .duijnjpy-sec{padding:48px 0}
  .duijnjpy-hero{padding:44px 0 52px}
  .duijnjpy-cats{grid-template-columns:1fr 1fr;gap:18px}
  .duijnjpy-rowgrid{grid-template-columns:1fr}
  .duijnjpy-g4{grid-template-columns:1fr}
  .duijnjpy-scene{grid-template-columns:1fr;gap:26px 0}
  .duijnjpy-scene > div{border-left:0!important;padding-left:0!important}
  .duijnjpy-card,.duijnjpy-voice,.duijnjpy-sp,.duijnjpy-thumb{border-radius:14px}
  .duijnjpy-serial{flex-direction:row!important;text-align:left!important;gap:14px}
  .duijnjpy-thumb{width:96px}
  .duijnjpy-serial p{margin-left:0!important}
  .duijnjpy-search{flex-wrap:wrap;border-radius:18px;padding:10px}
  .duijnjpy-search input{width:100%;flex:1 1 100%;padding:0 8px}
  .duijnjpy-search .duijnjpy-pill{width:100%}
  .duijnjpy-footgrid{grid-template-columns:1fr;gap:24px}
  .duijnjpy-faq summary{font-size:14px;min-height:50px}
}
