/* roulang page: index */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#ffffff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--warm);
      color:var(--text);
      font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;
      line-height:1.78;
      overflow-x:hidden;
    }
    h1,h2,h3,h4,p,ul,ol{margin-top:0}
    h1,h2,h3,h4{color:var(--text);line-height:1.28;font-weight:750;letter-spacing:-.02em}
    h1{font-size:clamp(2.2rem,4vw,4.6rem)}
    h2{font-size:clamp(1.75rem,2.5vw,2.65rem)}
    h3{font-size:1.24rem}
    p{color:var(--muted)}
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
      outline:3px solid rgba(34,166,161,.35);
      outline-offset:3px;
    }
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .narrow{max-width:820px}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;
      color:var(--brand);font-size:.78rem;font-weight:800;letter-spacing:.12em;
      text-transform:uppercase;margin-bottom:16px
    }
    .eyebrow::before{content:"";width:24px;height:2px;background:var(--accent)}
    .section{padding:92px 0}
    .section.compact{padding:68px 0}
    .section-head{display:flex;justify-content:space-between;gap:32px;align-items:end;margin-bottom:42px}
    .section-head h2{margin-bottom:10px}
    .section-head p{max-width:650px;margin-bottom:0}
    .section-kicker{font-size:.8rem;color:var(--light-muted);letter-spacing:.1em;font-weight:700}
    .site-header{
      position:sticky;top:0;z-index:50;
      background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);
      transition:var(--ease)
    }
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand-mark{
      width:36px;height:36px;border-radius:10px;background:var(--brand);
      color:white;display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)
    }
    .top-tools{display:flex;align-items:center;gap:12px}
    .search-box{display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;border-radius:8px;height:40px;padding:0 12px;min-width:220px}
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-size:.86rem;font-weight:700;color:var(--accent);padding:8px 12px;border-radius:7px}
    .trend-link:hover{background:var(--accent-soft)}
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;min-height:48px;overflow-x:auto;white-space:nowrap}
    .channel-inner::-webkit-scrollbar{height:3px}
    .channel-inner::-webkit-scrollbar-thumb{background:#c8d8e9;border-radius:4px}
    .channel-link{position:relative;padding:11px 15px;color:#50657d;font-size:.9rem;font-weight:650}
    .channel-link:hover,.channel-link.active{color:var(--brand-deep)}
    .channel-link.active::after{content:"";position:absolute;left:15px;right:15px;bottom:0;height:3px;background:var(--brand);border-radius:3px 3px 0 0}
    .mobile-toggle{display:none;border:1px solid var(--line);background:white;border-radius:7px;padding:8px 11px;color:var(--brand-deep)}
    .hero{
      position:relative;min-height:610px;display:flex;align-items:center;
      background:#dfeefa url("/assets/images/backpic/back-1.webp") center/cover no-repeat;
      isolation:isolate;overflow:hidden
    }
    .hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,38,76,.91) 0%,rgba(10,55,103,.76) 45%,rgba(10,55,103,.2) 100%);z-index:-1}
    .hero::after{content:"";position:absolute;right:6%;bottom:-130px;width:340px;height:340px;border:1px solid rgba(255,255,255,.18);border-radius:50%;box-shadow:0 0 0 28px rgba(255,255,255,.05),0 0 0 56px rgba(255,255,255,.035);z-index:-1}
    .hero-content{padding:98px 0 112px;max-width:760px}
    .hero .eyebrow{color:#c5e8ff}
    .hero .eyebrow::before{background:#7cddd5}
    .hero h1{color:white;max-width:760px;margin-bottom:24px}
    .hero h1 em{font-style:normal;color:#8fe1da}
    .hero-intro{color:#e6f0fa;font-size:1.08rem;max-width:700px;margin-bottom:30px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:38px}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;
      min-height:46px;padding:10px 19px;border-radius:8px;border:1px solid transparent;
      font-weight:750;font-size:.93rem;transition:var(--ease)
    }
    .btn-primary{background:var(--brand);color:white;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:white;transform:translateY(-2px);box-shadow:0 12px 22px rgba(23,105,194,.28)}
    .btn-light{background:white;color:var(--brand-deep);border-color:white}
    .btn-light:hover{background:#eaf5ff;color:var(--brand-deep);transform:translateY(-2px)}
    .btn-outline{background:white;color:var(--brand);border-color:#b9d0e7}
    .btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .btn-quiet{background:var(--brand-soft);color:var(--brand-deep)}
    .btn-quiet:hover{background:#d9ecff}
    .hero-points{display:flex;flex-wrap:wrap;gap:24px;color:#dbeaf7;font-size:.88rem}
    .hero-points strong{display:block;color:white;font-size:1.35rem;line-height:1.2}
    .hero-points span{display:block;margin-top:3px}
    .metrics-wrap{margin-top:-48px;position:relative;z-index:3}
    .metrics-panel{background:white;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);padding:28px 30px;display:grid;grid-template-columns:1.35fr repeat(4,1fr);gap:0}
    .metric{padding:4px 24px;border-left:1px solid var(--line)}
    .metric:first-child{border-left:0;padding-left:0}
    .metric-label{font-size:.79rem;color:var(--light-muted);font-weight:700}
    .metric-number{font-size:2.1rem;font-weight:850;color:var(--brand-deep);line-height:1.2;margin:5px 0}
    .metric-note{font-size:.8rem;color:var(--muted);line-height:1.5}
    .metric-main{padding-right:30px}
    .metric-main .metric-number{font-size:2.75rem}
    .mini-bar{height:5px;background:#e9f1f8;border-radius:8px;margin-top:12px;overflow:hidden}
    .mini-bar i{display:block;height:100%;background:var(--accent);border-radius:8px}
    .surface-blue{background:var(--surface-blue)}
    .matrix{display:grid;grid-template-columns:1.45fr 1fr 1fr;grid-template-rows:auto auto;gap:18px}
    .matrix-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-soft);transition:var(--ease);position:relative;overflow:hidden}
    .matrix-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .matrix-card.large{grid-row:span 2;min-height:470px;padding:34px}
    .matrix-card.wide{grid-column:span 2;display:flex;justify-content:space-between;gap:25px;align-items:center}
    .card-image{height:155px;border-radius:10px;overflow:hidden;margin:-2px -2px 22px}
    .large .card-image{height:235px}
    .card-image img{width:100%;height:100%;object-fit:cover;object-position:center}
    .tag{display:inline-flex;padding:4px 9px;border-radius:5px;background:var(--brand-soft);color:var(--brand);font-size:.74rem;font-weight:800;margin-bottom:12px}
    .tag.teal{background:var(--accent-soft);color:#16736f}
    .tag.gray{background:#f0f4f8;color:#60748a}
    .matrix-card h3{margin-bottom:10px}
    .matrix-card p{font-size:.9rem;line-height:1.7}
    .arrow-link{display:inline-flex;align-items:center;gap:8px;font-size:.87rem;font-weight:800;margin-top:12px}
    .arrow-link::after{content:"→";transition:var(--ease)}
    .arrow-link:hover::after{transform:translateX(4px)}
    .number-mark{font-size:2.7rem;color:#d6e7f5;font-weight:850;line-height:1;position:absolute;top:22px;right:26px}
    .comparison{display:grid;grid-template-columns:1fr 48px 1fr;align-items:stretch;gap:22px}
    .compare-card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:34px;box-shadow:var(--shadow-soft)}
    .compare-card.primary{border-top:4px solid var(--brand)}
    .compare-card.secondary{border-top:4px solid var(--accent)}
    .compare-label{font-size:.76rem;font-weight:850;letter-spacing:.1em;color:var(--brand);margin-bottom:12px}
    .compare-card.secondary .compare-label{color:#18827d}
    .compare-card h3{font-size:1.5rem;margin-bottom:14px}
    .compare-card p{font-size:.94rem}
    .compare-list{list-style:none;margin:22px 0 0;padding:0}
    .compare-list li{border-top:1px solid var(--line);padding:11px 0;font-size:.88rem;color:#53677c;display:flex;justify-content:space-between;gap:12px}
    .compare-list b{color:var(--brand-deep)}
    .compare-divider{display:flex;align-items:center;justify-content:center;color:var(--light-muted);font-weight:850;font-size:.85rem}
    .compare-divider span{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--warm)}
    .deep-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:54px;align-items:center}
    .deep-grid.reverse{grid-template-columns:.9fr 1.1fr}
    .deep-grid.reverse .deep-copy{order:2}
    .deep-grid.reverse .deep-image{order:1}
    .deep-copy p{font-size:.98rem}
    .deep-copy p+p{margin-top:13px}
    .deep-image{position:relative}
    .deep-image img{width:100%;height:390px;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}
    .image-note{position:absolute;left:22px;bottom:20px;background:rgba(255,255,255,.94);padding:10px 14px;border-radius:7px;color:var(--brand-deep);font-size:.78rem;font-weight:750}
    .quote-line{border-left:3px solid var(--accent);padding-left:18px;margin-top:22px;color:var(--brand-deep);font-weight:650}
    .news-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:28px}
    .news-main{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft)}
    .news-feature{display:grid;grid-template-columns:1fr 1fr}
    .news-feature img{height:275px;width:100%;object-fit:cover}
    .news-feature-copy{padding:30px}
    .news-date{font-size:.77rem;color:var(--light-muted);font-weight:750}
    .news-feature h3{font-size:1.55rem;margin:12px 0}
    .news-feature p{font-size:.9rem}
    .news-list{border-top:1px solid var(--line)}
    .news-item{display:grid;grid-template-columns:100px 1fr auto;gap:18px;align-items:center;padding:19px 25px;border-bottom:1px solid var(--line);transition:var(--ease)}
    .news-item:last-child{border-bottom:0}
    .news-item:hover{background:#f8fbfe}
    .news-item h4{font-size:1rem;margin:0 0 4px}
    .news-item p{font-size:.82rem;margin:0;line-height:1.55}
    .news-date-block{font-size:.8rem;color:var(--brand);font-weight:800}
    .news-date-block strong{display:block;font-size:1.4rem;line-height:1.3}
    .recommend{background:var(--brand-deep);border-radius:var(--radius);padding:30px;color:white}
    .recommend h3{color:white;margin-bottom:12px}
    .recommend p{color:#cfdeed;font-size:.9rem}
    .recommend-list{list-style:none;margin:24px 0 0;padding:0}
    .recommend-list li{padding:14px 0;border-top:1px solid rgba(255,255,255,.16)}
    .recommend-list a{display:flex;justify-content:space-between;gap:12px;color:white;font-size:.9rem}
    .recommend-list a span{color:#9cd8d5}
    .calendar{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:28px}
    .calendar-day{background:white;border:1px solid var(--line);border-radius:9px;padding:13px 8px;text-align:center;color:var(--muted);font-size:.78rem}
    .calendar-day strong{display:block;color:var(--brand-deep);font-size:1.15rem}
    .calendar-day.active{background:var(--brand);border-color:var(--brand);color:white}
    .calendar-day.active strong{color:white}
    .timeline{position:relative;padding-left:30px;border-left:2px solid #c8ddec;display:grid;gap:22px}
    .timeline-item{position:relative;background:white;border:1px solid var(--line);border-radius:10px;padding:21px 24px;box-shadow:var(--shadow-soft)}
    .timeline-item::before{content:"";position:absolute;width:11px;height:11px;border-radius:50%;background:var(--accent);border:3px solid var(--surface-blue);left:-37px;top:28px}
    .timeline-meta{display:flex;gap:12px;align-items:center;color:var(--brand);font-size:.78rem;font-weight:800;margin-bottom:6px}
    .timeline-item h3{font-size:1.08rem;margin-bottom:7px}
    .timeline-item p{margin-bottom:0;font-size:.88rem}
    .brand-story{display:grid;grid-template-columns:.75fr 1.25fr;gap:48px;align-items:start}
    .story-stat{border-left:4px solid var(--brand);padding-left:22px}
    .story-stat strong{display:block;font-size:3.5rem;color:var(--brand-deep);line-height:1.1}
    .story-stat span{color:var(--muted);font-size:.9rem}
    .story-copy p{font-size:1rem}
    .story-copy p+p{margin-top:15px}
    .story-points{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:23px}
    .story-point{padding:15px 17px;background:white;border:1px solid var(--line);border-radius:9px;font-size:.86rem;color:#52677d}
    .story-point b{display:block;color:var(--brand-deep);margin-bottom:4px}
    .membership{display:grid;grid-template-columns:1fr 1fr;gap:22px}
    .member-card{border:1px solid var(--line);background:white;border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-soft)}
    .member-card.featured{background:#edf7ff;border-color:#b8d9f2}
    .member-card h3{margin-bottom:11px}
    .member-card p{font-size:.9rem}
    .member-card ul{list-style:none;padding:0;margin:20px 0 0}
    .member-card li{padding:9px 0;border-top:1px solid var(--line);font-size:.87rem;color:#52677d}
    .member-card li::before{content:"✓";color:var(--accent);font-weight:900;margin-right:8px}
    .entry-section{background:#eaf5ff}
    .entry-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
    .entry-copy h2{margin-bottom:14px}
    .entry-copy p{font-size:1rem}
    .entry-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
    .entry-tag{padding:8px 12px;background:white;border:1px solid #c9dfef;border-radius:7px;color:var(--brand-deep);font-size:.83rem;font-weight:700}
    .form-panel{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow)}
    label{display:block;font-weight:750;color:var(--text);font-size:.86rem;margin-bottom:7px}
    label .required{color:var(--danger)}
    input,select,textarea{width:100%;border:1px solid #cbd9e7;border-radius:7px;background:#fbfdff;color:var(--text);padding:11px 13px;transition:var(--ease);margin-bottom:17px}
    input:focus,select:focus,textarea:focus{border-color:var(--brand);background:white;box-shadow:0 0 0 3px rgba(23,105,194,.1);outline:none}
    textarea{min-height:112px;resize:vertical}
    .check-row{display:flex;gap:9px;align-items:flex-start;font-size:.79rem;color:var(--muted);margin-bottom:18px}
    .check-row input{width:17px;height:17px;margin:3px 0 0;flex:none}
    .form-status{min-height:25px;color:var(--success);font-size:.85rem;margin-top:10px}
    .faq-list{max-width:930px;margin:0 auto}
    .accordion{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft)}
    .accordion-item{border-bottom:1px solid var(--line)}
    .accordion-item:last-child{border-bottom:0}
    .accordion-title{display:flex;justify-content:space-between;align-items:center;padding:21px 25px;color:var(--text);font-size:1rem;font-weight:750;background:white}
    .accordion-title:hover{background:#f6fafe;color:var(--brand)}
    .accordion-title::before{display:none}
    .accordion-title .plus{font-size:1.45rem;color:var(--brand);font-weight:400;line-height:1;transition:var(--ease)}
    .accordion-content{padding:0 25px 22px;background:#fff;color:var(--muted);font-size:.91rem;line-height:1.8}
    .accordion-item.is-active .plus{transform:rotate(45deg)}
    .cta-band{padding:38px 0;background:var(--brand-deep);color:white}
    .cta-band-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}
    .cta-band h2{color:white;font-size:1.8rem;margin:0 0 7px}
    .cta-band p{color:#d4e4f1;margin:0;font-size:.9rem}
    .site-footer{background:#102c4d;color:#b9cadb;padding:52px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:34px;padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.12)}
    .footer-brand{color:white;font-size:1.3rem;font-weight:850;margin-bottom:13px}
    .site-footer p{color:#b9cadb;font-size:.84rem;max-width:350px}
    .site-footer h3{font-size:.9rem;color:white;margin-bottom:15px}
    .footer-links{list-style:none;padding:0;margin:0}
    .footer-links li{margin:6px 0}
    .footer-links a{color:#b9cadb;font-size:.84rem}
    .footer-links a:hover{color:white;text-decoration:underline}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px;font-size:.78rem;color:#9eb3c8}
    .footer-bottom a{color:#c9d9e7}
    .float-bar{position:fixed;right:22px;bottom:22px;z-index:40;background:white;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:11px 13px;display:flex;align-items:center;gap:13px;font-size:.8rem}
    .float-bar strong{color:var(--brand-deep)}
    .float-close{border:0;background:transparent;color:var(--light-muted;font-size:1.1rem;padding:3px}
    .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
    @media(max-width:1024px){
      .metrics-panel{grid-template-columns:repeat(3,1fr);gap:20px}
      .metric{border-left:0;border-top:1px solid var(--line);padding:18px 0 0}
      .metric-main{grid-column:span 3;border-top:0;padding:0}
      .matrix{grid-template-columns:1fr 1fr}
      .matrix-card.large{grid-row:auto;grid-column:span 2;min-height:0}
      .news-layout{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1.2fr 1fr 1fr}
      .footer-grid>div:first-child{grid-column:span 3}
    }
    @media(max-width:760px){
      .container{width:min(100% - 32px,var(--container))}
      .topline{height:64px}
      .top-tools{gap:4px}
      .search-box{min-width:40px;width:40px;padding:0;justify-content:center;border:0;background:transparent}
      .search-box span{font-size:0}
      .search-box span::before{content:"⌕";font-size:1.45rem;color:var(--brand-deep)}
      .trend-link{display:none}
      .mobile-toggle{display:block}
      .channel-row{display:none}
      .channel-row.open{display:block}
      .channel-inner{display:flex;flex-wrap:wrap;padding:8px 0 12px;gap:0;white-space:normal}
      .channel-link{padding:8px 12px}
      .channel-link.active::after{left:12px;right:12px}
      .hero{min-height:650px;background-position:58% center}
      .hero::before{background:linear-gradient(180deg,rgba(7,38,76,.85),rgba(8,47,88,.88))}
      .hero-content{padding:72px 0 100px}
      .hero-intro{font-size:1rem}
      .hero-points{gap:16px}
      .metrics-wrap{margin-top:-38px}
      .metrics-panel{grid-template-columns:1fr 1fr;padding:22px}
      .metric-main{grid-column:span 2}
      .metric-main .metric-number{font-size:2.35rem}
      .section{padding:65px 0}
      .section-head{display:block;margin-bottom:28px}
      .section-kicker{display:block;margin-top:12px}
      .matrix{display:block}
      .matrix-card,.matrix-card.large,.matrix-card.wide{margin-bottom:15px;min-height:0;display:block}
      .large .card-image{height:200px}
      .comparison{display:block}
      .compare-card{margin-bottom:14px;padding:25px}
      .compare-divider{height:28px}
      .deep-grid,.deep-grid.reverse,.brand-story,.entry-layout,.membership{display:block}
      .deep-grid.reverse .deep-copy,.deep-grid.reverse .deep-image{order:initial}
      .deep-image{margin-top:25px}
      .deep-image img{height:260px}
      .story-stat{margin-bottom:26px}
      .story-points{grid-template-columns:1fr}
      .news-feature{display:block}
      .news-feature img{height:220px}
      .news-feature-copy{padding:24px}
      .news-item{grid-template-columns:67px 1fr;padding:17px 16px;gap:12px}
      .news-item .arrow-link{grid-column:2;margin-top:0}
      .calendar{grid-template-columns:repeat(3,1fr)}
      .entry-copy{margin-bottom:28px}
      .form-panel{padding:22px}
      .cta-band-inner{display:block}
      .cta-band .btn{margin-top:20px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:25px}
      .footer-grid>div:first-child{grid-column:span 2}
      .float-bar{left:16px;right:16px;bottom:14px;justify-content:space-between}
    }
    @media(max-width:420px){
      .brand{font-size:1.2rem}
      .brand-mark{width:32px;height:32px}
      .hero h1{font-size:2.35rem}
      .hero-actions .btn{width:100%}
      .metrics-panel{padding:17px}
      .metric{padding-left:4px;padding-right:4px}
      .metric-number{font-size:1.65rem}
    }
    @media(prefers-reduced-motion:reduce){
      *,*::before,*::after{scroll-behavior:auto!important;transition:none!important}
    }

/* roulang page: category1 */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#fff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--warm);color:var(--text);
      font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;line-height:1.78;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{color:var(--brand-deep);line-height:1.25;font-weight:850}
    h1{font-size:clamp(2.2rem,5vw,4.6rem);letter-spacing:-.045em}
    h2{font-size:clamp(1.8rem,3vw,2.8rem);letter-spacing:-.03em}
    h3{font-size:1.3rem}
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(34,166,161,.35);outline-offset:3px}
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);transition:var(--ease)}
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand-mark{width:36px;height:36px;border-radius:10px;background:var(--brand);color:white;display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)}
    .top-tools{display:flex;align-items:center;gap:14px}
    .search-box{display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;border-radius:8px;height:40px;padding:0 12px;min-width:220px}
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-size:.88rem;font-weight:750;color:var(--brand-deep)}
    .mobile-toggle{display:none;border:1px solid var(--line);background:white;border-radius:7px;padding:8px 11px;color:var(--brand-deep)}
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;overflow-x:auto}
    .channel-link{display:inline-flex;align-items:center;min-height:48px;padding:0 14px;color:var(--muted);font-size:.9rem;font-weight:750;white-space:nowrap;border-bottom:3px solid transparent}
    .channel-link:hover,.channel-link.active{color:var(--brand);border-bottom-color:var(--brand);background:#f7fbff}
    .hero{
      position:relative;min-height:510px;display:flex;align-items:center;
      background:#dfeefa url("/assets/images/backpic/back-2.webp") center/cover no-repeat;
      isolation:isolate;overflow:hidden
    }
    .hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,38,76,.93),rgba(10,55,103,.72) 52%,rgba(10,55,103,.17));z-index:-1}
    .hero-content{padding:82px 0 76px;max-width:790px}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--brand);font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px}
    .eyebrow:before{content:"";width:24px;height:2px;background:var(--accent)}
    .hero .eyebrow{color:#c5e8ff}.hero .eyebrow:before{background:#7cddd5}
    .hero h1{color:white;max-width:760px;margin-bottom:20px}
    .hero h1 em{font-style:normal;color:#8fe1da}
    .hero-intro{color:#e6f0fa;font-size:1.07rem;max-width:700px;margin-bottom:28px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:10px 19px;border-radius:8px;border:1px solid transparent;font-weight:750;font-size:.93rem;transition:var(--ease)}
    .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:#fff;transform:translateY(-2px)}
    .btn-light{background:#fff;color:var(--brand-deep);border-color:#fff}.btn-light:hover{background:#eaf5ff;color:var(--brand-deep);transform:translateY(-2px)}
    .btn-outline{background:#fff;color:var(--brand);border-color:#b9d0e7}.btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .hero-note{display:flex;gap:16px;flex-wrap:wrap;color:#d8e8f6;font-size:.88rem}
    .hero-note span{padding-left:14px;border-left:2px solid rgba(143,225,218,.7)}
    .countbar{position:absolute;bottom:0;left:0;right:0;background:rgba(5,31,64,.76);border-top:1px solid rgba(255,255,255,.2);color:#eaf5ff}
    .countbar-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:58px;font-size:.88rem}
    .countbar strong{color:#8fe1da}.countdown{font-weight:800;letter-spacing:.04em}
    .section{padding:86px 0}.section.compact{padding:62px 0}
    .section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:38px}
    .section-head p{max-width:670px;margin-bottom:0;color:var(--muted)}
    .section-kicker{font-size:.8rem;color:var(--light-muted);letter-spacing:.1em;font-weight:700}
    .breadcrumb{padding:22px 0 0;color:var(--muted);font-size:.86rem}.breadcrumb a{color:var(--brand)}.breadcrumb span{margin:0 8px;color:#afbdca}
    .stats-wrap{background:var(--surface-blue);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .stats-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:0}
    .stat{padding:28px 24px;border-right:1px solid var(--line)}.stat:first-child{padding-left:0}.stat:last-child{border-right:0}
    .stat-label{color:var(--muted);font-size:.82rem;font-weight:750}.stat-number{font-size:2.25rem;line-height:1.15;font-weight:900;color:var(--brand-deep);margin:7px 0}.stat p{font-size:.86rem;color:var(--muted);margin:0}
    .content-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:28px;align-items:start}
    .panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-soft)}
    .timeline{padding:26px 30px}.timeline-item{display:grid;grid-template-columns:86px 1fr;gap:22px;padding:24px 0;border-bottom:1px solid var(--line)}.timeline-item:first-child{padding-top:5px}.timeline-item:last-child{border-bottom:0;padding-bottom:4px}
    .date{color:var(--brand);font-size:.82rem;font-weight:850;line-height:1.4}.date b{display:block;font-size:1.35rem;color:var(--brand-deep)}
    .tag{display:inline-flex;padding:4px 9px;border-radius:5px;background:var(--brand-soft);color:var(--brand);font-size:.74rem;font-weight:800;margin-bottom:10px}.tag.teal{background:var(--accent-soft);color:#16736f}.tag.gray{background:#f0f4f8;color:#60748a}.tag.gold{background:#fff4df;color:#96621c}
    .timeline h3{font-size:1.18rem;margin-bottom:8px}.timeline p{color:var(--muted);font-size:.91rem;margin-bottom:10px}
    .arrow-link{display:inline-flex;align-items:center;gap:8px;font-size:.87rem;font-weight:800}.arrow-link:after{content:"→";transition:var(--ease)}.arrow-link:hover:after{transform:translateX(4px)}
    .side-stack{display:grid;gap:18px}.side-card{padding:24px}.side-card h3{margin-bottom:10px}.side-card p{color:var(--muted);font-size:.9rem}.side-card ul{margin:0;padding:0;list-style:none}.side-card li{padding:11px 0;border-bottom:1px solid var(--line);font-size:.88rem}.side-card li:last-child{border-bottom:0}
    .image-panel{display:grid;grid-template-columns:1fr 1fr;gap:0;overflow:hidden}.image-panel figure{margin:0;min-height:360px}.image-panel img{width:100%;height:100%;object-fit:cover}.image-copy{padding:42px;background:#fff}.image-copy p{color:var(--muted)}.image-copy blockquote{margin:24px 0 0;padding:15px 18px;border-left:3px solid var(--accent);background:var(--accent-soft);color:#256766;font-size:.92rem}
    .feature-band{background:var(--brand-deep);color:#dcebf8}.feature-band h2,.feature-band h3{color:#fff}.feature-band p{color:#c4d8ea}.feature-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:38px;align-items:center}.feature-grid img{width:100%;height:330px;object-fit:cover;border-radius:var(--radius)}.feature-list{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:12px}.feature-list li{padding-left:24px;position:relative}.feature-list li:before{content:"";position:absolute;left:0;top:12px;width:9px;height:9px;border-radius:50%;background:#8fe1da}
    .news-section{background:#f5f9fd}.news-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}.lead-news{overflow:hidden}.lead-news img{width:100%;height:270px;object-fit:cover}.news-copy{padding:26px}.news-copy p{color:var(--muted)}.news-list{padding:12px 26px}.news-row{padding:18px 0;border-bottom:1px solid var(--line)}.news-row:last-child{border-bottom:0}.news-row time{font-size:.78rem;color:var(--accent);font-weight:800}.news-row h3{font-size:1rem;margin:5px 0}.news-row p{font-size:.86rem;color:var(--muted);margin:0 0 6px}
    .topic-strip{display:flex;flex-wrap:wrap;gap:10px}.topic-strip a{padding:9px 14px;background:#fff;border:1px solid var(--line);border-radius:7px;font-size:.86rem}.topic-strip a:hover{background:var(--brand-soft);border-color:#b8d4ed}
    .faq-list{max-width:900px;margin:0 auto}.faq-item{background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:10px;overflow:hidden}.faq-item summary{cursor:pointer;list-style:none;padding:19px 24px;font-weight:800;color:var(--brand-deep);display:flex;justify-content:space-between;gap:20px}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"+";font-size:1.4rem;color:var(--accent);line-height:1}.faq-item[open] summary:after{content:"−"}.faq-answer{padding:0 24px 20px;color:var(--muted);font-size:.92rem}
    .cta{background:var(--brand-soft)}.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:start}.cta-copy p{color:var(--muted);max-width:560px}.form-panel{background:#fff;padding:30px;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-soft)}label{font-size:.86rem;font-weight:800;color:var(--brand-deep);margin-bottom:7px}input,select,textarea{border:1px solid #cbd9e6;border-radius:7px;background:#fbfdff;box-shadow:none!important;color:var(--text);margin-bottom:16px}input:focus,select:focus,textarea:focus{border-color:var(--brand);background:#fff}.required{color:var(--danger)}textarea{min-height:112px;resize:vertical}.checkline{display:flex;gap:9px;align-items:flex-start;color:var(--muted);font-size:.8rem;margin-bottom:17px}.checkline input{margin-top:6px}.form-message{display:none;padding:10px 13px;border-radius:7px;background:#e8f6ef;color:var(--success);font-size:.86rem;margin-top:12px}
    .site-footer{background:#102c4c;color:#b9cce0;padding:58px 0 24px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px}.footer-brand{font-size:1.45rem;color:white;font-weight:850;margin-bottom:12px}.site-footer p{font-size:.88rem;max-width:330px}.site-footer h3{font-size:1rem;color:white;margin-bottom:13px}.footer-links{list-style:none;margin:0;padding:0}.footer-links li{margin:7px 0}.footer-links a{color:#b9cce0;font-size:.86rem}.footer-links a:hover{color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:38px;padding-top:20px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:.78rem}.footer-bottom a{color:#d9edf9}
    @media(max-width:900px){.search-box{min-width:180px}.stats-grid{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.content-layout,.news-grid,.feature-grid,.cta-grid{grid-template-columns:1fr}.image-panel{grid-template-columns:1fr}.image-panel figure{min-height:260px}.footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:640px){.container{width:min(var(--container),calc(100% - 30px))}.topline{min-height:62px}.top-tools{gap:8px}.search-box,.trend-link{display:none}.mobile-toggle{display:block}.channel-row{display:none}.channel-row.open{display:block}.channel-inner{display:grid;grid-template-columns:1fr 1fr;padding:8px 0}.channel-link{min-height:42px;border-bottom:0;border-radius:6px}.hero{min-height:560px;background-position:58% center}.hero-content{padding:66px 0 100px}.hero-intro{font-size:.98rem}.hero-actions .btn{width:100%}.countbar-inner{display:block;padding:10px 0;font-size:.8rem}.countdown{margin-top:3px}.section{padding:60px 0}.section-head{display:block;margin-bottom:28px}.section-head .section-kicker{display:block;margin-top:12px}.stats-grid{grid-template-columns:1fr 1fr}.stat{padding:20px 12px;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}.stat:nth-child(2n){border-right:0}.stat-number{font-size:1.75rem}.timeline{padding:20px 17px}.timeline-item{grid-template-columns:65px 1fr;gap:12px}.timeline h3{font-size:1.03rem}.side-card{padding:20px}.image-copy{padding:27px 22px}.feature-grid img{height:240px}.news-copy{padding:22px}.news-list{padding:8px 18px}.form-panel{padding:21px}.footer-grid{grid-template-columns:1fr 1fr;gap:25px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:8px}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* roulang page: category2 */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#ffffff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--warm);color:var(--text);
      font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;line-height:1.78;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{color:var(--brand-deep);line-height:1.28;letter-spacing:-.02em}
    h1{font-size:clamp(2.3rem,4.6vw,4.55rem);margin-bottom:22px}
    h2{font-size:clamp(1.75rem,3vw,2.65rem);margin-bottom:14px}
    h3{font-size:1.22rem;margin-bottom:9px}
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
      outline:3px solid rgba(34,166,161,.35);outline-offset:3px
    }
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .narrow{max-width:820px}
    .section{padding:92px 0}
    .section.compact{padding:64px 0}
    .section-head{display:flex;justify-content:space-between;gap:32px;align-items:end;margin-bottom:40px}
    .section-head p{max-width:650px;margin-bottom:0;color:var(--muted)}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--brand);
      font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px
    }
    .eyebrow:before{content:"";width:24px;height:2px;background:var(--accent)}
    .site-header{
      position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);
      border-bottom:1px solid var(--line);transition:var(--ease)
    }
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand:hover{color:var(--brand)}
    .brand-mark{
      width:36px;height:36px;border-radius:10px;background:var(--brand);color:#fff;
      display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)
    }
    .top-tools{display:flex;align-items:center;gap:12px}
    .search-box{
      display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;
      border-radius:8px;height:40px;padding:0 12px;min-width:220px
    }
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-weight:750;font-size:.88rem;padding:8px 10px}
    .mobile-toggle{
      display:none;border:1px solid var(--line);background:#fff;border-radius:7px;
      padding:8px 11px;color:var(--brand-deep)
    }
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;overflow-x:auto}
    .channel-link{
      position:relative;color:var(--muted);font-size:.9rem;font-weight:700;
      padding:12px 17px;white-space:nowrap
    }
    .channel-link:after{
      content:"";position:absolute;left:17px;right:17px;bottom:-1px;height:3px;
      background:var(--brand);transform:scaleX(0);transition:var(--ease)
    }
    .channel-link:hover,.channel-link.active{color:var(--brand-deep)}
    .channel-link:hover:after,.channel-link.active:after{transform:scaleX(1)}
    .breadcrumb{padding:22px 0 0;color:var(--light-muted);font-size:.82rem}
    .breadcrumb a{color:var(--muted)}
    .hero-inner{padding:58px 0 82px}
    .schedule-hero{
      background:linear-gradient(135deg,#f5faff 0%,#eaf4ff 58%,#f8fcff 100%);
      border-bottom:1px solid var(--line)
    }
    .hero-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);gap:64px;align-items:center}
    .hero-copy h1{max-width:690px}
    .hero-copy h1 span{color:var(--brand)}
    .hero-intro{font-size:1.08rem;color:var(--muted);max-width:680px;margin-bottom:28px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;
      padding:10px 19px;border-radius:8px;border:1px solid transparent;font-weight:750;
      font-size:.93rem;transition:var(--ease)
    }
    .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px rgba(23,105,194,.28)}
    .btn-outline{background:#fff;color:var(--brand);border-color:#b9d0e7}
    .btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .btn-quiet{background:var(--brand-soft);color:var(--brand-deep)}
    .btn-quiet:hover{background:#d9ecff}
    .hero-note{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.88rem}
    .hero-note strong{display:block;color:var(--brand-deep);font-size:1.15rem;line-height:1.2}
    .cover-panel{position:relative;padding:18px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
    .cover-panel img{width:100%;height:360px;object-fit:cover;object-position:center;border-radius:11px}
    .cover-caption{
      position:absolute;left:34px;right:34px;bottom:34px;padding:18px 20px;border-radius:10px;
      color:#fff;background:rgba(12,60,120,.88)
    }
    .cover-caption small{display:block;color:#b9e7e2;font-weight:800;letter-spacing:.08em;margin-bottom:4px}
    .cover-caption strong{font-size:1.25rem}
    .contents-box{
      margin-top:20px;padding:19px 21px;background:#f7fbff;border:1px solid #e2edf7;border-radius:10px
    }
    .contents-box h3{font-size:1rem;margin-bottom:8px}
    .contents-box ul{margin:0;padding-left:20px;color:var(--muted);font-size:.88rem}
    .date-strip{background:#fff;border-bottom:1px solid var(--line)}
    .date-row{display:flex;gap:12px;overflow-x:auto;padding:19px 0}
    .date-item{
      min-width:126px;padding:12px 15px;border:1px solid var(--line);border-radius:10px;
      background:#fbfdff;color:var(--muted);transition:var(--ease)
    }
    .date-item:hover,.date-item.active{background:var(--brand-soft);border-color:#9fc5e7;color:var(--brand-deep)}
    .date-item strong{display:block;font-size:1.02rem}
    .date-item span{font-size:.77rem}
    .schedule-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(270px,.55fr);gap:34px;align-items:start}
    .schedule-board{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-soft);overflow:hidden}
    .board-head{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;border-bottom:1px solid var(--line)}
    .board-head h2{font-size:1.45rem;margin:0}
    .board-head span{font-size:.83rem;color:var(--muted)}
    .match-row{display:grid;grid-template-columns:108px 1fr 126px;gap:18px;align-items:center;padding:24px 28px;border-bottom:1px solid #edf2f7;transition:var(--ease)}
    .match-row:last-child{border-bottom:0}
    .match-row:hover{background:#f8fbfe}
    .match-time strong{display:block;color:var(--brand-deep);font-size:1.18rem}
    .match-time span{font-size:.78rem;color:var(--muted)}
    .match-main{min-width:0}
    .match-main h3{font-size:1.04rem;margin:5px 0 4px}
    .match-main p{font-size:.86rem;color:var(--muted);margin:0}
    .match-status{text-align:right}
    .tag{display:inline-flex;padding:4px 9px;border-radius:5px;background:var(--brand-soft);color:var(--brand);font-size:.74rem;font-weight:800}
    .tag.teal{background:var(--accent-soft);color:#16736f}
    .tag.gray{background:#f0f4f8;color:#60748a}
    .match-status .arrow-link{margin-top:8px}
    .arrow-link{display:inline-flex;align-items:center;gap:8px;font-size:.87rem;font-weight:800}
    .arrow-link:after{content:"→";transition:var(--ease)}
    .arrow-link:hover:after{transform:translateX(4px)}
    .side-note{background:var(--brand-deep);color:#e6f0fa;border-radius:var(--radius);padding:28px;position:sticky;top:150px}
    .side-note h2,.side-note h3{color:#fff}
    .side-note h2{font-size:1.42rem}
    .side-note p{font-size:.9rem;color:#cfe0f0}
    .side-note ul{margin:18px 0 0;padding:0;list-style:none}
    .side-note li{padding:12px 0;border-top:1px solid rgba(255,255,255,.14);font-size:.87rem}
    .side-note li strong{display:block;color:#fff}
    .info-band{background:var(--surface-blue)}
    .three-points{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
    .point-card{padding:25px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-soft)}
    .point-index{color:var(--accent);font-size:.8rem;font-weight:850;letter-spacing:.1em}
    .point-card h3{margin-top:12px}
    .point-card p{color:var(--muted);font-size:.9rem;margin-bottom:0}
    .feature-layout{display:grid;grid-template-columns:.95fr 1.05fr;gap:52px;align-items:center}
    .feature-image{position:relative}
    .feature-image img{width:100%;height:390px;object-fit:cover;border-radius:14px;box-shadow:var(--shadow)}
    .image-label{position:absolute;left:20px;bottom:20px;padding:9px 13px;border-radius:7px;background:#fff;color:var(--brand-deep);font-size:.8rem;font-weight:800;box-shadow:var(--shadow-soft)}
    .feature-copy p{color:var(--muted)}
    .reading-list{margin:24px 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}
    .reading-list li{display:flex;gap:15px;padding:15px 0;border-bottom:1px solid var(--line);font-size:.9rem}
    .reading-list b{color:var(--accent);font-size:.82rem;min-width:66px}
    .schedule-detail{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow-soft)}
    .schedule-detail h2{font-size:1.8rem}
    .schedule-detail p{color:var(--muted);max-width:800px}
    .detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px}
    .detail-cell{padding:17px;background:#f7fbff;border-left:3px solid #a9d2ed;border-radius:6px}
    .detail-cell span{display:block;color:var(--light-muted);font-size:.76rem;margin-bottom:4px}
    .detail-cell strong{color:var(--brand-deep);font-size:1rem}
    .six-list{display:grid;grid-template-columns:repeat(2,1fr);gap:0 36px;border-top:1px solid var(--line)}
    .six-item{display:grid;grid-template-columns:54px 1fr;gap:16px;padding:23px 0;border-bottom:1px solid var(--line)}
    .six-number{font-size:1.6rem;color:#a5c6e5;font-weight:850;line-height:1}
    .six-item h3{font-size:1.05rem;margin-bottom:5px}
    .six-item p{font-size:.88rem;color:var(--muted);margin-bottom:7px}
    .cta-panel{background:linear-gradient(110deg,#eaf5ff,#f0fbfa);border:1px solid #d5e8f3;border-radius:16px;padding:42px 48px;display:flex;justify-content:space-between;align-items:center;gap:30px}
    .cta-panel h2{margin-bottom:8px}
    .cta-panel p{color:var(--muted);margin:0;max-width:650px}
    .faq-wrap{max-width:900px}
    .accordion{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:0;box-shadow:var(--shadow-soft)}
    .accordion-item{border-bottom:1px solid var(--line)}
    .accordion-item:last-child{border-bottom:0}
    .accordion-title{
      display:flex;justify-content:space-between;align-items:center;padding:20px 24px;
      color:var(--brand-deep);font-weight:800;font-size:1rem;background:#fff
    }
    .accordion-title:before{content:"+";order:2;color:var(--accent);font-size:1.4rem;font-weight:400}
    .accordion-title:hover{background:#f8fbfe;color:var(--brand)}
    .accordion-content{padding:0 24px 22px;color:var(--muted);font-size:.92rem;background:#fff}
    .feedback-section{background:var(--surface-blue)}
    .feedback-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:38px;align-items:start}
    .feedback-copy{padding-top:10px}
    .feedback-copy p{color:var(--muted)}
    .feedback-list{list-style:none;padding:0;margin:25px 0 0}
    .feedback-list li{padding:11px 0;border-top:1px solid var(--line);font-size:.9rem}
    .feedback-list strong{color:var(--brand-deep)}
    .form-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow)}
    label{color:var(--brand-deep);font-size:.87rem;font-weight:750;margin-bottom:7px}
    input,select,textarea{
      width:100%;border:1px solid #cbd9e6;border-radius:7px;background:#fbfdff;
      color:var(--text);padding:11px 13px;box-shadow:none;transition:var(--ease)
    }
    input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(23,105,194,.1)}
    textarea{min-height:120px;resize:vertical}
    .form-row{display:grid;grid-template-columns:1fr 1fr;gap:17px}
    .form-field{margin-bottom:17px}
    .check-line{display:flex;align-items:flex-start;gap:9px;color:var(--muted);font-size:.8rem;margin:2px 0 18px}
    .check-line input{width:auto;margin-top:6px}
    .form-message{display:none;color:var(--success);font-size:.85rem;margin:13px 0 0}
    .site-footer{padding:62px 0 24px;background:#0b2e59;color:#c5d7e9}
    .footer-grid{display:grid;grid-template-columns:1.45fr 1fr 1fr 1fr;gap:38px;padding-bottom:42px}
    .footer-brand{color:#fff;font-weight:850;font-size:1.4rem;margin-bottom:12px}
    .site-footer p{font-size:.88rem;max-width:350px;color:#b8cce0}
    .site-footer h3{color:#fff;font-size:1rem;margin-bottom:13px}
    .footer-links{list-style:none;margin:0;padding:0}
    .footer-links li{margin:7px 0}
    .footer-links a{color:#b8cce0;font-size:.87rem}
    .footer-links a:hover{color:#fff}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:20px;display:flex;gap:18px;justify-content:space-between;flex-wrap:wrap;font-size:.78rem;color:#a9bfd6}
    .footer-bottom a{color:#c5d7e9}
    .pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:34px}
    .page-btn{min-width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:7px;color:var(--muted);display:grid;place-items:center}
    .page-btn:hover,.page-btn.active{background:var(--brand);border-color:var(--brand);color:#fff}
    .section-intro{max-width:710px;color:var(--muted);font-size:1rem}
    @media(max-width:1024px){
      .hero-layout{gap:34px}
      .schedule-layout{grid-template-columns:1fr}
      .side-note{position:static}
      .feature-layout{gap:30px}
      .footer-grid{grid-template-columns:1.3fr 1fr 1fr}
      .footer-grid>div:last-child{grid-column:2}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 32px))}
      .topline{min-height:62px}
      .top-tools{gap:7px}
      .search-box{min-width:0;width:42px;padding:0;justify-content:center;font-size:0}
      .search-box:before{content:"⌕";font-size:1.25rem;color:var(--brand)}
      .search-box span{display:none}
      .trend-link{display:none}
      .mobile-toggle{display:block}
      .channel-row{display:none}
      .channel-row.open{display:block}
      .channel-inner{display:block;padding:8px 0 12px}
      .channel-link{display:block;padding:10px 12px}
      .channel-link:after{left:12px;right:auto;width:30px}
      .hero-inner{padding:42px 0 58px}
      .hero-layout,.feature-layout,.feedback-layout{grid-template-columns:1fr}
      .cover-panel img{height:300px}
      .section{padding:65px 0}
      .section-head{display:block;margin-bottom:28px}
      .section-head p{margin-top:13px}
      .three-points,.detail-grid{grid-template-columns:1fr 1fr}
      .match-row{grid-template-columns:78px 1fr;gap:12px;padding:20px 18px}
      .match-status{grid-column:2;text-align:left}
      .board-head{padding:20px 18px}
      .six-list{grid-template-columns:1fr}
      .cta-panel{display:block;padding:30px 25px}
      .cta-panel .btn{margin-top:22px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
      .footer-grid>div:last-child{grid-column:auto}
    }
    @media(max-width:520px){
      body{font-size:15px}
      h1{font-size:2.28rem}
      .hero-copy h1{font-size:2.35rem}
      .hero-actions .btn{width:100%}
      .hero-note{gap:14px}
      .cover-panel{padding:11px}
      .cover-panel img{height:245px}
      .cover-caption{left:22px;right:22px;bottom:22px;padding:14px}
      .three-points,.detail-grid,.form-row{grid-template-columns:1fr}
      .schedule-detail,.form-panel{padding:23px 19px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:last-child{grid-column:auto}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:8px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
    }

/* roulang page: category3 */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#fff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease;
    }
    *,*:before,*:after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--warm);color:var(--text);font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.78;overflow-x:hidden}
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{color:var(--brand-deep);font-weight:800;line-height:1.28}
    h1{font-size:clamp(2.2rem,4.4vw,4.15rem);letter-spacing:-.045em}
    h2{font-size:clamp(1.75rem,3vw,2.55rem);letter-spacing:-.025em}
    h3{font-size:1.24rem}
    p{color:var(--muted)}
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(34,166,161,.35);outline-offset:3px}
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .narrow{max-width:820px}
    .section{padding:90px 0}
    .section.compact{padding:62px 0}
    .section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:40px}
    .section-head p{max-width:650px;margin-bottom:0}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--brand);font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:15px}
    .eyebrow:before{content:"";width:24px;height:2px;background:var(--accent)}
    .section-kicker{font-size:.78rem;color:var(--light-muted);letter-spacing:.1em;font-weight:700}
    .site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);transition:var(--ease)}
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{display:flex;justify-content:space-between;align-items:center;min-height:68px;gap:22px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand:hover{color:var(--brand)}
    .brand-mark{width:36px;height:36px;border-radius:10px;background:var(--brand);color:white;display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)}
    .top-tools{display:flex;align-items:center;gap:12px}
    .search-box{display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;border-radius:8px;height:40px;padding:0 12px;min-width:230px}
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-size:.86rem;font-weight:750;padding:8px 10px}
    .mobile-toggle{display:none;border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 11px;color:var(--brand-deep)}
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none}
    .channel-inner::-webkit-scrollbar{display:none}
    .channel-link{position:relative;display:inline-flex;align-items:center;min-height:47px;padding:0 15px;color:#526b84;font-size:.9rem;font-weight:700;white-space:nowrap}
    .channel-link:hover{color:var(--brand)}
    .channel-link:after{content:"";position:absolute;left:15px;right:15px;bottom:0;height:3px;background:var(--brand);transform:scaleX(0);transition:var(--ease)}
    .channel-link.active{color:var(--brand-deep)}
    .channel-link.active:after{transform:scaleX(1)}
    .crumb-wrap{background:var(--surface-blue);border-bottom:1px solid var(--line)}
    .breadcrumbs{margin:0;padding:15px 0;color:var(--light-muted);font-size:.83rem}
    .breadcrumbs a{color:var(--muted)}
    .breadcrumbs span{padding:0 8px;color:#aab7c5}
    .page-hero{padding:76px 0 84px;background:#eef6fd}
    .hero-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(390px,.96fr);gap:70px;align-items:center}
    .page-hero h1{margin-bottom:22px}
    .hero-copy{font-size:1.05rem;max-width:700px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:27px 0 0}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:10px 19px;border-radius:8px;border:1px solid transparent;font-weight:750;font-size:.93rem;transition:var(--ease)}
    .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px rgba(23,105,194,.28)}
    .btn-outline{background:#fff;color:var(--brand);border-color:#b9d0e7}
    .btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .report-cover{position:relative;min-height:405px;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);background:#164d8e}
    .report-cover img{width:100%;height:405px;object-fit:cover;object-position:center}
    .report-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,42,81,.08),rgba(5,33,66,.8))}
    .cover-caption{position:absolute;z-index:1;left:30px;right:30px;bottom:28px;color:#fff}
    .cover-caption small{display:block;color:#bfe8e3;letter-spacing:.12em;font-weight:800;margin-bottom:9px}
    .cover-caption h2{color:#fff;font-size:1.85rem;margin-bottom:8px}
    .cover-caption p{color:#e1edf7;margin:0;font-size:.9rem}
    .outline-box{margin-top:22px;padding:19px 22px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff}
    .outline-box strong{display:block;color:var(--brand-deep);margin-bottom:8px}
    .outline-box ul{display:grid;grid-template-columns:1fr 1fr;gap:7px 20px;margin:0;padding-left:18px;color:var(--muted);font-size:.88rem}
    .metric-band{background:#fff;border-bottom:1px solid var(--line)}
    .metric-layout{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;align-items:stretch}
    .metric{padding:31px 25px;border-right:1px solid var(--line)}
    .metric:first-child{padding-left:0}
    .metric:last-child{border-right:0}
    .metric-label{display:block;color:var(--light-muted);font-size:.78rem;font-weight:800;letter-spacing:.04em;margin-bottom:10px}
    .metric strong{display:block;color:var(--brand-deep);font-size:2.15rem;line-height:1.1;margin-bottom:9px}
    .metric p{font-size:.84rem;line-height:1.6;margin:0}
    .metric-main{background:var(--brand-soft)}
    .metric-main strong{font-size:2.8rem}
    .bar-list{display:grid;gap:17px}
    .bar-row{display:grid;grid-template-columns:125px 1fr 48px;align-items:center;gap:12px;font-size:.86rem}
    .bar-track{height:8px;background:#e5edf5;border-radius:20px;overflow:hidden}
    .bar-fill{height:100%;background:var(--brand);border-radius:20px}
    .bar-fill.teal{background:var(--accent)}
    .bar-fill.light{background:#78b5e9}
    .insight-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:25px}
    .panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-soft)}
    .panel-pad{padding:31px}
    .panel-title{display:flex;justify-content:space-between;gap:20px;align-items:start;margin-bottom:24px}
    .panel-title h3{margin-bottom:5px}
    .panel-title p{font-size:.86rem;margin:0}
    .mini-tag,.tag{display:inline-flex;padding:4px 9px;border-radius:5px;background:var(--brand-soft);color:var(--brand);font-size:.73rem;font-weight:800}
    .tag.teal{background:var(--accent-soft);color:#16736f}
    .tag.gray{background:#f0f4f8;color:#60748a}
    .comparison{display:grid;grid-template-columns:1fr 68px 1fr;align-items:stretch}
    .compare-side{padding:26px;background:#f7fbff;border:1px solid var(--line)}
    .compare-side:last-child{background:#f3fbfa}
    .compare-side h3{font-size:1.15rem;margin:13px 0 10px}
    .compare-side p{font-size:.88rem;line-height:1.7}
    .compare-list{margin:18px 0 0;padding:0;list-style:none}
    .compare-list li{padding:10px 0;border-top:1px solid var(--line);font-size:.86rem;color:var(--muted)}
    .compare-list b{float:right;color:var(--brand-deep)}
    .compare-mid{display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:1.5rem;font-weight:800}
    .trend-chart{height:200px;display:flex;align-items:end;gap:13px;padding:20px 7px 0;border-bottom:1px solid var(--line)}
    .chart-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%;justify-content:end}
    .chart-bar{width:100%;max-width:34px;background:var(--brand);border-radius:6px 6px 0 0;min-height:20px}
    .chart-col:nth-child(2n) .chart-bar{background:var(--accent)}
    .chart-col span{font-size:.72rem;color:var(--light-muted)}
    .trend-note{display:flex;justify-content:space-between;gap:15px;margin-top:16px;font-size:.83rem;color:var(--muted)}
    .trend-note strong{color:var(--success)}
    .data-note{padding:20px 24px;border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
    .data-note p{margin:0;font-size:.9rem}
    .reading-section{background:var(--surface-blue)}
    .reading-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:55px;align-items:center}
    .reading-image{border-radius:16px;overflow:hidden;box-shadow:var(--shadow);min-height:360px}
    .reading-image img{width:100%;height:360px;object-fit:cover;object-position:center}
    .reading-copy p{font-size:.96rem}
    .reading-points{display:grid;grid-template-columns:1fr 1fr;gap:18px 26px;margin:25px 0 0;padding:0;list-style:none}
    .reading-points li{position:relative;padding-left:22px;color:var(--muted);font-size:.9rem}
    .reading-points li:before{content:"";position:absolute;left:0;top:10px;width:8px;height:8px;border-radius:50%;background:var(--accent)}
    .feature-section{background:#fff}
    .feature-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:28px;align-items:stretch}
    .feature-intro{padding:37px 35px;background:var(--brand-deep);border-radius:var(--radius);color:#fff}
    .feature-intro h2,.feature-intro h3{color:#fff}
    .feature-intro p{color:#d9e9f7;font-size:.92rem}
    .feature-intro .btn{margin-top:18px}
    .feature-stack{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .feature-item{padding:24px;background:#f8fbfe;border:1px solid var(--line);border-radius:var(--radius-sm)}
    .feature-item:nth-child(1){grid-column:span 2}
    .feature-item h3{margin:10px 0 7px;font-size:1.08rem}
    .feature-item p{font-size:.86rem;margin:0}
    .number{color:var(--accent);font-size:.8rem;font-weight:900;letter-spacing:.08em}
    .news-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:30px}
    .lead-news{overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-soft)}
    .lead-news img{width:100%;height:245px;object-fit:cover}
    .lead-news-body{padding:25px 28px}
    .lead-news h3{font-size:1.45rem;margin:12px 0}
    .news-list{display:grid;gap:0;background:#fff;border-top:1px solid var(--line)}
    .news-item{display:grid;grid-template-columns:92px 1fr;gap:17px;padding:19px 0;border-bottom:1px solid var(--line)}
    .news-date{color:var(--brand);font-size:.8rem;font-weight:800;line-height:1.4}
    .news-item h3{font-size:1rem;margin:0 0 5px}
    .news-item p{font-size:.83rem;line-height:1.6;margin:0}
    .news-item a{font-size:.78rem;font-weight:800}
    .article-list{display:grid;gap:0}
    .article-row{display:grid;grid-template-columns:150px 1fr auto;gap:24px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}
    .article-row:first-child{border-top:1px solid var(--line)}
    .article-row time{color:var(--light-muted);font-size:.82rem}
    .article-row h3{font-size:1.06rem;margin:0 0 5px}
    .article-row p{font-size:.84rem;margin:0;line-height:1.6}
    .arrow-link{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;font-weight:800;white-space:nowrap}
    .arrow-link:after{content:"→";transition:var(--ease)}
    .arrow-link:hover:after{transform:translateX(4px)}
    .faq-section{background:var(--surface-blue)}
    .faq-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:55px}
    .faq-intro p{font-size:.93rem}
    .accordion{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
    .accordion-item{border-bottom:1px solid var(--line)}
    .accordion-item:last-child{border-bottom:0}
    .accordion-title{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 23px;color:var(--brand-deep);font-weight:750;cursor:pointer}
    .accordion-title:after{content:"+";color:var(--accent);font-size:1.45rem;font-weight:400}
    .accordion-item.is-active .accordion-title:after{content:"−"}
    .accordion-content{display:none;padding:0 23px 21px;color:var(--muted);font-size:.9rem;line-height:1.75}
    .accordion-item.is-active .accordion-content{display:block}
    .cta-section{padding:84px 0;background:#eaf4ff}
    .cta-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:start}
    .cta-copy p{max-width:530px}
    .feedback-form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow)}
    .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    label{display:block;color:var(--brand-deep);font-size:.84rem;font-weight:750;margin-bottom:7px}
    .required{color:var(--danger)}
    input,select,textarea{width:100%;border:1px solid #cbd9e6;border-radius:7px;background:#fff;color:var(--text);padding:11px 13px;min-height:45px;transition:var(--ease);box-shadow:none}
    textarea{min-height:120px;resize:vertical}
    input:hover,select:hover,textarea:hover{border-color:#9dbbd6}
    input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(23,105,194,.11);outline:none}
    .field-full{grid-column:1/-1}
    .checkline{display:flex;gap:9px;align-items:flex-start;margin:17px 0;color:var(--muted);font-size:.78rem}
    .checkline input{width:17px;min-height:17px;margin-top:4px}
    .form-status{min-height:26px;color:var(--success);font-size:.85rem;margin:12px 0 0}
    .site-footer{padding:58px 0 20px;background:#102e54;color:#cbdbea}
    .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:35px;padding-bottom:40px}
    .footer-brand{font-size:1.4rem;font-weight:850;color:#fff;margin-bottom:13px}
    .site-footer p{color:#b5c9dc;font-size:.86rem;max-width:330px}
    .site-footer h3{font-size:.92rem;color:#fff;margin:3px 0 14px}
    .footer-links{list-style:none;margin:0;padding:0}
    .footer-links li{margin:7px 0}
    .footer-links a{color:#cbdbea;font-size:.84rem}
    .footer-links a:hover{color:#fff;text-decoration:underline}
    .footer-bottom{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.16);padding-top:20px;color:#a9bdd2;font-size:.76rem}
    .footer-bottom a{color:#d4e7f8}
    .static-page{padding:28px 0 0}
    .related-strip{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
    .related-strip a{padding:9px 14px;background:#fff;border:1px solid var(--line);border-radius:7px;color:var(--muted);font-size:.84rem}
    .related-strip a:hover{color:var(--brand);border-color:#9dc3e3;background:var(--brand-soft)}
    .source-line{display:flex;gap:16px;flex-wrap:wrap;color:var(--light-muted);font-size:.78rem;margin-top:17px}
    @media(max-width:1024px){
      .hero-grid,.reading-layout,.feature-grid,.news-layout,.faq-layout,.cta-grid{grid-template-columns:1fr;gap:32px}
      .report-cover{max-width:650px}
      .metric-layout{grid-template-columns:1.4fr 1fr 1fr}
      .metric:last-child{grid-column:span 3;border-top:1px solid var(--line);padding-left:0}
      .metric:nth-child(3){border-right:0}
      .footer-grid{grid-template-columns:1.3fr 1fr 1fr}
      .footer-grid>div:last-child{grid-column:span 3}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 32px))}
      .topline{min-height:61px}
      .top-tools{margin-left:auto}
      .search-box{display:none}
      .mobile-toggle{display:block}
      .channel-row{display:none}
      .channel-row.open{display:block}
      .channel-inner{display:grid;grid-template-columns:1fr 1fr;padding:8px 0 13px}
      .channel-link{min-height:42px;padding:0 10px}
      .channel-link:after{left:10px;right:10px}
      .trend-link{display:none}
      .page-hero{padding:53px 0 60px}
      .hero-grid{gap:28px}
      .outline-box ul{grid-template-columns:1fr}
      .metric-layout{grid-template-columns:1fr 1fr}
      .metric,.metric:first-child{padding:23px 17px;border-right:0;border-bottom:1px solid var(--line)}
      .metric-main{grid-column:span 2}
      .metric:last-child{grid-column:span 1;padding-left:17px;border-top:0}
      .insight-grid,.comparison{grid-template-columns:1fr}
      .compare-mid{height:44px;transform:rotate(90deg)}
      .section{padding:64px 0}
      .section-head{display:block;margin-bottom:28px}
      .section-head .section-kicker{display:block;margin-top:12px}
      .reading-points,.feature-stack{grid-template-columns:1fr}
      .feature-item:nth-child(1){grid-column:auto}
      .article-row{grid-template-columns:1fr;gap:7px}
      .article-row .arrow-link{justify-self:start}
      .form-grid{grid-template-columns:1fr}
      .field-full{grid-column:auto}
      .footer-grid{grid-template-columns:1fr 1fr;gap:27px}
      .footer-grid>div:last-child{grid-column:auto}
    }
    @media(max-width:520px){
      body{font-size:15px}
      .brand{font-size:1.2rem}
      .brand-mark{width:32px;height:32px}
      h1{font-size:2.18rem}
      .page-hero h1{font-size:2.25rem}
      .report-cover,.report-cover img{min-height:300px;height:300px}
      .cover-caption{left:21px;right:21px;bottom:20px}
      .cover-caption h2{font-size:1.45rem}
      .panel-pad,.feedback-form{padding:22px}
      .bar-row{grid-template-columns:90px 1fr 38px;gap:8px;font-size:.78rem}
      .news-item{grid-template-columns:73px 1fr;gap:10px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:last-child{grid-column:auto}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:8px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
    }

/* roulang page: category4 */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#ffffff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease;
    }
    html{scroll-behavior:smooth}
    *,*::before,*::after{box-sizing:border-box}
    body{
      margin:0;background:var(--warm);color:var(--text);
      font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;line-height:1.78;overflow-x:hidden
    }
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
      outline:3px solid rgba(34,166,161,.35);outline-offset:3px
    }
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{color:var(--brand-deep);line-height:1.25;letter-spacing:-.025em}
    h1{font-size:clamp(2.2rem,4.5vw,4.2rem);margin-bottom:20px}
    h2{font-size:clamp(1.7rem,3vw,2.55rem);margin-bottom:12px}
    h3{font-size:1.2rem;margin-bottom:9px}
    p{color:var(--muted)}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .narrow{max-width:820px}
    .site-header{
      position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);
      border-bottom:1px solid var(--line);transition:var(--ease)
    }
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand:hover{color:var(--brand)}
    .brand-mark{
      width:36px;height:36px;border-radius:10px;background:var(--brand);color:#fff;
      display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)
    }
    .top-tools{display:flex;align-items:center;gap:12px}
    .search-box{
      display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;
      border-radius:8px;height:40px;padding:0 12px;min-width:220px
    }
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-size:.85rem;font-weight:750;color:var(--brand-deep);padding:8px 4px}
    .trend-link:hover{text-decoration:underline}
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none}
    .channel-inner::-webkit-scrollbar{display:none}
    .channel-link{
      position:relative;display:inline-flex;align-items:center;min-height:47px;
      padding:0 14px;color:#52677e;font-size:.9rem;font-weight:700;white-space:nowrap
    }
    .channel-link::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;background:transparent;border-radius:3px 3px 0 0}
    .channel-link:hover,.channel-link.active{color:var(--brand-deep)}
    .channel-link.active::after{background:var(--accent)}
    .mobile-toggle{display:none;border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 11px;color:var(--brand-deep)}
    .page-banner{
      position:relative;overflow:hidden;background:#dfeefa url("/assets/images/backpic/back-2.webp") center/cover no-repeat;
      min-height:355px;display:flex;align-items:center;isolation:isolate
    }
    .page-banner::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,38,76,.9),rgba(10,55,103,.64) 56%,rgba(10,55,103,.18));z-index:-1}
    .page-banner::after{content:"";position:absolute;width:360px;height:360px;border:1px solid rgba(255,255,255,.2);border-radius:50%;right:8%;bottom:-220px;box-shadow:0 0 0 26px rgba(255,255,255,.05),0 0 0 52px rgba(255,255,255,.04);z-index:-1}
    .banner-content{padding:72px 0 76px;max-width:760px}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--brand);font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:15px}
    .eyebrow::before{content:"";width:24px;height:2px;background:var(--accent)}
    .page-banner .eyebrow{color:#c5e8ff}
    .page-banner .eyebrow::before{background:#7cddd5}
    .page-banner h1{color:#fff}
    .page-banner h1 em{font-style:normal;color:#8fe1da}
    .banner-content p{color:#e6f0fa;max-width:700px;font-size:1.05rem;margin-bottom:0}
    .breadcrumb-wrap{background:#fff;border-bottom:1px solid var(--line)}
    .breadcrumbs{margin:0;padding:13px 0;display:flex;gap:10px;list-style:none;font-size:.82rem;color:var(--light-muted)}
    .breadcrumbs li+li::before{content:"/";margin-right:10px;color:#bdc9d6}
    .section{padding:86px 0}
    .section.compact{padding:60px 0}
    .section-blue{background:var(--surface-blue)}
    .section-head{display:flex;justify-content:space-between;gap:32px;align-items:end;margin-bottom:38px}
    .section-head p{max-width:650px;margin-bottom:0}
    .section-kicker{font-size:.8rem;color:var(--light-muted);letter-spacing:.1em;font-weight:700}
    .lead-copy{font-size:1.06rem;line-height:1.95}
    .intro-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:62px;align-items:center}
    .intro-note{border-left:3px solid var(--accent);padding:6px 0 6px 24px}
    .intro-note strong{display:block;color:var(--brand-deep);font-size:1.08rem;margin-bottom:7px}
    .visual-card{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#dfeefa}
    .visual-card img{width:100%;height:370px;object-fit:cover;object-position:center}
    .visual-caption{position:absolute;left:22px;right:22px;bottom:20px;padding:15px 17px;border-radius:10px;background:rgba(8,38,76,.82);color:#fff;font-size:.88rem}
    .filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:18px 20px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-soft)}
    .filter-label{color:var(--brand-deep);font-weight:800;font-size:.86rem;margin-right:5px}
    .filter-chip{border:1px solid var(--line);background:#f9fbfd;color:var(--muted);padding:8px 14px;border-radius:6px;font-size:.84rem;transition:var(--ease)}
    .filter-chip:hover,.filter-chip.active{background:var(--brand-soft);border-color:#9cc5e9;color:var(--brand-deep)}
    .profile-layout{display:grid;grid-template-columns:1.3fr .7fr;gap:24px}
    .profile-feature{display:grid;grid-template-columns:.92fr 1.08fr;min-height:390px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft)}
    .profile-feature img{width:100%;height:100%;min-height:390px;object-fit:cover}
    .profile-body{padding:35px 32px}
    .tag{display:inline-flex;padding:4px 9px;border-radius:5px;background:var(--brand-soft);color:var(--brand);font-size:.74rem;font-weight:800;margin-bottom:13px}
    .tag.teal{background:var(--accent-soft);color:#16736f}
    .tag.gray{background:#f0f4f8;color:#60748a}
    .profile-body h3{font-size:1.65rem}
    .profile-meta{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0;color:var(--muted);font-size:.83rem}
    .profile-meta span{padding:5px 9px;background:#f5f8fb;border-radius:5px}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:10px 19px;border-radius:8px;border:1px solid transparent;font-weight:750;font-size:.93rem;transition:var(--ease)}
    .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px rgba(23,105,194,.28)}
    .btn-outline{background:#fff;color:var(--brand);border-color:#b9d0e7}
    .btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .btn-quiet{background:var(--brand-soft);color:var(--brand-deep)}
    .btn-quiet:hover{background:#d9ecff}
    .quick-index{background:var(--brand-deep);color:#eaf4ff;border-radius:var(--radius);padding:29px 27px;box-shadow:var(--shadow)}
    .quick-index h3{color:#fff;margin-bottom:18px}
    .quick-index p{color:#bad1e6;font-size:.88rem}
    .index-list{list-style:none;margin:22px 0 0;padding:0}
    .index-list li{border-top:1px solid rgba(255,255,255,.15);padding:12px 0}
    .index-list a{display:flex;justify-content:space-between;color:#e8f4ff;font-size:.9rem}
    .index-list a::after{content:"→";color:#83ddd4}
    .index-list a:hover{padding-left:5px;color:#fff}
    .archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .archive-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:var(--shadow-soft);transition:var(--ease)}
    .archive-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .archive-card h3{margin-top:10px}
    .archive-card p{font-size:.89rem}
    .card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:20px;padding-top:15px;border-top:1px solid #edf2f7;font-size:.8rem;color:var(--light-muted)}
    .arrow-link{display:inline-flex;align-items:center;gap:8px;font-size:.87rem;font-weight:800;margin-top:10px}
    .arrow-link::after{content:"→";transition:var(--ease)}
    .arrow-link:hover::after{transform:translateX(4px)}
    .comparison{display:grid;grid-template-columns:1fr 78px 1fr;align-items:stretch;gap:0}
    .compare-card{background:#fff;border:1px solid var(--line);padding:31px;border-radius:var(--radius) 0 0 var(--radius)}
    .compare-card.right{border-left:0;border-radius:0 var(--radius) var(--radius) 0}
    .compare-card h3{font-size:1.35rem}
    .compare-card ul{list-style:none;margin:18px 0 0;padding:0}
    .compare-card li{padding:9px 0;border-top:1px solid #edf2f7;color:var(--muted);font-size:.9rem}
    .compare-card li strong{color:var(--brand-deep);display:block;font-size:.98rem}
    .versus{display:grid;place-items:center;background:var(--accent);color:#fff;font-weight:850;letter-spacing:.08em;z-index:2}
    .story-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:54px;align-items:start}
    .story-copy p{font-size:.96rem}
    .story-list{margin:18px 0 0;padding:0;list-style:none}
    .story-list li{display:flex;gap:13px;padding:13px 0;border-bottom:1px solid var(--line);color:var(--muted)}
    .story-list b{color:var(--accent);font-size:1.15rem}
    .content-list{border-top:1px solid var(--line)}
    .content-item{display:grid;grid-template-columns:92px 110px 1fr 100px;gap:18px;align-items:center;padding:21px 0;border-bottom:1px solid var(--line)}
    .content-date{color:var(--brand-deep);font-weight:800;font-size:.85rem}
    .content-item img{width:110px;height:78px;object-fit:cover;border-radius:8px}
    .content-item h3{font-size:1.06rem;margin-bottom:5px}
    .content-item p{font-size:.85rem;line-height:1.6;margin-bottom:0}
    .content-item .arrow-link{justify-self:end;margin-top:0}
    .faq-list{max-width:930px;margin:0 auto}
    .faq-item{border-top:1px solid var(--line);background:#fff}
    .faq-item:last-child{border-bottom:1px solid var(--line)}
    .faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left;border:0;background:transparent;padding:22px 5px;color:var(--brand-deep);font-weight:800}
    .faq-question::after{content:"+";color:var(--accent);font-size:1.5rem;font-weight:400}
    .faq-item.open .faq-question::after{content:"−"}
    .faq-answer{display:none;padding:0 45px 22px 5px}
    .faq-item.open .faq-answer{display:block}
    .faq-answer p{margin:0;font-size:.92rem}
    .related-strip{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
    .related-strip a{padding:10px 15px;background:#fff;border:1px solid var(--line);border-radius:7px;font-weight:700;font-size:.86rem}
    .related-strip a:hover{background:var(--brand-soft);border-color:#a8c9e7}
    .cta-panel{background:var(--brand-deep);border-radius:var(--radius);padding:46px 50px;display:flex;justify-content:space-between;align-items:center;gap:30px;box-shadow:var(--shadow)}
    .cta-panel h2{color:#fff;margin-bottom:10px}
    .cta-panel p{color:#c5d9eb;max-width:700px;margin-bottom:0}
    .site-footer{background:#102b4c;color:#bdd0e2;padding:58px 0 20px}
    .footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:34px;padding-bottom:42px}
    .footer-brand{color:#fff;font-size:1.35rem;font-weight:850;margin-bottom:12px}
    .site-footer p{color:#afc3d6;font-size:.88rem;max-width:330px}
    .site-footer h3{font-size:.92rem;color:#fff;margin-bottom:13px}
    .footer-links{list-style:none;margin:0;padding:0}
    .footer-links li{margin:6px 0}
    .footer-links a{color:#b8cde0;font-size:.85rem}
    .footer-links a:hover{color:#fff;text-decoration:underline}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.14);padding-top:19px;display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;font-size:.78rem;color:#9db4c9}
    .footer-bottom a{color:#c7d9e8}
    @media (max-width:1024px){
      .intro-grid,.story-grid{grid-template-columns:1fr;gap:30px}
      .profile-layout{grid-template-columns:1fr}
      .quick-index{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:center}
      .index-list{margin-top:0}
      .archive-grid{grid-template-columns:repeat(2,1fr)}
      .content-item{grid-template-columns:82px 100px 1fr}
      .content-item .arrow-link{grid-column:3;justify-self:start}
      .footer-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media (max-width:768px){
      .container{width:min(var(--container),calc(100% - 32px))}
      .topline{min-height:62px}
      .search-box{display:none}
      .mobile-toggle{display:block}
      .channel-row{display:none}
      .channel-row.open{display:block}
      .channel-inner{display:grid;grid-template-columns:repeat(2,1fr);padding:10px 0 14px;gap:3px}
      .channel-link{min-height:42px;padding:0 10px}
      .channel-link::after{left:10px;right:10px}
      .page-banner{min-height:330px}
      .banner-content{padding:62px 0}
      .section{padding:62px 0}
      .section-head{display:block;margin-bottom:27px}
      .section-head p{margin-top:13px}
      .profile-feature{grid-template-columns:1fr}
      .profile-feature img{height:260px;min-height:0}
      .profile-body{padding:27px 24px}
      .quick-index{display:block}
      .index-list{margin-top:18px}
      .comparison{display:block}
      .compare-card,.compare-card.right{border-radius:var(--radius);border:1px solid var(--line)}
      .compare-card.right{margin-top:12px}
      .versus{width:50px;height:38px;margin:-8px auto;position:relative;border-radius:50%;font-size:.78rem}
      .content-item{grid-template-columns:78px 92px 1fr;gap:12px}
      .content-item img{width:92px;height:68px}
      .content-item .arrow-link{grid-column:3}
      .cta-panel{display:block;padding:32px 25px}
      .cta-panel .btn{margin-top:22px}
    }
    @media (max-width:520px){
      h1{font-size:2.25rem}
      h2{font-size:1.75rem}
      .archive-grid{grid-template-columns:1fr}
      .content-item{grid-template-columns:1fr 1fr}
      .content-date{grid-column:1}
      .content-item img{grid-column:2;grid-row:1 / span 2;justify-self:end}
      .content-item h3{grid-column:1 / -1;grid-row:2}
      .content-item p{grid-column:1 / -1;grid-row:3}
      .content-item .arrow-link{grid-column:1 / -1;grid-row:4}
      .footer-grid{grid-template-columns:1fr}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:8px}
      .filter-bar{align-items:flex-start}
    }
    @media (prefers-reduced-motion:reduce){
      *,*::before,*::after{scroll-behavior:auto!important;transition:none!important}
    }

/* roulang page: category5 */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#fff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--warm);color:var(--text);
      font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;line-height:1.78;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{color:var(--brand-deep);font-weight:850;line-height:1.25}
    h1{font-size:clamp(2.25rem,5vw,4.35rem);letter-spacing:-.04em}
    h2{font-size:clamp(1.8rem,3vw,2.55rem);letter-spacing:-.025em}
    h3{font-size:1.22rem}
    p{color:var(--muted)}
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
      outline:3px solid rgba(34,166,161,.35);outline-offset:3px
    }
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .narrow{max-width:820px}
    .section{padding:92px 0}
    .section.compact{padding:64px 0}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--brand);
      font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:16px
    }
    .eyebrow::before{content:"";width:24px;height:2px;background:var(--accent)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:40px}
    .section-head p{max-width:650px;margin-bottom:0}
    .section-kicker{font-size:.8rem;color:var(--light-muted);letter-spacing:.1em;font-weight:700}
    .site-header{
      position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);
      border-bottom:1px solid var(--line);transition:var(--ease)
    }
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{min-height:67px;display:flex;align-items:center;justify-content:space-between;gap:22px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand-mark{
      width:36px;height:36px;border-radius:10px;background:var(--brand);color:#fff;
      display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)
    }
    .top-tools{display:flex;align-items:center;gap:14px}
    .search-box{
      display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;
      border-radius:8px;height:40px;padding:0 12px;min-width:220px
    }
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-size:.88rem;font-weight:750;color:var(--brand-deep)}
    .mobile-toggle{
      display:none;border:1px solid var(--line);background:#fff;border-radius:7px;
      padding:8px 11px;color:var(--brand-deep)
    }
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;overflow-x:auto}
    .channel-link{
      position:relative;display:block;white-space:nowrap;padding:13px 15px;
      color:#52657b;font-size:.9rem;font-weight:700
    }
    .channel-link:hover,.channel-link.active{color:var(--brand-deep)}
    .channel-link.active::after{
      content:"";position:absolute;left:15px;right:15px;bottom:0;height:3px;
      background:var(--accent);border-radius:3px 3px 0 0
    }
    .page-banner{
      position:relative;min-height:390px;display:flex;align-items:center;
      background:#dcecf8 url("/assets/images/backpic/back-2.webp") center/cover no-repeat;
      isolation:isolate;overflow:hidden
    }
    .page-banner::before{
      content:"";position:absolute;inset:0;z-index:-1;
      background:linear-gradient(90deg,rgba(9,48,91,.91),rgba(11,67,116,.7) 53%,rgba(15,79,120,.2))
    }
    .banner-content{padding:74px 0 78px;max-width:790px}
    .page-banner .eyebrow{color:#c7e7fb}
    .page-banner .eyebrow::before{background:#80dcd4}
    .page-banner h1{color:#fff;margin-bottom:20px}
    .page-banner h1 em{font-style:normal;color:#91e1da}
    .banner-content p{color:#e6f1fa;font-size:1.07rem;max-width:730px;margin-bottom:28px}
    .crumbs{padding:18px 0;color:var(--light-muted);font-size:.86rem}
    .crumbs a{color:var(--brand)}
    .crumbs span{margin:0 9px;color:#b4c1cf}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;
      min-height:46px;padding:10px 19px;border-radius:8px;border:1px solid transparent;
      font-weight:750;font-size:.93rem;transition:var(--ease)
    }
    .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px rgba(23,105,194,.28)}
    .btn-light{background:#fff;color:var(--brand-deep);border-color:#fff}
    .btn-light:hover{background:#eaf5ff;color:var(--brand-deep);transform:translateY(-2px)}
    .btn-outline{background:#fff;color:var(--brand);border-color:#b9d0e7}
    .btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .btn-quiet{background:var(--brand-soft);color:var(--brand-deep)}
    .btn-quiet:hover{background:#d9ecff}
    .tag{
      display:inline-flex;padding:4px 9px;border-radius:5px;background:var(--brand-soft);
      color:var(--brand);font-size:.74rem;font-weight:800;margin-bottom:12px
    }
    .tag.teal{background:var(--accent-soft);color:#16736f}
    .tag.gray{background:#f0f4f8;color:#60748a}
    .intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:62px;align-items:center}
    .intro-grid p{font-size:1.02rem}
    .intro-note{border-left:3px solid var(--accent);padding:24px 0 24px 27px;background:#f5fbfc}
    .intro-note strong{display:block;color:var(--brand-deep);font-size:1.65rem;margin-bottom:4px}
    .intro-note span{display:block;color:var(--muted);font-size:.9rem}
    .feature-story{
      display:grid;grid-template-columns:1.06fr .94fr;gap:0;background:#fff;
      border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)
    }
    .feature-story .story-image{min-height:430px;position:relative}
    .story-image img{width:100%;height:100%;object-fit:cover;object-position:center}
    .story-image::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,39,73,.35),transparent 55%)}
    .story-body{padding:45px 48px;display:flex;flex-direction:column;justify-content:center}
    .story-body h2{margin-bottom:18px}
    .story-body p{font-size:1rem;margin-bottom:17px}
    .story-meta{display:flex;flex-wrap:wrap;gap:12px 20px;color:var(--light-muted);font-size:.83rem;margin:4px 0 23px}
    .chapter-strip{display:flex;gap:12px;overflow-x:auto;padding-bottom:5px}
    .chapter{
      min-width:175px;border:1px solid var(--line);background:#fff;border-radius:var(--radius-sm);
      padding:19px 18px;transition:var(--ease)
    }
    .chapter:hover{border-color:#a9c9e8;box-shadow:var(--shadow-soft);transform:translateY(-3px)}
    .chapter b{display:block;color:var(--accent);font-size:.78rem;margin-bottom:6px}
    .chapter strong{display:block;color:var(--brand-deep);font-size:1rem;line-height:1.4}
    .chapter small{display:block;color:var(--light-muted);margin-top:8px}
    .article-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:54px;align-items:start}
    .reading-copy{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:40px 44px;box-shadow:var(--shadow-soft)}
    .reading-copy h2{font-size:1.8rem}
    .reading-copy h3{margin-top:30px}
    .reading-copy p{font-size:1rem;line-height:1.95}
    .reading-copy .lead{font-size:1.12rem;color:#3e5873}
    .quote-box{padding:27px;background:var(--brand-deep);border-radius:var(--radius);color:#e8f3fd;margin:28px 0}
    .quote-box p{color:#e8f3fd;font-size:1.08rem;margin:0}
    .side-stack{display:grid;gap:18px}
    .side-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:var(--shadow-soft)}
    .side-card h3{font-size:1.08rem;margin-bottom:10px}
    .side-card p{font-size:.9rem;margin-bottom:12px}
    .side-list{list-style:none;padding:0;margin:0}
    .side-list li{border-top:1px solid var(--line);padding:12px 0;font-size:.88rem}
    .side-list li:first-child{border-top:0}
    .side-list a{display:flex;justify-content:space-between;gap:10px}
    .timeline{position:relative;margin-top:15px}
    .timeline::before{content:"";position:absolute;left:62px;top:8px;bottom:8px;width:1px;background:#c9dbea}
    .timeline-item{display:grid;grid-template-columns:105px 1fr;gap:28px;position:relative;padding:0 0 27px}
    .timeline-item time{color:var(--brand);font-weight:850;font-size:.88rem;padding-top:3px}
    .timeline-item article{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);padding:20px 23px;box-shadow:var(--shadow-soft)}
    .timeline-item article::before{content:"";position:absolute;left:57px;top:9px;width:11px;height:11px;border:3px solid var(--accent);background:var(--warm);border-radius:50%}
    .timeline-item h3{font-size:1.08rem;margin-bottom:7px}
    .timeline-item p{font-size:.9rem;margin-bottom:9px}
    .data-band{background:var(--surface-blue);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .data-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:0}
    .data-intro,.data-item{padding:30px 24px;border-right:1px solid var(--line)}
    .data-intro{padding-left:0}
    .data-item:last-child{border-right:0}
    .data-number{font-size:2rem;font-weight:850;color:var(--brand-deep);line-height:1.1}
    .data-item p,.data-intro p{font-size:.84rem;margin:8px 0 0}
    .recommend-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
    .recommend-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft);transition:var(--ease)}
    .recommend-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .recommend-card img{height:170px;width:100%;object-fit:cover}
    .recommend-card .card-body{padding:22px}
    .recommend-card h3{font-size:1.12rem;margin-bottom:8px}
    .recommend-card p{font-size:.88rem;margin-bottom:14px}
    .faq-wrap{max-width:930px;margin:0 auto}
    .accordion{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft)}
    .accordion-title{border:0!important;border-bottom:1px solid var(--line)!important;padding:19px 56px 19px 23px;color:var(--brand-deep);font-weight:800;font-size:1rem;background:#fff}
    .accordion-title:hover{background:var(--brand-soft);color:var(--brand-deep)}
    .accordion-title::before{right:23px;color:var(--accent);font-size:1.4rem}
    .accordion-content{border:0!important;background:#fbfdff;padding:4px 56px 22px 23px;color:var(--muted);font-size:.94rem}
    .cta-section{padding:80px 0;background:#eaf4fc}
    .cta-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}
    .cta-copy p{max-width:480px}
    .form-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}
    label{display:block;color:var(--brand-deep);font-size:.86rem;font-weight:750;margin-bottom:7px}
    input,select,textarea{
      width:100%;border:1px solid #cbd9e6;background:#fbfdff;border-radius:7px;
      padding:11px 13px;color:var(--text);transition:var(--ease);margin-bottom:18px
    }
    input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(23,105,194,.1);outline:0;background:#fff}
    textarea{min-height:120px;resize:vertical}
    .checkline{display:flex;align-items:flex-start;gap:9px;color:var(--muted);font-size:.82rem;margin:0 0 20px}
    .checkline input{width:17px;height:17px;margin:3px 0 0}
    .form-message{display:none;margin-top:15px;padding:11px 14px;border-radius:7px;background:var(--accent-soft);color:#176d69;font-size:.88rem}
    .site-footer{background:#102e50;color:#c6d7e8;padding:62px 0 24px}
    .footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:35px}
    .footer-brand{font-size:1.35rem;color:#fff;font-weight:850;margin-bottom:12px}
    .site-footer p{color:#b9ccde;font-size:.88rem;max-width:320px}
    .site-footer h3{color:#fff;font-size:1rem;margin-bottom:15px}
    .footer-links{list-style:none;padding:0;margin:0}
    .footer-links li{margin:8px 0}
    .footer-links a{color:#b9ccde;font-size:.88rem}
    .footer-links a:hover{color:#fff;text-decoration:underline}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.16);margin-top:38px;padding-top:20px;display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between;font-size:.78rem;color:#a8bfd4}
    .footer-bottom a{color:#c9dced}
    .text-link{font-weight:800;font-size:.88rem}
    .pagination{display:flex;gap:8px;justify-content:center;margin-top:38px}
    .pagination a,.pagination span{min-width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--muted);font-size:.88rem}
    .pagination .current{background:var(--brand);border-color:var(--brand);color:#fff}
    @media(max-width:900px){
      .intro-grid,.feature-story,.article-layout,.cta-grid{grid-template-columns:1fr}
      .feature-story .story-image{min-height:300px}
      .data-grid{grid-template-columns:1fr 1fr}
      .data-intro{grid-column:span 2;border-right:0;border-bottom:1px solid var(--line);padding-left:24px}
      .data-item:nth-child(3){border-right:0}
      .footer-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:700px){
      .container{width:min(100% - 30px,var(--container))}
      .topline{min-height:61px}
      .top-tools{gap:9px}
      .search-box{display:none}
      .trend-link{font-size:.8rem}
      .mobile-toggle{display:block}
      .channel-row{display:none}
      .channel-row.open{display:block}
      .channel-inner{display:grid;grid-template-columns:1fr 1fr;padding:8px 0}
      .channel-link{padding:10px 8px}
      .channel-link.active::after{left:8px;right:8px}
      .section{padding:60px 0}
      .section-head{display:block;margin-bottom:27px}
      .section-head p{margin-top:13px}
      .page-banner{min-height:350px}
      .banner-content{padding:58px 0}
      .banner-content p{font-size:.97rem}
      .story-body{padding:30px 24px}
      .chapter{min-width:155px}
      .reading-copy{padding:28px 22px}
      .timeline::before{left:10px}
      .timeline-item{grid-template-columns:1fr;gap:8px;padding-left:32px}
      .timeline-item article::before{left:5px}
      .data-grid{grid-template-columns:1fr 1fr}
      .data-intro{grid-column:span 2}
      .data-intro,.data-item{padding:22px 15px}
      .recommend-grid{grid-template-columns:1fr}
      .recommend-card img{height:190px}
      .cta-section{padding:60px 0}
      .form-panel{padding:23px 18px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:25px 18px}
      .footer-grid>div:first-child{grid-column:span 2}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:9px}
    }
    @media(max-width:430px){
      h1{font-size:2.2rem}
      .hero-actions .btn{width:100%}
      .topline .brand{font-size:1.2rem}
      .brand-mark{width:32px;height:32px}
      .data-grid{grid-template-columns:1fr}
      .data-intro{grid-column:auto}
      .data-item{border-right:0;border-bottom:1px solid var(--line)}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
    }

/* roulang page: category6 */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#ffffff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease;
    }
    html{scroll-behavior:smooth}
    *,*::before,*::after{box-sizing:border-box}
    body{
      margin:0;
      background:var(--warm);
      color:var(--text);
      font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;
      line-height:1.78;
      overflow-x:hidden;
    }
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
      outline:3px solid rgba(34,166,161,.35);
      outline-offset:3px;
    }
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{color:var(--brand-deep);line-height:1.3;font-weight:850}
    h1{font-size:clamp(2.2rem,4vw,4.2rem);letter-spacing:-.04em}
    h2{font-size:clamp(1.7rem,2.4vw,2.55rem);margin-bottom:12px}
    h3{font-size:1.2rem;margin-bottom:10px}
    p{color:var(--muted)}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .narrow{max-width:820px}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;
      color:var(--brand);font-size:.78rem;font-weight:800;letter-spacing:.12em;
      margin-bottom:16px
    }
    .eyebrow::before{content:"";width:24px;height:2px;background:var(--accent)}
    .section{padding:92px 0}
    .section.compact{padding:66px 0}
    .section-head{
      display:flex;justify-content:space-between;gap:32px;align-items:end;
      margin-bottom:42px
    }
    .section-head p{max-width:650px;margin-bottom:0}
    .section-kicker{font-size:.8rem;color:var(--light-muted);letter-spacing:.1em;font-weight:700}
    .site-header{
      position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);
      border-bottom:1px solid var(--line);transition:var(--ease)
    }
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand:hover{color:var(--brand)}
    .brand-mark{
      width:36px;height:36px;border-radius:10px;background:var(--brand);color:#fff;
      display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)
    }
    .top-tools{display:flex;align-items:center;gap:14px}
    .search-box{
      display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;
      border-radius:8px;height:40px;padding:0 12px;min-width:220px
    }
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-size:.86rem;font-weight:750;color:var(--brand-deep)}
    .trend-link:hover{text-decoration:underline}
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none}
    .channel-inner::-webkit-scrollbar{display:none}
    .channel-link{
      position:relative;display:inline-flex;align-items:center;min-height:48px;
      padding:0 14px;color:#53677f;font-size:.9rem;font-weight:700;white-space:nowrap
    }
    .channel-link::after{
      content:"";position:absolute;height:2px;left:14px;right:14px;bottom:0;
      background:transparent;transition:var(--ease)
    }
    .channel-link:hover,.channel-link.active{color:var(--brand-deep)}
    .channel-link:hover::after,.channel-link.active::after{background:var(--accent)}
    .mobile-toggle{display:none;border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 11px;color:var(--brand-deep)}
    .page-banner{
      position:relative;min-height:390px;display:flex;align-items:center;
      background:#dfeefa url("/assets/images/backpic/back-3.webp") center 45%/cover no-repeat;
      isolation:isolate;overflow:hidden
    }
    .page-banner::before{
      content:"";position:absolute;inset:0;z-index:-1;
      background:linear-gradient(90deg,rgba(8,38,76,.9),rgba(10,55,103,.65) 56%,rgba(10,55,103,.18))
    }
    .banner-content{padding:72px 0 76px;max-width:780px}
    .page-banner .eyebrow{color:#c5e8ff}
    .page-banner .eyebrow::before{background:#7cddd5}
    .page-banner h1{color:#fff;margin-bottom:18px}
    .page-banner h1 em{font-style:normal;color:#8fe1da}
    .banner-content p{color:#e4eff9;font-size:1.07rem;max-width:720px;margin-bottom:0}
    .breadcrumb-wrap{background:#fff;border-bottom:1px solid var(--line)}
    .breadcrumbs{margin:0;padding:15px 0;font-size:.84rem;color:var(--light-muted)}
    .breadcrumbs a{color:var(--muted)}
    .breadcrumbs li:not(:last-child)::after{color:#9badbf}
    .intro-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
    .intro-copy p{font-size:1.02rem;line-height:1.95}
    .intro-note{border-left:3px solid var(--accent);padding:17px 0 17px 22px;margin-top:25px}
    .intro-note strong{display:block;color:var(--brand-deep);margin-bottom:4px}
    .feature-visual{position:relative}
    .feature-visual img{width:100%;height:390px;object-fit:cover;object-position:center;border-radius:var(--radius);box-shadow:var(--shadow)}
    .visual-caption{
      position:absolute;left:22px;right:22px;bottom:20px;padding:15px 17px;border-radius:10px;
      background:rgba(255,255,255,.94);box-shadow:var(--shadow-soft)
    }
    .visual-caption strong{display:block;color:var(--brand-deep)}
    .visual-caption span{font-size:.82rem;color:var(--muted)}
    .timeline-section{background:var(--surface-blue)}
    .timeline-layout{display:grid;grid-template-columns:250px 1fr;gap:58px}
    .year-nav{position:sticky;top:145px;align-self:start}
    .year-nav h3{font-size:1rem;margin-bottom:15px}
    .year-list{list-style:none;margin:0;padding:0;border-left:1px solid #c9d9e8}
    .year-list li a{
      display:block;padding:9px 0 9px 18px;color:var(--muted);font-weight:700;
      border-left:3px solid transparent;margin-left:-2px
    }
    .year-list li a:hover,.year-list li a.active{color:var(--brand);border-left-color:var(--accent);background:#fff}
    .timeline{position:relative;padding-left:33px}
    .timeline::before{content:"";position:absolute;left:8px;top:10px;bottom:18px;width:2px;background:#cfe0ee}
    .timeline-item{position:relative;padding:0 0 38px}
    .timeline-item:last-child{padding-bottom:0}
    .timeline-item::before{
      content:"";position:absolute;left:-31px;top:7px;width:16px;height:16px;border-radius:50%;
      background:#fff;border:4px solid var(--brand);box-shadow:0 0 0 5px rgba(23,105,194,.1)
    }
    .time-label{color:var(--accent);font-size:.82rem;font-weight:850;letter-spacing:.08em;margin-bottom:7px}
    .timeline-item h3{margin-bottom:8px}
    .timeline-item p{max-width:700px;margin-bottom:12px}
    .timeline-meta{display:flex;flex-wrap:wrap;gap:8px}
    .tag{display:inline-flex;padding:4px 9px;border-radius:5px;background:var(--brand-soft);color:var(--brand);font-size:.74rem;font-weight:800}
    .tag.teal{background:var(--accent-soft);color:#16736f}
    .tag.gray{background:#f0f4f8;color:#60748a}
    .index-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:34px}
    .index-cell{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px;text-align:center;transition:var(--ease)}
    .index-cell:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft);border-color:#b8d2e9}
    .index-cell strong{display:block;font-size:1.35rem;color:var(--brand-deep)}
    .index-cell span{font-size:.78rem;color:var(--muted)}
    .review-section{background:#fff}
    .review-feature{display:grid;grid-template-columns:.92fr 1.08fr;gap:0;background:var(--surface-blue);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft)}
    .review-feature img{width:100%;height:100%;min-height:430px;object-fit:cover}
    .review-text{padding:42px 46px}
    .review-text p{line-height:1.9}
    .review-points{list-style:none;margin:25px 0 26px;padding:0}
    .review-points li{position:relative;padding:8px 0 8px 25px;border-bottom:1px solid #d9e5ef;color:var(--muted)}
    .review-points li::before{content:"";position:absolute;left:0;top:18px;width:8px;height:8px;border-radius:50%;background:var(--accent)}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;
      padding:10px 19px;border-radius:8px;border:1px solid transparent;font-weight:750;
      font-size:.93rem;transition:var(--ease)
    }
    .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px rgba(23,105,194,.28)}
    .btn-outline{background:#fff;color:var(--brand);border-color:#b9d0e7}
    .btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .archive-section{background:var(--warm)}
    .archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
    .archive-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:var(--shadow-soft);transition:var(--ease)}
    .archive-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#bcd5e9}
    .archive-card:nth-child(2){margin-top:28px}
    .archive-card:nth-child(5){margin-top:-12px}
    .archive-card h3{font-size:1.12rem;margin-top:15px}
    .archive-card p{font-size:.91rem;line-height:1.78}
    .archive-card .archive-date{font-size:.78rem;color:var(--accent);font-weight:800}
    .archive-card .arrow-link,.related-item .arrow-link{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:.86rem}
    .arrow-link::after{content:"→";transition:var(--ease)}
    .arrow-link:hover::after{transform:translateX(4px)}
    .reading-section{background:#fff}
    .reading-grid{display:grid;grid-template-columns:1.18fr .82fr;gap:50px;align-items:start}
    .reading-copy p{line-height:1.95}
    .reading-list{display:grid;gap:0;border-top:1px solid var(--line)}
    .reading-row{display:grid;grid-template-columns:110px 1fr auto;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
    .reading-row time{font-size:.82rem;color:var(--accent);font-weight:800}
    .reading-row strong{font-size:.94rem;color:var(--brand-deep)}
    .reading-row span{font-size:.8rem;color:var(--light-muted)}
    .source-box{background:var(--brand-deep);border-radius:var(--radius);padding:30px;color:#e9f3fc}
    .source-box h3{color:#fff}
    .source-box p{color:#c9dced;font-size:.9rem}
    .source-box ul{margin:18px 0 0;padding-left:20px;color:#dbe9f5;font-size:.88rem}
    .source-box li{margin-bottom:8px}
    .related-section{background:var(--surface-blue)}
    .related-layout{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
    .related-item{background:#fff;border:1px solid var(--line);padding:22px 24px;border-radius:11px;min-height:170px;transition:var(--ease)}
    .related-item:hover{box-shadow:var(--shadow-soft);transform:translateY(-3px)}
    .related-item h3{font-size:1.05rem}
    .related-item p{font-size:.88rem;line-height:1.7}
    .faq-section{background:#fff}
    .faq-wrap{max-width:960px;margin:0 auto}
    .accordion{background:transparent;margin:0}
    .accordion-item{border:0;border-top:1px solid var(--line)}
    .accordion-item:last-child{border-bottom:1px solid var(--line)}
    .accordion-title{
      display:flex;align-items:center;justify-content:space-between;gap:20px;
      padding:21px 4px;color:var(--brand-deep);font-size:1rem;font-weight:800;border:0
    }
    .accordion-title::before{content:"+";position:static;order:2;color:var(--accent);font-size:1.35rem;font-weight:400}
    .accordion-title:hover{color:var(--brand);background:#fbfdff}
    .accordion-content{padding:0 42px 22px 4px;border:0;background:#fff}
    .accordion-content p{margin:0;line-height:1.9}
    .cta-section{padding:72px 0}
    .cta-panel{
      display:flex;justify-content:space-between;align-items:center;gap:30px;
      background:var(--brand-soft);border:1px solid #cce0f3;border-radius:var(--radius);
      padding:38px 44px
    }
    .cta-panel h2{margin-bottom:9px}
    .cta-panel p{margin-bottom:0;max-width:680px}
    .cta-actions{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0}
    .site-footer{background:#0e315b;color:#c6d7e9;padding:58px 0 20px}
    .footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:40px}
    .footer-brand{font-size:1.5rem;font-weight:850;color:#fff;margin-bottom:12px}
    .site-footer p{color:#b7cbe0;font-size:.9rem;max-width:330px}
    .site-footer h3{color:#fff;font-size:.95rem;margin-bottom:14px}
    .footer-links{list-style:none;margin:0;padding:0}
    .footer-links li{margin-bottom:8px}
    .footer-links a{color:#b7cbe0;font-size:.87rem}
    .footer-links a:hover{color:#fff;text-decoration:underline}
    .footer-bottom{
      display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
      border-top:1px solid rgba(255,255,255,.15);margin-top:42px;padding-top:18px;
      font-size:.78rem;color:#a9bfd5
    }
    .footer-bottom a{color:#c9deef}
    @media(max-width:900px){
      .top-tools .search-box{min-width:170px}
      .intro-grid,.review-feature,.reading-grid{grid-template-columns:1fr}
      .feature-visual img{height:320px}
      .timeline-layout{grid-template-columns:190px 1fr;gap:32px}
      .archive-grid{grid-template-columns:repeat(2,1fr)}
      .related-layout{grid-template-columns:repeat(2,1fr)}
      .footer-grid{grid-template-columns:repeat(2,1fr)}
      .cta-panel{align-items:flex-start;flex-direction:column}
    }
    @media(max-width:680px){
      .container{width:min(var(--container),calc(100% - 30px))}
      .topline{min-height:64px}
      .top-tools{gap:8px}
      .top-tools .search-box,.trend-link{display:none}
      .mobile-toggle{display:block}
      .channel-row{display:none}
      .channel-row.open{display:block}
      .channel-inner{display:grid;grid-template-columns:repeat(2,1fr);padding:8px 0 12px}
      .channel-link{min-height:42px;padding:0 9px}
      .channel-link::after{left:9px;right:9px}
      .page-banner{min-height:355px;background-position:62% center}
      .banner-content{padding:58px 0 64px}
      .section{padding:62px 0}
      .section.compact{padding:48px 0}
      .section-head{display:block;margin-bottom:28px}
      .section-head p{margin-top:12px}
      .intro-grid{gap:28px}
      .feature-visual img{height:260px}
      .timeline-layout{display:block}
      .year-nav{position:static;margin-bottom:32px}
      .year-list{display:flex;overflow-x:auto;border:0;gap:8px;padding-bottom:5px}
      .year-list li a{border:1px solid var(--line);border-radius:7px;padding:7px 13px;margin:0;white-space:nowrap;background:#fff}
      .year-list li a:hover,.year-list li a.active{border-color:var(--accent);background:var(--accent-soft)}
      .timeline{padding-left:27px}
      .timeline::before{left:6px}
      .timeline-item::before{left:-27px}
      .index-strip{grid-template-columns:repeat(2,1fr)}
      .index-cell:last-child{grid-column:span 2}
      .review-text{padding:28px 24px}
      .review-feature img{min-height:250px}
      .archive-grid,.related-layout{grid-template-columns:1fr}
      .archive-card:nth-child(2),.archive-card:nth-child(5){margin-top:0}
      .reading-row{grid-template-columns:80px 1fr;gap:10px}
      .reading-row span{grid-column:2}
      .cta-panel{padding:28px 23px}
      .cta-actions{width:100%}
      .cta-actions .btn{flex:1}
      .footer-grid{grid-template-columns:1fr 1fr;gap:26px 18px}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:8px}
    }
    @media(max-width:420px){
      h1{font-size:2.05rem}
      .brand{font-size:1.2rem}
      .brand-mark{width:32px;height:32px}
      .footer-grid{grid-template-columns:1fr}
      .cta-actions{display:grid;grid-template-columns:1fr}
    }
    @media(prefers-reduced-motion:reduce){
      html{scroll-behavior:auto}
      *,*::before,*::after{transition:none!important}
    }

/* roulang page: category7 */
:root{
      --brand:#1769c2;
      --brand-deep:#0c3c78;
      --brand-soft:#eaf4ff;
      --accent:#22a6a1;
      --accent-soft:#e6f7f5;
      --warm:#fbfcfe;
      --surface:#fff;
      --surface-blue:#f2f7fc;
      --text:#172b45;
      --muted:#64748b;
      --light-muted:#8b9ab0;
      --line:#dce6f0;
      --success:#2d8a63;
      --warning:#b87924;
      --danger:#bd5960;
      --shadow:0 18px 46px rgba(30,74,117,.10);
      --shadow-soft:0 8px 24px rgba(30,74,117,.07);
      --radius:14px;
      --radius-sm:9px;
      --container:1240px;
      --ease:all .28s ease
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--warm);color:var(--text);
      font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;line-height:1.78;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{color:var(--brand-deep);line-height:1.25;letter-spacing:-.025em}
    h1{font-size:clamp(2.25rem,4.6vw,4.25rem);margin-bottom:20px}
    h2{font-size:clamp(1.8rem,3vw,2.65rem);margin-bottom:14px}
    h3{font-size:1.22rem;margin-bottom:10px}
    p{color:var(--muted)}
    a{color:var(--brand);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--brand-deep)}
    a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
      outline:3px solid rgba(34,166,161,.35);outline-offset:3px
    }
    img{display:block;max-width:100%;height:auto}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
    .narrow{max-width:820px}
    .section{padding:92px 0}
    .section.compact{padding:65px 0}
    .section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:38px}
    .section-head p{max-width:650px;margin-bottom:0}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--brand);
      font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:15px
    }
    .eyebrow:before{content:"";width:24px;height:2px;background:var(--accent)}
    .site-header{
      position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);
      border-bottom:1px solid var(--line);transition:var(--ease)
    }
    .site-header.scrolled{box-shadow:0 8px 24px rgba(25,70,115,.08)}
    .topline{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--brand-deep);font-weight:850;font-size:1.42rem;white-space:nowrap}
    .brand:hover{color:var(--brand)}
    .brand-mark{
      width:36px;height:36px;border-radius:10px;background:var(--brand);color:#fff;
      display:grid;place-items:center;font-size:1rem;box-shadow:0 6px 14px rgba(23,105,194,.22)
    }
    .top-tools{display:flex;align-items:center;gap:12px}
    .search-box{
      display:flex;align-items:center;border:1px solid var(--line);background:#f8fbfe;
      border-radius:8px;height:40px;padding:0 12px;min-width:220px
    }
    .search-box span{color:var(--light-muted);font-size:.83rem}
    .trend-link{font-size:.88rem;font-weight:750;color:var(--brand-deep);padding:8px 10px}
    .trend-link:hover{background:var(--brand-soft);border-radius:7px}
    .mobile-toggle{
      display:none;border:1px solid var(--line);background:#fff;border-radius:7px;
      padding:8px 11px;color:var(--brand-deep)
    }
    .channel-row{border-top:1px solid #edf2f7}
    .channel-inner{display:flex;align-items:center;gap:4px;overflow-x:auto}
    .channel-link{
      position:relative;display:inline-flex;align-items:center;min-height:48px;
      padding:0 15px;color:#52657b;font-size:.9rem;white-space:nowrap
    }
    .channel-link:hover{color:var(--brand)}
    .channel-link.active{color:var(--brand-deep);font-weight:800}
    .channel-link.active:after{
      content:"";position:absolute;left:15px;right:15px;bottom:-1px;height:3px;
      background:var(--accent);border-radius:3px 3px 0 0
    }
    .sub-hero{
      position:relative;overflow:hidden;background:#dfeefa url("/assets/images/backpic/back-3.webp") center/cover no-repeat;
      min-height:390px;display:flex;align-items:center
    }
    .sub-hero:before{
      content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,45,87,.9),rgba(12,62,120,.68) 58%,rgba(12,62,120,.22))
    }
    .sub-hero-content{position:relative;z-index:1;max-width:760px;padding:72px 0 82px}
    .sub-hero h1{color:#fff;max-width:700px}
    .sub-hero h1 em{font-style:normal;color:#8fe1da}
    .sub-hero p{color:#e7f2fc;max-width:690px;font-size:1.06rem;margin-bottom:25px}
    .breadcrumb-wrap{background:#f3f7fb;border-bottom:1px solid var(--line)}
    .breadcrumbs{margin:0;padding:14px 0;color:var(--light-muted);font-size:.84rem}
    .breadcrumbs a{color:var(--muted)}
    .breadcrumbs li:not(:last-child):after{color:#9eb0c3}
    .hero-stamp{
      position:absolute;right:8%;top:67px;z-index:2;width:116px;height:116px;border-radius:50%;
      background:#fff3cf;color:#885b1d;display:grid;place-items:center;text-align:center;
      font-size:.82rem;font-weight:850;line-height:1.35;transform:rotate(10deg);
      box-shadow:0 13px 25px rgba(7,35,70,.16);border:5px solid rgba(255,255,255,.55)
    }
    .hero-stamp strong{display:block;font-size:1.1rem;color:#bd5960}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;
      padding:10px 19px;border-radius:8px;border:1px solid transparent;font-weight:750;
      font-size:.93rem;transition:var(--ease)
    }
    .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(23,105,194,.2)}
    .btn-primary:hover{background:#0e579f;color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px rgba(23,105,194,.28)}
    .btn-light{background:#fff;color:var(--brand-deep);border-color:#fff}
    .btn-light:hover{background:#eaf5ff;color:var(--brand-deep);transform:translateY(-2px)}
    .btn-outline{background:#fff;color:var(--brand);border-color:#b9d0e7}
    .btn-outline:hover{background:var(--brand-soft);border-color:var(--brand);transform:translateY(-2px)}
    .btn-quiet{background:var(--brand-soft);color:var(--brand-deep)}
    .btn-quiet:hover{background:#d9ecff}
    .trend-strip{margin-top:-35px;position:relative;z-index:3}
    .trend-panel{
      background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);
      padding:23px 28px;display:flex;align-items:center;gap:26px
    }
    .trend-title{min-width:100px;color:var(--brand-deep);font-weight:850}
    .trend-items{display:flex;flex-wrap:wrap;gap:10px}
    .tag{
      display:inline-flex;padding:5px 10px;border-radius:5px;background:var(--brand-soft);
      color:var(--brand);font-size:.76rem;font-weight:800
    }
    .tag.teal{background:var(--accent-soft);color:#16736f}
    .tag.gray{background:#f0f4f8;color:#60748a}
    .tag.amber{background:#fff5df;color:#90621d}
    .pick-grid{display:grid;grid-template-columns:1.18fr .82fr;gap:25px}
    .feature-story,.side-story,.reading-item,.faq-panel,.feedback-card,.topic-panel{
      background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
      box-shadow:var(--shadow-soft)
    }
    .feature-story{overflow:hidden}
    .feature-image{height:310px;overflow:hidden;position:relative}
    .feature-image:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,43,82,.55),transparent 52%)}
    .feature-image img{width:100%;height:100%;object-fit:cover;object-position:center}
    .feature-body{padding:27px 30px 30px}
    .feature-body h3{font-size:1.65rem;margin:8px 0 12px}
    .meta{display:flex;flex-wrap:wrap;gap:13px;color:var(--light-muted);font-size:.79rem}
    .side-stack{display:grid;gap:15px}
    .side-story{padding:22px 23px;transition:var(--ease)}
    .side-story:hover,.reading-item:hover,.topic-panel:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
    .side-story h3{font-size:1.08rem;margin:7px 0}
    .side-story p{font-size:.88rem;margin-bottom:8px}
    .reading-section{background:var(--surface-blue)}
    .reading-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
    .reading-item{display:grid;grid-template-columns:116px 1fr;gap:18px;padding:16px;transition:var(--ease)}
    .reading-thumb{height:116px;overflow:hidden;border-radius:9px}
    .reading-thumb img{width:100%;height:100%;object-fit:cover}
    .reading-item h3{font-size:1.06rem;margin:8px 0 7px}
    .reading-item p{font-size:.86rem;line-height:1.65;margin-bottom:6px}
    .arrow-link{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;font-weight:800}
    .arrow-link:after{content:"→";transition:var(--ease)}
    .arrow-link:hover:after{transform:translateX(4px)}
    .insight-layout{display:grid;grid-template-columns:.76fr 1.24fr;gap:48px;align-items:start}
    .insight-copy{padding-top:15px}
    .insight-copy p{font-size:1rem}
    .insight-note{border-left:3px solid var(--accent);padding:14px 0 14px 18px;margin-top:26px;color:var(--brand-deep);font-weight:700}
    .topic-panel{padding:27px;transition:var(--ease)}
    .topic-panel h3{font-size:1.34rem;margin-top:9px}
    .topic-panel p{font-size:.91rem}
    .topic-panel ul{list-style:none;margin:18px 0 0;padding:0}
    .topic-panel li{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-top:1px solid var(--line);font-size:.89rem}
    .topic-panel li span:last-child{color:var(--light-muted);white-space:nowrap}
    .faq-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:52px;align-items:start}
    .faq-intro p{max-width:390px}
    .faq-panel{padding:8px 24px}
    details{border-bottom:1px solid var(--line)}
    details:last-child{border-bottom:0}
    summary{
      list-style:none;cursor:pointer;padding:21px 38px 21px 0;position:relative;
      color:var(--brand-deep);font-weight:800
    }
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";position:absolute;right:4px;top:17px;color:var(--accent);font-size:1.5rem;font-weight:400}
    details[open] summary:after{content:"−"}
    .answer{padding:0 35px 20px 0;color:var(--muted);font-size:.92rem}
    .feedback-section{background:#eaf4ff}
    .feedback-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:38px;align-items:stretch}
    .feedback-copy{padding:28px 8px 20px 0}
    .feedback-copy h2{max-width:430px}
    .feedback-copy p{max-width:470px}
    .feedback-card{padding:30px}
    label{display:block;color:var(--brand-deep);font-size:.86rem;font-weight:800;margin-bottom:7px}
    .required{color:var(--danger)}
    input,select,textarea{
      width:100%;border:1px solid #cbd9e7;border-radius:8px;background:#fbfdff;
      color:var(--text);padding:11px 13px;transition:var(--ease);margin-bottom:17px
    }
    input,select{height:46px}
    textarea{min-height:118px;resize:vertical}
    input:hover,select:hover,textarea:hover{border-color:#9fbdd8}
    input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 4px rgba(23,105,194,.1);outline:0}
    .form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .checkline{display:flex;gap:9px;align-items:flex-start;color:var(--muted);font-size:.79rem;margin:1px 0 20px}
    .checkline input{width:17px;height:17px;margin:3px 0 0;flex:0 0 auto}
    .form-status{display:none;margin-top:14px;padding:10px 13px;border-radius:7px;background:#e8f6ee;color:var(--success);font-size:.84rem}
    .form-status.show{display:block}
    .cta-band{
      padding:30px 34px;background:var(--brand-deep);border-radius:var(--radius);
      display:flex;justify-content:space-between;align-items:center;gap:28px
    }
    .cta-band h2{color:#fff;font-size:1.75rem;margin-bottom:8px}
    .cta-band p{color:#d9e7f4;margin:0;max-width:690px}
    .cta-band .btn{flex:0 0 auto}
    .site-footer{background:#0d294c;color:#d9e6f2;padding:65px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.35fr .85fr .85fr .85fr;gap:38px;padding-bottom:40px}
    .footer-brand{font-size:1.45rem;font-weight:850;color:#fff;margin-bottom:12px}
    .site-footer p{color:#aebfd2;font-size:.88rem;max-width:330px}
    .site-footer h3{color:#fff;font-size:.95rem;margin-bottom:14px}
    .footer-links{list-style:none;padding:0;margin:0}
    .footer-links li{margin-bottom:8px}
    .footer-links a{color:#b5c7d9;font-size:.86rem}
    .footer-links a:hover{color:#fff}
    .footer-bottom{border-top:1px solid rgba(218,232,245,.16);padding-top:22px;display:flex;flex-wrap:wrap;gap:10px 24px;color:#9fb3c8;font-size:.78rem}
    .footer-bottom a{color:#c6d9eb}
    @media(max-width:900px){
      .hero-stamp{right:4%;top:38px;transform:scale(.84) rotate(10deg)}
      .pick-grid,.insight-layout,.faq-layout,.feedback-grid{grid-template-columns:1fr}
      .feature-image{height:270px}
      .footer-grid{grid-template-columns:1.2fr 1fr 1fr}
      .footer-grid>div:first-child{grid-column:1/-1}
    }
    @media(max-width:720px){
      .container{width:min(var(--container),calc(100% - 32px))}
      .topline{min-height:62px}
      .top-tools{gap:6px}
      .search-box{min-width:0;width:42px;padding:0;justify-content:center;font-size:0}
      .search-box span{font-size:0}
      .search-box:before{content:"⌕";font-size:1.35rem;color:var(--brand-deep)}
      .trend-link{display:none}
      .mobile-toggle{display:block}
      .channel-row{display:none}
      .channel-row.open{display:block}
      .channel-inner{display:flex;flex-wrap:wrap;padding:8px 0 12px;overflow:visible}
      .channel-link{min-height:42px;padding:0 10px}
      .channel-link.active:after{left:10px;right:10px}
      .sub-hero{min-height:430px}
      .sub-hero-content{padding:72px 0 78px}
      .hero-stamp{right:3%;top:20px;width:88px;height:88px;font-size:.68rem;border-width:3px}
      .hero-stamp strong{font-size:.9rem}
      .trend-strip{margin-top:-22px}
      .trend-panel{display:block;padding:19px}
      .trend-title{margin-bottom:12px}
      .section{padding:66px 0}
      .section-head{display:block;margin-bottom:28px}
      .section-head p{margin-top:12px}
      .reading-list{grid-template-columns:1fr}
      .reading-item{grid-template-columns:92px 1fr;gap:13px}
      .reading-thumb{height:92px}
      .feature-body{padding:23px}
      .feature-body h3{font-size:1.35rem}
      .form-row{grid-template-columns:1fr;gap:0}
      .cta-band{display:block;padding:26px 23px}
      .cta-band .btn{margin-top:20px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
      .footer-grid>div:first-child{grid-column:1/-1}
    }
    @media(max-width:520px){
      body{font-size:15px}
      h1{font-size:2.22rem}
      h2{font-size:1.8rem}
      .brand{font-size:1.22rem}
      .brand-mark{width:32px;height:32px}
      .sub-hero p{font-size:.96rem}
      .hero-actions{display:grid}
      .hero-actions .btn{width:100%}
      .feature-image{height:220px}
      .reading-item{display:block}
      .reading-thumb{height:150px;margin-bottom:13px}
      .feedback-card{padding:21px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:8px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
    }
