/* roulang page: index */
:root{
  --cream:#fff8ef;--paper:#fffdf9;--ink:#281d32;--muted:#766b78;
  --berry:#a73552;--coral:#f4775c;--plum:#38213f;--lime:#c7d96b;
  --gold:#e4b45c;--line:#eadfd8;--shadow:0 14px 36px rgba(66,35,48,.09);
  --radius:18px;--container:1220px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Noto Sans CJK SC","Microsoft YaHei",sans-serif;background:var(--cream);color:var(--ink);line-height:1.7}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a{ -webkit-tap-highlight-color:transparent}
img{max-width:100%;display:block}
.container{width:min(var(--container),calc(100% - 40px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,248,239,.94);backdrop-filter:blur(14px);border-bottom:1px solid rgba(234,223,216,.9)}
.navbar{height:76px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:11px;min-width:max-content}
.logo-mark{width:42px;height:42px;background:var(--coral);color:var(--plum);display:grid;place-items:center;border-radius:12px 5px 12px 5px;font-size:13px;font-weight:900;line-height:1.05;text-align:center}
.brand-name{font-size:20px;font-weight:800;letter-spacing:.02em}
.brand-note{font-size:11px;color:var(--muted);display:block;line-height:1.2}
.nav-links{display:flex;align-items:center;gap:5px;margin-left:auto}
.nav-links a{padding:9px 13px;border-radius:9px;color:#554957;font-size:14px;font-weight:600;transition:.25s}
.nav-links a:hover,.nav-links a.active{background:#f5e4da;color:var(--berry)}
.nav-cta,.btn-primary{background:var(--coral);color:#fff;border:0;border-radius:11px;padding:12px 19px;font-weight:700;cursor:pointer;transition:.25s}
.nav-cta:hover,.btn-primary:hover{background:var(--berry);transform:translateY(-2px)}
.menu-toggle{display:none;border:1px solid var(--line);background:var(--paper);border-radius:9px;padding:8px 11px;color:var(--plum)}
.hero{padding:78px 0 68px;background:linear-gradient(120deg,#fff8ef 0%,#f9e5dc 54%,#f7d6cf 100%);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:58px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--berry);font-size:13px;font-weight:800;margin-bottom:16px}
.eyebrow:before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
h1{font-size:clamp(38px,5vw,68px);line-height:1.13;letter-spacing:-.05em;color:var(--plum);margin-bottom:18px}
h1 em{color:var(--berry);font-style:normal}
.hero-sub{font-size:20px;font-weight:700;margin-bottom:14px}
.hero-copy{max-width:650px;color:#665765;font-size:16px;margin-bottom:25px}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.btn-secondary{border:1px solid #714459;color:var(--plum);background:transparent;border-radius:11px;padding:11px 18px;font-weight:700;transition:.25s}
.btn-secondary:hover{background:var(--plum);color:#fff;transform:translateY(-2px)}
.hero-stage{position:relative;min-height:365px}
.poster{position:absolute;width:190px;height:270px;border-radius:16px;box-shadow:var(--shadow);overflow:hidden;padding:20px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end}
.poster:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(27,12,28,.76))}
.poster>*{position:relative;z-index:1}
.poster strong{font-size:24px;line-height:1.2}
.poster small{font-size:12px;opacity:.85}
.poster.one{left:12%;top:36px;background:linear-gradient(145deg,#522449,#df765d)}
.poster.two{right:8%;top:0;background:linear-gradient(145deg,#d98d5e,#613452);transform:rotate(7deg)}
.poster.three{left:34%;bottom:0;background:linear-gradient(145deg,#788a48,#e2b96c);transform:rotate(-5deg)}
.hero-ticket{position:absolute;right:0;bottom:28px;background:var(--plum);color:#fff;border-radius:12px;padding:14px 17px;box-shadow:var(--shadow);font-size:13px}
.hero-ticket b{font-size:25px;color:var(--coral);display:block;line-height:1.1}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:34px}
.stat{background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.8);border-radius:13px;padding:14px 15px}
.stat b{display:block;font-size:24px;color:var(--plum);font-family:ui-monospace,monospace}
.stat span{font-size:12px;color:var(--muted)}
section{padding:84px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}
.section-kicker{font-size:12px;letter-spacing:.12em;color:var(--berry);font-weight:800;text-transform:uppercase}
h2{font-size:clamp(27px,3vw,40px);line-height:1.2;color:var(--plum);margin-top:5px;letter-spacing:-.035em}
.section-desc{color:var(--muted);max-width:600px;font-size:14px}
.text-link{color:var(--berry);font-weight:800;white-space:nowrap;border-bottom:1px solid #dca8ae;padding-bottom:3px}
.latest{background:var(--paper)}
.movie-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:21px}
.movie-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.28s;box-shadow:0 5px 18px rgba(61,31,42,.035)}
.movie-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#e5a399}
.cover{aspect-ratio:2/2.85;position:relative;display:flex;align-items:end;padding:16px;color:#fff;overflow:hidden}
.cover:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(25,12,28,.78))}
.cover>*{position:relative;z-index:1}
.cover b{font-size:22px;line-height:1.2;display:block}
.cover small{font-size:12px;opacity:.9}
.c1{background:linear-gradient(140deg,#51304c,#ec8068)}.c2{background:linear-gradient(140deg,#213b48,#d29c67)}
.c3{background:linear-gradient(140deg,#7d3d47,#e9c16c)}.c4{background:linear-gradient(140deg,#283f2e,#d96d55)}
.c5{background:linear-gradient(140deg,#3f2854,#9e82c5)}.c6{background:linear-gradient(140deg,#6a4430,#ed9b71)}
.c7{background:linear-gradient(140deg,#24434b,#c66e82)}.c8{background:linear-gradient(140deg,#582c38,#d7b36d)}
.c9{background:linear-gradient(140deg,#293b61,#e18460)}.c10{background:linear-gradient(140deg,#4d3d28,#d7a84e)}.c11{background:linear-gradient(140deg,#473750,#db7893)}.c12{background:linear-gradient(140deg,#28483c,#df8c53)}
.badge{position:absolute;top:13px;left:13px;background:var(--lime);color:#283324;border-radius:6px;padding:3px 7px;font-size:11px;font-weight:800}
.card-info{padding:13px 15px 16px}.card-title{font-weight:800;color:var(--plum);font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:4px}.score{color:#ad6223;font-weight:800}
.hot{background:#fff4ec}
.hot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:18px}
.featured-hot{grid-row:span 2;background:var(--plum);border-radius:20px;overflow:hidden;color:#fff;display:grid;grid-template-rows:260px auto}
.featured-cover{background:linear-gradient(140deg,#402045,#ed795f);padding:22px;display:flex;align-items:end;font-size:29px;font-weight:800;line-height:1.2}
.featured-hot .hot-copy{padding:20px}.hot-copy p{color:#d9c7d2;font-size:13px;margin:7px 0 14px}
.hot-small{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px;display:flex;gap:13px;align-items:center}
.mini-cover{width:72px;height:92px;border-radius:9px;flex:none;background:linear-gradient(145deg,#b94c64,#f2b66c)}
.hot-small h3{font-size:15px;color:var(--plum)}.hot-small p{font-size:12px;color:var(--muted)}
.channel{background:var(--cream)}
.channel-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.channel-item{min-height:190px;padding:22px;border-radius:16px;border:1px solid var(--line);position:relative;overflow:hidden}
.channel-item:nth-child(1){background:#f8d9ce}.channel-item:nth-child(2){background:#eadcf1}.channel-item:nth-child(3){background:#e8efc9}.channel-item:nth-child(4){background:#f5e7bb}.channel-item:nth-child(5){background:#dce8e5}
.channel-no{font-family:ui-monospace;font-size:13px;color:var(--berry);font-weight:800}.channel-item h3{font-size:21px;margin:22px 0 8px;color:var(--plum)}.channel-item p{font-size:13px;color:#665765}.channel-item small{position:absolute;bottom:18px;color:var(--berry);font-weight:700}
.ranking{background:var(--plum);color:#fff}.ranking h2{color:#fff}.ranking .section-desc{color:#cdbdcc}.rank-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 40px}.rank-item{display:grid;grid-template-columns:44px 1fr 75px 48px;align-items:center;gap:10px;padding:14px 10px;border-bottom:1px solid rgba(255,255,255,.13)}.rank-no{font-size:21px;font-weight:900;color:#d9b46e}.rank-item:nth-child(-n+3) .rank-no{color:var(--coral)}.rank-name{font-weight:700}.rank-tag{font-size:11px;color:#e2cbd5}.rank-hot,.rank-score{font-family:ui-monospace;color:#f5c87b;font-size:13px;text-align:right}
.news{background:var(--paper)}.news-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px 28px}.news-item{display:flex;gap:15px;padding:12px;border-bottom:1px solid var(--line);transition:.2s}.news-item:hover{background:#fff5ed}.news-thumb{width:115px;height:78px;border-radius:10px;flex:none;background:linear-gradient(135deg,#63344e,#e8896c)}.news-item h3{font-size:15px;line-height:1.45;color:var(--plum);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.news-item p{font-size:12px;color:var(--muted);margin-top:5px}
.experience{background:#f7e8df}.experience-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.experience-item{border-top:3px solid var(--coral);padding:17px 5px}.experience-item b{font-size:18px;color:var(--plum);display:block;margin-bottom:7px}.experience-item p{font-size:13px;color:var(--muted)}
.quick{background:var(--cream)}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.quick-item{display:flex;gap:14px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:14px}.quick-num{font-family:ui-monospace;color:var(--berry);font-weight:900}.quick-item h3{font-size:15px;color:var(--plum)}.quick-item p{font-size:12px;color:var(--muted);margin-top:4px}
.faq{background:var(--paper)}.faq-list{max-width:850px;margin:auto}.faq-list details{border-bottom:1px solid var(--line);padding:5px 0}.faq-list details[open]{background:#fff4ed;border-radius:10px;padding:5px 15px;margin:5px 0}.faq-list summary{cursor:pointer;list-style:none;padding:15px 5px;font-weight:800;color:var(--plum)}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"＋";float:right;color:var(--berry)}.faq-list details[open] summary:after{content:"－"}.faq-list p{font-size:14px;color:var(--muted);padding:0 5px 15px}
.form-section{background:var(--berry);color:#fff}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.form-section h2{color:#fff}.form-section .section-desc{color:#f0d8dc;margin-top:13px}.form-box{background:#fff;color:var(--ink);border-radius:18px;padding:24px;box-shadow:var(--shadow)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{margin-bottom:13px}.field label{display:block;font-size:12px;font-weight:800;color:var(--plum);margin-bottom:5px}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 12px;outline:none;background:#fff}.field textarea{min-height:82px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--coral);box-shadow:0 0 0 3px rgba(244,119,92,.16)}.form-box .btn-primary{width:100%}.form-note{font-size:11px;color:var(--muted);margin-top:8px}.form-message{display:none;color:#43813c;font-size:13px;margin-top:8px}
.topics{background:var(--cream)}.topic-list{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:14px}.topic{min-height:145px;border-radius:15px;padding:21px;background:#fff;border:1px solid var(--line);position:relative}.topic:first-child{background:var(--plum);color:#fff}.topic h3{font-size:19px}.topic p{font-size:13px;color:var(--muted);margin-top:8px}.topic:first-child p{color:#d8c6d1}.topic small{position:absolute;bottom:17px;color:var(--berry);font-weight:700}.topic:first-child small{color:#f5bd8f}
.index-strip{padding:27px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fffaf5}.index-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}.index-inner p{font-weight:800;color:var(--plum)}.index-links{display:flex;flex-wrap:wrap;gap:10px}.index-links a{padding:7px 13px;border:1px solid var(--line);border-radius:20px;font-size:13px;color:var(--berry);transition:.2s}.index-links a:hover{background:var(--coral);color:#fff;border-color:var(--coral)}
footer{background:var(--plum);color:#fff;padding:58px 0 20px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px;padding-bottom:42px}.footer-brand p{color:#cdbdcc;font-size:13px;max-width:270px;margin-top:13px}.footer-title{font-weight:800;margin-bottom:13px}.footer-links{display:grid;gap:7px}.footer-links a{font-size:13px;color:#cdbdcc}.footer-links a:hover{color:var(--coral)}.copyright{border-top:1px solid rgba(255,255,255,.14);padding-top:18px;color:#a996a8;font-size:12px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media(max-width:1024px){.movie-grid{grid-template-columns:repeat(3,1fr)}.channel-grid{grid-template-columns:repeat(3,1fr)}.channel-item:last-child{grid-column:span 3}.nav-links a{padding:8px 8px}.hero-grid{gap:25px}.experience-grid,.quick-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.container{width:min(100% - 28px,var(--container))}.navbar{height:68px}.menu-toggle{display:block;margin-left:auto}.nav-links{display:none;position:absolute;top:68px;left:14px;right:14px;background:var(--paper);padding:12px;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{text-align:center}.nav-cta{display:none}.hero{padding:55px 0 45px}.hero-grid{grid-template-columns:1fr}.hero-stage{min-height:285px;max-width:500px;margin:auto;width:100%}.poster{width:145px;height:210px}.poster strong{font-size:18px}.hero-ticket{right:5%;bottom:8px}.stats{grid-template-columns:repeat(2,1fr)}section{padding:60px 0}.section-head{display:block}.section-desc{margin-top:10px}.section-head .text-link{display:inline-block;margin-top:14px}.movie-grid{grid-template-columns:repeat(2,1fr);gap:13px}.card-info{padding:10px}.hot-grid{grid-template-columns:1fr 1fr}.featured-hot{grid-column:span 2;grid-row:auto}.rank-grid,.news-grid,.form-grid{grid-template-columns:1fr}.form-grid{gap:30px}.topic-list{grid-template-columns:1fr 1fr}.topic:first-child{grid-column:span 2}.footer-grid{grid-template-columns:1fr 1fr}.index-inner{display:block}.index-links{margin-top:14px}}
@media(max-width:480px){h1{font-size:39px}.hero-sub{font-size:17px}.hero-copy{font-size:14px}.hero-stage{transform:scale(.92);transform-origin:center}.channel-grid{grid-template-columns:1fr 1fr}.channel-item:last-child{grid-column:span 2}.experience-grid,.quick-grid{grid-template-columns:1fr}.hot-grid{grid-template-columns:1fr}.featured-hot{grid-column:span 1}.news-thumb{width:86px;height:68px}.form-row{grid-template-columns:1fr}.topic-list{grid-template-columns:1fr}.topic:first-child{grid-column:span 1}.footer-grid{grid-template-columns:1fr 1fr;gap:24px}.footer-brand{grid-column:span 2}.rank-item{grid-template-columns:34px 1fr 52px 40px;font-size:13px}}