/* roulang page: index */
:root{--ink:#26221f;--muted:#77716c;--paper:#fffaf2;--surface:#fff;--line:#ece4db;--mango:#ffc943;--orange:#f58c39;--berry:#723b79;--plum:#3c243f;--soft:#fff0cf;--green:#397b60;--shadow:0 16px 42px rgba(83,53,35,.09);--radius:24px;--small-radius:16px;--max:1220px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC",system-ui,sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}button{font:inherit}img{max-width:100%;display:block}.container{width:min(var(--max),calc(100% - 48px));margin-inline:auto}.skip-link{position:absolute;top:-50px;left:16px;background:#fff;padding:10px 16px;z-index:99}.skip-link:focus{top:10px}
.site-header{height:76px;position:sticky;top:0;z-index:30;background:rgba(255,250,242,.96);border-bottom:1px solid rgba(90,67,49,.1);backdrop-filter:blur(12px)}.nav-wrap{height:100%;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:11px;white-space:nowrap;font-weight:850;font-size:17px}.brand-mark{width:39px;height:39px;border-radius:13px;background:linear-gradient(135deg,var(--mango),var(--orange) 50%,var(--berry));display:grid;place-items:center;color:#fff;font-size:16px;box-shadow:0 7px 18px rgba(192,112,60,.22)}.brand-mark span{transform:translateX(1px)}.nav-links{display:flex;align-items:center;gap:23px;margin-left:auto}.nav-links a{font-size:13px;color:#5e5752;transition:color .2s}.nav-links a:hover,.nav-links a.active{color:var(--berry)}.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:12px 20px;background:linear-gradient(110deg,var(--mango),#ffad43);color:#33241a;font-weight:800;font-size:14px;box-shadow:0 8px 18px rgba(226,152,53,.2);transition:transform .2s,box-shadow .2s,filter .2s}.nav-cta:hover,.button:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(226,152,53,.28);filter:saturate(1.08)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #8b55a0;outline-offset:3px}.menu-toggle{display:none;margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:12px;width:44px;height:42px;font-size:21px;color:var(--plum)}
.hero{padding:46px 0 30px}.hero-stage{min-height:440px;border-radius:32px;overflow:hidden;position:relative;background:linear-gradient(112deg,#ffdc71 0%,#f7a44e 47%,#7b477b 100%);padding:58px;display:flex;align-items:center}.hero-stage:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 80% 10%,rgba(255,255,255,.36),transparent 31%),linear-gradient(90deg,rgba(47,26,39,.06),transparent 65%)}.hero-copy{position:relative;z-index:2;max-width:630px}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:0;color:#4d3541;font-weight:800;background:rgba(255,255,255,.5);padding:7px 12px;border-radius:999px}.eyebrow:before{content:"";width:7px;height:7px;background:#723b79;border-radius:50%}.hero h1{font-size:clamp(38px,5vw,62px);line-height:1.14;margin:18px 0 12px;letter-spacing:0;max-width:590px}.hero h1 em{font-style:normal;color:#fff9e8;text-shadow:0 2px 12px rgba(87,49,66,.16)}.hero-lead{font-size:19px;font-weight:750;margin:0 0 12px}.hero-desc{font-size:14px;line-height:1.9;color:#463a3a;max-width:570px;margin:0 0 24px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.button-secondary{background:rgba(255,255,255,.82);box-shadow:none;color:var(--plum)}.hero-art{position:absolute;right:6%;top:50%;transform:translateY(-50%);width:390px;height:345px}.hero-poster{position:absolute;width:174px;aspect-ratio:2/3;border-radius:18px;box-shadow:0 22px 45px rgba(46,28,42,.26);overflow:hidden;border:3px solid rgba(255,255,255,.65)}.hero-poster:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(30,20,31,.8))}.hero-poster strong{position:absolute;z-index:1;bottom:17px;left:15px;color:#fff;font-size:18px}.hero-poster.one{left:8px;top:50px;transform:rotate(-9deg);background:linear-gradient(155deg,#e6c078 0%,#987159 42%,#343c4c 100%)}.hero-poster.two{left:122px;top:4px;transform:rotate(3deg);background:linear-gradient(145deg,#f9a75f,#bd5372 48%,#392c62)}.hero-poster.three{right:0;top:80px;transform:rotate(9deg);background:linear-gradient(155deg,#7cc6c4,#41728d 50%,#283e54)}.hero-stamp{position:absolute;right:10px;bottom:24px;background:#fff9e9;color:var(--plum);font-weight:850;padding:11px 15px;border-radius:14px;box-shadow:var(--shadow);font-size:13px}.hero-foot{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.pill{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid rgba(89,58,63,.14);border-radius:999px;background:rgba(255,255,255,.64);font-size:12px;color:#574a4a;font-weight:700}
section{padding:43px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:23px}.section-kicker{font-size:11px;text-transform:uppercase;color:var(--berry);font-weight:850;letter-spacing:1px}.section-head h2{font-size:29px;line-height:1.25;margin:5px 0 0;letter-spacing:0}.section-head p{max-width:580px;color:var(--muted);font-size:13px;margin:0}.text-link{color:var(--berry);font-size:13px;font-weight:800;white-space:nowrap}.text-link:hover{text-decoration:underline;text-underline-offset:4px}
.benefits{padding-top:16px}.benefit-row{display:grid;grid-template-columns:1.08fr 1fr 1.12fr;gap:15px;align-items:stretch}.benefit{min-height:146px;border-radius:20px;padding:22px;position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 8px 25px rgba(83,53,35,.04)}.benefit:nth-child(2){transform:translateY(13px);background:#fff0d2}.benefit:nth-child(3){background:#f0e6f1}.benefit-number{font-size:11px;color:var(--berry);font-weight:900}.benefit h3{font-size:18px;margin:9px 0 5px}.benefit p{font-size:12px;color:var(--muted);margin:0;max-width:300px}.benefit-badge{position:absolute;right:17px;top:18px;color:#744777;background:#fff;border-radius:999px;padding:6px 10px;font-size:11px;font-weight:800}
.scene{padding-top:62px}.scene-panel{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center;background:#f3eadf;border-radius:28px;padding:32px}.scene-board{background:#fff;border:1px solid #e7dbcf;border-radius:19px;padding:20px;box-shadow:var(--shadow)}.board-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:13px;margin-bottom:14px}.board-top strong{font-size:15px}.live-label{font-size:11px;font-weight:800;color:var(--green);background:#e4f3e9;padding:5px 9px;border-radius:999px}.board-row{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #f1ece6}.board-row:last-child{border:0}.mini-cover{width:40px;height:52px;border-radius:8px;background:linear-gradient(145deg,#ffc36c,#783d75)}.board-row:nth-of-type(3) .mini-cover{background:linear-gradient(145deg,#86beb8,#384769)}.board-row:nth-of-type(4) .mini-cover{background:linear-gradient(145deg,#e7aa77,#593956)}.board-row b{display:block;font-size:13px}.board-row small{font-size:11px;color:var(--muted)}.score{font-weight:900;color:#a45d1f;font-size:13px}.scene-copy h2{font-size:30px;line-height:1.3;margin:8px 0 14px}.scene-copy p{font-size:14px;color:#6b625e;line-height:1.9}.scene-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:19px}.data-tag{padding:7px 11px;border-radius:10px;background:#fff;color:#61416c;font-size:12px;font-weight:800}
.latest{background:#fffdf9;border-top:1px solid #f1eae2;border-bottom:1px solid #f1eae2}.movie-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px 15px}.movie-card{min-width:0;transition:transform .22s}.movie-card:hover{transform:translateY(-5px)}.poster{aspect-ratio:2/3;border-radius:15px;position:relative;overflow:hidden;background:linear-gradient(145deg,#e6c078,#594b66);box-shadow:0 8px 20px rgba(66,43,47,.13)}.poster:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 30% 25%,rgba(255,255,255,.45),transparent 24%),linear-gradient(180deg,transparent 48%,rgba(24,19,30,.78))}.poster:after{content:"";position:absolute;inset:10% 12% 18%;border:1px solid rgba(255,255,255,.25);border-radius:50% 50% 42% 42%;opacity:.7}.poster-title{position:absolute;z-index:1;left:12px;bottom:13px;color:#fff;font-size:18px;font-weight:900;writing-mode:vertical-rl;letter-spacing:2px;text-shadow:0 2px 8px #222}.poster-b{background:linear-gradient(155deg,#f2b56d,#cb684d 52%,#44375d)}.poster-c{background:linear-gradient(155deg,#f5d28a,#e78f75 52%,#744c64)}.poster-d{background:linear-gradient(155deg,#9bd4d1,#387e96 50%,#293450)}.poster-e{background:linear-gradient(155deg,#b5a6dc,#5e5d9e 55%,#292b4d)}.poster-f{background:linear-gradient(155deg,#f1c684,#ad735d 52%,#475b55)}.poster-g{background:linear-gradient(155deg,#a8c59f,#537e6f 52%,#364e48)}.poster-h{background:linear-gradient(155deg,#f2a9a5,#cf6683 55%,#633d72)}.poster-i{background:linear-gradient(155deg,#b9a0c3,#754e79 52%,#282e48)}.poster-j{background:linear-gradient(155deg,#f0c170,#ae674d 52%,#493752)}.poster-k{background:linear-gradient(155deg,#8dd3d2,#4d88ab 50%,#4b548c)}.poster-l{background:linear-gradient(155deg,#d8d294,#7a9b6f 55%,#435d4c)}.movie-name{font-size:13px;font-weight:800;margin:9px 0 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.movie-meta{display:flex;align-items:center;justify-content:space-between;gap:4px}.status{font-size:10px;color:#674478;background:#f2e8f3;border-radius:999px;padding:4px 7px;font-weight:750;white-space:nowrap}.rating{font-size:12px;color:#a25f20;font-weight:900}
.hot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.hot-card{display:flex;align-items:center;gap:15px;padding:14px;background:#fff;border:1px solid var(--line);border-radius:19px;transition:transform .2s,box-shadow .2s}.hot-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.hot-poster{width:76px;aspect-ratio:2/3;border-radius:11px;flex:none;background:linear-gradient(145deg,#e9b878,#68436e)}.hot-card:nth-child(2) .hot-poster{background:linear-gradient(145deg,#9bd4d1,#293450)}.hot-card:nth-child(3) .hot-poster{background:linear-gradient(145deg,#8dd3d2,#4b548c)}.hot-card:nth-child(4) .hot-poster{background:linear-gradient(145deg,#f2b56d,#44375d)}.hot-card:nth-child(5) .hot-poster{background:linear-gradient(145deg,#f1c684,#475b55)}.hot-card:nth-child(6) .hot-poster{background:linear-gradient(145deg,#b9a0c3,#282e48)}.hot-info h3{font-size:15px;margin:0 0 7px}.hot-info p{font-size:11px;color:var(--muted);margin:0}.hot-score{margin-left:auto;text-align:right}.hot-score b{display:block;color:#a25f20;font-size:15px}.hot-score small{font-size:10px;color:var(--muted)}
.trend-band{background:var(--plum);color:#fff;padding:29px;border-radius:25px;display:grid;grid-template-columns:1.2fr 2fr;align-items:center;gap:30px;position:relative;overflow:hidden}.trend-band:after{content:"";position:absolute;width:300px;height:300px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:-80px;top:-200px;box-shadow:0 0 0 30px rgba(255,255,255,.025),0 0 0 60px rgba(255,255,255,.02)}.trend-title{position:relative;z-index:1}.trend-title strong{font-size:24px;display:block}.trend-title span{font-size:12px;color:#d8c5d7}.trend-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.trend-stat{border-left:1px solid rgba(255,255,255,.2);padding-left:18px}.trend-stat b{display:block;font-size:23px;color:#ffd36c}.trend-stat small{font-size:11px;color:#e0d3df}
.compare{background:#fffdf9}.compare-wrap{display:grid;grid-template-columns:1fr 1fr;gap:16px}.compare-col{padding:25px 28px;border-radius:22px;border:1px solid var(--line);background:#fff}.compare-col.featured{background:#f5edf5;border-color:#e1cde1}.compare-col h3{font-size:16px;margin:0 0 14px}.compare-col ul{list-style:none;padding:0;margin:0}.compare-col li{padding:10px 0;border-top:1px solid rgba(80,55,69,.1);font-size:13px;color:#615955;display:flex;gap:10px}.compare-col li:before{content:"•";color:var(--orange);font-size:18px;line-height:1}
.channels{background:linear-gradient(180deg,#fffaf2,#fff5e5)}.channel-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.channel{min-height:168px;border-radius:19px;padding:19px;background:#fff;border:1px solid #eee1d3;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}.channel:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.channel:nth-child(2){background:#f3e9f3}.channel:nth-child(3){background:#fcebdc}.channel:nth-child(4){background:#eaf1e7}.channel:nth-child(5){background:#e9eff2}.channel-icon{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,var(--mango),var(--orange),var(--berry));color:#fff;display:grid;place-items:center;font-weight:900;margin-bottom:13px}.channel h3{font-size:15px;margin:0 0 6px}.channel p{font-size:11px;line-height:1.7;color:var(--muted);margin:0}
.ranking-layout{display:grid;grid-template-columns:1.4fr .8fr;gap:24px}.ranking-list{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.rank-item{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:11px;padding:12px 4px;border-bottom:1px solid var(--line)}.rank-number{font-size:16px;font-weight:900;color:#8f817b;text-align:center}.rank-item:nth-child(-n+3) .rank-number{color:#a05a32;font-size:21px}.rank-item strong{display:block;font-size:13px}.rank-item small{color:var(--muted);font-size:10px}.rank-data{text-align:right}.rank-data b{display:block;font-size:12px;color:#a25f20}.rank-data small{font-size:10px}.rank-feature{border-radius:24px;background:linear-gradient(145deg,#784879,#392641);padding:26px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;min-height:285px}.rank-feature .rank-mark{font-size:12px;color:#f9d178;font-weight:800}.rank-feature h3{font-size:25px;line-height:1.35;margin:20px 0 8px}.rank-feature p{color:#e2d5e2;font-size:12px;line-height:1.8;margin:0}.rank-feature .score-big{font-size:39px;color:#ffd36c;font-weight:900}
.news{background:#fffdf9}.news-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:23px}.news-feature{border-radius:21px;overflow:hidden;background:#f0e4d7}.news-art{height:220px;background:linear-gradient(135deg,#f4bd70,#b66d65 48%,#544166);position:relative}.news-art:after{content:"影视更新";position:absolute;right:22px;bottom:17px;color:rgba(255,255,255,.85);font-size:27px;font-weight:900}.news-feature-content{padding:20px}.news-feature-content time,.news-item time{font-size:10px;color:var(--berry);font-weight:800}.news-feature-content h3{font-size:17px;margin:7px 0}.news-feature-content p{font-size:12px;color:var(--muted);margin:0;line-height:1.8}.news-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}.news-item{padding:14px;border:1px solid var(--line);border-radius:15px;background:#fff;display:flex;flex-direction:column;justify-content:space-between;min-height:118px;transition:border-color .2s,transform .2s}.news-item:hover{border-color:#d8b8d5;transform:translateY(-2px)}.news-item h3{font-size:13px;line-height:1.6;margin:7px 0 0}
.faq-section{background:#f4eee8}.faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:48px;align-items:start}.faq-intro h2{font-size:29px;line-height:1.3;margin:7px 0 12px}.faq-intro p{font-size:13px;color:var(--muted);line-height:1.8}.faq-list details{border-bottom:1px solid #dfd5cd;padding:16px 0}.faq-list summary{cursor:pointer;list-style:none;font-weight:800;font-size:14px;display:flex;justify-content:space-between;gap:15px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";color:var(--berry);font-size:20px;line-height:1}.faq-list details[open] summary:after{content:"−"}.faq-list details p{font-size:12px;line-height:1.8;color:#6c625d;margin:11px 24px 0 0}
.assurance{padding-top:26px}.assurance-bar{background:#fff;border:1px solid var(--line);border-radius:17px;padding:17px 22px;display:flex;justify-content:space-around;gap:12px;flex-wrap:wrap}.assurance-item{font-size:12px;color:#554d48;font-weight:750;display:flex;align-items:center;gap:8px}.assurance-item span{color:var(--green);font-weight:900}
.closing{padding:50px 0 82px}.closing-panel{border-radius:27px;padding:29px 35px;background:linear-gradient(105deg,#ffd56d,#f59a48 55%,#724177);display:flex;justify-content:space-between;align-items:center;gap:24px}.closing-panel h2{font-size:24px;margin:0 0 5px}.closing-panel p{font-size:12px;margin:0;color:#473538}.closing-panel .button{background:#fffaf2}
.site-footer{background:#302431;color:#f8eef5;padding:45px 0 18px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:35px;padding-bottom:32px}.footer-brand .brand{color:#fff;margin-bottom:13px}.footer-brand p{font-size:12px;line-height:1.8;color:#c9bbc8;max-width:290px}.footer-col h3{font-size:13px;margin:2px 0 14px;color:#ffd36c}.footer-col a,.footer-col span{display:block;font-size:12px;color:#d0c4d0;margin:8px 0}.footer-col a:hover{color:#ffd36c}.copyright{border-top:1px solid rgba(255,255,255,.13);padding-top:15px;display:flex;justify-content:space-between;gap:14px;font-size:10px;color:#b9abb8}.fixed-cta{position:fixed;z-index:25;bottom:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;background:rgba(51,36,53,.96);color:#fff;padding:9px 11px 9px 18px;border-radius:999px;box-shadow:0 12px 30px rgba(38,25,39,.24);font-size:12px}.fixed-cta strong{white-space:nowrap}.fixed-cta .button{padding:9px 16px;font-size:12px}
@media(max-width:1024px){.nav-wrap{gap:16px}.nav-links{gap:13px}.nav-links a{font-size:12px}.hero-stage{padding:44px}.hero-art{right:2%;transform:translateY(-50%) scale(.86);transform-origin:right center}.hero-copy{max-width:55%}.movie-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.channel-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.container{width:min(100% - 32px,var(--max))}.site-header{height:66px}.brand{font-size:15px}.brand-mark{width:36px;height:36px}.menu-toggle{display:block}.nav-cta{display:none}.nav-links{display:none;position:absolute;top:66px;left:0;right:0;background:#fffaf2;padding:12px 20px 20px;border-bottom:1px solid var(--line);box-shadow:0 12px 20px rgba(49,34,31,.08);margin:0;flex-direction:column;align-items:stretch;gap:0}.nav-links.open{display:flex}.nav-links a{padding:12px 5px;border-bottom:1px solid #f0e8df;font-size:14px}.nav-links a:last-child{border:0}.hero{padding-top:22px}.hero-stage{min-height:580px;padding:32px 27px 260px;align-items:flex-start}.hero-copy{max-width:100%}.hero h1{font-size:44px}.hero-lead{font-size:17px}.hero-desc{font-size:13px}.hero-art{width:325px;height:255px;top:auto;bottom:10px;right:50%;transform:translateX(50%) scale(.78);transform-origin:center bottom}.hero-poster{width:150px}.hero-poster.one{left:5px;top:38px}.hero-poster.two{left:92px;top:1px}.hero-poster.three{right:8px;top:43px}.hero-stamp{right:8px;bottom:5px}.section-head{align-items:flex-start;flex-direction:column;gap:8px}.section-head h2{font-size:25px}.benefit-row{grid-template-columns:1fr}.benefit:nth-child(2){transform:none}.benefit{min-height:130px}.scene-panel{grid-template-columns:1fr;gap:22px;padding:22px}.scene-copy h2{font-size:25px}.movie-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 11px}.hot-grid{grid-template-columns:repeat(2,1fr)}.trend-band{grid-template-columns:1fr;gap:19px;padding:24px}.compare-wrap{grid-template-columns:1fr}.channel-grid{grid-template-columns:repeat(2,1fr)}.channel{min-height:155px}.ranking-layout{grid-template-columns:1fr}.rank-feature{min-height:210px}.news-layout{grid-template-columns:1fr}.news-art{height:190px}.faq-layout{grid-template-columns:1fr;gap:15px}.footer-grid{grid-template-columns:1fr 1fr;gap:25px}.closing-panel{padding:25px;align-items:flex-start;flex-direction:column}.closing{padding-bottom:98px}.fixed-cta{bottom:10px;width:calc(100% - 24px);justify-content:space-between;padding-left:15px}.fixed-cta span{display:none}}
@media(max-width:520px){.container{width:calc(100% - 28px)}.brand{font-size:13px;gap:8px}.hero-stage{border-radius:24px;padding:25px 20px 245px;min-height:560px}.hero h1{font-size:38px}.hero-desc{line-height:1.75}.hero-actions .button{padding:11px 15px;font-size:12px}.hero-art{transform:translateX(50%) scale(.7);bottom:3px}.hero-foot{gap:6px}.pill{font-size:10px;padding:6px 9px}.section-head h2{font-size:23px}.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 13px}.poster{border-radius:13px}.poster-title{font-size:16px}.hot-grid{grid-template-columns:1fr}.hot-card{padding:11px}.trend-stats{gap:5px}.trend-stat{padding-left:10px}.trend-stat b{font-size:19px}.ranking-list{grid-template-columns:1fr}.rank-feature{min-height:190px}.channel-grid{gap:9px}.channel{padding:14px;min-height:153px}.channel p{font-size:10px}.news-list{grid-template-columns:1fr}.news-item{min-height:95px}.footer-grid{grid-template-columns:1fr 1fr;gap:20px 15px}.footer-brand{grid-column:1/-1}.copyright{flex-direction:column;gap:5px}.assurance-bar{justify-content:flex-start}.fixed-cta strong{font-size:11px}.closing-panel h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* roulang page: category1 */
:root{
      --ink:#26221f;
      --muted:#77716c;
      --paper:#fffaf2;
      --surface:#fff;
      --line:#ece4db;
      --mango:#ffc943;
      --orange:#f58c39;
      --berry:#723b79;
      --plum:#3c243f;
      --soft:#fff0cf;
      --green:#397b60;
      --bluegray:#70708a;
      --shadow:0 16px 42px rgba(83,53,35,.09);
      --shadow-soft:0 10px 25px rgba(83,53,35,.07);
      --radius:24px;
      --small-radius:16px;
      --max:1220px
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth;scroll-padding-top:88px}
    body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC",system-ui,sans-serif;line-height:1.65}
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button{font:inherit}
    a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #8b55a0;outline-offset:3px}
    .container{width:min(var(--max),calc(100% - 48px));margin-inline:auto}
    .site-header{height:76px;position:sticky;top:0;z-index:30;background:rgba(255,250,242,.96);border-bottom:1px solid rgba(90,67,49,.1);backdrop-filter:blur(12px)}
    .nav-wrap{height:100%;display:flex;align-items:center;gap:28px}
    .brand{display:flex;align-items:center;gap:11px;white-space:nowrap;font-weight:850;font-size:17px}
    .brand-mark{width:39px;height:39px;border-radius:13px;background:linear-gradient(135deg,var(--mango),var(--orange) 50%,var(--berry));display:grid;place-items:center;color:#fff;font-size:16px;box-shadow:0 7px 18px rgba(192,112,60,.22)}
    .brand-mark span{transform:translateX(1px)}
    .nav-links{display:flex;align-items:center;gap:23px;margin-left:auto}
    .nav-links a{font-size:13px;color:#5e5752;transition:color .2s}
    .nav-links a:hover,.nav-links a.active{color:var(--berry)}
    .nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:12px 20px;background:linear-gradient(110deg,var(--mango),#ffad43);color:#33241a;font-weight:800;font-size:14px;box-shadow:0 8px 18px rgba(226,152,53,.2);transition:transform .2s,box-shadow .2s,filter .2s}
    .nav-cta:hover,.button:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(226,152,53,.28);filter:saturate(1.08)}
    .button-secondary{background:#fff;color:var(--berry);border:1px solid #dfcfe0;box-shadow:none}
    .menu-toggle{display:none;margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:12px;width:44px;height:42px;font-size:21px;color:var(--plum);cursor:pointer}
    main{overflow:hidden}
    section{padding:43px 0}
    .category-heading{padding:44px 0 28px}
    .breadcrumb{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12px;margin-bottom:19px}
    .breadcrumb a:hover{color:var(--berry)}
    .heading-layout{display:flex;align-items:end;justify-content:space-between;gap:35px}
    .heading-copy{max-width:730px}
    .eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:8px;color:var(--berry);font-size:11px;font-weight:850;letter-spacing:1px}
    .eyebrow:before{content:"";width:7px;height:7px;background:var(--orange);border-radius:50%}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(34px,5vw,58px);line-height:1.16;letter-spacing:0;margin:12px 0 13px}
    h1 em{font-style:normal;color:var(--berry)}
    .heading-copy p{font-size:16px;color:var(--muted);max-width:680px;margin:0}
    .heading-stat{min-width:220px;padding:20px 22px;border-radius:20px;background:linear-gradient(135deg,#fff0c8,#f5d8d5 55%,#ead9e9);box-shadow:var(--shadow-soft)}
    .heading-stat strong{display:block;font-size:30px;color:var(--plum);line-height:1.1}
    .heading-stat span{font-size:12px;color:#665663}
    .filter-section{padding-top:16px}
    .filter-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:15px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow-soft)}
    .filter-label{font-size:12px;font-weight:850;color:var(--plum);margin-right:3px}
    .filter-chip{border:1px solid #eadfd8;background:#fffaf4;border-radius:999px;padding:9px 15px;color:#756b66;font-size:12px;cursor:pointer;transition:.2s}
    .filter-chip:hover,.filter-chip.active{background:var(--berry);border-color:var(--berry);color:#fff}
    .filter-note{margin-left:auto;color:var(--muted);font-size:12px}
    .catalog-section{padding-top:24px}
    .section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:23px}
    .section-head h2{font-size:29px;line-height:1.25;margin:5px 0 0}
    .section-head p{max-width:580px;color:var(--muted);font-size:13px;margin:0}
    .catalog-layout{display:grid;grid-template-columns:245px 1fr;gap:24px;align-items:start}
    .side-panel{position:sticky;top:98px;padding:22px;border-radius:var(--radius);background:var(--plum);color:#fff;box-shadow:var(--shadow)}
    .side-panel h3{font-size:18px;margin:0 0 17px}
    .side-panel p{font-size:12px;color:#dfcfe0;line-height:1.8;margin-bottom:20px}
    .side-list{display:grid;gap:9px}
    .side-item{display:flex;justify-content:space-between;align-items:center;padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.08);font-size:12px;color:#f9edf8}
    .side-item strong{font-size:11px;color:var(--mango)}
    .side-item.active{background:linear-gradient(100deg,var(--orange),var(--berry));color:#fff}
    .catalog-list{display:grid;gap:13px}
    .catalog-card{display:grid;grid-template-columns:118px 1fr auto;gap:18px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 7px 20px rgba(83,53,35,.045);transition:transform .22s,box-shadow .22s,border-color .22s}
    .catalog-card:hover{transform:translateY(-4px);border-color:#d8b7d9;box-shadow:var(--shadow)}
    .catalog-poster{height:150px;border-radius:14px;position:relative;overflow:hidden;display:flex;align-items:end;padding:13px;color:#fff;font-size:16px;font-weight:900;letter-spacing:1px}
    .catalog-poster:after{content:"";position:absolute;inset:42% 0 0;background:linear-gradient(transparent,rgba(38,22,39,.76))}
    .catalog-poster span{position:relative;z-index:1}
    .poster-a{background:linear-gradient(145deg,#e8bd70,#b65a69 53%,#4a365b)}
    .poster-b{background:linear-gradient(145deg,#9ac7bf,#537894 48%,#322d4d)}
    .poster-c{background:linear-gradient(145deg,#f6a25c,#d16578 48%,#4b2b52)}
    .poster-d{background:linear-gradient(145deg,#c7a7d3,#825b9c 50%,#292c54)}
    .poster-e{background:linear-gradient(145deg,#e8d290,#9c9160 50%,#455b50)}
    .poster-f{background:linear-gradient(145deg,#f29e7e,#9a4869 48%,#352542)}
    .catalog-info h3{font-size:19px;line-height:1.35;margin:0 0 7px}
    .catalog-info p{font-size:12px;color:var(--muted);margin:0 0 13px;line-height:1.8}
    .tag-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
    .data-tag,.status-badge,.score-badge{display:inline-flex;align-items:center;border-radius:9px;padding:6px 9px;font-size:11px;font-weight:850}
    .data-tag{background:#f8edf7;color:var(--berry)}
    .status-badge{background:#fff0cf;color:#8a5a1e}
    .status-badge.green{background:#e3f3e9;color:var(--green)}
    .score-badge{background:var(--plum);color:#fff}
    .catalog-side{text-align:right;min-width:72px}
    .catalog-side strong{display:block;font-size:25px;line-height:1;color:var(--orange)}
    .catalog-side span{display:block;color:var(--muted);font-size:11px;margin-top:5px}
    .more-row{text-align:center;padding-top:18px}
    .text-link{color:var(--berry);font-size:13px;font-weight:800}
    .text-link:hover{text-decoration:underline;text-underline-offset:4px}
    .ranking-section{background:#fff2da}
    .ranking-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}
    .ranking-panel,.update-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-soft)}
    .ranking-panel h3,.update-panel h3{font-size:19px;margin:0 0 14px}
    .rank-row{display:grid;grid-template-columns:38px 1fr auto auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #f1e9e2}
    .rank-row:last-child{border-bottom:0}
    .rank-no{font-size:19px;font-weight:900;color:#b9aaa0}
    .rank-row:nth-child(2) .rank-no{color:var(--orange)}
    .rank-row:nth-child(3) .rank-no{color:var(--berry)}
    .rank-name{font-weight:800;font-size:13px}
    .rank-type{display:block;font-size:11px;color:var(--muted);font-weight:400}
    .heat{font-size:12px;color:var(--berry);font-weight:850}
    .mini-score{font-size:12px;font-weight:900;color:var(--orange)}
    .update-line{display:grid;grid-template-columns:76px 1fr;gap:18px;padding:15px 0;border-bottom:1px solid #f1e9e2}
    .update-line:last-child{border-bottom:0}
    .update-date{font-size:12px;color:var(--berry);font-weight:850}
    .update-line strong{display:block;font-size:13px;margin-bottom:4px}
    .update-line span{font-size:11px;color:var(--muted)}
    .faq-section{padding-bottom:40px}
    .faq-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:40px;align-items:start}
    .faq-intro h2{font-size:30px;line-height:1.25;margin:7px 0 12px}
    .faq-intro p{font-size:13px;color:var(--muted);max-width:370px}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:17px 0}
    summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;font-weight:800;font-size:14px}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";color:var(--berry);font-size:22px;font-weight:400;line-height:1}
    details[open] summary:after{content:"−"}
    details p{font-size:13px;color:var(--muted);line-height:1.85;margin:12px 30px 0 0}
    .news-section{background:#fff}
    .news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
    .news-card{padding:18px;border-radius:18px;border:1px solid var(--line);background:#fffaf6;transition:.22s}
    .news-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:#dbbada}
    .news-date{font-size:11px;color:var(--berry);font-weight:850}
    .news-card h3{font-size:15px;line-height:1.5;margin:9px 0 7px}
    .news-card p{font-size:12px;color:var(--muted);margin:0}
    .bottom-cta{padding:30px 0 76px}
    .cta-band{border-radius:28px;padding:32px 38px;display:flex;align-items:center;justify-content:space-between;gap:25px;background:linear-gradient(110deg,#ffdc73,#f19a4d 50%,#723b79);color:#fff;box-shadow:var(--shadow)}
    .cta-band h2{font-size:25px;margin:0 0 5px}
    .cta-band p{margin:0;color:#fff8ec;font-size:13px}
    .cta-band .button{background:#fff;color:var(--plum);box-shadow:none}
    .site-footer{padding:48px 0 76px;background:#302031;color:#f8edf7}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
    .footer-brand .brand{color:#fff}
    .footer-brand p{font-size:12px;color:#cbb9c8;max-width:285px;margin:16px 0 0}
    .footer-col{display:grid;align-content:start;gap:9px}
    .footer-col h3{font-size:13px;margin:3px 0 7px;color:#fff}
    .footer-col a,.footer-col span{font-size:12px;color:#cbb9c8}
    .footer-col a:hover{color:var(--mango)}
    .copyright{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.14);margin-top:38px;padding-top:18px;color:#aa9ca9;font-size:11px}
    .fixed-bar{position:fixed;z-index:25;bottom:16px;left:50%;transform:translateX(-50%);width:min(610px,calc(100% - 32px));display:flex;align-items:center;justify-content:space-between;gap:15px;padding:9px 11px 9px 18px;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:rgba(60,36,63,.96);box-shadow:0 12px 35px rgba(45,25,48,.25);color:#fff}
    .fixed-bar span{font-size:12px;font-weight:750}
    .fixed-bar .button{padding:9px 16px;font-size:12px;box-shadow:none}
    @media (max-width:1024px){
      .nav-wrap{gap:15px}
      .nav-links{gap:14px}
      .catalog-layout{grid-template-columns:205px 1fr}
      .catalog-card{grid-template-columns:100px 1fr auto}
      .catalog-poster{height:135px}
      .heading-layout{align-items:start;flex-direction:column}
      .heading-stat{min-width:260px}
    }
    @media (max-width:768px){
      .container{width:min(var(--max),calc(100% - 32px))}
      .site-header{height:68px}
      .nav-wrap{gap:0}
      .brand{font-size:15px}
      .brand-mark{width:36px;height:36px}
      .menu-toggle{display:block}
      .nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;margin:0;padding:14px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}
      .nav-links.open{display:flex}
      .nav-links a{padding:12px 14px;border-bottom:1px solid #f2ece7}
      .nav-links a:last-child{border-bottom:0}
      .nav-cta{display:none}
      .category-heading{padding-top:32px}
      h1{font-size:39px}
      .catalog-layout,.ranking-layout,.faq-layout{grid-template-columns:1fr}
      .side-panel{position:static}
      .side-list{grid-template-columns:repeat(3,1fr)}
      .side-item{justify-content:center;text-align:center}
      .side-item strong{display:none}
      .news-grid{grid-template-columns:1fr 1fr}
      .footer-grid{grid-template-columns:1fr 1fr}
      .cta-band{align-items:flex-start;flex-direction:column;padding:28px}
    }
    @media (max-width:520px){
      section{padding:34px 0}
      .heading-stat{width:100%}
      .filter-bar{align-items:flex-start}
      .filter-note{width:100%;margin:2px 0 0}
      .catalog-card{grid-template-columns:82px 1fr;gap:12px}
      .catalog-poster{height:118px}
      .catalog-side{grid-column:2;text-align:left;display:flex;align-items:center;gap:9px}
      .catalog-side strong{font-size:21px}
      .catalog-info h3{font-size:16px}
      .side-list{grid-template-columns:1fr 1fr}
      .rank-row{grid-template-columns:31px 1fr auto}
      .rank-row .mini-score{grid-column:3;grid-row:1}
      .heat{grid-column:2}
      .news-grid{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1fr}
      .copyright{align-items:flex-start;flex-direction:column;gap:7px}
      .fixed-bar{bottom:10px}
      .fixed-bar span{font-size:11px}
      .fixed-bar .button{padding:8px 12px}
    }
