/* roulang page: index */
:root{
  --ink:#201c2d;--muted:#777383;--paper:#f7f6f3;--white:#fff;
  --purple:#241d35;--purple-2:#34264b;--lime:#c8f36a;--lime-deep:#9fc83b;
  --orange:#f27d52;--line:#e5e1e8;--soft:#efedf2;--radius:18px;
  --shadow:0 16px 36px rgba(36,29,53,.09);--max:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
a{color:inherit;text-decoration:none;transition:.25s ease}
img{display:block;max-width:100%}
button,input{font:inherit}
button{cursor:pointer;border:0}
.container{width:min(var(--max),calc(100% - 48px));margin:auto}
.site-header{height:82px;background:rgba(247,246,243,.94);border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{display:flex;align-items:center;gap:11px;min-width:270px}
.brand-mark{width:38px;height:38px;border-radius:12px;background:var(--purple);position:relative;overflow:hidden}
.brand-mark:before,.brand-mark:after{content:"";position:absolute;border:1px solid var(--lime);border-radius:50%;transform:rotate(-28deg)}
.brand-mark:before{width:46px;height:15px;left:-5px;top:11px}
.brand-mark:after{width:5px;height:5px;background:var(--orange);border:0;left:22px;top:8px}
.brand strong{font-size:16px;line-height:1.2;letter-spacing:-.3px}
.brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.main-nav{display:flex;align-items:center;gap:25px}
.main-nav a{font-size:14px;color:#696473;position:relative;padding:29px 0 25px;white-space:nowrap}
.main-nav a:hover,.main-nav a.active{color:var(--ink)}
.main-nav a.active:after{content:"";height:3px;background:var(--lime-deep);position:absolute;left:0;right:0;bottom:0;border-radius:4px}
.nav-download{background:var(--purple)!important;color:var(--lime)!important;border-radius:10px;padding:11px 16px!important}
.nav-download:hover{background:var(--purple-2)!important;transform:translateY(-2px)}
.menu-btn{display:none;background:transparent;font-size:25px;color:var(--purple)}
.hero{background:var(--purple);color:white;padding:88px 0 72px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:540px;height:540px;border:1px solid rgba(200,243,106,.16);border-radius:50%;right:-180px;top:-250px;box-shadow:0 0 0 35px rgba(200,243,106,.04),0 0 0 72px rgba(200,243,106,.025)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center;position:relative;z-index:1}
.eyebrow,.section-kicker{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--lime);font-weight:700}
.hero h1{font-size:clamp(38px,5vw,70px);line-height:1.1;letter-spacing:-3px;margin:18px 0 22px;max-width:680px}
.hero p{font-size:17px;color:#cec8d6;max-width:580px;line-height:1.85}
.actions{display:flex;gap:13px;margin-top:32px;flex-wrap:wrap}
.btn{min-height:46px;padding:12px 20px;border-radius:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn-primary{background:var(--lime);color:var(--purple)}
.btn-primary:hover{background:#dcff8c;transform:translateY(-2px)}
.btn-dark{border:1px solid #665979;color:white;background:transparent}
.btn-dark:hover{background:#3c2e52;border-color:#9e8db5}
.btn:focus,a:focus,input:focus{outline:3px solid rgba(200,243,106,.65);outline-offset:3px}
.hero-board{background:#302541;border:1px solid #58496a;border-radius:22px;padding:22px;box-shadow:var(--shadow);transform:rotate(1.5deg)}
.board-top{display:flex;justify-content:space-between;align-items:center;color:#c8c0d1;font-size:12px;padding-bottom:18px;border-bottom:1px solid #4b3d5b}
.live-dot{color:var(--lime);font-weight:700}
.score-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;text-align:center;padding:25px 5px;border-bottom:1px solid #473950}
.team{font-size:16px;font-weight:700}.team span{display:block;color:#9287a1;font-size:11px;font-weight:400;margin-top:4px}
.score{font-size:31px;font-weight:800;color:var(--lime);line-height:1}.score em{font-size:13px;font-style:normal;color:#a69aaa;margin:0 7px}
.board-foot{display:flex;gap:9px;margin-top:18px}.mini-line{height:8px;background:#51445f;border-radius:8px;flex:1}.mini-line.on{background:var(--orange);flex:1.5}
.section{padding:86px 0}.section.alt{background:#eeecef}.section.dark{background:var(--purple);color:white}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}
.section-head h2{font-size:32px;line-height:1.2;letter-spacing:-1px;margin-top:8px}
.section-head p{color:var(--muted);max-width:490px;font-size:14px}
.dark .section-head p{color:#b9b1c4}
.text-link{font-size:14px;font-weight:700;border-bottom:1px solid var(--lime-deep);padding-bottom:4px}
.timeline{display:flex;gap:14px;overflow-x:auto;padding:5px 2px 15px;scrollbar-color:#c1bdc7 transparent}
.match{min-width:246px;background:var(--white);border:1px solid var(--line);border-radius:15px;padding:19px;box-shadow:0 5px 15px rgba(30,20,40,.04)}
.match:hover,.media-card:hover,.news-item:hover,.topic:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.match-top,.meta{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}
.badge{border-radius:30px;padding:4px 9px;font-size:11px;font-weight:700;background:var(--soft);color:var(--purple)}
.badge.live{background:#ffe2d8;color:#bd4c2c}.badge.done{background:#e7f1dc;color:#59801c}
.match h3{font-size:16px;margin:18px 0 14px}.versus{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:14px}.versus b{color:var(--orange);font-size:12px}
.media-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:20px}
.feature-media{min-height:350px;border-radius:var(--radius);padding:28px;display:flex;align-items:end;position:relative;overflow:hidden;background:linear-gradient(145deg,#3a2855 15%,#191725 90%)}
.feature-media:before{content:"";position:absolute;width:280px;height:280px;border:1px solid rgba(200,243,106,.3);border-radius:50%;right:12%;top:10%;box-shadow:0 0 0 30px rgba(200,243,106,.04)}
.media-copy{position:relative;max-width:450px}.media-copy h3{font-size:30px;line-height:1.25;color:white;margin:13px 0}.media-copy p{color:#ccc3d5;font-size:14px}
.play{width:48px;height:48px;background:var(--lime);color:var(--purple);border-radius:50%;display:grid;place-items:center;font-size:18px;margin-bottom:28px}
.media-side{display:grid;gap:14px}.media-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:17px;display:flex;gap:14px;align-items:center}.media-thumb{width:92px;height:68px;border-radius:10px;background:linear-gradient(135deg,#d5e28e,#6e5c88);position:relative;flex:none}.media-thumb:after{content:"▶";position:absolute;inset:0;display:grid;place-items:center;color:white}.media-card h4{font-size:14px;line-height:1.4;margin:6px 0}
.duel{background:var(--purple);border-radius:var(--radius);color:white;padding:34px;display:grid;grid-template-columns:1fr 150px 1fr;align-items:center;text-align:center}.duel .club{font-size:20px;font-weight:800}.duel small{display:block;color:#a89eb4;font-size:12px;font-weight:400;margin-top:5px}.duel-score{border-left:1px solid #655871;border-right:1px solid #655871;font-size:42px;color:var(--lime);line-height:1}.duel-score span{display:block;font-size:11px;color:#beb5c7;margin-top:9px}
.data-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.data-panel,.analysis-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px}.data-row{margin:20px 0}.data-label{display:flex;justify-content:space-between;font-size:13px;margin-bottom:8px}.bar{height:9px;background:#e9e7eb;border-radius:10px;overflow:hidden}.bar i{display:block;height:100%;background:var(--lime-deep);border-radius:10px}.metric-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.metric{background:var(--soft);padding:18px;border-radius:13px}.metric strong{display:block;font-size:26px}.metric span{color:var(--muted);font-size:12px}
.news-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}.news-item{background:white;border:1px solid var(--line);padding:20px;border-radius:14px;display:grid;grid-template-columns:68px 1fr;gap:17px}.news-date{font-weight:800;color:var(--orange);font-size:13px;border-right:1px solid var(--line)}.news-date b{display:block;font-size:26px;color:var(--purple);line-height:1.1}.news-item h3{font-size:16px;margin:5px 0}.news-item p{font-size:13px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.analysis-list{display:grid;grid-template-columns:1fr 1fr;gap:16px}.analysis-card{padding:22px;background:#2f2440;border:1px solid #4e3e60;border-radius:15px}.analysis-card h3{font-size:18px;margin:10px 0}.analysis-card p{color:#bdb3c8;font-size:13px}.analysis-card .meta{color:#aaa0b6}
.topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.topic{min-height:230px;border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;justify-content:end;position:relative;overflow:hidden;color:white}.topic:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(22,15,34,.9));}.topic>*{position:relative}.topic.football{background:linear-gradient(135deg,#394d38,#17251f)}.topic.basketball{background:linear-gradient(135deg,#8f4b32,#33202c)}.topic h3{font-size:25px}.topic p{color:#ddd5df;font-size:13px;margin:5px 0 15px}.video-strip{display:grid;grid-template-columns:1.15fr .85fr .85fr;gap:15px}.video-tile{min-height:190px;border-radius:15px;padding:20px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(145deg,#6b6284,#211b2d);color:white;position:relative;overflow:hidden}.video-tile:nth-child(2){background:linear-gradient(145deg,#a65e45,#33202d)}.video-tile:nth-child(3){background:linear-gradient(145deg,#6d8245,#23272c)}.video-tile h3{font-size:17px;position:relative}.video-tile small{color:#d7d1da;position:relative;margin-bottom:5px}.video-tile .play{width:36px;height:36px;font-size:13px;position:absolute;top:18px;left:18px;margin:0}
.app-section{display:grid;grid-template-columns:.75fr 1.25fr;gap:65px;align-items:center}.app-section h2{font-size:35px;line-height:1.25;margin:10px 0 18px}.app-section p{color:var(--muted)}.device-stage{height:330px;background:#e4e1e7;border-radius:25px;position:relative;display:flex;align-items:center;justify-content:center}.device{width:178px;height:300px;background:#292136;border:7px solid #15121c;border-radius:27px;padding:18px 12px;color:white;box-shadow:18px 18px 0 rgba(36,29,53,.12);transform:rotate(-5deg)}.device.second{width:155px;height:260px;position:absolute;margin-left:270px;margin-top:-35px;transform:rotate(8deg);background:#493657;opacity:.9}.device-head{font-size:11px;color:var(--lime);margin-bottom:18px}.device-score{background:#3d3050;padding:14px;border-radius:12px;font-size:11px;margin-bottom:10px}.device-score strong{display:block;font-size:24px;color:var(--lime);margin:7px 0}.device-line{height:6px;background:#776685;border-radius:8px;margin:12px 0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid #dcd8df}.step{padding:26px 24px 15px;border-right:1px solid #dcd8df}.step:last-child{border:0}.step b{display:grid;place-items:center;width:34px;height:34px;background:var(--purple);color:var(--lime);border-radius:50%;margin-bottom:16px}.step h3{font-size:17px;margin-bottom:6px}.step p{color:var(--muted);font-size:13px}
.faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:60px}.faq-grid h2{font-size:32px;line-height:1.25}.faq-list details{border-bottom:1px solid #d9d5dd;padding:17px 0}.faq-list summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between}.faq-list summary:after{content:"+";color:var(--orange);font-size:20px}.faq-list details[open] summary:after{content:"−"}.faq-list p{color:var(--muted);font-size:14px;padding-top:12px;max-width:700px}
.subscribe{background:var(--lime);border-radius:var(--radius);padding:34px 42px;display:flex;align-items:center;justify-content:space-between;gap:25px}.subscribe h2{font-size:27px}.subscribe p{font-size:13px;color:#4d5d2a;margin-top:5px}.subscribe-form{display:flex;gap:8px}.subscribe input{height:46px;border:1px solid #a4c752;border-radius:9px;padding:0 14px;min-width:230px;background:#eaffb9}.subscribe button{background:var(--purple);color:white;border-radius:9px;padding:0 19px;font-weight:700}
.site-footer{background:#1d1729;color:#c9c1d0;padding:55px 0 24px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:35px;padding-bottom:42px}.footer-brand strong{color:white;font-size:17px}.footer-brand p{font-size:13px;line-height:1.8;margin-top:13px;max-width:300px;color:#9990a6}.footer-col h4{color:var(--lime);font-size:13px;margin-bottom:15px}.footer-col a{display:block;font-size:13px;color:#aaa1b0;margin:9px 0}.footer-col a:hover{color:white}.copyright{border-top:1px solid #3a3045;padding-top:20px;font-size:12px;color:#8c8298;display:flex;justify-content:space-between;gap:20px}
.empty{grid-column:1/-1;padding:35px;text-align:center;border:1px dashed #c8c3cc;border-radius:14px;color:var(--muted);font-size:14px}
@media(max-width:1024px){.main-nav{gap:14px}.brand{min-width:220px}.hero-grid{gap:35px}.app-section{gap:35px}}
@media(max-width:768px){.container{width:min(100% - 32px,620px)}.site-header{height:70px}.main-nav{display:none;position:absolute;left:16px;right:16px;top:65px;background:white;border:1px solid var(--line);border-radius:14px;padding:10px 18px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}.main-nav.open{display:flex}.main-nav a{padding:12px 0}.main-nav a.active:after{left:auto;width:35px;right:0;bottom:8px}.nav-download{margin:5px 0}.menu-btn{display:block}.brand{min-width:0}.brand strong{font-size:13px}.brand small{display:none}.hero{padding:60px 0}.hero-grid,.media-layout,.data-grid,.app-section,.faq-grid{grid-template-columns:1fr}.hero h1{letter-spacing:-1.5px}.hero-board{max-width:520px;margin:auto}.section{padding:62px 0}.section-head{display:block}.section-head h2{font-size:27px;margin-bottom:10px}.section-head .text-link{display:inline-block;margin-top:16px}.duel{grid-template-columns:1fr 100px 1fr;padding:25px 12px}.duel .club{font-size:16px}.video-strip,.topic-grid,.news-layout,.analysis-list{grid-template-columns:1fr}.feature-media{min-height:290px}.steps{grid-template-columns:1fr}.step{border-right:0;border-bottom:1px solid #dcd8df}.device-stage{margin-top:10px}.subscribe{display:block;padding:27px}.subscribe-form{margin-top:20px}.subscribe input{min-width:0;flex:1;width:100%}.subscribe button{height:46px}.footer-grid{grid-template-columns:1fr 1fr}.copyright{display:block}.copyright span{display:block;margin-top:8px}}
@media(max-width:480px){.hero h1{font-size:39px}.hero p{font-size:15px}.actions .btn{width:100%}.brand-mark{width:34px;height:34px}.score-row{padding:20px 0}.media-card{padding:13px}.media-thumb{width:78px}.metric-list{gap:8px}.metric{padding:14px}.metric strong{font-size:22px}.subscribe-form{display:block}.subscribe-form button,.subscribe input{width:100%;margin-bottom:8px}.footer-grid{grid-template-columns:1fr}.copyright{line-height:1.7}}

/* roulang page: article */
:root{
      --ink:#201c2d;
      --muted:#777383;
      --paper:#f7f6f3;
      --white:#fff;
      --purple:#241d35;
      --purple-2:#34264b;
      --lime:#c8f36a;
      --lime-deep:#9fc83b;
      --orange:#f27d52;
      --line:#e5e1e8;
      --soft:#efedf2;
      --radius:18px;
      --shadow:0 16px 36px rgba(36,29,53,.09);
      --max:1240px
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      background:var(--paper);
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
      line-height:1.6
    }
    a{color:inherit;text-decoration:none;transition:.25s ease}
    a:hover{color:inherit}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(var(--max),calc(100% - 48px));margin:auto}
    .site-header{
      height:82px;
      background:rgba(247,246,243,.94);
      border-bottom:1px solid var(--line);
      display:flex;
      align-items:center;
      position:sticky;
      top:0;
      z-index:20;
      backdrop-filter:blur(12px)
    }
    .header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .brand{display:flex;align-items:center;gap:11px;min-width:270px}
    .brand-mark{
      width:38px;height:38px;border-radius:12px;background:var(--purple);
      position:relative;overflow:hidden;flex:none
    }
    .brand-mark:before,.brand-mark:after{
      content:"";position:absolute;border:1px solid var(--lime);border-radius:50%;transform:rotate(-28deg)
    }
    .brand-mark:before{width:46px;height:15px;left:-5px;top:11px}
    .brand-mark:after{width:5px;height:5px;background:var(--orange);border:0;left:22px;top:8px}
    .brand strong{font-size:16px;line-height:1.2;letter-spacing:-.3px}
    .brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
    .main-nav{display:flex;align-items:center;gap:25px}
    .main-nav a{
      font-size:14px;color:#696473;position:relative;padding:29px 0 25px;white-space:nowrap
    }
    .main-nav a:hover,.main-nav a.active{color:var(--ink)}
    .main-nav a.active:after{
      content:"";height:3px;background:var(--lime-deep);position:absolute;
      left:0;right:0;bottom:0;border-radius:4px
    }
    .nav-download{background:var(--purple)!important;color:var(--lime)!important;border-radius:10px;padding:11px 16px!important}
    .nav-download:hover{background:var(--purple-2)!important;transform:translateY(-2px)}
    .menu-btn{display:none;background:transparent;font-size:25px;color:var(--purple)}
    .article-hero{
      background:var(--purple);
      color:#fff;
      padding:68px 0 62px;
      position:relative;
      overflow:hidden
    }
    .article-hero:before{
      content:"";position:absolute;width:460px;height:460px;border:1px solid rgba(200,243,106,.17);
      border-radius:50%;right:-150px;top:-260px;box-shadow:0 0 0 30px rgba(200,243,106,.035),0 0 0 68px rgba(200,243,106,.02)
    }
    .article-hero:after{
      content:"";position:absolute;left:7%;bottom:22px;width:100px;height:1px;
      background:var(--lime);box-shadow:35px 0 0 rgba(200,243,106,.45),70px 0 0 rgba(200,243,106,.2)
    }
    .article-hero-inner{position:relative;z-index:1;max-width:920px}
    .breadcrumb-line{display:flex;gap:10px;align-items:center;color:#bdb5c8;font-size:13px;margin-bottom:25px}
    .breadcrumb-line a:hover{color:var(--lime)}
    .breadcrumb-line .sep{color:#756783}
    .article-label{
      display:inline-flex;align-items:center;gap:8px;color:var(--lime);
      font-size:12px;font-weight:700;letter-spacing:1.5px;margin-bottom:18px
    }
    .article-label:before{content:"";width:22px;height:2px;background:var(--lime)}
    .article-hero h1{
      max-width:900px;font-size:clamp(32px,5vw,60px);line-height:1.18;
      letter-spacing:-2px;margin:0 0 23px;font-weight:800
    }
    .article-intro{max-width:780px;color:#d0c9d7;font-size:17px;line-height:1.85;margin:0}
    .article-meta{
      display:flex;flex-wrap:wrap;gap:20px;margin-top:28px;color:#aaa1b7;font-size:13px
    }
    .meta-highlight{color:var(--lime)}
    .reading-layout{
      display:grid;grid-template-columns:minmax(0,820px) 280px;gap:54px;
      align-items:start;padding:72px 0 86px
    }
    .article-content{
      background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
      padding:clamp(26px,5vw,62px);box-shadow:0 10px 30px rgba(36,29,53,.04);
      min-width:0
    }
    .article-content h2{
      font-size:28px;line-height:1.3;margin:38px 0 17px;padding-left:16px;
      border-left:4px solid var(--lime-deep);letter-spacing:-.6px
    }
    .article-content h3{font-size:21px;line-height:1.4;margin:30px 0 13px}
    .article-content p{font-size:17px;line-height:2.05;color:#4f4a58;margin:0 0 21px}
    .article-content strong{color:var(--purple);font-weight:750}
    .article-content ul,.article-content ol{padding-left:25px;margin:18px 0 25px;color:#4f4a58}
    .article-content li{font-size:16px;line-height:1.9;padding-left:5px;margin:6px 0}
    .article-content blockquote{
      margin:30px 0;padding:22px 25px;background:#f1f5e8;border-radius:12px;
      border-left:4px solid var(--lime-deep);color:#4e5937;font-size:17px
    }
    .article-content img{width:100%;border-radius:13px;margin:27px 0}
    .article-content video,.article-content iframe{max-width:100%;width:100%;border:0;border-radius:13px;margin:25px 0}
    .article-content table{width:100%;display:block;overflow-x:auto;border-collapse:collapse;margin:25px 0;font-size:14px}
    .article-content th,.article-content td{border:1px solid var(--line);padding:12px 15px;white-space:nowrap;text-align:left}
    .article-content th{background:var(--soft);color:var(--purple)}
    .article-content hr{border:0;border-top:1px solid var(--line);margin:38px 0}
    .empty-state{text-align:center;padding:45px 20px}
    .empty-state .empty-icon{
      width:58px;height:58px;border-radius:18px;background:var(--soft);color:var(--purple);
      display:grid;place-items:center;margin:0 auto 18px;font-size:25px
    }
    .empty-state h2{border:0;padding:0;font-size:25px;margin:0 0 10px}
    .empty-state p{font-size:15px;margin-bottom:24px}
    .sidebar{position:sticky;top:108px}
    .side-card{
      background:var(--white);border:1px solid var(--line);border-radius:16px;
      padding:23px;margin-bottom:18px
    }
    .side-card.dark{background:var(--purple);color:#fff;border-color:var(--purple)}
    .side-card h3{font-size:17px;margin:0 0 17px}
    .side-card.dark h3{color:var(--lime)}
    .side-index{list-style:none;padding:0;margin:0}
    .side-index li{border-top:1px solid var(--line);padding:11px 0;font-size:13px;color:var(--muted)}
    .side-index li:first-child{border-top:0;padding-top:0}
    .side-index a:hover{color:var(--purple-2)}
    .side-card p{font-size:13px;color:var(--muted);line-height:1.8;margin:0 0 18px}
    .side-card.dark p{color:#c8c0d0}
    .btn{
      min-height:46px;padding:12px 20px;border-radius:10px;font-weight:700;
      display:inline-flex;align-items:center;justify-content:center;gap:8px
    }
    .btn-primary{background:var(--lime);color:var(--purple)}
    .btn-primary:hover{background:#dcff8c;color:var(--purple);transform:translateY(-2px)}
    .btn-dark{border:1px solid #665979;color:#fff;background:transparent}
    .btn-dark:hover{background:#3c2e52;border-color:#9e8db5;color:#fff}
    .btn:focus,a:focus,input:focus{outline:3px solid rgba(200,243,106,.65);outline-offset:3px}
    .article-bottom{background:#eeecef;padding:70px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:28px}
    .section-kicker{font-size:12px;letter-spacing:2px;color:var(--lime-deep);font-weight:700}
    .section-head h2{font-size:31px;line-height:1.2;letter-spacing:-1px;margin:8px 0 0}
    .section-head p{color:var(--muted);max-width:500px;font-size:14px;margin:0}
    .related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
    .related-card{
      background:#fff;border:1px solid var(--line);border-radius:15px;padding:22px;
      min-height:175px;display:flex;flex-direction:column;justify-content:space-between
    }
    .related-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .badge{border-radius:30px;padding:4px 9px;font-size:11px;font-weight:700;background:var(--soft);color:var(--purple);display:inline-block}
    .related-card h3{font-size:17px;line-height:1.5;margin:14px 0 8px}
    .related-card p{font-size:13px;color:var(--muted);margin:0 0 14px}
    .related-meta{font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:10px}
    .download-strip{padding:68px 0;background:var(--purple);color:#fff}
    .download-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}
    .download-inner h2{font-size:30px;line-height:1.3;margin:8px 0 12px}
    .download-inner p{color:#c9c1d2;font-size:15px;margin:0;max-width:650px}
    .site-footer{background:#191524;color:#fff;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:35px;padding-bottom:42px}
    .footer-brand strong{font-size:18px}
    .footer-brand p{color:#aaa1b6;font-size:13px;line-height:1.8;max-width:310px;margin-top:13px}
    .footer-col{display:flex;flex-direction:column;gap:9px}
    .footer-col h4{font-size:14px;color:var(--lime);margin:0 0 9px}
    .footer-col a{font-size:13px;color:#aaa1b6}
    .footer-col a:hover{color:#fff;transform:translateX(2px)}
    .copyright{
      border-top:1px solid #352c43;padding-top:20px;color:#81788d;font-size:12px;
      display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap
    }
    @media (max-width:1024px){
      .main-nav{gap:16px}
      .brand{min-width:245px}
      .reading-layout{grid-template-columns:minmax(0,1fr) 235px;gap:28px}
      .footer-grid{grid-template-columns:1.5fr repeat(3,1fr);gap:20px}
    }
    @media (max-width:768px){
      .container{width:min(var(--max),calc(100% - 32px))}
      .site-header{height:72px}
      .main-nav{
        display:none;position:absolute;left:16px;right:16px;top:68px;background:var(--white);
        border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:var(--shadow);
        flex-direction:column;align-items:stretch;gap:0
      }
      .main-nav.open{display:flex}
      .main-nav a{padding:13px 14px;border-radius:8px}
      .main-nav a.active:after{display:none}
      .main-nav a.active{background:var(--soft)}
      .nav-download{text-align:center;margin-top:5px}
      .menu-btn{display:block}
      .article-hero{padding:48px 0 50px}
      .article-hero h1{letter-spacing:-1px}
      .article-intro{font-size:15px}
      .reading-layout{display:block;padding:42px 0 58px}
      .sidebar{position:static;margin-top:22px}
      .side-index{display:grid;grid-template-columns:repeat(2,1fr);gap:0 15px}
      .related-grid{grid-template-columns:1fr}
      .download-inner{display:block}
      .download-inner .btn{margin-top:22px}
      .footer-grid{grid-template-columns:1fr 1fr}
      .footer-brand{grid-column:1/-1}
    }
    @media (max-width:520px){
      .brand{min-width:0;gap:8px}
      .brand-mark{width:34px;height:34px;border-radius:10px}
      .brand strong{font-size:14px}
      .brand small{font-size:9px}
      .article-meta{gap:10px 15px}
      .article-content{padding:23px 19px}
      .article-content p{font-size:16px;line-height:1.9}
      .article-content h2{font-size:23px;margin-top:30px}
      .section-head{display:block}
      .section-head p{margin-top:12px}
      .download-inner h2{font-size:25px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:25px 15px}
      .copyright{display:block}
      .copyright span{display:block;margin-bottom:7px}
    }

/* roulang page: category1 */
:root{
      --ink:#201c2d;--muted:#777383;--paper:#f7f6f3;--white:#fff;
      --purple:#241d35;--purple-2:#34264b;--lime:#c8f36a;--lime-deep:#9fc83b;
      --orange:#f27d52;--line:#e5e1e8;--soft:#efedf2;--radius:18px;
      --shadow:0 16px 36px rgba(36,29,53,.09);--max:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%}
    button,input{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(var(--max),calc(100% - 48px));margin:auto}
    .site-header{height:82px;background:rgba(247,246,243,.96);border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
    .header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .brand{display:flex;align-items:center;gap:11px;min-width:270px}
    .brand-mark{width:38px;height:38px;border-radius:12px;background:var(--purple);position:relative;overflow:hidden;flex:none}
    .brand-mark:before,.brand-mark:after{content:"";position:absolute;border:1px solid var(--lime);border-radius:50%;transform:rotate(-28deg)}
    .brand-mark:before{width:46px;height:15px;left:-5px;top:11px}
    .brand-mark:after{width:5px;height:5px;background:var(--orange);border:0;left:22px;top:8px}
    .brand strong{font-size:16px;line-height:1.2;letter-spacing:-.3px}
    .brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
    .main-nav{display:flex;align-items:center;gap:25px}
    .main-nav a{font-size:14px;color:#696473;position:relative;padding:29px 0 25px;white-space:nowrap}
    .main-nav a:hover,.main-nav a.active{color:var(--ink)}
    .main-nav a.active:after{content:"";height:3px;background:var(--lime-deep);position:absolute;left:0;right:0;bottom:0;border-radius:4px}
    .nav-download{background:var(--purple)!important;color:var(--lime)!important;border-radius:10px;padding:11px 16px!important}
    .nav-download:hover{background:var(--purple-2)!important;transform:translateY(-2px)}
    .menu-btn{display:none;background:transparent;font-size:25px;color:var(--purple)}
    .btn{min-height:46px;padding:12px 20px;border-radius:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}
    .btn-primary{background:var(--lime);color:var(--purple)}
    .btn-primary:hover{background:#dcff8c;transform:translateY(-2px)}
    .btn-dark{background:var(--purple);color:#fff;border:1px solid var(--purple)}
    .btn-dark:hover{background:var(--purple-2);transform:translateY(-2px)}
    .btn:focus,a:focus,input:focus{outline:3px solid rgba(200,243,106,.65);outline-offset:3px}
    .page-hero{background:var(--purple);color:#fff;padding:76px 0 68px;position:relative;overflow:hidden}
    .page-hero:after{content:"";position:absolute;width:440px;height:440px;border:1px solid rgba(200,243,106,.18);border-radius:50%;right:-120px;top:-220px;box-shadow:0 0 0 34px rgba(200,243,106,.04),0 0 0 70px rgba(200,243,106,.025)}
    .hero-copy{position:relative;z-index:1;max-width:790px}
    .eyebrow,.section-kicker{font-size:12px;letter-spacing:2px;color:var(--lime);font-weight:700}
    .page-hero h1{font-size:clamp(38px,5vw,64px);line-height:1.12;letter-spacing:-2px;margin:16px 0 18px}
    .page-hero p{font-size:17px;color:#cec8d6;max-width:730px;margin:0;line-height:1.85}
    .filter-bar{margin-top:30px;display:flex;gap:9px;flex-wrap:wrap}
    .filter-bar span,.badge{border-radius:30px;padding:5px 11px;font-size:12px;font-weight:700}
    .filter-bar span{color:#e6e0ec;border:1px solid #5b4c6d}
    .filter-bar span.active{background:var(--lime);border-color:var(--lime);color:var(--purple)}
    .section{padding:78px 0}
    .section.alt{background:#eeecef}
    .section.dark{background:var(--purple);color:white}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:28px}
    .section-head h2{font-size:32px;line-height:1.2;letter-spacing:-1px;margin:8px 0 0}
    .section-head p{color:var(--muted);max-width:510px;font-size:14px;margin:0}
    .dark .section-head p{color:#b9b1c4}
    .schedule-wrap{border:1px solid var(--line);border-radius:var(--radius);background:var(--white);overflow:hidden;box-shadow:var(--shadow)}
    .date-strip{display:flex;gap:8px;padding:16px 20px;border-bottom:1px solid var(--line);overflow:auto}
    .date-strip span{min-width:82px;text-align:center;padding:8px 12px;border-radius:10px;background:var(--soft);font-size:13px;white-space:nowrap}
    .date-strip span.current{background:var(--purple);color:var(--lime)}
    .event-row{display:grid;grid-template-columns:100px 1.2fr 1fr 110px 100px;gap:18px;align-items:center;padding:21px 24px;border-bottom:1px solid var(--line)}
    .event-row:last-child{border:0}
    .event-time{font-size:20px;font-weight:800}
    .event-name strong{display:block;font-size:16px}
    .event-name small,.event-teams small{color:var(--muted);font-size:12px}
    .event-teams{font-size:14px}
    .event-teams b{font-weight:700}
    .badge{display:inline-block;background:var(--soft);color:var(--purple)}
    .badge.live{background:#ffe2d8;color:#bd4c2c}
    .badge.done{background:#e7f1dc;color:#59801c}
    .video-link{font-size:13px;font-weight:700;text-align:right}
    .video-link:hover{color:#789c20}
    .media-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:20px}
    .feature-media{min-height:350px;border-radius:var(--radius);padding:28px;display:flex;align-items:end;position:relative;overflow:hidden;background:linear-gradient(145deg,#3a2855 15%,#191725 90%)}
    .feature-media:before{content:"";position:absolute;width:280px;height:280px;border:1px solid rgba(200,243,106,.3);border-radius:50%;right:12%;top:10%;box-shadow:0 0 0 30px rgba(200,243,106,.04)}
    .media-copy{position:relative;max-width:450px}
    .media-copy h3{font-size:30px;line-height:1.25;color:white;margin:13px 0}
    .media-copy p{color:#ccc3d5;font-size:14px}
    .play{width:54px;height:54px;border-radius:50%;background:var(--lime);color:var(--purple);display:grid;place-items:center;font-size:20px;margin-bottom:18px}
    .media-side{display:grid;gap:14px}
    .media-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:17px;display:flex;gap:14px;align-items:center}
    .media-card:hover,.article-row:hover,.scene:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
    .media-thumb{width:92px;height:68px;border-radius:10px;background:linear-gradient(135deg,#d5e28e,#6e5c88);position:relative;flex:none}
    .media-thumb:after{content:"▶";position:absolute;inset:0;display:grid;place-items:center;color:white}
    .media-card h4{font-size:14px;line-height:1.4;margin:6px 0}
    .meta{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}
    .compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .compare-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px}
    .compare-panel h3{margin:0 0 20px;font-size:20px}
    .metric{margin:20px 0}
    .metric-line{display:flex;justify-content:space-between;font-size:13px;margin-bottom:8px}
    .bar{height:8px;background:var(--soft);border-radius:8px;overflow:hidden}
    .bar i{display:block;height:100%;background:var(--lime-deep);border-radius:8px}
    .insight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
    .insight{padding:24px;background:#302541;color:#fff;border:1px solid #514261;border-radius:15px}
    .insight .number{font-size:31px;font-weight:800;color:var(--lime)}
    .insight h3{font-size:17px;margin:12px 0 7px}
    .insight p{color:#bdb3c8;font-size:13px;margin:0}
    .article-list{display:grid;gap:13px}
    .article-row{display:grid;grid-template-columns:90px 1fr auto;gap:20px;align-items:center;padding:20px;background:#fff;border:1px solid var(--line);border-radius:14px}
    .article-date{font-size:13px;color:var(--muted);border-right:1px solid var(--line)}
    .article-row h3{font-size:17px;margin:0 0 5px}
    .article-row p{margin:0;color:var(--muted);font-size:13px}
    .article-row .arrow{font-size:22px;color:var(--lime-deep)}
    .download-strip{background:var(--purple-2);border-radius:var(--radius);padding:34px 38px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .download-strip h2{margin:0 0 7px;font-size:26px}
    .download-strip p{margin:0;color:#c9c1d2;font-size:14px}
    .site-footer{background:#191525;color:#fff;padding:52px 0 24px}
    .footer-grid{display:grid;grid-template-columns:1.7fr repeat(3,1fr);gap:35px}
    .footer-brand strong{font-size:18px}
    .footer-brand p{color:#aaa1b6;font-size:13px;max-width:300px;margin-top:14px}
    .footer-col h4{font-size:14px;margin:0 0 14px;color:var(--lime)}
    .footer-col a{display:block;color:#aaa1b6;font-size:13px;margin:9px 0}
    .footer-col a:hover{color:#fff}
    .copyright{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #352b43;margin-top:38px;padding-top:19px;color:#81778e;font-size:12px}
    @media(max-width:900px){
      .main-nav{gap:14px}.brand{min-width:230px}
      .media-layout,.compare-grid{grid-template-columns:1fr}
      .event-row{grid-template-columns:75px 1fr 1fr 90px}
      .event-row .video-link{display:none}
      .insight-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:768px){
      .container{width:min(var(--max),calc(100% - 32px))}
      .site-header{height:70px}.brand small{display:none}.brand strong{font-size:14px}
      .main-nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--paper);padding:12px 20px;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
      .main-nav.open{display:flex}.main-nav a{padding:13px 5px}.main-nav a.active:after{bottom:5px}
      .menu-btn{display:block}.nav-download{text-align:center;margin-top:6px}
      .page-hero{padding:58px 0 52px}.page-hero h1{font-size:42px;letter-spacing:-1.5px}
      .section{padding:58px 0}.section-head{display:block}.section-head h2{font-size:27px}.section-head p{margin-top:12px}
      .event-row{grid-template-columns:70px 1fr;gap:8px 14px;padding:18px}
      .event-row .event-teams{grid-column:2}.event-row .badge{grid-column:2;justify-self:start}
      .media-layout{gap:14px}.feature-media{min-height:290px}
      .article-row{grid-template-columns:68px 1fr;gap:13px}.article-row .arrow{display:none}
      .article-date{grid-row:span 2}.download-strip{display:block;padding:27px 24px}.download-strip .btn{margin-top:20px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:27px}.footer-brand{grid-column:1/-1}
      .copyright{display:block}.copyright span{display:block;margin-top:6px}
    }
    @media(max-width:480px){
      .page-hero h1{font-size:35px}.page-hero p{font-size:15px}
      .insight-grid{grid-template-columns:1fr}.feature-media{min-height:260px;padding:22px}
      .media-copy h3{font-size:24px}.footer-grid{grid-template-columns:1fr 1fr}
      .footer-brand{grid-column:1/-1}
    }

/* roulang page: category3 */
:root{
  --ink:#201c2d;--muted:#777383;--paper:#f7f6f3;--white:#fff;
  --purple:#241d35;--purple-2:#34264b;--lime:#c8f36a;--lime-deep:#9fc83b;
  --orange:#f27d52;--line:#e5e1e8;--soft:#efedf2;--radius:18px;
  --shadow:0 16px 36px rgba(36,29,53,.09);--max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--paper);line-height:1.65}
a{color:inherit;text-decoration:none;transition:.25s ease}
img{display:block;max-width:100%}
button,input{font:inherit}
button{cursor:pointer;border:0}
.container{width:min(var(--max),calc(100% - 48px));margin:auto}
.site-header{height:82px;background:rgba(247,246,243,.94);border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{display:flex;align-items:center;gap:11px;min-width:270px}
.brand-mark{width:38px;height:38px;border-radius:12px;background:var(--purple);position:relative;overflow:hidden;flex:none}
.brand-mark:before,.brand-mark:after{content:"";position:absolute;border:1px solid var(--lime);border-radius:50%;transform:rotate(-28deg)}
.brand-mark:before{width:46px;height:15px;left:-5px;top:11px}
.brand-mark:after{width:5px;height:5px;background:var(--orange);border:0;left:22px;top:8px}
.brand strong{font-size:16px;line-height:1.2;letter-spacing:-.3px}
.brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.main-nav{display:flex;align-items:center;gap:25px}
.main-nav a{font-size:14px;color:#696473;position:relative;padding:29px 0 25px;white-space:nowrap}
.main-nav a:hover,.main-nav a.active{color:var(--ink)}
.main-nav a.active:after{content:"";height:3px;background:var(--lime-deep);position:absolute;left:0;right:0;bottom:0;border-radius:4px}
.nav-download{background:var(--purple)!important;color:var(--lime)!important;border-radius:10px;padding:11px 16px!important}
.nav-download:after{display:none}
.nav-download:hover{background:var(--purple-2)!important;transform:translateY(-2px)}
.menu-btn{display:none;background:transparent;font-size:25px;color:var(--purple)}
.btn{min-height:46px;padding:12px 20px;border-radius:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent}
.btn-primary{background:var(--lime);color:var(--purple)}
.btn-primary:hover{background:#dcff8c;transform:translateY(-2px);box-shadow:0 10px 18px rgba(200,243,106,.2)}
.btn-outline{border-color:#82758f;color:var(--purple);background:transparent}
.btn-outline:hover{border-color:var(--purple);background:var(--purple);color:#fff}
.btn:focus,a:focus,input:focus,summary:focus{outline:3px solid rgba(159,200,59,.48);outline-offset:3px}
.section{padding:82px 0}
.section.alt{background:#eeecef}
.section.dark{background:var(--purple);color:#fff}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:30px}
.section-head h2{font-size:clamp(25px,3vw,34px);line-height:1.2;letter-spacing:-1px;margin:7px 0 0}
.section-head p{margin:0;max-width:520px;color:var(--muted);font-size:14px}
.section-kicker{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--lime-deep);font-weight:800}
.dark .section-kicker{color:var(--lime)}
.dark .section-head p{color:#bdb5c5}
.badge{display:inline-flex;align-items:center;border-radius:99px;padding:4px 10px;font-size:11px;line-height:1.3;font-weight:800;background:var(--soft);color:var(--purple)}
.badge.hot{background:#ffe2d8;color:#bd4c2c}
.badge.video{background:#e5f1cf;color:#56791b}
.badge.news{background:#e9e4f1;color:#5d477f}
.breadcrumb-wrap{background:#eeecef;border-bottom:1px solid var(--line)}
.breadcrumb{padding:14px 0;margin:0;font-size:13px;color:var(--muted)}
.breadcrumb a:hover{color:var(--purple)}
.news-intro{padding:52px 0 45px;background:linear-gradient(105deg,#f7f6f3 0%,#f7f6f3 70%,#ece6f2 100%);position:relative;overflow:hidden}
.news-intro:after{content:"";position:absolute;width:310px;height:310px;border:1px solid rgba(36,29,53,.14);border-radius:50%;right:7%;top:-165px;box-shadow:0 0 0 32px rgba(200,243,106,.14),0 0 0 64px rgba(200,243,106,.06)}
.intro-inner{position:relative;z-index:1}
.intro-inner h1{font-size:clamp(34px,5vw,58px);line-height:1.12;letter-spacing:-2.5px;margin:11px 0 17px}
.intro-inner p{max-width:740px;margin:0;color:#5f5968;font-size:16px}
.topic-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.topic-tags span{padding:8px 13px;border:1px solid var(--line);border-radius:99px;background:#fff;color:#574f60;font-size:13px;font-weight:700}
.topic-tags span:first-child{border-color:var(--lime-deep);background:#f1fadf;color:#4d6d19}
.news-grid{display:grid;grid-template-columns:210px minmax(0,1fr);gap:45px}
.news-index{border-right:1px solid var(--line);padding-right:25px}
.news-index h3{font-size:15px;margin:0 0 15px}
.news-index a{display:block;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px;color:#686172}
.news-index a:hover{color:var(--purple);padding-left:5px}
.news-index .index-note{font-size:12px;color:var(--muted);margin-top:24px}
.article-stream{display:grid;gap:14px}
.article-item{display:grid;grid-template-columns:96px minmax(0,1fr);gap:20px;padding:21px 22px;background:#fff;border:1px solid var(--line);border-radius:15px}
.article-item:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#d5cbde}
.article-date{border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;gap:1px}
.article-date strong{font-size:29px;line-height:1;font-weight:800;color:var(--purple)}
.article-date span{font-size:12px;color:var(--muted)}
.article-main h3{font-size:19px;line-height:1.42;margin:8px 0}
.article-main h3 a:hover{color:#6b4d8b}
.article-main p{font-size:14px;color:var(--muted);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.article-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;color:var(--muted);font-size:12px}
.empty-state{padding:42px 25px;text-align:center;border:1px dashed #cfc8d6;border-radius:16px;background:#fff;color:var(--muted)}
.empty-state b{display:block;font-size:26px;color:var(--purple);margin-bottom:7px}
.more-row{padding-top:25px;text-align:right}
.text-link{font-size:14px;font-weight:800;border-bottom:1px solid var(--lime-deep);padding-bottom:4px}
.text-link:hover{color:#5b7e1a}
.hot-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}
.hot-feature{min-height:390px;border-radius:var(--radius);background:#332545;position:relative;overflow:hidden;padding:32px;display:flex;align-items:flex-end}
.hot-feature:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 22%,rgba(200,243,106,.35),transparent 23%),linear-gradient(135deg,transparent 25%,rgba(255,255,255,.06) 25.5%,transparent 26%);opacity:.9}
.hot-feature:after{content:"";position:absolute;width:350px;height:160px;border:1px solid rgba(200,243,106,.4);border-radius:50%;right:-34px;top:55px;transform:rotate(-22deg)}
.hot-copy{position:relative;z-index:1;max-width:510px}
.hot-copy h3{font-size:clamp(26px,3vw,38px);line-height:1.22;margin:13px 0;color:#fff}
.hot-copy p{color:#d1c8d9;margin:0 0 20px;font-size:14px}
.hot-list{display:grid;gap:13px}
.hot-mini{background:#fff;border:1px solid var(--line);border-radius:15px;padding:18px 19px;display:grid;grid-template-columns:50px 1fr;gap:13px;align-items:center}
.hot-mini:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.hot-mini .number{font-size:25px;font-weight:800;color:#d7d0dc}
.hot-mini h3{font-size:15px;line-height:1.45;margin:5px 0}
.hot-mini h3 a:hover{color:#664a87}
.timeline{position:relative;max-width:1000px;margin:auto}
.timeline:before{content:"";position:absolute;left:122px;top:7px;bottom:7px;width:1px;background:#d6d0da}
.timeline-item{display:grid;grid-template-columns:105px 34px minmax(0,1fr);gap:16px;position:relative;padding:0 0 25px}
.timeline-time{font-size:13px;font-weight:800;color:#61596a;text-align:right;padding-top:6px}
.timeline-dot{width:13px;height:13px;border-radius:50%;margin:8px auto 0;background:var(--lime);border:3px solid #e4f3c5;box-shadow:0 0 0 3px var(--purple)}
.timeline-dot.orange{background:var(--orange);border-color:#ffe5db}
.timeline-content{background:#fff;border:1px solid var(--line);border-radius:13px;padding:15px 18px}
.timeline-content h3{font-size:16px;margin:5px 0}
.timeline-content p{margin:0;color:var(--muted);font-size:13px}
.mix-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px}
.video-feature{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.video-cover{height:265px;background:linear-gradient(130deg,#332448,#6c5a85 52%,#b6d567);position:relative;padding:22px;display:flex;align-items:flex-end}
.video-cover:before{content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,.3);border-radius:12px}
.play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:var(--lime);color:var(--purple);font-size:20px;font-weight:900;box-shadow:0 8px 22px rgba(0,0,0,.2)}
.duration{position:absolute;right:17px;bottom:15px;padding:4px 9px;border-radius:7px;background:rgba(32,28,45,.78);color:#fff;font-size:11px;font-weight:700}
.video-caption{padding:21px}
.video-caption h3{font-size:21px;line-height:1.4;margin:10px 0 6px}
.video-caption p{font-size:13px;color:var(--muted);margin:0}
.reading-panel{background:var(--purple);border-radius:var(--radius);padding:26px;color:#fff}
.reading-panel h3{font-size:24px;line-height:1.3;margin:10px 0 20px}
.reading-row{display:grid;grid-template-columns:36px 1fr;gap:12px;padding:15px 0;border-top:1px solid rgba(255,255,255,.13)}
.reading-row span{color:var(--lime);font-weight:800;font-size:13px}
.reading-row h4{font-size:15px;line-height:1.45;margin:0}
.reading-row p{color:#beb4c8;font-size:12px;margin:4px 0 0}
.channel-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.channel-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px;min-height:152px;position:relative;overflow:hidden}
.channel-card:after{content:"";position:absolute;width:82px;height:82px;border:1px solid #e7e1eb;border-radius:50%;right:-22px;bottom:-27px}
.channel-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.channel-card h3{font-size:17px;margin:0 0 8px}
.channel-card p{font-size:13px;color:var(--muted);margin:0}
.channel-card .arrow{position:absolute;bottom:15px;left:20px;font-weight:800;color:#708f29}
.app-strip{background:var(--purple);border-radius:var(--radius);padding:36px 42px;display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;overflow:hidden}
.app-strip:before{content:"";position:absolute;right:6%;top:-90px;width:245px;height:245px;border-radius:50%;border:1px solid rgba(200,243,106,.4);box-shadow:0 0 0 28px rgba(200,243,106,.05)}
.app-strip h2{position:relative;font-size:29px;line-height:1.25;margin:7px 0;color:#fff}
.app-strip p{position:relative;color:#c7bfce;margin:0;font-size:14px;max-width:700px}
.app-strip .btn{position:relative;white-space:nowrap}
.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:45px}
.faq-intro h2{font-size:34px;line-height:1.2;margin:8px 0 15px}
.faq-intro p{color:var(--muted);font-size:14px}
.faq-list details{background:#fff;border:1px solid var(--line);border-radius:13px;padding:0 18px;margin-bottom:11px}
.faq-list details[open]{border-color:#b5d66d}
.faq-list summary{padding:17px 26px 17px 0;font-size:15px;font-weight:800;cursor:pointer;list-style:none;position:relative}
.faq-list summary:after{content:"＋";position:absolute;right:0;top:14px;color:#628122;font-size:21px;font-weight:400}
.faq-list details[open] summary:after{content:"－"}
.faq-list p{padding:0 0 17px;margin:0;color:var(--muted);font-size:14px}
.site-footer{background:#1f1a2c;color:#e9e4ee;padding:58px 0 22px}
.footer-grid{display:grid;grid-template-columns:1.7fr repeat(3,1fr);gap:35px;padding-bottom:38px}
.footer-brand strong{font-size:20px}
.footer-brand p{font-size:13px;line-height:1.8;color:#afa6ba;max-width:310px;margin:12px 0 0}
.footer-col h4{font-size:14px;color:var(--lime);margin:0 0 13px}
.footer-col a{display:block;font-size:13px;color:#bcb4c6;margin:8px 0}
.footer-col a:hover{color:#fff;padding-left:3px}
.copyright{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;display:flex;justify-content:space-between;gap:16px;color:#92899e;font-size:12px}
@media(max-width:1024px){
  .main-nav{gap:16px}
  .main-nav a{font-size:13px}
  .news-grid{grid-template-columns:165px minmax(0,1fr);gap:28px}
  .channel-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .container{width:min(100% - 32px,var(--max))}
  .site-header{height:68px}
  .brand{min-width:0}
  .brand small{display:none}
  .main-nav{display:none;position:absolute;left:16px;right:16px;top:62px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px 16px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}
  .main-nav.open{display:flex}
  .main-nav a{padding:13px 4px}
  .main-nav a.active:after{left:0;right:auto;width:30px;bottom:5px}
  .nav-download{margin:7px 0;padding:12px 14px!important;text-align:center}
  .menu-btn{display:block}
  .section{padding:58px 0}
  .section-head{display:block;margin-bottom:23px}
  .section-head p{margin-top:12px}
  .news-intro{padding:39px 0}
  .intro-inner h1{letter-spacing:-1.5px}
  .news-grid,.hot-layout,.mix-grid,.faq-grid{grid-template-columns:1fr;gap:25px}
  .news-index{display:flex;gap:13px;overflow:auto;border-right:0;border-bottom:1px solid var(--line);padding:0 0 13px}
  .news-index h3,.news-index .index-note{display:none}
  .news-index a{white-space:nowrap;border:0;padding:5px 0}
  .hot-feature{min-height:315px}
  .timeline:before{left:72px}
  .timeline-item{grid-template-columns:55px 24px minmax(0,1fr);gap:10px}
  .timeline-time{font-size:11px}
  .app-strip{padding:30px 25px;display:block}
  .app-strip .btn{margin-top:20px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
}
@media(max-width:520px){
  .brand strong{font-size:14px}
  .article-item{grid-template-columns:1fr;gap:12px;padding:18px}
  .article-date{border-right:0;border-bottom:1px solid var(--line);padding-bottom:12px;display:flex;flex-direction:row;align-items:baseline;gap:8px}
  .article-date strong{font-size:22px}
  .article-main h3{font-size:17px}
  .hot-feature{padding:23px;min-height:290px}
  .hot-copy h3{font-size:26px}
  .video-cover{height:210px}
  .channel-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;gap:23px}
  .copyright{display:block;line-height:1.9}
  .copyright span{display:block}
}

/* roulang page: category2 */
:root{
      --ink:#201c2d;--muted:#777383;--paper:#f7f6f3;--white:#fff;
      --purple:#241d35;--purple-2:#34264b;--lime:#c8f36a;--lime-deep:#9fc83b;
      --orange:#f27d52;--line:#e5e1e8;--soft:#efedf2;--radius:18px;
      --shadow:0 16px 36px rgba(36,29,53,.09);--max:1240px
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%}
    button,input{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(var(--max),calc(100% - 48px));margin:auto}
    .site-header{height:82px;background:rgba(247,246,243,.95);border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
    .header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .brand{display:flex;align-items:center;gap:11px;min-width:270px}
    .brand-mark{width:38px;height:38px;border-radius:12px;background:var(--purple);position:relative;overflow:hidden}
    .brand-mark:before,.brand-mark:after{content:"";position:absolute;border:1px solid var(--lime);border-radius:50%;transform:rotate(-28deg)}
    .brand-mark:before{width:46px;height:15px;left:-5px;top:11px}
    .brand-mark:after{width:5px;height:5px;background:var(--orange);border:0;left:22px;top:8px}
    .brand strong{font-size:16px;line-height:1.2;letter-spacing:-.3px}
    .brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
    .main-nav{display:flex;align-items:center;gap:25px}
    .main-nav a{font-size:14px;color:#696473;position:relative;padding:29px 0 25px;white-space:nowrap}
    .main-nav a:hover,.main-nav a.active{color:var(--ink)}
    .main-nav a.active:after{content:"";height:3px;background:var(--lime-deep);position:absolute;left:0;right:0;bottom:0;border-radius:4px}
    .nav-download{background:var(--purple)!important;color:var(--lime)!important;border-radius:10px;padding:11px 16px!important}
    .nav-download:hover{background:var(--purple-2)!important;transform:translateY(-2px)}
    .menu-btn{display:none;background:transparent;font-size:25px;color:var(--purple)}
    .page-hero{background:var(--purple);color:#fff;padding:72px 0 62px;position:relative;overflow:hidden}
    .page-hero:after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(200,243,106,.16);border-radius:50%;right:-180px;top:-260px;box-shadow:0 0 0 34px rgba(200,243,106,.04),0 0 0 70px rgba(200,243,106,.025)}
    .hero-inner{position:relative;z-index:1;max-width:850px}
    .eyebrow,.section-kicker{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--lime);font-weight:700}
    .page-hero h1{font-size:clamp(36px,5vw,64px);line-height:1.12;letter-spacing:-2px;margin:16px 0 18px}
    .page-hero p{max-width:760px;color:#cec8d6;font-size:17px;line-height:1.85;margin:0}
    .crumbs{margin-top:27px;color:#aaa0b7;font-size:13px}
    .crumbs a:hover{color:var(--lime)}
    .section{padding:78px 0}
    .section.alt{background:#eeecef}
    .section.dark{background:var(--purple);color:#fff}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:28px}
    .section-head h2{font-size:32px;line-height:1.2;letter-spacing:-1px;margin:8px 0 0}
    .section-head p{color:var(--muted);max-width:520px;font-size:14px;margin:0}
    .dark .section-head p{color:#b9b1c4}
    .filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
    .filter{padding:8px 15px;border:1px solid #675878;border-radius:30px;color:#d4ccdc;font-size:13px;background:transparent}
    .filter.active,.filter:hover{background:var(--lime);border-color:var(--lime);color:var(--purple)}
    .analysis-list{display:grid;grid-template-columns:1.35fr .65fr;gap:20px}
    .article-stream{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
    .stream-item{display:grid;grid-template-columns:86px 1fr auto;gap:20px;align-items:center;padding:23px 25px;border-bottom:1px solid var(--line);transition:.25s ease}
    .stream-item:last-child{border-bottom:0}
    .stream-item:hover{background:#fbfafc;transform:translateX(4px)}
    .stream-date{font-size:12px;color:var(--muted);border-right:1px solid var(--line);line-height:1.4}
    .stream-date strong{display:block;color:var(--purple);font-size:23px;line-height:1}
    .stream-item h3{font-size:17px;margin:5px 0 4px;line-height:1.4}
    .stream-item p{font-size:13px;color:var(--muted);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
    .meta{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px}
    .badge{display:inline-block;border-radius:30px;padding:4px 9px;font-size:11px;font-weight:700;background:var(--soft);color:var(--purple)}
    .badge.live{background:#ffe2d8;color:#bd4c2c}
    .badge.done{background:#e7f1dc;color:#59801c}
    .arrow{font-size:20px;color:var(--purple)}
    .empty-state{padding:55px 25px;text-align:center;color:var(--muted);font-size:14px}
    .empty-state b{display:block;color:var(--purple);font-size:28px;margin-bottom:8px}
    .index-panel{background:var(--purple);color:#fff;border-radius:var(--radius);padding:27px;min-height:100%}
    .index-panel h3{font-size:21px;margin:7px 0 18px}
    .index-panel p{font-size:13px;color:#c4bacd;margin-bottom:22px}
    .index-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #4c3d5b;padding:15px 0;font-size:13px}
    .index-row span:last-child{color:var(--lime);font-weight:700}
    .data-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .data-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px}
    .data-panel h3{font-size:20px;margin:0 0 7px}
    .data-panel>p{color:var(--muted);font-size:13px;margin:0 0 25px}
    .metric{padding:17px 0;border-top:1px solid var(--line)}
    .metric-title{display:flex;justify-content:space-between;font-size:13px;margin-bottom:9px}
    .metric-title strong{color:var(--purple)}
    .bar{height:8px;background:#ece9ef;border-radius:10px;overflow:hidden}
    .bar i{display:block;height:100%;background:var(--lime-deep);border-radius:10px}
    .compare-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
    .compare-card{padding:18px;background:var(--soft);border-radius:14px}
    .compare-card span{font-size:12px;color:var(--muted)}
    .compare-card strong{display:block;font-size:22px;margin-top:7px}
    .timeline{border-left:2px solid #d8d2dc;margin:8px 0 0 12px;padding-left:26px}
    .timeline-item{position:relative;padding:0 0 25px}
    .timeline-item:before{content:"";position:absolute;width:11px;height:11px;border-radius:50%;background:var(--lime-deep);left:-33px;top:7px;border:3px solid var(--paper)}
    .timeline-item h3{font-size:17px;margin:0 0 5px}
    .timeline-item p{font-size:13px;color:var(--muted);margin:0}
    .topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .topic-card{padding:26px;border-radius:var(--radius);border:1px solid var(--line);background:#fff;transition:.25s ease}
    .topic-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .topic-card.dark-card{background:var(--purple);border-color:var(--purple);color:#fff}
    .topic-card h3{font-size:21px;margin:10px 0}
    .topic-card p{font-size:14px;color:var(--muted);margin:0}
    .dark-card p{color:#c4bacd}
    .topic-num{font-size:12px;color:var(--orange);font-weight:800;letter-spacing:1px}
    .cta-strip{background:var(--lime);border-radius:var(--radius);padding:30px 34px;display:flex;justify-content:space-between;align-items:center;gap:25px}
    .cta-strip h2{font-size:26px;margin:0 0 5px;letter-spacing:-.6px}
    .cta-strip p{margin:0;color:#4f5d2e;font-size:14px}
    .btn{min-height:46px;padding:12px 20px;border-radius:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}
    .btn-primary{background:var(--lime);color:var(--purple)}
    .btn-dark{border:1px solid #665979;color:#fff;background:var(--purple)}
    .btn-dark:hover{background:var(--purple-2)}
    .cta-strip .btn-dark:hover{background:#fff;color:var(--purple)}
    .faq-list{max-width:900px;margin:auto}
    .faq-item{border-bottom:1px solid var(--line);padding:20px 0}
    .faq-item summary{font-weight:700;font-size:16px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px}
    .faq-item summary:after{content:"＋";color:var(--lime-deep);font-size:22px;line-height:1}
    .faq-item[open] summary:after{content:"－"}
    .faq-item p{color:var(--muted);font-size:14px;margin:13px 30px 0 0}
    .site-footer{background:var(--purple);color:#fff;padding:54px 0 22px}
    .footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:40px}
    .footer-brand strong{font-size:18px}
    .footer-brand p{color:#bdb3c8;font-size:13px;max-width:300px;margin-top:13px}
    .footer-col h4{font-size:14px;color:var(--lime);margin:0 0 15px}
    .footer-col a{display:block;color:#c6bdce;font-size:13px;margin:9px 0}
    .footer-col a:hover{color:var(--lime)}
    .copyright{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #4b3b5a;color:#a69bad;font-size:12px;margin-top:40px;padding-top:20px}
    .btn:focus,a:focus,summary:focus{outline:3px solid rgba(200,243,106,.65);outline-offset:3px}
    @media(max-width:900px){
      .main-nav{gap:14px}.brand{min-width:230px}.analysis-list,.data-layout{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1.3fr 1fr 1fr}
    }
    @media(max-width:768px){
      .container{width:min(var(--max),calc(100% - 32px))}
      .site-header{height:70px}.main-nav{display:none;position:absolute;top:70px;left:0;right:0;padding:10px 20px 18px;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}
      .main-nav.open{display:flex}.main-nav a{padding:13px 5px}.main-nav a.active:after{bottom:4px}.nav-download{text-align:center;margin-top:7px}
      .menu-btn{display:block}.page-hero{padding:54px 0 48px}.page-hero h1{letter-spacing:-1px}
      .section{padding:58px 0}.section-head{display:block}.section-head h2{font-size:27px;margin-bottom:10px}
      .stream-item{grid-template-columns:62px 1fr;gap:13px;padding:18px}.stream-item .arrow{display:none}
      .topic-grid,.compare-grid{grid-template-columns:1fr}.cta-strip{display:block;padding:25px}.cta-strip .btn{margin-top:20px;width:100%}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}
      .copyright{display:block}.copyright span{display:block;margin-top:7px}
    }
    @media(max-width:480px){
      .brand strong{font-size:14px}.brand small{font-size:9px}.brand-mark{width:34px;height:34px}
      .page-hero h1{font-size:37px}.page-hero p{font-size:15px}.section-head h2{font-size:25px}
      .footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}
    }

/* roulang page: category4 */
:root{
      --ink:#201c2d;--muted:#777383;--paper:#f7f6f3;--white:#fff;
      --purple:#241d35;--purple-2:#34264b;--lime:#c8f36a;--lime-deep:#9fc83b;
      --orange:#f27d52;--line:#e5e1e8;--soft:#efedf2;--radius:18px;
      --shadow:0 16px 36px rgba(36,29,53,.09);--max:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%}
    button,input,textarea{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(var(--max),calc(100% - 48px));margin:auto}
    .site-header{height:82px;background:rgba(247,246,243,.95);border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
    .header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .brand{display:flex;align-items:center;gap:11px;min-width:270px}
    .brand-mark{width:38px;height:38px;border-radius:12px;background:var(--purple);position:relative;overflow:hidden}
    .brand-mark:before,.brand-mark:after{content:"";position:absolute;border:1px solid var(--lime);border-radius:50%;transform:rotate(-28deg)}
    .brand-mark:before{width:46px;height:15px;left:-5px;top:11px}
    .brand-mark:after{width:5px;height:5px;background:var(--orange);border:0;left:22px;top:8px}
    .brand strong{font-size:16px;line-height:1.2;letter-spacing:-.3px}
    .brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
    .main-nav{display:flex;align-items:center;gap:25px}
    .main-nav a{font-size:14px;color:#696473;position:relative;padding:29px 0 25px;white-space:nowrap}
    .main-nav a:hover,.main-nav a.active{color:var(--ink)}
    .main-nav a.active:after{content:"";height:3px;background:var(--lime-deep);position:absolute;left:0;right:0;bottom:0;border-radius:4px}
    .nav-download{background:var(--purple)!important;color:var(--lime)!important;border-radius:10px;padding:11px 16px!important}
    .nav-download:hover{background:var(--purple-2)!important;transform:translateY(-2px)}
    .menu-btn{display:none;background:transparent;font-size:25px;color:var(--purple)}
    .sub-hero{background:var(--purple);color:var(--white);padding:68px 0 64px;position:relative;overflow:hidden}
    .sub-hero:before{content:"";position:absolute;width:500px;height:500px;border:1px solid rgba(200,243,106,.18);border-radius:50%;right:-190px;top:-250px;box-shadow:0 0 0 34px rgba(200,243,106,.04),0 0 0 70px rgba(200,243,106,.025)}
    .sub-hero:after{content:"✦  ·   ·      ✦       ·";position:absolute;right:15%;bottom:28px;color:rgba(200,243,106,.42);letter-spacing:17px;font-size:13px}
    .hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
    .eyebrow,.section-kicker{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--lime);font-weight:700}
    .sub-hero h1{font-size:clamp(36px,5vw,62px);line-height:1.12;letter-spacing:-2px;margin:16px 0 18px;max-width:700px}
    .sub-hero p{font-size:16px;color:#cec8d6;max-width:650px;margin:0;line-height:1.85}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
    .btn{min-height:46px;padding:12px 20px;border-radius:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}
    .btn-primary{background:var(--lime);color:var(--purple)}
    .btn-primary:hover{background:#dcff8c;transform:translateY(-2px)}
    .btn-dark{border:1px solid #665979;color:white;background:transparent}
    .btn-dark:hover{background:#3c2e52;border-color:#9e8db5}
    .btn:focus,a:focus,input:focus,textarea:focus{outline:3px solid rgba(200,243,106,.65);outline-offset:3px}
    .guide-board{background:#302541;border:1px solid #58496a;border-radius:22px;padding:20px;box-shadow:var(--shadow);transform:rotate(1deg)}
    .board-top{display:flex;justify-content:space-between;align-items:center;color:#c9c1d3;font-size:12px;border-bottom:1px solid #493a59;padding-bottom:15px}
    .live-dot{width:8px;height:8px;background:var(--lime);display:inline-block;border-radius:50%;margin-right:7px}
    .screen-nav{display:flex;gap:14px;padding:18px 0 13px;color:#aba1b8;font-size:12px}
    .screen-nav b{color:var(--lime);border-bottom:2px solid var(--lime);padding-bottom:8px}
    .screen-card{background:#3b2c50;border-radius:14px;padding:18px;margin-top:8px}
    .screen-card h3{font-size:21px;margin:7px 0;color:#fff}
    .scoreline{display:flex;justify-content:space-between;align-items:center;color:#d9d2df;font-size:13px}
    .screen-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}
    .screen-stats span{background:#2b213a;border-radius:8px;padding:9px 5px;text-align:center;color:#bdb3c8;font-size:11px}
    .screen-stats b{display:block;color:#fff;font-size:15px}
    .section{padding:78px 0}
    .section.alt{background:#eeecef}
    .section.dark{background:var(--purple);color:#fff}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}
    .section-head h2{font-size:32px;line-height:1.2;letter-spacing:-1px;margin:8px 0 0}
    .section-head p{color:var(--muted);max-width:520px;font-size:14px;margin:0}
    .dark .section-head p{color:#b9b1c4}
    .filter-bar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:28px}
    .filter{border:1px solid var(--line);background:var(--white);padding:8px 15px;border-radius:30px;color:var(--muted);font-size:13px}
    .filter.active,.filter:hover{background:var(--purple);border-color:var(--purple);color:var(--lime)}
    .preview-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px;align-items:stretch}
    .device-stage{min-height:390px;background:#e1dfe5;border-radius:var(--radius);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
    .device-stage:before{content:"";position:absolute;width:320px;height:320px;border:1px solid rgba(52,38,75,.16);border-radius:50%}
    .phone{width:190px;height:350px;border:8px solid #171322;border-radius:28px;background:#fbfaf8;position:relative;z-index:1;box-shadow:0 20px 35px rgba(36,29,53,.22);overflow:hidden}
    .phone-bar{height:30px;background:var(--purple);color:var(--lime);font-size:9px;padding:8px 12px}
    .phone-content{padding:13px}
    .phone-content small{color:var(--muted);font-size:9px}
    .phone-content h4{font-size:17px;line-height:1.25;margin:8px 0 14px}
    .phone-score{background:#eeeaf1;border-radius:10px;padding:12px;font-size:10px;margin-bottom:10px}
    .phone-score strong{display:block;font-size:16px;color:var(--purple);margin-top:4px}
    .phone-line{height:7px;border-radius:8px;background:#e6e2e8;margin:10px 0}
    .phone-line.lime{background:var(--lime);width:72%}
    .feature-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .feature-card{background:var(--white);border:1px solid var(--line);border-radius:15px;padding:22px}
    .feature-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .feature-card strong{display:block;font-size:17px;margin:12px 0 6px}
    .feature-card p{color:var(--muted);font-size:13px;margin:0}
    .feature-icon{width:34px;height:34px;border-radius:10px;background:var(--purple);color:var(--lime);display:grid;place-items:center;font-weight:700}
    .steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid #d9d5dc}
    .step{padding:26px 20px 12px 0;border-bottom:1px solid #d9d5dc;position:relative}
    .step:not(:last-child){margin-right:24px}
    .step:not(:last-child):after{content:"→";position:absolute;right:7px;top:27px;color:var(--lime-deep);font-size:20px}
    .step-num{width:30px;height:30px;border-radius:50%;background:var(--purple);color:var(--lime);display:grid;place-items:center;font-weight:700;font-size:13px}
    .step h3{font-size:17px;margin:14px 0 7px}
    .step p{font-size:13px;color:var(--muted);margin:0}
    .scene-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}
    .scene{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;min-height:142px}
    .scene.featured{background:var(--purple);color:#fff;grid-row:span 2}
    .scene h3{font-size:20px;margin:12px 0 7px}
    .scene p{font-size:13px;color:var(--muted);margin:0}
    .scene.featured p{color:#c8c0d1}
    .scene-tag{font-size:11px;color:var(--orange);font-weight:700}
    .updates{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
    .update-row{display:grid;grid-template-columns:110px 105px 1fr 90px;gap:18px;align-items:center;padding:19px 22px;border-bottom:1px solid var(--line)}
    .update-row:last-child{border-bottom:0}
    .update-row:hover{background:#faf9fb}
    .update-date{font-size:12px;color:var(--muted)}
    .update-row h3{font-size:15px;margin:0 0 3px}
    .update-row p{font-size:12px;color:var(--muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .badge{border-radius:30px;padding:4px 9px;font-size:11px;font-weight:700;background:var(--soft);color:var(--purple);display:inline-block}
    .badge.live{background:#ffe2d8;color:#bd4c2c}
    .badge.done{background:#e7f1dc;color:#59801c}
    .text-link{font-size:13px;font-weight:700;border-bottom:1px solid var(--lime-deep);padding-bottom:3px;white-space:nowrap}
    .empty-state{text-align:center;padding:45px 20px;color:var(--muted);font-size:14px}
    .faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:40px}
    .faq-intro h2{font-size:32px;line-height:1.25;margin:8px 0 15px}
    .faq-intro p{color:var(--muted);font-size:14px}
    .accordion-item{border:1px solid var(--line)!important;border-radius:12px!important;margin-bottom:10px;overflow:hidden;background:#fff}
    .accordion-button{font-weight:700;color:var(--ink);background:#fff;box-shadow:none!important;padding:18px 20px}
    .accordion-button:not(.collapsed){color:var(--purple);background:#f0eef3}
    .accordion-body{font-size:14px;color:var(--muted);padding:0 20px 18px}
    .download-strip{background:var(--purple);color:#fff;border-radius:var(--radius);padding:34px 38px;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .download-strip h2{font-size:27px;margin:0 0 7px}
    .download-strip p{color:#c8c0d1;font-size:14px;margin:0}
    .site-footer{background:#1a1527;color:#fff;padding:52px 0 24px}
    .footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:35px;padding-bottom:42px}
    .footer-brand strong{font-size:18px}
    .footer-brand p{color:#aba2b7;font-size:13px;max-width:280px;margin-top:13px}
    .footer-col h4{font-size:14px;color:var(--lime);margin:0 0 15px}
    .footer-col a{display:block;color:#b7afc0;font-size:13px;margin:9px 0}
    .footer-col a:hover{color:var(--lime)}
    .copyright{border-top:1px solid #393044;padding-top:19px;display:flex;justify-content:space-between;gap:20px;color:#8f879b;font-size:12px}
    @media(max-width:1024px){
      .main-nav{gap:15px}.brand{min-width:235px}.hero-inner,.preview-grid{gap:35px}
      .update-row{grid-template-columns:90px 90px 1fr 70px}
    }
    @media(max-width:768px){
      .container{width:min(var(--max),calc(100% - 32px))}
      .site-header{height:70px}.brand{min-width:0}.brand small{display:none}.brand strong{font-size:14px}
      .main-nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--line);padding:12px 20px;flex-direction:column;align-items:stretch;gap:0}
      .main-nav.open{display:flex}.main-nav a{padding:13px 8px}.main-nav a.active:after{bottom:5px}.nav-download{text-align:center;margin-top:6px}
      .menu-btn{display:block}.hero-inner,.preview-grid,.faq-grid,.scene-grid{grid-template-columns:1fr}
      .sub-hero{padding:52px 0}.sub-hero h1{letter-spacing:-1px}.guide-board{max-width:430px;margin:auto}
      .section{padding:58px 0}.section-head{display:block}.section-head h2{font-size:27px}.section-head p{margin-top:12px}
      .steps{grid-template-columns:1fr;gap:0}.step:not(:last-child){margin-right:0}.step:not(:last-child):after{content:"↓";right:18px;top:28px}
      .scene.featured{grid-row:auto}.update-row{grid-template-columns:1fr auto;gap:8px 12px}.update-row .update-date{grid-column:1}.update-row .badge{grid-column:2;grid-row:1}.update-row h3{grid-column:1 / -1}.update-row p{grid-column:1 / -1}.update-row .text-link{grid-column:1 / -1;justify-self:start}
      .download-strip{display:block;padding:28px 24px}.download-strip .btn{margin-top:20px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1 / -1}.copyright{display:block}.copyright span{display:block;margin-top:6px}
    }
    @media(max-width:480px){
      .feature-list{grid-template-columns:1fr}.sub-hero h1{font-size:36px}.hero-actions .btn{width:100%}
      .device-stage{min-height:350px}.phone{transform:scale(.9)}.footer-grid{grid-template-columns:1fr}
    }