/* roulang page: index */
:root{
      --bg:#171519;
      --bg-soft:#211d22;
      --panel:#282128;
      --panel-deep:#201b20;
      --cream:#f4eee8;
      --muted:#b6aeb5;
      --faint:#817982;
      --line:rgba(244,238,232,.12);
      --rose:#c87386;
      --rose-dark:#9f5068;
      --coral:#e19a83;
      --lavender:#b9a5c8;
      --success:#9bc4ab;
      --warning:#e0b47e;
      --danger:#dc8585;
      --radius-lg:28px;
      --radius-md:18px;
      --radius-sm:12px;
      --shadow:0 22px 60px rgba(0,0,0,.22);
      --container:1180px;
      --ease:240ms ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--bg);color:var(--cream);
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      line-height:1.7;font-size:15px;
    }
    a{color:inherit;text-decoration:none}
    button,input{font:inherit}
    button{cursor:pointer}
    img{display:block;max-width:100%}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .site-header{
      position:sticky;top:0;z-index:50;background:rgba(23,21,25,.92);
      backdrop-filter:blur(16px);border-bottom:1px solid var(--line);
    }
    .brand-row{min-height:68px;display:flex;align-items:center;gap:22px}
    .brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
    .brand-mark{
      width:34px;height:34px;border-radius:11px;background:var(--rose);
      display:grid;place-items:center;color:#fff;box-shadow:0 8px 20px rgba(200,115,134,.25);
    }
    .brand-mark:after{content:"›";font-size:25px;line-height:1;transform:translateX(1px)}
    .brand-name{font-size:16px}
    .header-search{margin-left:auto;display:flex;align-items:center;gap:8px}
    .search-wrap{position:relative}
    .search-input{
      width:245px;height:40px;padding:0 40px 0 15px;border-radius:999px;
      border:1px solid var(--line);background:var(--panel-deep);color:var(--cream);outline:none;
      transition:var(--ease)
    }
    .search-input::placeholder{color:var(--faint)}
    .search-input:focus{border-color:var(--rose);box-shadow:0 0 0 4px rgba(200,115,134,.14)}
    .clear-search{
      position:absolute;right:11px;top:8px;border:0;background:none;color:var(--faint);
      width:25px;height:25px;border-radius:50%
    }
    .clear-search:hover{background:rgba(255,255,255,.08);color:var(--cream)}
    .search-button,.primary-button,.secondary-button{
      min-height:42px;border-radius:999px;padding:0 20px;border:1px solid transparent;
      transition:var(--ease);display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700
    }
    .search-button,.primary-button{background:var(--rose);color:#fff}
    .search-button:hover,.primary-button:hover{background:#d78598;transform:translateY(-2px);box-shadow:0 10px 24px rgba(200,115,134,.2)}
    .secondary-button{border-color:var(--line);color:var(--cream);background:rgba(255,255,255,.035)}
    .secondary-button:hover{border-color:var(--rose);background:rgba(200,115,134,.1)}
    button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid rgba(225,154,131,.75);outline-offset:3px}
    .channel-row{display:flex;align-items:center;gap:9px;min-height:47px;overflow-x:auto;scrollbar-width:none}
    .channel-row::-webkit-scrollbar{display:none}
    .channel-link{color:var(--muted);padding:7px 13px;border-radius:9px;white-space:nowrap;transition:var(--ease)}
    .channel-link:hover,.channel-link.active{color:var(--cream);background:rgba(200,115,134,.15)}
    .trend{margin-left:auto;color:var(--coral);white-space:nowrap;font-size:13px}
    .hero{padding:78px 0 62px;position:relative;overflow:hidden}
    .hero:before,.hero:after{content:"";position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none}
    .hero:before{width:430px;height:430px;right:-130px;top:-130px;background:rgba(159,80,104,.18)}
    .hero:after{width:250px;height:250px;left:-100px;bottom:-130px;background:rgba(185,165,200,.1)}
    .hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:58px;align-items:center;position:relative;z-index:1}
    .eyebrow,.section-kicker{color:var(--coral);font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
    .hero h1{font-size:clamp(40px,5.5vw,70px);line-height:1.12;letter-spacing:-.06em;margin:17px 0 23px;max-width:680px}
    .hero-copy{max-width:620px;color:var(--muted);font-size:17px;line-height:1.9}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:29px}
    .hero-points{display:flex;flex-wrap:wrap;gap:18px;margin-top:25px;color:var(--muted);font-size:13px}
    .hero-points span:before{content:"•";color:var(--rose);font-size:20px;vertical-align:-2px;margin-right:6px}
    .hero-board{display:grid;grid-template-columns:1.15fr .85fr;gap:13px;min-height:365px}
    .abstract-cover{border-radius:var(--radius-lg);background:linear-gradient(145deg,#49313f,#7d5264 48%,#302734);position:relative;overflow:hidden;min-height:365px;box-shadow:var(--shadow)}
    .abstract-cover:before{content:"";position:absolute;width:260px;height:260px;border:1px solid rgba(255,255,255,.2);border-radius:50%;right:-70px;top:40px}
    .abstract-cover:after{content:"";position:absolute;width:170px;height:170px;border-radius:45% 55% 55% 45%;background:rgba(244,238,232,.12);left:35px;bottom:45px;transform:rotate(-28deg)}
    .cover-label{position:absolute;left:24px;top:22px;color:#f8dedc;font-size:12px;letter-spacing:.12em}
    .cover-title{position:absolute;left:24px;bottom:25px;font-size:28px;font-weight:800;line-height:1.25;max-width:230px}
    .preview-stack{display:flex;flex-direction:column;gap:13px}
    .preview-card{flex:1;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-md);padding:18px;display:flex;flex-direction:column;justify-content:space-between;transition:var(--ease)}
    .preview-card:hover{transform:translateY(-3px);border-color:rgba(200,115,134,.55)}
    .preview-card strong{font-size:16px;line-height:1.45}
    .preview-card small{color:var(--faint)}
    .mini-line{height:5px;border-radius:99px;background:rgba(255,255,255,.1);margin-top:12px}
    .mini-line i{display:block;height:100%;border-radius:inherit;background:var(--coral);width:72%}
    .section{padding:74px 0}
    .section.alt{background:var(--bg-soft)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}
    .section h2{font-size:clamp(28px,3vw,42px);line-height:1.2;letter-spacing:-.04em;margin:8px 0 0}
    .section-intro{max-width:560px;color:var(--muted);margin:0;line-height:1.85}
    .feature-band{display:grid;grid-template-columns:1.3fr .9fr .9fr;gap:1px;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:var(--line)}
    .feature-item{background:var(--panel);padding:28px;min-height:205px;transition:var(--ease)}
    .feature-item:first-child{background:#32242c}
    .feature-item:hover{background:#372932}
    .feature-num{color:var(--coral);font-weight:800;font-size:13px}
    .feature-item h3{font-size:21px;margin:30px 0 8px}
    .feature-item p{color:var(--muted);margin:0;font-size:14px}
    .scene-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:stretch}
    .scene-panel{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-lg);padding:32px}
    .scene-panel h3{font-size:25px;margin:12px 0}
    .scene-panel p{color:var(--muted);margin:0 0 24px}
    .scene-steps{display:flex;flex-direction:column;gap:14px}
    .scene-step{display:flex;gap:13px;align-items:flex-start;padding:13px 0;border-top:1px solid var(--line)}
    .scene-step b{color:var(--coral);font-size:13px}
    .scene-step span{color:var(--muted)}
    .filter-demo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .demo-tile{min-height:128px;border-radius:var(--radius-md);padding:17px;background:#332931;position:relative;overflow:hidden}
    .demo-tile:nth-child(2){background:#302b3c}
    .demo-tile:nth-child(3){background:#3a2d2a}
    .demo-tile:nth-child(4){background:#292f35}
    .demo-tile:after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;right:-45px;bottom:-55px;background:rgba(255,255,255,.08)}
    .demo-tile strong{position:relative;z-index:1}
    .demo-tag{display:block;color:var(--muted);font-size:12px;margin-top:32px;position:relative;z-index:1}
    .proof-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
    .proof-main{border-radius:var(--radius-lg);background:#33262e;padding:32px;min-height:270px}
    .proof-main h3{font-size:28px;max-width:420px;line-height:1.35;margin:14px 0}
    .proof-main p{color:var(--muted);max-width:500px;margin:0}
    .proof-side{display:grid;gap:12px}
    .metric{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);padding:21px;display:flex;justify-content:space-between;align-items:center}
    .metric strong{font-size:28px;color:var(--coral)}
    .metric span{color:var(--muted);font-size:13px}
    .news-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}
    .news-list,.trend-box{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel);overflow:hidden}
    .news-item{padding:20px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;align-items:center;transition:var(--ease)}
    .news-item:last-child{border-bottom:0}
    .news-item:hover{background:#332932}
    .news-item h3{font-size:16px;margin:5px 0;line-height:1.45}
    .news-item p{color:var(--faint);font-size:13px;margin:0}
    .news-date{color:var(--faint);font-size:12px;white-space:nowrap}
    .trend-box{padding:25px}
    .trend-box h3{margin:0 0 15px;font-size:19px}
    .tag-list{display:flex;flex-wrap:wrap;gap:9px}
    .tag{display:inline-flex;align-items:center;padding:6px 10px;border-radius:8px;background:rgba(200,115,134,.12);color:#e2b5bd;font-size:12px}
    .pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;align-items:stretch}
    .price-card{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-lg);padding:28px;display:flex;flex-direction:column}
    .price-card.featured{background:#382731;border-color:rgba(225,154,131,.55);transform:translateY(-8px)}
    .price-card h3{font-size:21px;margin:14px 0 5px}
    .price-card p{color:var(--muted);font-size:13px;min-height:45px}
    .price{font-size:32px;font-weight:800;margin:18px 0}
    .price small{font-size:13px;color:var(--faint);font-weight:400}
    .benefits{list-style:none;padding:0;margin:0 0 25px;color:var(--muted);flex:1}
    .benefits li{padding:8px 0;border-bottom:1px solid var(--line)}
    .benefits li:before{content:"✓";color:var(--success);margin-right:8px}
    .form-box{display:grid;grid-template-columns:1fr .9fr;gap:35px;border-radius:var(--radius-lg);background:#30252d;padding:38px}
    .form-box h2{font-size:32px;line-height:1.25;margin:10px 0 12px}
    .form-box p{color:var(--muted);margin:0;max-width:520px}
    .lead-form{display:grid;gap:12px}
    .lead-form label{font-size:13px;color:var(--muted)}
    .lead-form input,.lead-form textarea{width:100%;border:1px solid var(--line);background:var(--panel-deep);color:var(--cream);border-radius:12px;padding:12px 14px;outline:none}
    .lead-form textarea{min-height:88px;resize:vertical}
    .lead-form input:focus,.lead-form textarea:focus{border-color:var(--rose);box-shadow:0 0 0 4px rgba(200,115,134,.13)}
    .form-note{color:var(--faint);font-size:12px;line-height:1.7}
    .faq-list{max-width:850px;margin:0 auto;border-top:1px solid var(--line)}
    .faq-item{border-bottom:1px solid var(--line)}
    .faq-question{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;background:none;border:0;color:var(--cream);padding:21px 0;font-weight:700}
    .faq-question span:last-child{color:var(--coral);font-size:22px;transition:var(--ease)}
    .faq-answer{max-height:0;overflow:hidden;color:var(--muted);transition:max-height 280ms ease,padding 280ms ease}
    .faq-item.open .faq-answer{max-height:140px;padding:0 35px 20px 0}
    .faq-item.open .faq-question span:last-child{transform:rotate(45deg)}
    .cta{padding:25px 0 78px}
    .cta-inner{border-radius:var(--radius-lg);padding:38px 42px;background:linear-gradient(110deg,#633b4d,#3b2935);display:flex;justify-content:space-between;align-items:center;gap:25px}
    .cta-inner h2{font-size:29px;margin:0 0 8px}
    .cta-inner p{margin:0;color:#dbcbd0}
    .site-footer{border-top:1px solid var(--line);padding:42px 0 22px;background:#131114}
    .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
    .footer-title{font-weight:800;margin-bottom:15px}
    .footer-copy,.footer-link{color:var(--faint);font-size:13px}
    .footer-links{display:grid;gap:8px}
    .footer-link:hover{color:var(--coral)}
    .copyright{border-top:1px solid var(--line);margin-top:35px;padding-top:18px;color:var(--faint);font-size:12px;display:flex;justify-content:space-between;gap:15px}
    .age-note{display:inline-flex;gap:7px;align-items:center;color:#e2b8a4;font-size:12px}
    .status-message{display:none;margin-top:10px;color:var(--warning);font-size:13px}
    @media(max-width:900px){
      .hero-grid,.scene-grid,.proof-layout,.news-layout,.form-box{grid-template-columns:1fr}
      .hero{padding-top:55px}.hero-board{max-width:680px}
      .feature-band{grid-template-columns:1fr}
      .feature-item{min-height:0}
      .pricing{grid-template-columns:1fr}
      .price-card.featured{transform:none}
      .footer-grid{grid-template-columns:repeat(2,1fr)}
      .trend{display:none}
    }
    @media(max-width:620px){
      .container{width:min(var(--container),calc(100% - 28px))}
      .brand-row{gap:10px}.brand-name{font-size:14px}
      .header-search{margin-left:auto}.search-input{width:38px;padding-left:12px;padding-right:12px;color:transparent}
      .search-input::placeholder{color:transparent}.search-button{width:40px;padding:0;font-size:0}
      .search-button:after{content:"⌕";font-size:19px}
      .hero h1{font-size:40px}.hero-copy{font-size:15px}
      .hero-board{grid-template-columns:1fr;min-height:0}.abstract-cover{min-height:270px}.preview-stack{display:grid;grid-template-columns:1fr 1fr}
      .preview-card{min-height:145px;padding:15px}.preview-card strong{font-size:14px}
      .section{padding:55px 0}.section-head{display:block}.section-intro{margin-top:13px}
      .filter-demo{grid-template-columns:1fr 1fr}.scene-panel,.proof-main,.form-box{padding:24px}
      .news-item{padding:17px 18px}.news-date{display:none}
      .cta-inner{display:block;padding:29px 24px}.cta-inner .primary-button{margin-top:20px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:24px}.copyright{display:block}.copyright .age-note{margin-top:8px}
    }

/* roulang page: category1 */
:root{
 --bg:#171519;--bg-soft:#211d22;--panel:#282128;--panel-deep:#201b20;
 --cream:#f4eee8;--muted:#b6aeb5;--faint:#817982;--line:rgba(244,238,232,.12);
 --rose:#c87386;--rose-dark:#9f5068;--coral:#e19a83;--lavender:#b9a5c8;
 --success:#9bc4ab;--warning:#e0b47e;--danger:#dc8585;
 --radius-lg:28px;--radius-md:18px;--radius-sm:12px;
 --shadow:0 22px 60px rgba(0,0,0,.22);--container:1180px;--ease:240ms ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--cream);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.7}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
.container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{position:sticky;top:0;z-index:50;background:rgba(23,21,25,.93);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.brand-row{min-height:68px;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
.brand-mark{width:34px;height:34px;border-radius:11px;background:var(--rose);display:grid;place-items:center;color:#fff;box-shadow:0 8px 20px rgba(200,115,134,.25)}
.brand-mark:after{content:"›";font-size:25px;line-height:1;transform:translateX(1px)}
.brand-name{font-size:16px}
.header-search{margin-left:auto;display:flex;align-items:center;gap:8px}
.search-wrap{position:relative}
.search-input{width:245px;height:40px;padding:0 40px 0 15px;border-radius:999px;border:1px solid var(--line);background:var(--panel-deep);color:var(--cream);outline:none;transition:var(--ease)}
.search-input::placeholder{color:var(--faint)}
.search-input:focus{border-color:var(--rose);box-shadow:0 0 0 4px rgba(200,115,134,.14)}
.clear-search{position:absolute;right:8px;top:7px;border:0;background:none;color:var(--faint);width:27px;height:27px;border-radius:50%;font-size:20px;line-height:1}
.clear-search:hover{background:rgba(255,255,255,.08);color:var(--cream)}
.search-button,.primary-button,.secondary-button,.ghost-button{min-height:42px;border-radius:999px;padding:0 20px;border:1px solid transparent;transition:var(--ease);display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700}
.search-button,.primary-button{background:var(--rose);color:#fff}
.search-button:hover,.primary-button:hover{background:#d78598;transform:translateY(-2px);box-shadow:0 10px 24px rgba(200,115,134,.2)}
.secondary-button,.ghost-button{border-color:var(--line);color:var(--cream);background:rgba(255,255,255,.035)}
.secondary-button:hover,.ghost-button:hover{border-color:var(--rose);background:rgba(200,115,134,.1)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(225,154,131,.75);outline-offset:3px}
.channel-row{display:flex;align-items:center;gap:9px;min-height:47px;overflow-x:auto;scrollbar-width:none}
.channel-row::-webkit-scrollbar{display:none}
.channel-link{flex:none;position:relative;padding:7px 11px;border-radius:999px;color:var(--muted);font-weight:700;font-size:14px;transition:var(--ease)}
.channel-link:hover{color:var(--cream);background:rgba(255,255,255,.06)}
.channel-link.active{color:#fff;background:rgba(200,115,134,.18)}
.channel-link.active:after{content:"";position:absolute;bottom:-9px;left:18px;right:18px;height:2px;background:var(--coral);border-radius:999px}
.trend{margin-left:auto;white-space:nowrap;color:var(--faint);font-size:12px}
.status-message{min-height:0;color:var(--coral);font-size:13px;padding-bottom:0}
.breadcrumb{padding:25px 0 12px;color:var(--faint);font-size:13px}
.breadcrumb a:hover{color:var(--coral)}
.category-hero{padding:27px 0 42px}
.category-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:stretch}
.category-copy{padding:28px 0}
.kicker{color:var(--coral);font-size:12px;letter-spacing:.15em;font-weight:800}
h1{font-size:clamp(38px,5vw,62px);line-height:1.12;letter-spacing:-.06em;margin:13px 0 19px}
.category-copy p{max-width:640px;color:var(--muted);font-size:16px;margin:0}
.meta-line{display:flex;flex-wrap:wrap;gap:10px 20px;color:var(--faint);font-size:13px;margin-top:22px}
.meta-line span:before{content:"•";color:var(--rose);margin-right:7px}
.featured-panel{position:relative;overflow:hidden;min-height:298px;border-radius:var(--radius-lg);padding:26px;background:linear-gradient(145deg,#49313d 0%,#2d252c 52%,#211d22 100%);border:1px solid rgba(244,238,232,.15);box-shadow:var(--shadow)}
.featured-panel:before{content:"";position:absolute;width:260px;height:260px;right:-62px;top:-80px;border:34px solid rgba(225,154,131,.14);border-radius:50%}
.featured-panel:after{content:"";position:absolute;width:150px;height:150px;left:46%;bottom:-80px;background:rgba(185,165,200,.14);border-radius:50%;filter:blur(8px)}
.panel-content{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:space-between}
.badge{display:inline-flex;align-items:center;gap:6px;width:max-content;padding:4px 10px;border-radius:999px;background:rgba(244,238,232,.1);color:var(--cream);font-size:12px;font-weight:700}
.badge.hot{background:rgba(225,154,131,.18);color:#ffd7ca}
.featured-panel h2{font-size:30px;line-height:1.28;letter-spacing:-.04em;max-width:360px;margin:14px 0 8px}
.featured-panel p{color:#d2c8cf;max-width:390px;margin:0;font-size:14px}
.panel-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:22px;color:var(--muted);font-size:13px}
.section{padding:68px 0}
.section.alt{background:var(--bg-soft)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:22px;margin-bottom:25px}
.section-head h2{font-size:clamp(28px,3vw,40px);line-height:1.2;letter-spacing:-.04em;margin:7px 0 0}
.section-intro{max-width:480px;margin:0;color:var(--muted)}
.filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px;border:1px solid var(--line);background:var(--panel-deep);border-radius:var(--radius-md);margin-bottom:22px}
.filter-label{font-size:13px;color:var(--faint);font-weight:700;margin:0 3px}
.filter-chip{border:1px solid transparent;border-radius:999px;background:rgba(255,255,255,.045);color:var(--muted);padding:8px 13px;font-size:13px;transition:var(--ease)}
.filter-chip:hover,.filter-chip.active{color:var(--cream);border-color:rgba(200,115,134,.45);background:rgba(200,115,134,.14)}
.sort-select{margin-left:auto;min-height:37px;border:1px solid var(--line);border-radius:999px;padding:0 28px 0 13px;background:var(--panel);color:var(--cream);outline:none}
.content-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(285px,.75fr);gap:24px}
.list-stack{display:grid;gap:15px}
.content-card{display:grid;grid-template-columns:210px 1fr;gap:20px;padding:14px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--panel);transition:var(--ease)}
.content-card:hover{transform:translateY(-3px);border-color:rgba(200,115,134,.55);box-shadow:0 16px 35px rgba(0,0,0,.16)}
.cover{position:relative;min-height:146px;border-radius:12px;overflow:hidden;background:#3a2d35}
.cover:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 28%,rgba(225,154,131,.55),transparent 27%),linear-gradient(135deg,#7d475b,#312731 56%,#202026)}
.cover.c2:before{background:radial-gradient(circle at 26% 20%,rgba(185,165,200,.55),transparent 30%),linear-gradient(135deg,#4d405d,#29242f 62%,#201d23)}
.cover.c3:before{background:radial-gradient(circle at 76% 72%,rgba(225,154,131,.48),transparent 26%),linear-gradient(135deg,#62464b,#342932 55%,#211f24)}
.cover.c4:before{background:radial-gradient(circle at 25% 38%,rgba(155,196,171,.3),transparent 28%),linear-gradient(135deg,#3a4a48,#29272d 58%,#211e23)}
.cover-grid{position:absolute;inset:19px;background:repeating-linear-gradient(90deg,rgba(244,238,232,.18) 0 1px,transparent 1px 44px),repeating-linear-gradient(0deg,rgba(244,238,232,.12) 0 1px,transparent 1px 36px);opacity:.65}
.play-dot{position:absolute;left:16px;bottom:15px;width:39px;height:39px;border-radius:50%;background:rgba(244,238,232,.9);color:#503441;display:grid;place-items:center;font-size:15px;font-weight:900}
.card-body{min-width:0;padding:3px 4px 3px 0;display:flex;flex-direction:column}
.card-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.time{font-size:12px;color:var(--faint);white-space:nowrap}
.content-card h3{font-size:19px;line-height:1.4;letter-spacing:-.025em;margin:10px 0 7px}
.content-card p{color:var(--muted);font-size:14px;line-height:1.65;margin:0}
.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:12px}
.card-meta{color:var(--faint);font-size:12px}
.text-link{font-size:13px;color:var(--coral);font-weight:800}
.text-link:hover{color:#ffd1c2}
.sidebar{display:grid;gap:16px;align-content:start}
.side-box{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--panel);padding:20px}
.side-title{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:17px;font-weight:800;margin-bottom:14px}
.rank-list{list-style:none;margin:0;padding:0}
.rank-list li{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.rank-list li:last-child{border-bottom:0;padding-bottom:0}
.rank-num{color:var(--coral);font-size:17px;font-weight:800}
.rank-list a{font-size:14px;line-height:1.45;transition:var(--ease)}
.rank-list a:hover{color:var(--coral)}
.rank-state{font-size:11px;color:var(--faint)}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px}
.tag{padding:6px 10px;border-radius:999px;background:rgba(244,238,232,.06);color:var(--muted);font-size:12px;border:1px solid transparent;transition:var(--ease)}
.tag:hover{background:rgba(200,115,134,.15);border-color:rgba(200,115,134,.38);color:var(--cream)}
.notice{padding:15px;border-radius:var(--radius-sm);background:rgba(225,180,126,.09);border:1px solid rgba(225,180,126,.22);color:#d9c6a9;font-size:13px}
.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:30px}
.page-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--muted);transition:var(--ease)}
.page-btn:hover,.page-btn.active{background:var(--rose);color:#fff;border-color:var(--rose)}
.scene-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:20px}
.scene-main{padding:31px;border-radius:var(--radius-lg);background:#33262e;border:1px solid var(--line)}
.scene-main h2{font-size:32px;line-height:1.3;margin:10px 0 15px;letter-spacing:-.04em}
.scene-main p{color:var(--muted);margin:0}
.scene-points{display:grid;gap:13px;margin-top:24px}
.scene-point{display:flex;gap:12px;align-items:flex-start;color:var(--muted)}
.scene-icon{flex:none;width:29px;height:29px;border-radius:9px;background:rgba(200,115,134,.17);display:grid;place-items:center;color:var(--coral);font-size:13px}
.scene-list{display:grid;gap:12px}
.scene-item{display:flex;gap:17px;align-items:center;padding:18px 20px;border-radius:var(--radius-md);border:1px solid var(--line);background:var(--panel)}
.scene-index{font-size:27px;font-weight:800;color:rgba(225,154,131,.65)}
.scene-item h3{font-size:17px;margin:0 0 3px}
.scene-item p{font-size:13px;color:var(--muted);margin:0}
.faq-list{display:grid;gap:10px}
.faq-item{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-md);overflow:hidden}
.faq-question{width:100%;border:0;background:transparent;color:var(--cream);padding:18px 20px;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:16px;font-weight:800}
.faq-question span:last-child{font-size:22px;color:var(--coral);transition:var(--ease)}
.faq-answer{display:none;padding:0 20px 19px;color:var(--muted);font-size:14px}
.faq-item.open{border-color:rgba(200,115,134,.48)}
.faq-item.open .faq-answer{display:block}
.faq-item.open .faq-question span:last-child{transform:rotate(45deg)}
.cta{padding:68px 0}
.cta-box{position:relative;overflow:hidden;padding:39px;border-radius:var(--radius-lg);background:#3a2933;border:1px solid rgba(244,238,232,.14)}
.cta-box:after{content:"";position:absolute;width:260px;height:260px;right:-80px;bottom:-120px;border-radius:50%;background:rgba(225,154,131,.16)}
.cta-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:25px}
.cta h2{font-size:clamp(27px,3vw,39px);line-height:1.25;letter-spacing:-.04em;margin:0 0 10px}
.cta p{margin:0;color:var(--muted);max-width:620px}
.cta-actions{display:flex;gap:10px;flex-wrap:wrap;flex:none}
.site-footer{border-top:1px solid var(--line);background:#121114;padding:54px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:30px}
.footer-copy{color:var(--muted);max-width:290px;font-size:14px}
.footer-title{font-size:14px;font-weight:800;margin-bottom:13px}
.footer-links{display:grid;gap:8px}
.footer-link{color:var(--muted);font-size:14px;transition:var(--ease)}
.footer-link:hover{color:var(--coral);transform:translateX(2px)}
.copyright{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:42px;padding-top:22px;border-top:1px solid var(--line);font-size:12px;color:var(--faint)}
.age-note{color:#b99983}
.empty-state{display:none;margin-top:18px;border:1px dashed var(--line);border-radius:var(--radius-md);padding:30px;text-align:center;color:var(--muted);background:rgba(255,255,255,.02)}
@media(max-width:1024px){
 .category-grid,.content-layout,.scene-wrap{grid-template-columns:1fr}
 .sidebar{grid-template-columns:repeat(3,1fr)}
 .sidebar .notice{grid-column:1/-1}
 .trend{display:none}
}
@media(max-width:768px){
 .container{width:min(var(--container),calc(100% - 28px))}
 .brand-row{min-height:62px;gap:10px}
 .brand-name{font-size:14px}
 .header-search{margin-left:auto}
 .search-input{width:145px}
 .search-button{padding:0 13px}
 .channel-row{min-height:45px}
 .category-hero{padding:20px 0 31px}
 .category-copy{padding:10px 0}
 .content-card{grid-template-columns:145px 1fr;gap:14px}
 .cover{min-height:128px}
 .sidebar{grid-template-columns:1fr}
 .section{padding:53px 0}
 .section-head,.cta-inner{align-items:flex-start;flex-direction:column}
 .sort-select{margin-left:0}
 .footer-grid{grid-template-columns:1fr 1fr;gap:27px}
}
@media(max-width:520px){
 body{font-size:14px}
 .header-search{gap:4px}
 .search-input{width:118px;height:38px;padding-left:12px}
 .clear-search{display:none}
 .search-button{min-height:38px;font-size:13px}
 .channel-link{padding:6px 9px;font-size:13px}
 h1{font-size:37px}
 .featured-panel{min-height:260px;padding:21px}
 .featured-panel h2{font-size:25px}
 .filter-bar{gap:8px}
 .filter-chip{padding:7px 10px}
 .content-card{grid-template-columns:1fr;padding:12px}
 .cover{min-height:165px}
 .card-body{padding:4px}
 .card-bottom{padding-top:10px}
 .scene-main{padding:24px}
 .scene-main h2{font-size:27px}
 .scene-item{padding:15px}
 .cta-box{padding:27px 22px}
 .footer-grid{grid-template-columns:1fr}
 .copyright{margin-top:30px}
}

/* roulang page: category2 */
:root{
  --bg:#171519;--bg-soft:#211d22;--panel:#282128;--panel-deep:#201b20;
  --cream:#f4eee8;--muted:#b6aeb5;--faint:#817982;--line:rgba(244,238,232,.12);
  --rose:#c87386;--rose-dark:#9f5068;--coral:#e19a83;--lavender:#b9a5c8;
  --success:#9bc4ab;--warning:#e0b47e;--danger:#dc8585;
  --radius-lg:28px;--radius-md:18px;--radius-sm:12px;
  --shadow:0 22px 60px rgba(0,0,0,.22);--container:1180px;--ease:240ms ease;
 }
 *{box-sizing:border-box}
 html{scroll-behavior:smooth}
 body{margin:0;background:var(--bg);color:var(--cream);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;line-height:1.7;font-size:15px}
 a{color:inherit;text-decoration:none}
 button,input,select{font:inherit}
 button{cursor:pointer}
 img{display:block;max-width:100%}
 .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
 .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 .site-header{position:sticky;top:0;z-index:50;background:rgba(23,21,25,.94);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
 .brand-row{min-height:68px;display:flex;align-items:center;gap:22px}
 .brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
 .brand-mark{width:34px;height:34px;border-radius:11px;background:var(--rose);display:grid;place-items:center;color:#fff;box-shadow:0 8px 20px rgba(200,115,134,.25)}
 .brand-mark:after{content:"›";font-size:25px;line-height:1;transform:translateX(1px)}
 .brand-name{font-size:16px}
 .header-search{margin-left:auto;display:flex;align-items:center;gap:8px}
 .search-wrap{position:relative}
 .search-input{width:245px;height:40px;padding:0 40px 0 15px;border-radius:999px;border:1px solid var(--line);background:var(--panel-deep);color:var(--cream);outline:none;transition:var(--ease)}
 .search-input::placeholder{color:var(--faint)}
 .search-input:focus{border-color:var(--rose);box-shadow:0 0 0 4px rgba(200,115,134,.14)}
 .clear-search{position:absolute;right:11px;top:8px;border:0;background:none;color:var(--faint);width:25px;height:25px;border-radius:50%}
 .clear-search:hover{background:rgba(255,255,255,.08);color:var(--cream)}
 .search-button,.primary-button,.secondary-button{min-height:42px;border-radius:999px;padding:0 20px;border:1px solid transparent;transition:var(--ease);display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700}
 .search-button,.primary-button{background:var(--rose);color:#fff}
 .search-button:hover,.primary-button:hover{background:#d78598;transform:translateY(-2px);box-shadow:0 10px 24px rgba(200,115,134,.2)}
 .secondary-button{border-color:var(--line);color:var(--cream);background:rgba(255,255,255,.035)}
 .secondary-button:hover{border-color:var(--rose);background:rgba(200,115,134,.1)}
 button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(225,154,131,.75);outline-offset:3px}
 .channel-row{display:flex;align-items:center;gap:9px;min-height:47px;overflow-x:auto;scrollbar-width:none}
 .channel-row::-webkit-scrollbar{display:none}
 .channel-link{padding:7px 14px;color:var(--muted);border-radius:999px;white-space:nowrap;transition:var(--ease)}
 .channel-link:hover{color:var(--cream);background:rgba(255,255,255,.06)}
 .channel-link.active{color:#fff;background:rgba(200,115,134,.18);box-shadow:inset 0 -2px var(--rose)}
 .trend{margin-left:auto;color:var(--faint);font-size:12px;white-space:nowrap}
 .status-message{min-height:0;color:var(--coral);font-size:13px;padding-bottom:4px}
 .page-hero{padding:58px 0 38px;background:radial-gradient(circle at 85% 20%,rgba(159,80,104,.19),transparent 32%),var(--bg)}
 .crumbs{color:var(--faint);font-size:13px;margin-bottom:22px}
 .crumbs a:hover{color:var(--cream)}
 .hero-layout{display:grid;grid-template-columns:1fr 360px;gap:48px;align-items:end}
 .section-kicker{color:var(--coral);font-size:12px;font-weight:800;letter-spacing:.16em}
 h1{font-size:clamp(36px,5vw,64px);line-height:1.13;letter-spacing:-.055em;margin:15px 0 18px}
 .hero-copy{max-width:700px;color:var(--muted);font-size:17px;line-height:1.9;margin:0}
 .hero-note{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-md);padding:22px;box-shadow:var(--shadow)}
 .hero-note strong{display:block;font-size:20px;margin:9px 0 5px}
 .hero-note p{color:var(--muted);font-size:13px;margin:0}
 .note-icon{width:40px;height:40px;border-radius:13px;background:rgba(225,154,131,.15);display:grid;place-items:center;color:var(--coral);font-weight:800}
 .section{padding:64px 0}
 .section.alt{background:var(--bg-soft)}
 .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:26px}
 .section h2{font-size:clamp(27px,3vw,40px);line-height:1.2;letter-spacing:-.04em;margin:8px 0 0}
 .section-intro{max-width:550px;color:var(--muted);margin:0;line-height:1.85}
 .filter-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:15px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-md);margin-bottom:24px}
 .filter-bar label{color:var(--faint);font-size:13px}
 .filter-select{background:var(--panel-deep);border:1px solid var(--line);border-radius:10px;color:var(--cream);padding:9px 12px;min-width:130px}
 .tag{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;background:rgba(200,115,134,.13);color:#e6b0bb;font-size:12px}
 .tag.soft{background:rgba(185,165,200,.12);color:var(--lavender)}
 .content-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px}
 .update-list,.trend-box,.feedback-box{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel);overflow:hidden}
 .update-item{display:grid;grid-template-columns:118px 1fr auto;gap:18px;align-items:center;padding:18px 22px;border-bottom:1px solid var(--line);transition:var(--ease)}
 .update-item:last-child{border-bottom:0}
 .update-item:hover{background:#312730}
 .abstract-cover{height:83px;border-radius:13px;position:relative;overflow:hidden;background:linear-gradient(135deg,#4b2c3d,#a56b7d 58%,#d9a28f)}
 .abstract-cover:before{content:"";position:absolute;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.12);right:-28px;top:-38px}
 .abstract-cover:after{content:"";position:absolute;width:70px;height:70px;border:1px solid rgba(255,255,255,.22);border-radius:18px;left:20px;bottom:-25px;transform:rotate(25deg)}
 .cover-b{background:linear-gradient(135deg,#2b273b,#756287 60%,#c4a5b3)}
 .cover-c{background:linear-gradient(135deg,#3b2b27,#a86e59 60%,#e2b38c)}
 .cover-d{background:linear-gradient(135deg,#272d35,#667b83 58%,#b9c5bd)}
 .item-copy h3{font-size:17px;margin:7px 0 4px;line-height:1.4}
 .item-copy h3 a:hover{color:var(--coral)}
 .item-copy p{color:var(--muted);font-size:13px;margin:0}
 .meta{color:var(--faint);font-size:12px;display:flex;gap:12px;flex-wrap:wrap}
 .item-action{color:var(--coral);font-size:13px;font-weight:700;white-space:nowrap}
 .item-action:hover{color:#f0b2a0}
 .side-title{padding:20px 22px 14px;font-size:18px;font-weight:800;border-bottom:1px solid var(--line)}
 .rank-item{display:flex;gap:14px;padding:15px 20px;border-bottom:1px solid var(--line);align-items:flex-start}
 .rank-item:last-child{border-bottom:0}
 .rank-num{width:25px;height:25px;border-radius:8px;background:rgba(225,154,131,.14);color:var(--coral);display:grid;place-items:center;font-weight:800;font-size:12px}
 .rank-item strong{font-size:14px;display:block;line-height:1.45}
 .rank-item small{color:var(--faint);font-size:12px}
 .side-tags{padding:20px;display:flex;flex-wrap:wrap;gap:8px}
 .pagination{display:flex;justify-content:center;gap:8px;margin-top:26px}
 .page-btn{width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:var(--panel);color:var(--muted);transition:var(--ease)}
 .page-btn:hover,.page-btn.current{background:var(--rose);border-color:var(--rose);color:#fff}
 .notice-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
 .feedback-box{padding:27px}
 .feedback-box h3{font-size:23px;margin:0 0 8px}
 .feedback-box p{color:var(--muted);margin:0 0 20px}
 .feedback-form{display:flex;gap:9px}
 .text-input{min-width:0;flex:1;background:var(--panel-deep);color:var(--cream);border:1px solid var(--line);border-radius:999px;padding:0 16px;height:44px}
 .text-input:focus{border-color:var(--rose);outline:none;box-shadow:0 0 0 4px rgba(200,115,134,.14)}
 .privacy-box{border-radius:var(--radius-lg);padding:27px;background:#33262e;border:1px solid rgba(225,154,131,.16)}
 .privacy-box h3{margin:0 0 8px;font-size:20px}
 .privacy-box p{color:var(--muted);margin:0;font-size:14px}
 .faq-list{border-top:1px solid var(--line)}
 .faq-item{border-bottom:1px solid var(--line)}
 .faq-question{width:100%;border:0;background:none;color:var(--cream);display:flex;justify-content:space-between;text-align:left;padding:20px 0;font-weight:700}
 .faq-question span:last-child{color:var(--coral);font-size:22px;transition:var(--ease)}
 .faq-answer{max-height:0;overflow:hidden;color:var(--muted);transition:max-height 280ms ease,padding 280ms ease}
 .faq-item.open .faq-answer{max-height:100px;padding:0 35px 20px 0}
 .faq-item.open .faq-question span:last-child{transform:rotate(45deg)}
 .cta{padding:36px;border-radius:var(--radius-lg);background:linear-gradient(105deg,#512f3d,#35252e 62%,#29212a);display:flex;justify-content:space-between;align-items:center;gap:25px}
 .cta h2{font-size:28px;margin:0 0 6px}
 .cta p{color:#d0bdc2;margin:0}
 .cta-actions{display:flex;gap:10px;flex-wrap:wrap}
 .site-footer{background:#121114;border-top:1px solid var(--line);padding:48px 0 22px}
 .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:30px}
 .footer-copy{color:var(--muted);font-size:13px;max-width:270px}
 .footer-title{font-weight:800;margin-bottom:13px}
 .footer-links{display:grid;gap:8px}
 .footer-link{color:var(--muted);font-size:13px;transition:var(--ease)}
 .footer-link:hover{color:var(--coral);transform:translateX(2px)}
 .copyright{border-top:1px solid var(--line);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;color:var(--faint);font-size:12px}
 .age-note{color:var(--warning)}
 .empty-state{display:none;padding:45px 25px;text-align:center;color:var(--muted)}
 @media(max-width:900px){.hero-layout,.content-layout,.notice-grid{grid-template-columns:1fr}.hero-note{max-width:500px}.trend{display:none}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}}
 @media(max-width:680px){
  .container{width:min(100% - 28px,var(--container))}
  .brand-row{min-height:62px;gap:10px}.brand-name{font-size:14px}.header-search{gap:5px}.search-input{width:145px;height:38px}.search-button{padding:0 14px;font-size:13px}
  .channel-row{min-height:44px}.channel-link{padding:6px 10px;font-size:13px}
  .page-hero{padding:42px 0 28px}h1{font-size:39px}.hero-copy{font-size:15px}
  .section{padding:48px 0}.section-head{display:block}.section-intro{margin-top:12px}
  .update-item{grid-template-columns:78px 1fr;gap:12px;padding:14px}.abstract-cover{height:70px}.item-action{grid-column:2}
  .filter-bar{align-items:stretch}.filter-select{flex:1;min-width:110px}
  .cta{padding:25px;display:block}.cta-actions{margin-top:20px}.footer-grid{grid-template-columns:1fr 1fr;gap:25px}.copyright{display:block}.copyright .age-note{display:block;margin-top:8px}
  . grid-template-columns:1fr 1fr;gap:25px}.copyright{display:block}.copyright .age-note{display:block;margin-top:8px}
 }
 @media(max-width:480px){
  .brand-row{flex-wrap:wrap;padding:10px 0}.header-search{order:3;width:100%;margin:0}.search-wrap{flex:1}.search-input{width:100%}.search-button{min-width:68px}
  .hero-note{padding:18px}.notice-grid{gap:12px}.feedback-form{display:block}.feedback-form .primary-button{width:100%;margin-top:10px}
  .footer-grid{grid-template-columns:1fr}.section h2{font-size:30px}.cta h2{font-size:24px}
 }