/* roulang page: index */
:root {
  --blue:#1879d4; --blue-dark:#125eaa; --blue-soft:#e9f4ff; --cyan:#36b7c8;
  --coral:#ef7864; --green:#188a70; --ink:#1c2c3c; --muted:#68798a;
  --line:#e3ebf2; --paper:#fff; --wash:#f4f8fc; --warm:#fff9f4;
  --radius:12px; --shadow:0 10px 28px rgba(25,62,96,.08); --container:1220px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:92px; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.65 "Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif; }
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% - 48px)); margin-inline:auto; }
.skip-link { position:absolute; z-index:1000; top:-60px; left:12px; padding:10px 14px; background:#fff; }
.skip-link:focus { top:12px; }
.site-header { position:sticky; z-index:50; top:0; border-bottom:1px solid rgba(222,232,241,.9); background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }
.nav-wrap { min-height:76px; display:flex; align-items:center; gap:26px; }
.brand { display:flex; align-items:center; gap:11px; flex:none; font-size:19px; font-weight:800; }
.brand-mark { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; color:#fff; background:var(--blue); font-size:21px; font-weight:900; box-shadow:0 5px 12px rgba(24,121,212,.22); }
.brand span:last-child { white-space:nowrap; }
.main-nav { display:flex; align-items:center; justify-content:center; gap:clamp(12px,2vw,27px); margin-left:auto; }
.main-nav a { position:relative; padding:10px 0; color:#536578; font-size:14px; font-weight:600; transition:color .2s; }
.main-nav a:hover,.main-nav a:focus-visible,.main-nav a.active { color:var(--blue); }
.main-nav a.active:after { position:absolute; right:0; bottom:2px; left:0; height:2px; border-radius:2px; background:var(--blue); content:""; }
.nav-cta,.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 18px; border:1px solid transparent; border-radius:9px; font-weight:700; transition:background .2s,border-color .2s,box-shadow .2s,transform .2s; }
.nav-cta,.button-primary { color:#fff; background:var(--blue); box-shadow:0 5px 14px rgba(24,121,212,.16); }
.nav-cta:hover,.button-primary:hover { background:var(--blue-dark); box-shadow:0 8px 18px rgba(24,121,212,.23); transform:translateY(-1px); }
.button-secondary { color:var(--ink); border-color:#d8e3ec; background:#fff; }
.button-secondary:hover { color:var(--blue); border-color:var(--blue); background:#f7fbff; }
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible { outline:3px solid rgba(24,121,212,.32); outline-offset:3px; }
.menu-toggle { display:none; width:42px; height:42px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); }
.hero { position:relative; overflow:hidden; min-height:578px; display:flex; align-items:center; color:#fff; background:#102a3b; }
.hero:before { position:absolute; inset:0; background:linear-gradient(90deg,rgba(11,31,46,.95) 0%,rgba(11,31,46,.82) 42%,rgba(11,31,46,.28) 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 700'%3E%3Crect width='1600' height='700' fill='%23152f42'/%3E%3Cpath d='M780 700 1120 0h480v700z' fill='%232d6174'/%3E%3Cpath d='M1040 700 1360 0h240v700z' fill='%233e7681'/%3E%3Ccircle cx='1250' cy='235' r='170' fill='%23d8a176' fill-opacity='.72'/%3E%3Cpath d='M700 700 965 250l275 450z' fill='%23102436'/%3E%3Cpath d='m0 540 480-240 360 400H0z' fill='%23284d5b'/%3E%3C/svg%3E") center/cover; content:""; }
.hero:after { position:absolute; right:8%; bottom:0; width:30%; height:85%; border-left:1px solid rgba(255,255,255,.14); transform:skew(-20deg); content:""; }
.hero-inner { position:relative; z-index:1; padding:68px 0 82px; }
.hero-copy { max-width:760px; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; color:#b8dfff; font-size:13px; font-weight:700; }
.eyebrow:before { width:24px; height:2px; background:var(--coral); content:""; }
.hero h1 { max-width:720px; margin:18px 0 13px; font-size:clamp(38px,5.1vw,62px); line-height:1.16; font-weight:800; }
.hero h1 em { color:#80d7e0; font-style:normal; }
.hero-lead { max-width:680px; margin:0; color:#d6e4ed; font-size:18px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:27px; }
.hero .button-secondary { color:#fff; border-color:rgba(255,255,255,.42); background:rgba(255,255,255,.08); }
.hero .button-secondary:hover { border-color:#fff; background:rgba(255,255,255,.16); }
.hero-proof { display:flex; flex-wrap:wrap; gap:22px; margin-top:28px; color:#c5d6df; font-size:13px; }
.hero-proof span:before { margin-right:8px; color:#78d4c0; content:"●"; font-size:10px; }
.section { padding:84px 0; }
.section-wash { background:var(--wash); }
.section-warm { background:var(--warm); }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:28px; }
.section-head h2 { margin:0; font-size:29px; line-height:1.3; letter-spacing:0; }
.section-head p { max-width:650px; margin:8px 0 0; color:var(--muted); }
.section-kicker { display:block; margin-bottom:7px; color:var(--blue); font-size:12px; font-weight:800; }
.text-link { display:inline-flex; align-items:center; gap:7px; color:var(--blue); font-size:14px; font-weight:700; white-space:nowrap; }
.text-link:hover { color:var(--blue-dark); }
.benefit-row { display:grid; grid-template-columns:1.08fr 1fr 1fr; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.benefit { min-height:144px; display:flex; align-items:center; gap:18px; padding:26px 24px; border-right:1px solid var(--line); }
.benefit:last-child { border-right:0; }
.benefit-number { color:var(--blue); font-size:36px; line-height:1; font-weight:800; }
.benefit h3 { margin:0 0 5px; font-size:17px; }
.benefit p { margin:0; color:var(--muted); font-size:14px; }
.scene-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:54px; align-items:center; }
.scene-copy h2 { margin:0 0 12px; font-size:30px; }
.scene-copy>p { margin:0; color:var(--muted); }
.steps { margin-top:25px; border-top:1px solid var(--line); }
.step { display:grid; grid-template-columns:42px 1fr; gap:14px; padding:17px 0; border-bottom:1px solid var(--line); }
.step-num { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:var(--blue); background:var(--blue-soft); font-weight:800; }
.step h3 { margin:0 0 3px; font-size:15px; }
.step p { margin:0; color:var(--muted); font-size:14px; }
.scene-board { padding:23px; border:1px solid #dfe9f1; border-radius:14px; background:#fff; box-shadow:var(--shadow); }
.searchbar { min-height:46px; display:flex; align-items:center; gap:10px; padding:0 14px; border:1px solid var(--line); border-radius:8px; color:#8292a1; background:#fafcfe; font-size:14px; }
.search-icon { width:15px; height:15px; border:2px solid #8292a1; border-radius:50%; position:relative; }
.search-icon:after { position:absolute; right:-5px; bottom:-3px; width:7px; height:2px; background:#8292a1; transform:rotate(45deg); content:""; }
.scene-tags { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 18px; }
.scene-tags span { padding:5px 11px; border:1px solid var(--line); border-radius:99px; color:#5e7183; font-size:12px; }
.scene-tags span:first-child { color:var(--blue); border-color:#b9daf5; background:#eff7ff; }
.scene-feature { display:grid; grid-template-columns:130px 1fr; gap:18px; align-items:center; padding-top:17px; border-top:1px solid var(--line); }
.scene-feature .poster { aspect-ratio:4/3; }
.scene-feature h3 { margin:0 0 7px; font-size:18px; }
.scene-feature p { margin:0 0 10px; color:var(--muted); font-size:13px; }
.score { color:#bd5b37; font-size:13px; font-weight:800; white-space:nowrap; }
.score:before { margin-right:5px; content:"★"; }
.poster { position:relative; overflow:hidden; display:flex; align-items:end; aspect-ratio:2/3; padding:13px; border-radius:9px; color:#fff; background:#31536a; isolation:isolate; }
.poster:before,.poster:after { position:absolute; z-index:-1; inset:0; content:""; }
.poster:before { background:linear-gradient(180deg,transparent 28%,rgba(7,24,37,.78) 100%); }
.poster:after { width:74%; height:110%; top:-15%; left:34%; border-left:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.06); transform:rotate(23deg); }
.poster-title { max-width:100%; font-size:16px; line-height:1.3; font-weight:800; text-shadow:0 1px 5px #142433; }
.poster-mark { position:absolute; top:12px; left:12px; color:rgba(255,255,255,.76); font-size:10px; font-weight:800; letter-spacing:1px; }
.poster-line { position:absolute; top:28%; left:13%; width:38%; height:2px; background:rgba(255,255,255,.7); }
.poster-a { background-color:#41677a; background-image:radial-gradient(ellipse at 68% 35%,#ddab7c 0 14%,transparent 15%),linear-gradient(135deg,#173746,#72949b 55%,#263a4b); }
.poster-b { background-color:#ad7b71; background-image:radial-gradient(ellipse at 60% 35%,#f1c4a0 0 16%,transparent 17%),linear-gradient(145deg,#ba8774,#e4b899 48%,#667b79); }
.poster-c { background-color:#24475d; background-image:radial-gradient(circle at 62% 34%,#72c1d1 0 13%,transparent 14%),linear-gradient(145deg,#152a45,#317687 53%,#162841); }
.poster-d { background-color:#79645b; background-image:radial-gradient(ellipse at 37% 37%,#e0b090 0 16%,transparent 17%),linear-gradient(150deg,#466c73,#d09b76 50%,#314a57); }
.poster-e { background-color:#568081; background-image:radial-gradient(circle at 68% 34%,#e2b65d 0 12%,transparent 13%),linear-gradient(145deg,#227082,#8bb79c 52%,#d5ae6a); }
.poster-f { background-color:#d59b6f; background-image:radial-gradient(ellipse at 67% 32%,#f1d2a3 0 15%,transparent 16%),linear-gradient(140deg,#b96553,#e5b67c 50%,#60948d); }
.poster-g { background-color:#546678; background-image:radial-gradient(ellipse at 61% 36%,#d7c7a8 0 14%,transparent 15%),linear-gradient(140deg,#253849,#7791a0 52%,#344758); }
.poster-h { background-color:#65798d; background-image:radial-gradient(circle at 54% 31%,#eee0c3 0 13%,transparent 14%),linear-gradient(140deg,#586c90,#b7a7a0 50%,#556a78); }
.poster-i { background-color:#af7270; background-image:radial-gradient(ellipse at 58% 34%,#f4c6a5 0 14%,transparent 15%),linear-gradient(145deg,#ca7965,#edb893 48%,#965d67); }
.poster-j { background-color:#386a6e; background-image:radial-gradient(circle at 68% 39%,#8ed1c5 0 12%,transparent 13%),linear-gradient(145deg,#193c4b,#61a3a0 48%,#253d4c); }
.poster-k { background-color:#637b77; background-image:radial-gradient(ellipse at 59% 34%,#f2cf9c 0 14%,transparent 15%),linear-gradient(145deg,#375d63,#a8a17b 50%,#314a54); }
.poster-l { background-color:#597b8e; background-image:radial-gradient(circle at 61% 36%,#ffd279 0 14%,transparent 15%),linear-gradient(145deg,#29859a,#acd0bd 52%,#5b7890); }
.proof-band { display:grid; grid-template-columns:1.2fr repeat(3,1fr); align-items:center; gap:0; padding:26px 30px; border:1px solid #e2ebf1; border-radius:12px; background:#fff; }
.proof-intro { padding-right:25px; }
.proof-intro h2 { margin:0 0 5px; font-size:19px; }
.proof-intro p { margin:0; color:var(--muted); font-size:13px; }
.proof-stat { padding:3px 20px; border-left:1px solid var(--line); }
.proof-stat strong { display:block; color:var(--blue); font-size:24px; line-height:1.2; }
.proof-stat span { color:var(--muted); font-size:13px; }
.movie-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:22px 16px; }
.movie-card { min-width:0; }
.movie-card .poster { transition:transform .22s,box-shadow .22s; box-shadow:0 5px 14px rgba(18,44,65,.11); }
.movie-card:hover .poster { transform:translateY(-3px); box-shadow:0 12px 22px rgba(18,44,65,.17); }
.movie-meta { display:flex; align-items:center; justify-content:space-between; gap:5px; margin-top:10px; }
.movie-meta h3 { overflow:hidden; margin:0; font-size:15px; text-overflow:ellipsis; white-space:nowrap; }
.badge { display:inline-flex; align-items:center; min-height:22px; padding:2px 7px; border-radius:5px; color:#17745d; background:#e8f6f0; font-size:10px; font-weight:700; white-space:nowrap; }
.badge-coral { color:#b45841; background:#fff0e9; }
.badge-blue { color:#1767ab; background:#e9f3ff; }
.movie-sub { display:flex; justify-content:space-between; gap:4px; margin-top:5px; color:var(--muted); font-size:12px; }
.popular-layout { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.feature-movie { min-height:280px; display:grid; grid-template-columns:38% 1fr; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:var(--shadow); }
.feature-movie .poster { height:100%; min-height:280px; border-radius:0; }
.feature-info { align-self:center; padding:22px; }
.feature-info h3 { margin:0 0 8px; font-size:21px; }
.feature-info p { margin:0 0 13px; color:var(--muted); font-size:14px; }
.feature-stats { display:flex; flex-wrap:wrap; gap:11px; color:#65798b; font-size:12px; }
.feature-small { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.mini-movie { display:grid; grid-template-columns:82px 1fr; gap:12px; align-items:center; min-width:0; padding:11px; border:1px solid var(--line); border-radius:10px; background:#fff; transition:box-shadow .2s,transform .2s; }
.mini-movie:hover { box-shadow:var(--shadow); transform:translateY(-2px); }
.mini-movie .poster { aspect-ratio:3/4; }
.mini-movie h3 { margin:0 0 5px; font-size:14px; }
.mini-movie p { margin:0; color:var(--muted); font-size:12px; }
.channel-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.channel { min-height:111px; display:grid; grid-template-columns:44px 1fr 20px; align-items:center; gap:14px; padding:19px; border:1px solid var(--line); border-radius:10px; background:#fff; transition:border-color .2s,box-shadow .2s,transform .2s; }
.channel:hover { border-color:#b9d8f2; box-shadow:var(--shadow); transform:translateY(-2px); }
.channel-index { width:40px; height:40px; display:grid; place-items:center; border-radius:10px; color:var(--blue); background:var(--blue-soft); font-weight:800; }
.channel h3 { margin:0 0 4px; font-size:16px; }
.channel p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
.channel-arrow { color:var(--blue); font-size:20px; }
.rank-layout { display:grid; grid-template-columns:1fr 1fr; gap:0 42px; }
.rank-row { min-height:68px; display:grid; grid-template-columns:40px minmax(0,1fr) 70px 48px; align-items:center; gap:10px; border-bottom:1px solid var(--line); }
.rank-no { color:#778897; font-size:17px; font-weight:800; text-align:center; }
.rank-no.top { color:var(--coral); }
.rank-title { overflow:hidden; font-size:14px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.rank-tag { width:max-content; padding:3px 7px; border-radius:5px; color:#537085; background:#eff4f7; font-size:11px; }
.rank-heat { color:var(--muted); font-size:12px; text-align:right; white-space:nowrap; }
.rank-rating { color:#b85b39; font-size:12px; font-weight:800; text-align:right; }
.compare { display:grid; grid-template-columns:1fr 1fr; overflow:hidden; border:1px solid #dfe8ef; border-radius:12px; background:#fff; box-shadow:var(--shadow); }
.compare-col { padding:25px 29px; }
.compare-col:first-child { background:#f7f9fb; }
.compare-col:last-child { background:#f3f9ff; }
.compare-col h3 { margin:0 0 15px; font-size:17px; }
.compare-col ul { display:grid; gap:13px; margin:0; padding:0; list-style:none; }
.compare-col li { display:flex; align-items:flex-start; gap:10px; color:#5f7181; font-size:14px; }
.compare-col li:before { flex:none; margin-top:2px; color:#8b9aa7; content:"•"; }
.compare-col:last-child li:before { color:var(--blue); content:"✓"; font-weight:800; }
.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.news-item { display:grid; grid-template-columns:94px 1fr; gap:14px; align-items:center; min-height:116px; padding:12px; border:1px solid var(--line); border-radius:10px; background:#fff; transition:box-shadow .2s,border-color .2s; }
.news-item:hover { border-color:#bdd9ef; box-shadow:var(--shadow); }
.news-item .poster { aspect-ratio:1/1; padding:8px; }
.news-item .poster-title { font-size:11px; }
.news-item h3 { display:-webkit-box; overflow:hidden; margin:0 0 7px; font-size:14px; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.news-item time { color:var(--muted); font-size:12px; }
.faq-list { display:grid; gap:10px; max-width:900px; }
.faq-list details { border:1px solid var(--line); border-radius:9px; background:#fff; transition:border-color .2s,background .2s; }
.faq-list details[open] { border-color:#b8d5ec; background:#fafdff; }
.faq-list summary { position:relative; padding:17px 50px 17px 19px; cursor:pointer; font-weight:700; list-style:none; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary:after { position:absolute; top:50%; right:19px; color:var(--blue); content:"＋"; font-size:21px; transform:translateY(-50%); }
.faq-list details[open] summary:after { content:"−"; }
.faq-list details p { margin:0; padding:0 19px 18px; color:var(--muted); font-size:14px; }
.assurance { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid #dceaf4; border-radius:11px; background:#eff7fc; }
.assurance-item { display:flex; align-items:center; gap:12px; padding:20px; border-right:1px solid #dceaf4; }
.assurance-item:last-child { border-right:0; }
.assurance-icon { width:34px; height:34px; display:grid; flex:none; place-items:center; border-radius:50%; color:var(--blue); background:#fff; font-weight:800; }
.assurance-item strong { display:block; font-size:13px; }
.assurance-item span { display:block; color:var(--muted); font-size:11px; }
.site-footer { padding:58px 0 108px; color:#cfdae3; background:#172c3d; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:42px; }
.footer-brand { color:#fff; }
.footer-brand p { max-width:310px; margin:14px 0 0; color:#aebdc9; font-size:13px; }
.footer-col h2 { margin:2px 0 14px; color:#fff; font-size:14px; }
.footer-col a,.footer-col span { display:block; margin:9px 0; color:#aebdc9; font-size:13px; }
.footer-col a:hover { color:#fff; }
.footer-bottom { display:flex; justify-content:space-between; gap:16px; margin-top:35px; padding-top:20px; border-top:1px solid rgba(255,255,255,.13); color:#9eafbd; font-size:12px; }
.fixed-cta { position:fixed; z-index:40; right:0; bottom:0; left:0; padding:10px 0 calc(10px + env(safe-area-inset-bottom)); border-top:1px solid rgba(218,229,238,.9); background:rgba(255,255,255,.96); box-shadow:0 -5px 20px rgba(23,52,76,.07); backdrop-filter:blur(12px); }
.fixed-inner { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.fixed-copy strong { display:block; font-size:14px; }
.fixed-copy span { color:var(--muted); font-size:12px; }
.fixed-actions { display:flex; gap:9px; }
@media (max-width:1100px) {
  .main-nav { gap:13px; }
  .main-nav a { font-size:13px; }
  .movie-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .feature-movie { grid-template-columns:34% 1fr; }
  .proof-band { grid-template-columns:1fr repeat(3,.8fr); }
}
@media (max-width:850px) {
  .container { width:min(100% - 36px,var(--container)); }
  .nav-wrap { min-height:68px; gap:12px; }
  .menu-toggle { display:grid; place-items:center; margin-left:auto; }
  .nav-cta { min-height:40px; padding:0 13px; font-size:13px; }
  .main-nav { position:absolute; top:68px; right:0; left:0; display:none; align-items:stretch; gap:0; padding:8px 18px 16px; border-bottom:1px solid var(--line); background:#fff; box-shadow:0 10px 16px rgba(19,48,72,.08); }
  .main-nav.open { display:flex; flex-direction:column; }
  .main-nav a { padding:12px 8px; border-bottom:1px solid #edf1f5; font-size:15px; }
  .main-nav a.active:after { display:none; }
  .hero { min-height:520px; }
  .hero-inner { padding:60px 0 72px; }
  .scene-layout { grid-template-columns:1fr; gap:28px; }
  .proof-band { grid-template-columns:1fr 1fr; gap:16px 0; }
  .proof-intro { grid-column:1/-1; padding:0 0 10px; }
  .proof-stat:nth-child(2) { border-left:0; padding-left:0; }
  .popular-layout { grid-template-columns:1fr; }
  .channel-grid { grid-template-columns:repeat(2,1fr); }
  .news-grid { grid-template-columns:repeat(2,1fr); }
  .assurance { grid-template-columns:repeat(2,1fr); }
  .assurance-item:nth-child(2) { border-right:0; }
  .assurance-item:nth-child(-n+2) { border-bottom:1px solid #dceaf4; }
  .footer-grid { grid-template-columns:repeat(2,1fr); gap:28px; }
}
@media (max-width:600px) {
  html { scroll-padding-top:74px; }
  .container { width:calc(100% - 32px); }
  .brand { gap:8px; font-size:16px; }
  .brand-mark { width:34px; height:34px; font-size:19px; }
  .nav-wrap { gap:8px; }
  .nav-cta { min-height:38px; padding:0 10px; font-size:12px; }
  .hero { min-height:520px; }
  .hero:before { background:linear-gradient(90deg,rgba(11,31,46,.92),rgba(11,31,46,.64)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 800'%3E%3Crect width='700' height='800' fill='%23152f42'/%3E%3Ccircle cx='490' cy='230' r='160' fill='%23d8a176' fill-opacity='.72'/%3E%3Cpath d='M250 800 470 0h230v800z' fill='%232d6174'/%3E%3Cpath d='M0 560 280 350l250 450H0z' fill='%23284d5b'/%3E%3C/svg%3E") center/cover; }
  .hero-inner { padding:52px 0 66px; }
  .hero h1 { font-size:39px; }
  .hero-lead { font-size:15px; }
  .hero-proof { gap:10px 16px; }
  .section { padding:58px 0; }
  .section-head { align-items:flex-start; flex-direction:column; gap:11px; margin-bottom:22px; }
  .section-head h2,.scene-copy h2 { font-size:24px; }
  .benefit-row { grid-template-columns:1fr; }
  .benefit { min-height:0; padding:18px 4px; border-right:0; border-bottom:1px solid var(--line); }
  .benefit:last-child { border-bottom:0; }
  .benefit-number { width:58px; flex:none; font-size:31px; }
  .scene-board { padding:14px; }
  .scene-feature { grid-template-columns:100px 1fr; gap:12px; }
  .proof-band { padding:20px; }
  .proof-stat { padding:3px 12px; }
  .proof-stat strong { font-size:21px; }
  .movie-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px; }
  .movie-meta h3 { font-size:14px; }
  .popular-layout { gap:12px; }
  .feature-movie { grid-template-columns:36% 1fr; min-height:218px; }
  .feature-movie .poster { min-height:218px; }
  .feature-info { padding:14px; }
  .feature-info h3 { font-size:17px; }
  .feature-info p { font-size:12px; }
  .feature-small { gap:9px; }
  .mini-movie { grid-template-columns:64px 1fr; gap:8px; padding:8px; }
  .mini-movie h3 { font-size:12px; }
  .mini-movie p { font-size:11px; }
  .channel-grid { grid-template-columns:1fr; gap:9px; }
  .channel { min-height:88px; padding:14px; }
  .rank-layout { grid-template-columns:1fr; }
  .rank-row { grid-template-columns:34px minmax(0,1fr) 58px 42px; min-height:62px; gap:7px; }
  .rank-heat { font-size:11px; }
  .compare-col { padding:18px 15px; }
  .compare-col h3 { font-size:15px; }
  .compare-col li { gap:7px; font-size:12px; }
  .news-grid { grid-template-columns:1fr; gap:9px; }
  .news-item { min-height:94px; grid-template-columns:74px 1fr; }
  .assurance { grid-template-columns:1fr 1fr; }
  .assurance-item { gap:8px; padding:13px 9px; }
  .assurance-icon { width:28px; height:28px; font-size:12px; }
  .assurance-item strong { font-size:11px; }
  .assurance-item span { font-size:10px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:22px 16px; }
  .footer-grid>div:first-child { grid-column:1/-1; }
  .footer-bottom { flex-direction:column; gap:5px; }
  .site-footer { padding:45px 0 126px; }
  .fixed-inner { align-items:center; }
  .fixed-copy { display:none; }
  .fixed-actions { width:100%; }
  .fixed-actions .button { flex:1; min-height:42px; padding:0 9px; font-size:13px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; }
}

/* roulang page: category1 */
:root{--blue:#1879d4;--blue-dark:#125eaa;--blue-soft:#e9f4ff;--cyan:#36b7c8;--coral:#ef7864;--green:#188a70;--ink:#1c2c3c;--muted:#68798a;--line:#e3ebf2;--paper:#fff;--wash:#f4f8fc;--warm:#fff9f4;--radius:12px;--shadow:0 10px 28px rgba(25,62,96,.08);--container:1220px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.65 "Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif}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% - 48px));margin-inline:auto}
.site-header{position:sticky;z-index:50;top:0;border-bottom:1px solid rgba(222,232,241,.9);background:rgba(255,255,255,.96);backdrop-filter:blur(12px)}.nav-wrap{min-height:76px;display:flex;align-items:center;gap:26px}.brand{display:flex;align-items:center;gap:11px;flex:none;font-size:19px;font-weight:800}.brand-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;color:#fff;background:var(--blue);font-size:21px;font-weight:900;box-shadow:0 5px 12px rgba(24,121,212,.22)}.brand span:last-child{white-space:nowrap}.main-nav{display:flex;align-items:center;justify-content:center;gap:clamp(12px,2vw,27px);margin-left:auto}.main-nav a{position:relative;padding:10px 0;color:#536578;font-size:14px;font-weight:600;transition:color .2s}.main-nav a:hover,.main-nav a:focus-visible,.main-nav a.active{color:var(--blue)}.main-nav a.active:after{position:absolute;right:0;bottom:2px;left:0;height:2px;border-radius:2px;background:var(--blue);content:""}.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid transparent;border-radius:9px;font-weight:700;transition:.2s}.nav-cta,.button-primary{color:#fff;background:var(--blue);box-shadow:0 5px 14px rgba(24,121,212,.16)}.nav-cta:hover,.button-primary:hover{background:var(--blue-dark);box-shadow:0 8px 18px rgba(24,121,212,.23);transform:translateY(-1px)}.button-secondary{color:var(--ink);border-color:#d8e3ec;background:#fff}.button-secondary:hover{color:var(--blue);border-color:var(--blue);background:#f7fbff}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid rgba(24,121,212,.32);outline-offset:3px}.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink)}
.page-head{position:relative;overflow:hidden;padding:70px 0 64px;background:#eef7fd;border-bottom:1px solid var(--line)}.page-head:after{position:absolute;right:-8%;bottom:-120px;width:43%;height:270px;background:#d8eff5;transform:skew(-24deg);content:""}.page-head .container{position:relative;z-index:1}.crumb{margin-bottom:16px;color:var(--blue);font-size:13px;font-weight:700}.page-head h1{max-width:760px;margin:0 0 13px;font-size:clamp(34px,5vw,56px);line-height:1.18;letter-spacing:-1px}.page-head h1 em{color:var(--blue);font-style:normal}.page-summary{max-width:760px;margin:0;color:var(--muted);font-size:17px}.head-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.meta-pill,.badge{display:inline-flex;align-items:center;border-radius:99px;font-size:12px;font-weight:700}.meta-pill{padding:7px 12px;color:#4f6d83;border:1px solid #cfe1ed;background:#fff}.badge{padding:4px 8px}.badge.blue{color:#1265a7;background:#e7f3ff}.badge.coral{color:#b64b3a;background:#fff0ec}.badge.green{color:#11725d;background:#e5f7f1}
.section{padding:78px 0}.section-wash{background:var(--wash)}.section-warm{background:var(--warm)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}.section-head h2{margin:0;font-size:29px;line-height:1.3}.section-head p{max-width:650px;margin:8px 0 0;color:var(--muted)}.section-kicker{display:block;margin-bottom:7px;color:var(--blue);font-size:12px;font-weight:800}
.filter-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}.filter-label{color:var(--muted);font-size:13px;font-weight:700}.filter-chip{padding:8px 14px;border:1px solid #dbe6ee;border-radius:8px;color:#5d7081;background:#fff;font-size:13px;transition:.2s}.filter-chip:hover,.filter-chip.selected{color:var(--blue);border-color:#a9d2f3;background:var(--blue-soft)}.filter-clear{margin-left:auto;color:var(--blue);border:0;background:transparent;font-size:13px;font-weight:700}
.film-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.film-card{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}.film-card:hover{transform:translateY(-4px);box-shadow:0 15px 30px rgba(25,62,96,.13)}.poster{position:relative;display:flex;align-items:flex-end;aspect-ratio:4/3;padding:16px;color:#fff;overflow:hidden}.poster:after{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,25,40,.74),transparent 65%);content:""}.poster-title{position:relative;z-index:1;font-size:19px;font-weight:800}.poster-blue{background:#2b78a9}.poster-coral{background:#c77569}.poster-violet{background:#675c9a}.poster-night{background:#263d57}.poster-green{background:#428878}.poster-sand{background:#ae8761}.poster-steel{background:#547486}.poster-orange{background:#c87942}.film-body{padding:15px}.film-body h3{margin:0 0 5px;font-size:17px}.film-info{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px}.film-desc{margin:9px 0 0;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.film-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:13px}.rating{color:#c65a42;font-weight:800;font-size:14px}.rating:before{content:"评分 ";color:var(--muted);font-size:12px;font-weight:400}.more-row{text-align:center;margin-top:30px}
.support-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}.feature-panel,.rank-panel{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}.feature-panel h3{margin:0 0 16px;font-size:22px}.feature-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.feature-item{padding:16px;border-radius:10px;background:var(--wash)}.feature-item strong{display:block;margin-bottom:5px;color:var(--blue);font-size:22px}.feature-item span{color:var(--muted);font-size:13px}.rank-panel h3{margin:0 0 13px;font-size:20px}.rank-row{display:grid;grid-template-columns:38px 1fr auto auto;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}.rank-row:last-child{border-bottom:0}.rank-num{color:var(--blue);font-weight:900;font-variant-numeric:tabular-nums}.rank-row:nth-child(-n+4) .rank-num{color:var(--coral)}.rank-tag{padding:3px 7px;border-radius:5px;color:#637789;background:var(--wash);font-size:11px}.rank-score{color:#c65a42;font-weight:800}
.news-list{display:grid;grid-template-columns:repeat(2,1fr);gap:0 38px}.news-item{display:flex;align-items:center;gap:16px;padding:17px 0;border-bottom:1px solid var(--line)}.news-thumb{width:98px;aspect-ratio:16/10;flex:none;border-radius:8px;background:#d6e8ef}.news-thumb.one{background:#8bb9cb}.news-thumb.two{background:#e2a18a}.news-thumb.three{background:#9ca5ce}.news-thumb.four{background:#9bc3a8}.news-item h3{margin:4px 0 5px;font-size:16px}.news-item time{color:var(--muted);font-size:12px}.news-tag{color:var(--blue);font-size:12px;font-weight:700}
.faq-list{max-width:900px;border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{position:relative;padding:20px 42px 20px 0;list-style:none;font-weight:700;cursor:pointer}summary::-webkit-details-marker{display:none}summary:after{position:absolute;right:5px;top:18px;color:var(--blue);font-size:23px;content:"+";transition:transform .2s}details[open] summary:after{transform:rotate(45deg)}details p{margin:0;padding:0 40px 20px 0;color:var(--muted);font-size:14px}
.bottom-cta{padding:32px 0;background:var(--blue);color:#fff}.bottom-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}.bottom-cta h2{margin:0 0 5px;font-size:24px}.bottom-cta p{margin:0;color:#d9efff}.bottom-cta .button-secondary{color:var(--blue)}
.site-footer{padding:58px 0 98px;color:#aebdca;background:#132b3c}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px}.footer-brand{color:#fff}.site-footer p{max-width:280px;margin:17px 0 0;color:#aebdca;font-size:14px}.footer-col{display:flex;flex-direction:column;gap:9px;font-size:14px}.footer-col h2{margin:0 0 8px;color:#fff;font-size:15px}.footer-col a:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:38px;padding-top:19px;border-top:1px solid rgba(255,255,255,.14);font-size:12px}
@media (max-width:1024px){.film-grid{grid-template-columns:repeat(3,1fr)}.nav-cta{display:none}.main-nav{gap:15px}.support-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:768px){.container{width:min(var(--container),calc(100% - 32px))}.nav-wrap{min-height:68px}.main-nav{position:absolute;top:69px;right:16px;left:16px;display:none;flex-direction:column;align-items:stretch;gap:0;padding:10px 18px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}.main-nav.open{display:flex}.main-nav a{padding:12px 0;border-bottom:1px solid #edf2f6}.main-nav a:last-child{border-bottom:0}.main-nav a.active:after{display:none}.menu-toggle{display:block;margin-left:auto}.page-head{padding:50px 0 45px}.page-head h1{font-size:38px}.section{padding:58px 0}.section-head{display:block}.section-head h2{font-size:25px}.filter-bar{align-items:flex-start}.filter-clear{margin-left:0}.film-grid{grid-template-columns:repeat(2,1fr);gap:14px}.film-body{padding:12px}.poster{padding:12px}.poster-title{font-size:16px}.feature-list{grid-template-columns:1fr}.news-list{grid-template-columns:1fr}.bottom-cta-inner{display:block}.bottom-cta .button{margin-top:17px}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:6px}}
@media (max-width:520px){.brand{font-size:17px}.brand-mark{width:35px;height:35px}.page-head h1{font-size:32px}.page-summary{font-size:15px}.head-meta{gap:7px}.meta-pill{font-size:11px}.film-grid{grid-template-columns:1fr 1fr}.film-info{display:block}.film-info span{display:block;margin-top:3px}.rank-row{grid-template-columns:32px 1fr auto}.rank-tag{display:none}.rank-score{font-size:13px}.news-item{gap:11px}.news-thumb{width:82px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px 18px}.site-footer{padding-bottom:75px}}

/* roulang page: category2 */
:root{--blue:#1879d4;--blue-dark:#125eaa;--blue-soft:#e9f4ff;--cyan:#36b7c8;--coral:#ef7864;--green:#188a70;--ink:#1c2c3c;--muted:#68798a;--line:#e3ebf2;--paper:#fff;--wash:#f4f8fc;--warm:#fff9f4;--radius:12px;--shadow:0 10px 28px rgba(25,62,96,.08);--container:1220px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.65 "Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif}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% - 48px));margin-inline:auto}
.site-header{position:sticky;z-index:50;top:0;border-bottom:1px solid rgba(222,232,241,.9);background:rgba(255,255,255,.96);backdrop-filter:blur(12px)}.nav-wrap{min-height:76px;display:flex;align-items:center;gap:26px}.brand{display:flex;align-items:center;gap:11px;flex:none;font-size:19px;font-weight:800}.brand-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;color:#fff;background:var(--blue);font-size:21px;font-weight:900;box-shadow:0 5px 12px rgba(24,121,212,.22)}.brand span:last-child{white-space:nowrap}
.main-nav{display:flex;align-items:center;justify-content:center;gap:clamp(12px,2vw,27px);margin-left:auto}.main-nav a{position:relative;padding:10px 0;color:#536578;font-size:14px;font-weight:600;transition:.2s}.main-nav a:hover,.main-nav a:focus-visible,.main-nav a.active{color:var(--blue)}.main-nav a.active:after{position:absolute;right:0;bottom:2px;left:0;height:2px;border-radius:2px;background:var(--blue);content:""}.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid transparent;border-radius:9px;font-weight:700;transition:.2s}.nav-cta,.button-primary{color:#fff;background:var(--blue);box-shadow:0 5px 14px rgba(24,121,212,.16)}.nav-cta:hover,.button-primary:hover{background:var(--blue-dark);box-shadow:0 8px 18px rgba(24,121,212,.23);transform:translateY(-1px)}.button-secondary{color:var(--ink);border-color:#d8e3ec;background:#fff}.button-secondary:hover{color:var(--blue);border-color:var(--blue);background:#f7fbff}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid rgba(24,121,212,.32);outline-offset:3px}.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink)}
.page-intro{padding:72px 0 58px;background:var(--wash);border-bottom:1px solid var(--line)}.crumb{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:13px}.crumb a{color:var(--blue)}.intro-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:60px;align-items:end}.page-intro h1{max-width:720px;margin:18px 0 12px;font-size:clamp(34px,4.5vw,56px);line-height:1.18}.page-intro h1 em{color:var(--blue);font-style:normal}.intro-copy{max-width:730px;margin:0;color:var(--muted);font-size:17px}.intro-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat{padding:20px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}.stat strong{display:block;color:var(--blue);font-size:28px;line-height:1.2}.stat span{color:var(--muted);font-size:13px}
.section{padding:78px 0}.section-wash{background:var(--wash)}.section-warm{background:var(--warm)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}.section-head h2{margin:0;font-size:29px;line-height:1.3}.section-head p{max-width:650px;margin:8px 0 0;color:var(--muted)}.section-kicker{display:block;margin-bottom:7px;color:var(--blue);font-size:12px;font-weight:800}.text-link{display:inline-flex;align-items:center;gap:7px;color:var(--blue);font-size:14px;font-weight:700;white-space:nowrap}.text-link:hover{color:var(--blue-dark)}
.filter-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}.filter-label{color:var(--muted);font-size:14px;font-weight:700}.filter-item{padding:8px 14px;border:1px solid var(--line);border-radius:99px;color:#5e7183;background:#fff;font-size:13px;transition:.2s}.filter-item:hover,.filter-item.active{color:var(--blue);border-color:#a9d2f3;background:var(--blue-soft)}.filter-clear{margin-left:auto;color:var(--coral);border:0;background:transparent;font-size:13px}
.film-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.film-card{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 5px 18px rgba(25,62,96,.05);transition:.25s}.film-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#b8d7ef}.poster{position:relative;aspect-ratio:16/10;display:flex;align-items:end;padding:16px;color:#fff;overflow:hidden}.poster:before{position:absolute;inset:0;background:linear-gradient(140deg,rgba(255,255,255,.18),transparent 45%,rgba(5,24,40,.45));content:""}.poster:after{position:absolute;right:-18px;top:18px;width:110px;height:110px;border:1px solid rgba(255,255,255,.3);border-radius:50%;content:""}.poster-title{position:relative;z-index:1;font-size:18px;font-weight:800;text-shadow:0 1px 5px #142433}.poster-blue{background:#2879b5}.poster-coral{background:#c86762}.poster-teal{background:#278d91}.poster-violet{background:#695a9d}.poster-night{background:#283d63}.poster-sand{background:#b28a62}.poster-rose{background:#a95375}.poster-ocean{background:#287b9d}.film-body{padding:15px 16px 17px}.film-title{display:block;margin-bottom:9px;font-size:17px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.film-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;color:var(--muted);font-size:12px}.badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:5px;color:var(--green);background:#e9f7f2;font-size:11px;font-weight:800}.badge.coral{color:#b64e3e;background:#fff0ed}.score{color:#d66a31;font-weight:800}.film-desc{margin:9px 0 0;color:var(--muted);font-size:13px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.popular-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:20px}.feature-card{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow)}.feature-card .poster{min-height:250px}.feature-copy{padding:28px}.feature-copy h3{margin:10px 0 8px;font-size:25px}.feature-copy p{color:var(--muted)}.compact-list{display:grid;grid-template-columns:1fr 1fr;gap:20px}.compact-card{display:flex;gap:14px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fff;transition:.2s}.compact-card:hover{border-color:#aad1ee;box-shadow:var(--shadow)}.compact-card .poster{width:110px;flex:none;aspect-ratio:1/1.15;border-radius:8px;padding:9px}.compact-card .poster-title{font-size:13px}.compact-card h3{margin:4px 0 8px;font-size:16px}.compact-card p{margin:0;color:var(--muted);font-size:12px}
.rank-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px}.rank-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}.rank-item{display:grid;grid-template-columns:46px 1fr auto auto;gap:12px;align-items:center;padding:15px 4px;border-bottom:1px solid var(--line)}.rank-num{font-size:21px;font-weight:900;color:#8da0b0}.rank-item:nth-child(-n+3) .rank-num{color:var(--coral)}.rank-name{font-weight:750}.rank-tag{padding:3px 8px;border-radius:5px;color:var(--blue);background:var(--blue-soft);font-size:11px}.rank-info{text-align:right;color:var(--muted);font-size:12px}.rank-info strong{display:block;color:#d66a31;font-size:14px}
.news-list{display:grid;grid-template-columns:1fr 1fr;gap:0 34px;border-top:1px solid var(--line)}.news-item{display:flex;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}.news-thumb{width:92px;height:66px;flex:none;border-radius:8px;background:#d8eefa;position:relative;overflow:hidden}.news-thumb:after{content:"";position:absolute;width:70px;height:70px;right:-14px;top:-18px;border-radius:50%;background:#71b8d4;opacity:.75}.news-item h3{margin:0 0 5px;font-size:15px;line-height:1.45}.news-item time{color:var(--muted);font-size:12px}
.faq-list{max-width:900px;margin:auto;border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{position:relative;padding:21px 42px 21px 4px;cursor:pointer;font-weight:750;list-style:none}summary::-webkit-details-marker{display:none}summary:after{position:absolute;right:8px;top:18px;color:var(--blue);content:"＋";font-size:22px;font-weight:400}details[open] summary:after{content:"－"}details p{margin:0;padding:0 42px 22px 4px;color:var(--muted);font-size:14px}.bottom-cta{padding:32px 38px;display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid #b9dcf6;border-radius:14px;background:var(--blue-soft)}.bottom-cta h2{margin:0 0 5px;font-size:23px}.bottom-cta p{margin:0;color:var(--muted)}.cta-actions{display:flex;gap:10px;flex-wrap:wrap}
.site-footer{padding:58px 0 24px;color:#d0dce5;background:#173247}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:38px}.footer-brand{color:#fff}.footer-brand .brand-mark{background:#2b91df}.site-footer p{max-width:300px;color:#aebfcb;font-size:13px}.footer-col{display:flex;flex-direction:column;gap:9px}.footer-col h2{margin:0 0 7px;color:#fff;font-size:15px}.footer-col a,.footer-col span{color:#aebfcb;font-size:13px}.footer-col a:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:42px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);color:#9fb3c2;font-size:12px}
@media(max-width:1024px){.intro-grid{gap:30px}.film-grid{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}.footer-grid>:last-child{display:none}}
@media(max-width:768px){.container{width:min(var(--container),calc(100% - 32px))}.nav-wrap{min-height:68px}.main-nav{display:none;position:absolute;top:68px;right:16px;left:16px;flex-direction:column;align-items:stretch;gap:0;padding:10px 18px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}.main-nav.open{display:flex}.main-nav a{padding:12px 0}.main-nav a.active:after{right:auto;width:28px}.nav-cta{display:none}.menu-toggle{display:block;margin-left:auto}.intro-grid,.popular-grid,.rank-layout{grid-template-columns:1fr}.page-intro{padding:52px 0 44px}.section{padding:58px 0}.film-grid{grid-template-columns:repeat(2,1fr)}.news-list{grid-template-columns:1fr}.bottom-cta{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>:first-child{grid-column:1/-1}}
@media(max-width:520px){.brand{font-size:16px}.brand-mark{width:34px;height:34px;font-size:18px}.intro-stats{grid-template-columns:1fr 1fr}.page-intro h1{font-size:35px}.section-head{display:block}.section-head .text-link{margin-top:13px}.film-grid{grid-template-columns:1fr 1fr;gap:12px}.film-body{padding:12px}.film-title{font-size:15px}.poster{padding:11px}.poster-title{font-size:14px}.film-desc{font-size:12px}.feature-card{grid-template-columns:1fr}.feature-card .poster{min-height:190px}.compact-list{grid-template-columns:1fr}.rank-item{grid-template-columns:32px 1fr auto}.rank-tag{display:none}.footer-grid{grid-template-columns:1fr}.footer-grid>:first-child{grid-column:auto}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:7px}}
