/* roulang page: index */
:root{
      --wine:#3A121B;
      --copper:#B66A58;
      --apricot:#F2C7A5;
      --blackberry:#120B0E;
      --cream:#FFF7F1;
      --card:#FFFFFF;
      --dark-card:#1B1115;
      --text:#2D2427;
      --muted:#7A686D;
      --border:rgba(90,45,55,.14);
      --shadow:0 18px 60px rgba(58,18,27,.08);
      --shadow-strong:0 28px 90px rgba(58,18,27,.18);
      --radius:28px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at 16% 8%, rgba(242,199,165,.32), transparent 28%),
        radial-gradient(circle at 92% 18%, rgba(182,106,88,.18), transparent 30%),
        linear-gradient(180deg,#fff7f1 0%,#fffaf6 48%,#fff7f1 100%);
      line-height:1.75;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input{font:inherit}
    ::selection{background:var(--apricot);color:var(--wine)}
    .site-container{width:min(1180px,calc(100% - 32px));margin-inline:auto}
    .skip-link{
      position:absolute;left:-999px;top:8px;z-index:9999;
      background:var(--apricot);color:var(--wine);padding:10px 14px;border-radius:999px
    }
    .skip-link:focus{left:12px;outline:3px solid rgba(242,199,165,.6)}
    .pill-nav{
      background:rgba(255,247,241,.88);
      backdrop-filter:blur(18px);
      border:1px solid rgba(90,45,55,.14);
      box-shadow:0 16px 50px rgba(58,18,27,.10);
    }
    .brand-mark{
      width:38px;height:38px;border-radius:999px;
      background:linear-gradient(135deg,var(--apricot),var(--copper));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 28px rgba(182,106,88,.32);
      position:relative;flex:0 0 auto;
    }
    .brand-mark:after{
      content:"18+";
      position:absolute;inset:0;display:grid;place-items:center;
      font-size:11px;font-weight:800;color:var(--wine);letter-spacing:-.02em;
    }
    .nav-link{
      display:inline-flex;align-items:center;justify-content:center;
      padding:9px 15px;border-radius:999px;
      color:#5b444b;font-size:14px;font-weight:650;
      transition:all .22s ease;
    }
    .nav-link:hover{background:rgba(242,199,165,.34);color:var(--wine);transform:translateY(-1px)}
    .nav-link.active{background:var(--wine);color:#fff7f1;box-shadow:0 10px 24px rgba(58,18,27,.18)}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:8px;
      border-radius:999px;padding:14px 22px;font-weight:800;
      transition:transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease;
      border:1px solid transparent;
      min-height:48px;
    }
    .btn:focus-visible,.nav-link:focus-visible,summary:focus-visible,input:focus-visible{
      outline:3px solid rgba(242,199,165,.72);
      outline-offset:3px;
    }
    .btn-primary{
      color:#321116;
      background:linear-gradient(135deg,var(--apricot),#dfa083 45%,var(--copper));
      box-shadow:0 16px 38px rgba(182,106,88,.28);
    }
    .btn-primary:hover{transform:translateY(-2px);box-shadow:0 22px 48px rgba(182,106,88,.36);filter:saturate(1.06)}
    .btn-secondary{
      color:#fff7f1;border-color:rgba(242,199,165,.42);
      background:rgba(255,247,241,.06);
    }
    .btn-secondary:hover{transform:translateY(-2px);background:rgba(242,199,165,.14);border-color:rgba(242,199,165,.72)}
    .btn-light{
      color:var(--wine);background:#fff;border-color:rgba(90,45,55,.10);
      box-shadow:0 12px 32px rgba(58,18,27,.08);
    }
    .btn-light:hover{transform:translateY(-2px);border-color:rgba(182,106,88,.35);box-shadow:0 18px 42px rgba(58,18,27,.12)}
    .hero{
      position:relative;overflow:hidden;
      background:
        radial-gradient(circle at 70% 18%, rgba(242,199,165,.25), transparent 26%),
        radial-gradient(circle at 18% 76%, rgba(182,106,88,.32), transparent 26%),
        linear-gradient(135deg,#120b0e 0%,#2a0e15 48%,#3a121b 100%);
      color:#fff7f1;
    }
    .hero:before{
      content:"";position:absolute;inset:0;opacity:.22;
      background-image:linear-gradient(135deg,rgba(255,255,255,.08) 1px,transparent 1px);
      background-size:22px 22px;
      mask-image:linear-gradient(180deg,#000,transparent 88%);
    }
    .hero-soft-edge{
      position:absolute;left:0;right:0;bottom:-1px;height:78px;
      background:linear-gradient(180deg,transparent,#fff7f1);
      pointer-events:none;
    }
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;
      padding:7px 12px;border-radius:999px;
      background:rgba(242,199,165,.14);
      border:1px solid rgba(242,199,165,.26);
      color:#ffd9bd;font-size:13px;font-weight:750;
    }
    .section-kicker{
      color:var(--copper);font-weight:850;letter-spacing:.02em;
      display:inline-flex;align-items:center;gap:8px;
    }
    .section-kicker:before{
      content:"";width:24px;height:2px;border-radius:999px;
      background:linear-gradient(90deg,var(--copper),var(--apricot));
    }
    .card{
      background:rgba(255,255,255,.86);
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease;
    }
    .card:hover{transform:translateY(-4px);box-shadow:var(--shadow-strong);border-color:rgba(182,106,88,.34)}
    .dark-card{
      background:linear-gradient(145deg,rgba(27,17,21,.94),rgba(58,18,27,.72));
      border:1px solid rgba(242,199,165,.18);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 22px 70px rgba(0,0,0,.28);
    }
    .tag{
      display:inline-flex;align-items:center;gap:6px;
      padding:7px 11px;border-radius:999px;
      background:rgba(242,199,165,.42);color:var(--wine);
      font-size:13px;font-weight:750;border:1px solid rgba(182,106,88,.16);
      white-space:nowrap;
    }
    .tag.dark{background:rgba(242,199,165,.12);color:#ffe0c8;border-color:rgba(242,199,165,.20)}
    .abstract-cover{
      min-height:160px;border-radius:24px;position:relative;overflow:hidden;
      background:
        radial-gradient(circle at 22% 24%,rgba(242,199,165,.64),transparent 22%),
        radial-gradient(circle at 78% 34%,rgba(182,106,88,.55),transparent 26%),
        linear-gradient(135deg,#2b1017,#120b0e 68%);
    }
    .abstract-cover:after{
      content:"";position:absolute;inset:0;
      background:linear-gradient(120deg,transparent 0 38%,rgba(255,255,255,.12) 39% 43%,transparent 44% 100%);
      transform:translateX(-28%);
    }
    .data-step{
      position:relative;overflow:hidden;
      background:linear-gradient(135deg,#fff,#fff4ec);
      border:1px solid var(--border);
      border-radius:26px;
      box-shadow:0 16px 46px rgba(58,18,27,.07);
    }
    .data-step:before{
      content:"";position:absolute;left:0;top:0;bottom:0;width:6px;
      background:linear-gradient(180deg,var(--copper),var(--apricot));
    }
    details.faq-item{
      border:1px solid var(--border);border-radius:22px;background:#fff;
      box-shadow:0 12px 34px rgba(58,18,27,.06);overflow:hidden;
    }
    details.faq-item summary{
      cursor:pointer;list-style:none;padding:20px 22px;font-weight:850;color:var(--wine);
      display:flex;align-items:center;justify-content:space-between;gap:18px;
      transition:background .2s ease;
    }
    details.faq-item summary::-webkit-details-marker{display:none}
    details.faq-item summary:hover{background:#fff2e8}
    details.faq-item summary:after{content:"＋";font-size:20px;color:var(--copper);flex:0 0 auto}
    details.faq-item[open] summary:after{content:"—"}
    .faq-body{padding:0 22px 22px;color:var(--muted);line-height:1.85}
    .cta-band{
      background:
        radial-gradient(circle at 18% 18%,rgba(242,199,165,.28),transparent 26%),
        radial-gradient(circle at 82% 72%,rgba(182,106,88,.30),transparent 26%),
        linear-gradient(135deg,#120b0e,#3a121b);
      border:1px solid rgba(242,199,165,.14);
      box-shadow:0 28px 80px rgba(58,18,27,.20);
    }
    .footer-link{color:#dcc8c0;transition:color .2s ease,transform .2s ease;display:inline-flex}
    .footer-link:hover{color:var(--apricot);transform:translateX(2px)}
    .mobile-menu{display:none}
    #menu-toggle:checked ~ .mobile-menu{display:block}
    @media (max-width: 1024px){
      .site-container{width:min(100% - 28px,920px)}
      .hero-title{font-size:clamp(2.35rem,7vw,4.1rem)}
    }
    @media (max-width: 768px){
      .desktop-nav{display:none}
      .mobile-trigger{display:inline-flex}
      .site-container{width:min(100% - 24px,680px)}
      .hero{padding-top:88px}
      .btn{width:100%}
      .nav-shell{border-radius:26px}
      .section-pad{padding-block:64px}
      details.faq-item summary{padding:18px}
      .faq-body{padding:0 18px 18px}
    }
    @media (min-width: 769px){
      .mobile-trigger{display:none}
      .section-pad{padding-block:96px}
    }
    @media (max-width: 520px){
      .brand-text{max-width:215px}
      .hero-title{font-size:2.25rem;line-height:1.12}
      .abstract-cover{min-height:132px}
      .tag{font-size:12px;padding:6px 9px}
    }

/* roulang page: category1 */
:root{
      --primary:#3A121B;
      --secondary:#B66A58;
      --accent:#F2C7A5;
      --dark:#120B0E;
      --light:#FFF7F1;
      --card:#FFFFFF;
      --text:#2D2427;
      --muted:#7A686D;
      --border:rgba(90,45,55,.14);
      --shadow:0 18px 60px rgba(58,18,27,.08);
      --shadow-strong:0 28px 90px rgba(58,18,27,.18);
      --radius:28px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at 8% 8%,rgba(242,199,165,.40),transparent 28%),
        radial-gradient(circle at 92% 18%,rgba(182,106,88,.18),transparent 30%),
        linear-gradient(180deg,#fff7f1 0%,#fffaf6 48%,#fff7f1 100%);
      line-height:1.75;
      overflow-x:hidden;
    }
    body:before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      opacity:.35;
      background-image:linear-gradient(135deg,rgba(58,18,27,.045) 0 1px,transparent 1px 18px);
      z-index:-1;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input,textarea{font:inherit}
    ::selection{background:var(--accent);color:var(--primary)}
    .site-container{width:min(1180px,calc(100% - 32px));margin-inline:auto}
    .section{padding:88px 0}
    .section-tight{padding:64px 0}
    .pill-nav{
      background:rgba(255,247,241,.88);
      border:1px solid rgba(90,45,55,.16);
      box-shadow:0 18px 50px rgba(58,18,27,.10);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
    }
    .nav-shell{min-height:66px}
    .brand-mark{
      width:38px;height:38px;flex:0 0 38px;border-radius:999px;display:inline-block;
      background:
        radial-gradient(circle at 35% 30%,#F2C7A5 0 20%,transparent 22%),
        linear-gradient(135deg,#3A121B,#B66A58 58%,#F2C7A5);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),0 12px 30px rgba(58,18,27,.22);
      position:relative;
    }
    .brand-mark:after{
      content:"18+";
      position:absolute;
      inset:auto -8px -5px auto;
      font-size:10px;
      font-weight:900;
      color:#3A121B;
      background:#F2C7A5;
      border-radius:999px;
      padding:1px 5px;
      border:1px solid rgba(58,18,27,.12);
    }
    .nav-link{
      display:inline-flex;align-items:center;justify-content:center;
      min-height:42px;padding:0 15px;border-radius:999px;
      color:#5e454c;font-weight:800;font-size:14px;
      transition:transform .22s ease,background .22s ease,color .22s ease,box-shadow .22s ease;
    }
    .nav-link:hover{background:rgba(242,199,165,.45);color:var(--primary);transform:translateY(-1px)}
    .nav-link.active{background:var(--primary);color:#fff;box-shadow:0 12px 28px rgba(58,18,27,.20)}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
      border-radius:999px;padding:14px 22px;
      font-weight:900;line-height:1.2;border:1px solid transparent;
      transition:transform .22s ease,box-shadow .22s ease,background .22s ease,border-color .22s ease,color .22s ease,filter .22s ease;
      cursor:pointer;
    }
    .btn:hover{transform:translateY(-2px)}
    .btn:focus-visible,.nav-link:focus-visible,summary:focus-visible,input:focus-visible{
      outline:3px solid rgba(242,199,165,.88);outline-offset:3px;
    }
    .btn-primary{
      color:#2b1315;
      background:linear-gradient(135deg,#F2C7A5,#B66A58);
      box-shadow:0 16px 38px rgba(182,106,88,.28);
    }
    .btn-primary:hover{filter:brightness(1.04);box-shadow:0 22px 48px rgba(182,106,88,.34)}
    .btn-light{
      background:rgba(255,255,255,.72);
      color:var(--primary);
      border-color:rgba(90,45,55,.16);
    }
    .btn-light:hover{background:#fff;border-color:rgba(182,106,88,.42);box-shadow:var(--shadow)}
    .btn-outline{
      color:var(--primary);border-color:rgba(182,106,88,.42);
      background:rgba(255,247,241,.58);
    }
    .btn-outline:hover{background:rgba(242,199,165,.38);box-shadow:var(--shadow)}
    .mobile-trigger,.mobile-menu{display:none}
    #menu-toggle:checked + .mobile-menu{display:block}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;
      padding:8px 13px;border-radius:999px;
      background:rgba(242,199,165,.28);
      border:1px solid rgba(242,199,165,.45);
      color:#6b3030;font-weight:900;font-size:13px;
    }
    .tag{
      display:inline-flex;align-items:center;
      border-radius:999px;padding:7px 11px;
      font-size:13px;font-weight:800;
      background:#fff1e7;color:#6b3030;
      border:1px solid rgba(182,106,88,.18);
      white-space:nowrap;
    }
    .tag.dark{background:rgba(242,199,165,.10);color:#F2C7A5;border-color:rgba(242,199,165,.18)}
    .soft-card{
      background:rgba(255,255,255,.82);
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
    }
    .dark-card{
      background:linear-gradient(145deg,rgba(27,17,21,.98),rgba(58,18,27,.96));
      border:1px solid rgba(242,199,165,.14);
      color:#fff7f1;
      box-shadow:0 24px 70px rgba(18,11,14,.28);
    }
    .cover-abstract{
      min-height:180px;border-radius:24px;overflow:hidden;position:relative;
      background:
        radial-gradient(circle at 28% 24%,rgba(242,199,165,.85),transparent 20%),
        radial-gradient(circle at 78% 35%,rgba(182,106,88,.72),transparent 26%),
        linear-gradient(135deg,#1B1115 0%,#3A121B 48%,#6b3030 100%);
    }
    .cover-abstract:before{
      content:"";
      position:absolute;inset:16px;
      border:1px solid rgba(255,247,241,.16);
      border-radius:20px;
      background:linear-gradient(135deg,rgba(255,255,255,.10),transparent 52%);
    }
    .cover-abstract:after{
      content:"成人内容分类封面占位";
      position:absolute;left:18px;bottom:16px;
      color:rgba(255,247,241,.82);
      font-size:13px;font-weight:800;
      letter-spacing:.02em;
    }
    .filter-strip{
      overflow-x:auto;
      scrollbar-width:none;
      -webkit-overflow-scrolling:touch;
    }
    .filter-strip::-webkit-scrollbar{display:none}
    .filter-pill{
      display:inline-flex;align-items:center;gap:7px;
      padding:10px 15px;border-radius:999px;
      border:1px solid rgba(90,45,55,.13);
      background:rgba(255,255,255,.72);
      color:#614a50;font-weight:900;font-size:14px;
      transition:.22s ease;
      white-space:nowrap;
    }
    .filter-pill:hover,.filter-pill.active{
      color:#fff;background:var(--primary);
      border-color:var(--primary);
      box-shadow:0 14px 34px rgba(58,18,27,.16);
      transform:translateY(-1px);
    }
    .list-card{
      border-radius:28px;background:rgba(255,255,255,.84);
      border:1px solid var(--border);
      box-shadow:0 14px 42px rgba(58,18,27,.06);
      transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
    }
    .list-card:hover{transform:translateY(-4px);border-color:rgba(182,106,88,.45);box-shadow:var(--shadow-strong)}
    .mini-line{
      width:100%;height:1px;
      background:linear-gradient(90deg,transparent,rgba(90,45,55,.18),transparent);
    }
    .metric{
      border-radius:26px;
      background:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,247,241,.70));
      border:1px solid rgba(90,45,55,.12);
      box-shadow:0 12px 36px rgba(58,18,27,.06);
      padding:22px;
    }
    .step-dot{
      width:38px;height:38px;border-radius:999px;
      display:flex;align-items:center;justify-content:center;
      background:linear-gradient(135deg,#F2C7A5,#B66A58);
      color:#2b1315;font-weight:1000;
      box-shadow:0 12px 30px rgba(182,106,88,.22);
      flex:0 0 38px;
    }
    details{
      border-radius:24px;
      background:rgba(255,255,255,.78);
      border:1px solid rgba(90,45,55,.13);
      box-shadow:0 10px 34px rgba(58,18,27,.05);
      overflow:hidden;
    }
    summary{
      cursor:pointer;
      padding:20px 22px;
      font-weight:1000;
      color:var(--primary);
      list-style:none;
      display:flex;align-items:center;justify-content:space-between;gap:18px;
    }
    summary::-webkit-details-marker{display:none}
    summary:after{
      content:"+";
      width:28px;height:28px;border-radius:999px;
      display:inline-flex;align-items:center;justify-content:center;
      background:#fff1e7;color:#6b3030;font-weight:1000;
      flex:0 0 28px;
    }
    details[open] summary{background:rgba(242,199,165,.18)}
    details[open] summary:after{content:"−"}
    details p{padding:0 22px 22px;color:var(--muted);line-height:1.85}
    .footer-link{color:#dcc8c0;transition:color .2s ease,transform .2s ease;display:inline-flex}
    .footer-link:hover{color:#F2C7A5;transform:translateX(3px)}
    .page-hero{
      padding-top:132px;
      background:
        radial-gradient(circle at 20% 20%,rgba(242,199,165,.22),transparent 30%),
        radial-gradient(circle at 86% 12%,rgba(182,106,88,.28),transparent 28%),
        linear-gradient(135deg,#120B0E 0%,#3A121B 58%,#1B1115 100%);
      color:#fff7f1;
      position:relative;
      overflow:hidden;
    }
    .page-hero:after{
      content:"";
      position:absolute;left:-5%;right:-5%;bottom:-68px;height:138px;
      background:var(--light);
      border-radius:50% 50% 0 0/60% 60% 0 0;
    }
    .hero-panel{
      position:relative;
      background:rgba(255,247,241,.08);
      border:1px solid rgba(242,199,165,.18);
      border-radius:36px;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 28px 90px rgba(0,0,0,.25);
    }
    .hero-panel:before{
      content:"";
      position:absolute;inset:16px;border-radius:28px;
      border:1px solid rgba(242,199,165,.10);
      pointer-events:none;
    }
    .breadcrumb a{color:#F2C7A5}
    .breadcrumb span{color:rgba(255,247,241,.66)}
    @media (max-width:1024px){
      .desktop-nav{display:none!important}
      .mobile-trigger{display:inline-flex}
      .site-container{width:min(100% - 28px,1180px)}
      .section{padding:72px 0}
      .page-hero{padding-top:118px}
    }
    @media (max-width:768px){
      .brand-mark{width:34px;height:34px;flex-basis:34px}
      .brand-text{max-width:210px}
      .nav-shell{border-radius:28px!important}
      .mobile-menu .nav-link{min-height:48px}
      .page-hero:after{bottom:-86px;height:120px}
      .section{padding:58px 0}
      .section-tight{padding:46px 0}
      .cover-abstract{min-height:150px}
    }
    @media (max-width:520px){
      .site-container{width:min(100% - 22px,1180px)}
      .btn{width:100%;padding:13px 18px}
      .mobile-trigger{width:auto!important}
      .brand-text{max-width:178px}
      summary{padding:18px}
      details p{padding:0 18px 18px}
    }