/* roulang page: index */
:root{
      --ink:#252a29;
      --ink-soft:#58615e;
      --muted:#7b8580;
      --paper:#f7f4ee;
      --paper-2:#eeeae1;
      --white:#fffdf9;
      --line:#ddd8ce;
      --line-dark:#434b47;
      --coral:#e8664c;
      --coral-dark:#bb4936;
      --lime:#b9d875;
      --cyan:#72c7bd;
      --night:#202827;
      --shadow:0 18px 42px rgba(37,42,41,.09);
      --shadow-sm:0 8px 20px rgba(37,42,41,.07);
      --radius:18px;
      --radius-sm:11px;
      --container:1240px;
      --ease:all .28s ease;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--paper);
      color:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:16px;
      line-height:1.8;
      overflow-x:hidden;
    }
    h1,h2,h3,h4,p,ul,ol{margin-top:0}
    h1,h2,h3,h4{line-height:1.25;letter-spacing:-.035em}
    h1{font-size:clamp(2.6rem,5vw,5.7rem);margin-bottom:22px}
    h2{font-size:clamp(2rem,3vw,3.2rem);margin-bottom:16px}
    h3{font-size:1.25rem;margin-bottom:10px}
    p{color:var(--ink-soft);margin-bottom:18px}
    a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--coral)}
    a:visited{color:var(--coral-dark)}
    a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
      outline:3px solid rgba(114,199,189,.65);
      outline-offset:3px;
    }
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;
      color:var(--coral-dark);font-size:.78rem;font-weight:800;
      letter-spacing:.12em;text-transform:uppercase;margin-bottom:15px
    }
    .eyebrow::before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
    .section{padding:96px 0;position:relative}
    .section-head{max-width:700px;margin-bottom:42px}
    .section-head p{font-size:1.07rem;max-width:650px}
    .section-soft{background:var(--paper-2)}
    .section-dark{background:var(--night);color:#f7f4ee}
    .section-dark p{color:#c4ccc6}
    .section-dark .eyebrow{color:var(--lime)}
    .section-dark .eyebrow::before{background:var(--lime)}
    .section-dark h2,.section-dark h3{color:#fffdf9}
    .site-header{
      background:rgba(247,244,238,.95);
      border-bottom:1px solid var(--line);
      position:sticky;top:0;z-index:30;
      backdrop-filter:blur(12px)
    }
    .brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
    .brand-mark{
      width:40px;height:40px;border-radius:12px;background:var(--coral);
      display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.1rem;
      box-shadow:4px 4px 0 var(--ink)
    }
    .brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
    .live-dot{width:8px;height:8px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(232,102,76,.13)}
    .nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}
    .icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
    .icon-nav a{
      min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;
      display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700
    }
    .icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}
    .icon-nav a.active{background:var(--ink);color:#fffdf9;border-color:var(--ink);box-shadow:var(--shadow-sm)}
    .nav-icon{font-size:1.15rem;line-height:1}
    .hero{
      min-height:690px;display:flex;align-items:center;position:relative;
      background:
        linear-gradient(90deg,rgba(32,40,39,.92) 0%,rgba(32,40,39,.72) 45%,rgba(32,40,39,.2) 100%),
        url('/assets/images/backpic/back-1.webp') center/cover;
      color:#fffdf9;overflow:hidden
    }
    .hero::after{content:"";position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,var(--paper))}
    .hero-inner{position:relative;z-index:1;width:100%;padding:82px 0 110px}
    .hero-copy{max-width:750px}
    .hero .eyebrow{color:var(--lime)}
    .hero .eyebrow::before{background:var(--lime)}
    .hero h1{max-width:700px}
    .hero h1 em{font-style:normal;color:var(--lime)}
    .hero-intro{max-width:690px;color:#e3e8e1;font-size:1.12rem;line-height:1.95}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 34px}
    .button{
      display:inline-flex;align-items:center;justify-content:center;min-height:48px;
      border-radius:10px;padding:11px 20px;font-weight:800;transition:var(--ease);
      border:1px solid transparent
    }
    .button.primary{background:var(--coral);color:#fff}
    .button.primary:hover{background:#f17a61;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}
    .button.secondary{background:transparent;border-color:rgba(255,255,255,.45);color:#fff}
    .button.secondary:hover{background:#fff;color:var(--ink)}
    .button.ink{background:var(--ink);color:#fff}
    .button.ink:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}
    .button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}
    .button.outline:hover{background:var(--ink);color:#fff}
    .hero-points{display:flex;flex-wrap:wrap;gap:10px}
    .hero-point{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);border-radius:999px;padding:7px 13px;color:#f5f6f0;font-size:.85rem}
    .hero-side{
      position:absolute;right:4%;bottom:86px;width:315px;padding:20px;border:1px solid rgba(255,255,255,.28);
      background:rgba(32,40,39,.7);border-radius:18px;box-shadow:0 22px 50px rgba(0,0,0,.22)
    }
    .side-kicker{font-size:.76rem;color:var(--lime);font-weight:800;letter-spacing:.1em}
    .countdown{display:flex;gap:8px;margin:14px 0 18px}
    .countdown span{flex:1;background:rgba(255,255,255,.1);padding:10px 6px;text-align:center;border-radius:9px;font-size:1.4rem;font-weight:900;font-family:ui-monospace,monospace}
    .countdown small{display:block;font:normal .65rem sans-serif;color:#b8c3bd}
    .fixture{border-top:1px solid rgba(255,255,255,.2);padding-top:14px;display:flex;justify-content:space-between;gap:12px;align-items:center}
    .fixture strong{font-size:1.1rem}
    .fixture small{color:#c4ccc6}
    .ticker{margin-top:-34px;position:relative;z-index:3}
    .ticker-inner{background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:14px;display:flex;align-items:center;gap:20px;padding:17px 22px}
    .ticker-label{font-weight:900;color:var(--coral-dark);white-space:nowrap}
    .ticker-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink-soft)}
    .ticker-date{margin-left:auto;white-space:nowrap;color:var(--muted);font-size:.85rem}
    .pain-grid{display:grid;grid-template-columns:5fr 7fr;gap:70px;align-items:start}
    .pain-copy p{font-size:1.08rem}
    .pain-note{border-left:3px solid var(--coral);padding:4px 0 4px 22px;font-size:1.1rem;font-weight:700;color:var(--ink)}
    .pain-list{display:grid;gap:14px}
    .pain-item{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}
    .pain-number{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--lime);font-weight:900}
    .pain-item p{margin-bottom:0;font-size:.94rem}
    .editorial{display:grid;grid-template-columns:7fr 5fr;gap:28px;align-items:stretch}
    .feature-story{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
    .feature-story img{width:100%;aspect-ratio:16/7;object-fit:cover;object-position:center}
    .story-body{padding:27px 30px 30px}
    .tag{display:inline-flex;align-items:center;padding:4px 9px;border-radius:6px;background:#e8f0d8;color:#607631;font-size:.75rem;font-weight:800;margin-bottom:13px}
    .tag.coral{background:#fbe2da;color:var(--coral-dark)}
    .tag.cyan{background:#d9eeea;color:#28766e}
    .story-body h3{font-size:1.7rem}
    .story-body p{font-size:1rem}
    .story-meta{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:.8rem;border-top:1px solid var(--line);padding-top:14px;margin-top:22px}
    .news-stack{background:var(--night);border-radius:var(--radius);padding:25px;color:#fff}
    .news-stack h3{font-size:1.35rem}
    .news-link{display:grid;grid-template-columns:70px 1fr;gap:14px;padding:17px 0;border-top:1px solid rgba(255,255,255,.14)}
    .news-link time{color:var(--lime);font-size:.78rem;font-family:ui-monospace,monospace}
    .news-link a{color:#fff;font-weight:700;line-height:1.5}
    .news-link a:hover{color:var(--lime)}
    .service-layout{display:grid;grid-template-columns:4fr 8fr;gap:70px}
    .service-intro{position:sticky;top:145px;align-self:start}
    .service-intro p{font-size:1.06rem}
    .service-link{display:inline-flex;align-items:center;gap:8px;font-weight:800;margin-top:10px}
    .pathway{display:grid;gap:0}
    .path-step{display:grid;grid-template-columns:70px 1fr 150px;gap:22px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}
    .path-step:first-child{border-top:1px solid var(--line)}
    .step-num{font-size:2.1rem;color:var(--coral);font-weight:900;font-family:ui-monospace,monospace}
    .path-step p{margin:0;font-size:.94rem}
    .path-label{text-align:right;color:var(--muted);font-size:.8rem;font-weight:800}
    .topic-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
    .topic-card{position:relative;min-height:235px;border-radius:var(--radius);overflow:hidden;color:#fff;background:var(--night)}
    .topic-card.large{grid-column:span 7;min-height:360px}
    .topic-card.small{grid-column:span 5}
    .topic-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.68;transition:var(--ease)}
    .topic-card:hover img{transform:scale(1.04);opacity:.82}
    .topic-card::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(20,25,24,.9))}
    .topic-content{position:absolute;z-index:1;left:24px;right:24px;bottom:22px}
    .topic-content h3{font-size:1.5rem;color:#fff}
    .topic-content p{color:#e2e8e2;font-size:.9rem;margin-bottom:0}
    .result-grid{display:grid;grid-template-columns:4fr 8fr;gap:60px;align-items:center}
    .result-number{font-size:clamp(5rem,12vw,10rem);font-weight:900;line-height:.85;color:var(--lime);letter-spacing:-.09em}
    .result-caption{color:#fff;font-size:1.2rem;font-weight:800;margin:15px 0 0}
    .result-copy p{font-size:1.03rem}
    .metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}
    .metric{border-top:2px solid var(--coral);padding-top:13px}
    .metric strong{display:block;font-size:1.7rem;color:#fff}
    .metric span{font-size:.82rem;color:#adbab3}
    .deep-grid{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:center}
    .deep-grid.reverse{grid-template-columns:7fr 5fr}
    .deep-grid.reverse .deep-image{order:2}
    .deep-image{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
    .deep-image img{width:100%;aspect-ratio:4/3;object-fit:cover}
    .deep-copy{max-width:600px}
    .deep-copy p{font-size:1.02rem}
    .deep-copy h2{font-size:2.35rem}
    .content-list{list-style:none;padding:0;margin:25px 0}
    .content-list li{position:relative;padding:10px 0 10px 24px;border-bottom:1px solid var(--line)}
    .content-list li::before{content:"";position:absolute;left:0;top:20px;width:8px;height:8px;border-radius:50%;background:var(--coral)}
    .article-meta{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:.8rem;margin:20px 0}
    .schedule-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:27px;box-shadow:var(--shadow-sm)}
    .schedule-head{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:16px}
    .schedule-head h3{margin:0}
    .schedule-item{display:grid;grid-template-columns:90px 1fr 100px;gap:15px;align-items:center;padding:16px 0;border-top:1px solid var(--line)}
    .schedule-item time{font-size:.8rem;color:var(--muted)}
    .teams{font-weight:800}
    .teams span{display:inline-block;padding:0 8px;color:var(--muted);font-weight:500}
    .status{justify-self:end;padding:4px 8px;border-radius:5px;background:#e8f0d8;color:#607631;font-size:.72rem;font-weight:800}
    .status.finished{background:#eceae5;color:#6a716d}
    .data-layout{display:grid;grid-template-columns:5fr 7fr;gap:45px;align-items:start}
    .data-copy p{font-size:1.03rem}
    .bar-chart{background:var(--white);border:1px solid var(--line);padding:27px;border-radius:var(--radius)}
    .bar-line{display:grid;grid-template-columns:120px 1fr 48px;gap:14px;align-items:center;margin:17px 0}
    .bar-line label{font-size:.86rem;color:var(--ink-soft)}
    .bar-track{height:10px;background:#e3e1d9;border-radius:99px;overflow:hidden}
    .bar-fill{height:100%;background:var(--coral);border-radius:99px}
    .bar-fill.alt{background:var(--cyan)}
    .bar-fill.lime{background:#95b75b}
    .bar-value{text-align:right;font:800 .85rem ui-monospace,monospace}
    .news-center{display:grid;grid-template-columns:5fr 7fr;gap:55px}
    .news-lead{border-top:5px solid var(--coral);padding-top:24px}
    .news-lead h3{font-size:2rem}
    .news-lead p{font-size:1.02rem}
    .news-list{list-style:none;padding:0;margin:0}
    .news-list li{display:grid;grid-template-columns:90px 1fr auto;gap:18px;align-items:start;padding:17px 0;border-bottom:1px solid var(--line)}
    .news-list time{font:700 .75rem ui-monospace,monospace;color:var(--muted);padding-top:4px}
    .news-list h4{font-size:1.05rem;margin-bottom:5px}
    .news-list p{font-size:.86rem;margin:0}
    .read-more{font-size:.78rem;font-weight:800;white-space:nowrap;padding-top:4px}
    .app-section{background:#e2ece4}
    .app-layout{display:grid;grid-template-columns:7fr 5fr;gap:60px;align-items:center}
    .app-screen{position:relative;background:var(--night);border-radius:24px;padding:26px;color:#fff;box-shadow:12px 15px 0 rgba(37,42,41,.12);max-width:520px;transform:rotate(-2deg)}
    .screen-top{display:flex;justify-content:space-between;color:#c9d4cc;font-size:.8rem}
    .screen-score{margin:28px 0;padding:20px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:#2c3633}
    .screen-score small{color:var(--lime)}
    .screen-score strong{display:block;font-size:2.4rem;margin:10px 0}
    .screen-bars{display:grid;gap:10px}
    .screen-bars i{display:block;height:8px;border-radius:4px;background:var(--coral)}
    .screen-bars i:nth-child(2){width:72%;background:var(--lime)}
    .screen-bars i:nth-child(3){width:51%;background:var(--cyan)}
    .app-copy p{font-size:1.05rem}
    .app-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:26px 0}
    .app-list div{padding:15px;border:1px solid rgba(37,42,41,.15);border-radius:12px;background:rgba(255,255,255,.42)}
    .app-list strong{display:block;margin-bottom:3px}
    .app-list span{font-size:.84rem;color:var(--ink-soft)}
    .feedback-layout{display:grid;grid-template-columns:7fr 5fr;gap:35px;align-items:start}
    .quote-main{background:var(--coral);color:#fff;padding:36px;border-radius:var(--radius);min-height:250px;display:flex;flex-direction:column;justify-content:space-between}
    .quote-main blockquote{font-size:1.5rem;line-height:1.65;margin:0;color:#fff}
    .quote-main cite{font-style:normal;color:#ffe7df;font-size:.88rem}
    .quote-stack{display:grid;gap:15px}
    .quote-small{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:20px 22px}
    .quote-small p{margin-bottom:10px;font-size:.94rem}
    .quote-small cite{font-style:normal;font-size:.8rem;font-weight:800;color:var(--ink)}
    .faq-layout{display:grid;grid-template-columns:4fr 8fr;gap:70px;align-items:start}
    .faq-intro p{font-size:1.03rem}
    .accordion{background:transparent;margin:0}
    .accordion-item{border:0;border-top:1px solid var(--line)}
    .accordion-title{background:transparent!important;color:var(--ink)!important;border:0!important;padding:20px 38px 20px 0;font-weight:800;font-size:1.05rem;position:relative}
    .accordion-title::before{right:8px;color:var(--coral);font-size:1.5rem}
    .accordion-content{background:transparent!important;border:0!important;padding:0 30px 20px 0;color:var(--ink-soft);font-size:.95rem}
    .brand-section{background:var(--white)}
    .brand-layout{display:grid;grid-template-columns:3fr 9fr;gap:70px}
    .brand-stamp{font-size:2.8rem;font-weight:900;letter-spacing:-.08em;color:var(--coral)}
    .brand-copy p{font-size:1.04rem}
    .brand-copy p:last-child{margin-bottom:0}
    .matrix{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:30px}
    .matrix a{padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:10px;color:var(--ink);font-weight:800;font-size:.9rem}
    .matrix a:hover{border-color:var(--coral);color:var(--coral-dark);transform:translateY(-2px)}
    .subscribe{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .subscribe-layout{display:grid;grid-template-columns:5fr 7fr;gap:50px;align-items:center}
    .subscribe-form{display:flex;gap:10px}
    .subscribe-form input{flex:1;min-width:0;border:1px solid var(--line);border-radius:9px;background:var(--white);padding:12px 15px;color:var(--ink)}
    .form-message{font-size:.82rem;margin:9px 0 0;min-height:25px;color:var(--coral-dark)}
    .cta{padding:70px 0;background:var(--night);color:#fff}
    .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:35px}
    .cta h2{max-width:650px;color:#fff;margin-bottom:10px}
    .cta p{color:#c6d0c9;margin:0}
    .cta-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
    .site-footer{background:#181e1d;color:#b9c3bd;padding:54px 0 22px}
    .footer-grid{display:grid;grid-template-columns:4fr 5fr 3fr;gap:45px;padding-bottom:38px;border-bottom:1px solid rgba(255,255,255,.14)}
    .site-footer .brand{color:#fff!important}
    .footer-title{color:#fff;margin-bottom:13px;font-size:1rem}
    .footer-text{font-size:.88rem;color:#9ca9a2;max-width:330px}
    .footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 20px}
    .footer-links a{color:#b9c3bd;font-size:.88rem}
    .footer-links a:hover{color:var(--lime)}
    .footer-note{font-size:.8rem;color:#87938c;margin:0}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:20px;flex-wrap:wrap;font-size:.78rem;color:#7e8a83}
    .footer-bottom a{color:#aeb9b2}
    @media(max-width:1024px){
      .hero-side{right:3%;width:280px}
      .hero-copy{max-width:650px}
      .service-layout,.pain-grid,.data-layout,.news-center,.faq-layout{gap:35px}
      .brand-layout{gap:35px}
    }
    @media(max-width:768px){
      .container{width:min(100% - 28px,var(--container))}
      .brand-row{min-height:65px}
      .brand-meta{display:none}
      .section{padding:68px 0}
      .hero{min-height:690px;background-position:58% center}
      .hero-inner{padding:74px 0 110px}
      .hero-side{position:relative;right:auto;bottom:auto;margin-top:34px;width:min(100%,360px)}
      .hero::after{height:80px}
      .ticker-inner{display:block;padding:15px}
      .ticker-date{display:block;margin:7px 0 0}
      .pain-grid,.editorial,.service-layout,.result-grid,.deep-grid,.deep-grid.reverse,.data-layout,.news-center,.app-layout,.feedback-layout,.faq-layout,.brand-layout,.subscribe-layout{grid-template-columns:1fr}
      .service-intro{position:static}
      .deep-grid.reverse .deep-image{order:0}
      .topic-card.large,.topic-card.small{grid-column:span 12}
      .topic-card.large{min-height:280px}
      .result-number{font-size:6rem}
      .path-step{grid-template-columns:54px 1fr}
      .path-label{grid-column:2;text-align:left}
      .schedule-item{grid-template-columns:70px 1fr}
      .status{grid-column:2;justify-self:start}
      .news-list li{grid-template-columns:75px 1fr}
      .read-more{grid-column:2}
      .app-screen{margin:0 auto}
      .matrix{grid-template-columns:repeat(2,1fr)}
      .subscribe-form{display:block}
      .subscribe-form .button{width:100%;margin-top:10px}
      .cta-inner{display:block}
      .cta-actions{justify-content:flex-start;margin-top:24px}
      .footer-grid{grid-template-columns:1fr 1fr}
      .footer-grid>div:first-child{grid-column:span 2}
    }
    @media(max-width:520px){
      body{font-size:15px}
      h1{font-size:2.65rem}
      h2{font-size:2rem}
      .icon-nav a{min-width:90px;padding:8px 10px;font-size:.78rem}
      .hero-intro{font-size:1rem}
      .hero-actions{display:grid}
      .hero-actions .button{width:100%}
      .metric-row{grid-template-columns:1fr}
      .bar-line{grid-template-columns:88px 1fr 36px;gap:8px}
      .app-list{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
      .footer-links{grid-template-columns:1fr 1fr}
    }

/* roulang page: category2 */
:root{
      --ink:#252a29;
      --ink-soft:#58615e;
      --muted:#7b8580;
      --paper:#f7f4ee;
      --paper-2:#eeeae1;
      --white:#fffdf9;
      --line:#ddd8ce;
      --line-dark:#434b47;
      --coral:#e8664c;
      --coral-dark:#bb4936;
      --lime:#b9d875;
      --cyan:#72c7bd;
      --night:#202827;
      --shadow:0 18px 42px rgba(37,42,41,.09);
      --shadow-sm:0 8px 20px rgba(37,42,41,.07);
      --radius:18px;
      --radius-sm:11px;
      --container:1240px;
      --ease:all .28s ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;background:var(--paper);color:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:16px;line-height:1.8;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{line-height:1.25;letter-spacing:-.035em}
    h1{font-size:clamp(2.35rem,5vw,4.7rem);margin-bottom:20px}
    h2{font-size:clamp(1.9rem,3vw,3rem);margin-bottom:16px}
    h3{font-size:1.3rem}
    a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--coral)}
    a:visited{color:var(--coral-dark)}
    a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
      outline:3px solid rgba(114,199,189,.65);outline-offset:3px
    }
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .section{padding:82px 0;position:relative}
    .section-soft{background:var(--paper-2)}
    .section-dark{background:var(--night);color:var(--paper)}
    .section-dark p{color:#c4ccc6}
    .section-head{max-width:760px;margin-bottom:36px}
    .section-head p{font-size:1.06rem;color:var(--ink-soft)}
    .section-dark .section-head p{color:#c4ccc6}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--coral-dark);
      font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:14px
    }
    .eyebrow:before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
    .site-header{
      background:rgba(247,244,238,.95);border-bottom:1px solid var(--line);
      position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)
    }
    .brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
    .brand-mark{
      width:40px;height:40px;border-radius:12px;background:var(--coral);display:grid;
      place-items:center;color:#fff;font-weight:900;font-size:1.1rem;box-shadow:4px 4px 0 var(--ink)
    }
    .brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
    .live-dot{width:8px;height:8px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(232,102,76,.14)}
    .nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}
    .icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
    .icon-nav a{
      min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;
      display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700
    }
    .icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}
    .icon-nav a.active{background:var(--ink);color:#fffdf9;border-color:var(--ink);box-shadow:var(--shadow-sm)}
    .icon-nav a.active:visited{color:#fffdf9}
    .nav-icon{font-size:1.15rem;line-height:1}
    .page-banner{
      position:relative;overflow:hidden;color:var(--white);
      background:linear-gradient(90deg,rgba(32,40,39,.96),rgba(32,40,39,.74)),
      url('/assets/images/backpic/back-2.webp') center/cover
    }
    .page-banner:after{content:"";position:absolute;right:7%;top:22%;width:180px;height:180px;border:1px solid rgba(185,216,117,.42);transform:rotate(14deg)}
    .banner-inner{position:relative;z-index:1;padding:72px 0 68px;display:grid;grid-template-columns:7fr 5fr;gap:55px;align-items:center}
    .page-banner .eyebrow{color:var(--lime)}
    .page-banner .eyebrow:before{background:var(--lime)}
    .page-banner h1{max-width:720px}
    .page-banner p{max-width:680px;color:#dbe2dc;font-size:1.08rem}
    .coupon{
      background:var(--lime);color:var(--ink);padding:26px;border-radius:18px;
      position:relative;box-shadow:10px 10px 0 rgba(232,102,76,.7);transform:rotate(-2deg)
    }
    .coupon:before,.coupon:after{content:"";position:absolute;top:50%;width:18px;height:18px;border-radius:50%;background:var(--night);transform:translateY(-50%)}
    .coupon:before{left:-9px}.coupon:after{right:-9px}
    .coupon-label{font-size:.76rem;font-weight:900;letter-spacing:.12em;color:#536a2e}
    .coupon h2{font-size:2rem;margin:10px 0 7px}
    .coupon p{color:#47543d!important;font-size:.9rem!important;margin-bottom:16px}
    .button{
      display:inline-flex;align-items:center;justify-content:center;min-height:46px;
      border-radius:10px;padding:10px 19px;font-weight:800;transition:var(--ease);
      border:1px solid transparent
    }
    .button.primary{background:var(--coral);color:#fff}
    .button.primary:hover{background:#f17a61;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}
    .button.ink{background:var(--ink);color:#fff}
    .button.ink:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}
    .button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}
    .button.outline:hover{background:var(--ink);color:#fff}
    .coupon .button{background:var(--ink);color:#fff;width:100%}
    .filter-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:28px}
    .filter-bar button{
      border:1px solid var(--line);background:var(--white);border-radius:999px;
      color:var(--ink-soft);padding:8px 15px;font-weight:700;transition:var(--ease)
    }
    .filter-bar button:hover,.filter-bar button.active{background:var(--coral);border-color:var(--coral);color:#fff}
    .date-note{margin-left:auto;color:var(--muted);font-size:.88rem}
    .featured-match{
      background:var(--night);color:var(--white);border-radius:var(--radius);padding:28px 32px;
      display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:22px;
      box-shadow:var(--shadow);position:relative;overflow:hidden
    }
    .featured-match:after{content:"";position:absolute;width:230px;height:230px;border:1px solid rgba(114,199,189,.35);border-radius:50%;right:-55px;top:-85px}
    .match-kicker,.match-status{color:var(--lime);font-size:.78rem;font-weight:800;letter-spacing:.08em}
    .match-team{font-size:1.25rem;font-weight:800}
    .team-away{text-align:right}
    .score-box{text-align:center;position:relative;z-index:1}
    .score{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:2.7rem;line-height:1;font-weight:900;color:var(--lime)}
    .score-time{font-size:.82rem;color:#bcc7bf;margin-top:10px}
    .schedule-layout{display:grid;grid-template-columns:8fr 4fr;gap:28px;align-items:start}
    .schedule-group{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:18px}
    .group-head{padding:17px 22px;background:#f0eee7;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:15px}
    .group-head h3{margin:0;font-size:1.1rem}
    .group-head small{color:var(--muted)}
    .match-row{
      display:grid;grid-template-columns:92px 1fr 95px 82px;gap:16px;align-items:center;
      padding:19px 22px;border-bottom:1px solid var(--line);transition:var(--ease)
    }
    .match-row:last-child{border-bottom:0}
    .match-row:hover{background:#fbfaf6}
    .match-time{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink-soft);font-size:.9rem}
    .league{font-size:.76rem;color:var(--coral-dark);font-weight:800}
    .teams{font-weight:800;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
    .teams span:last-child{color:var(--muted);font-weight:500}
    .match-score{text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.25rem;font-weight:900}
    .status{display:inline-flex;justify-content:center;border-radius:7px;padding:4px 8px;font-size:.74rem;font-weight:800}
    .status.before{background:#e7f0d3;color:#607631}.status.live{background:#fbe2da;color:var(--coral-dark)}.status.done{background:#e7e9e4;color:#66706b}
    .side-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-sm)}
    .side-panel h3{margin-bottom:14px}
    .side-panel p{font-size:.93rem;color:var(--ink-soft)}
    .side-list{list-style:none;padding:0;margin:20px 0 0}
    .side-list li{padding:13px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px}
    .side-list span{color:var(--muted);font-size:.84rem}
    .side-list strong{font-size:.9rem}
    .schedule-note{margin-top:18px;padding:16px;border-left:4px solid var(--cyan);background:#e6f2ef;color:var(--ink-soft);font-size:.9rem}
    .index-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
    .index-item{padding:18px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);transition:var(--ease)}
    .index-item:hover{transform:translateY(-3px);border-color:var(--coral)}
    .index-item strong{display:block;margin-bottom:4px}.index-item span{font-size:.82rem;color:var(--muted)}
    .timeline{position:relative;padding-left:34px;margin-top:8px}
    .timeline:before{content:"";position:absolute;left:8px;top:8px;bottom:8px;width:2px;background:var(--line)}
    .timeline-item{position:relative;padding:0 0 28px 25px}
    .timeline-item:before{content:"";position:absolute;left:-32px;top:8px;width:15px;height:15px;border-radius:50%;background:var(--coral);border:4px solid var(--paper-2)}
    .timeline-item h3{margin-bottom:6px}.timeline-item p{color:var(--ink-soft);margin-bottom:0}
    .observation{display:grid;grid-template-columns:5fr 7fr;gap:55px;align-items:center}
    .observation img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}
    .metric-line{border-top:1px solid rgba(255,255,255,.22);padding:18px 0;display:flex;justify-content:space-between;gap:20px}
    .metric-line strong{font-size:1.7rem;color:var(--lime);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
    .metric-line span{color:#c4ccc6}
    .faq-grid{display:grid;grid-template-columns:4fr 8fr;gap:55px}
    .faq-list{display:grid;gap:10px}
    details{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:0 20px;transition:var(--ease)}
    details:hover,details[open]{border-color:var(--cyan);box-shadow:var(--shadow-sm)}
    summary{list-style:none;cursor:pointer;padding:18px 28px 18px 0;font-weight:800;position:relative}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";position:absolute;right:0;color:var(--coral);font-size:1.3rem}
    details[open] summary:after{content:"−"}
    details p{padding:0 0 18px;color:var(--ink-soft);margin:0;font-size:.94rem}
    .cta-band{background:#e6eee0;border-top:1px solid #d2ddc7;border-bottom:1px solid #d2ddc7}
    .cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}
    .cta-inner p{color:var(--ink-soft);max-width:680px;margin:0}
    .cta-actions{display:flex;gap:10px;flex-wrap:wrap}
    .state-reserve{display:none}
    .site-footer{background:var(--night);color:var(--paper);padding:64px 0 22px}
    .site-footer .brand{color:var(--paper)!important}
    .footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:50px}
    .footer-text,.footer-note{color:#bac4bd;font-size:.9rem;max-width:350px}
    .footer-title{font-size:1rem;color:var(--lime);margin-bottom:15px}
    .footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 18px}
    .footer-links a,.footer-note a{color:#d8dfd8;font-size:.88rem}
    .footer-links a:hover,.footer-note a:hover{color:var(--lime)}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.16);margin-top:42px;padding-top:18px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:#aab5ad;font-size:.78rem}
    @media(max-width:1024px){
      .banner-inner,.schedule-layout,.observation,.faq-grid{grid-template-columns:1fr}
      .coupon{max-width:420px;transform:none}
      .index-strip{grid-template-columns:repeat(3,1fr)}
      .hero-side{position:static;margin-top:30px}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 28px))}
      .brand-row{min-height:66px}.brand-meta{display:none}
      .section{padding:60px 0}
      .banner-inner{padding:55px 0}
      .featured-match{grid-template-columns:1fr;gap:12px;text-align:center}
      .team-away{text-align:center}
      .match-row{grid-template-columns:70px 1fr 70px;gap:10px;padding:16px 14px}
      .match-row .status{grid-column:3;grid-row:1}
      .match-score{grid-column:3;grid-row:2}
      .index-strip{grid-template-columns:repeat(2,1fr)}
      .cta-inner{align-items:flex-start;flex-direction:column}
      .footer-grid{grid-template-columns:1fr;gap:30px}
    }
    @media(max-width:520px){
      h1{font-size:2.35rem}.page-banner h1{font-size:2.45rem}
      .date-note{width:100%;margin-left:0}
      .filter-bar{gap:7px}
      .filter-bar button{padding:7px 11px;font-size:.85rem}
      .group-head{align-items:flex-start;flex-direction:column;gap:2px}
      .match-row{grid-template-columns:62px 1fr;position:relative}
      .match-row .status{position:absolute;right:14px;top:15px}
      .match-score{text-align:left;grid-column:2;grid-row:2}
      .teams{padding-right:60px}
      .index-strip{grid-template-columns:1fr}
      .cta-actions,.cta-actions .button{width:100%}
      .footer-links{grid-template-columns:1fr 1fr}
    }

/* roulang page: category1 */
:root{
      --ink:#252a29;
      --ink-soft:#58615e;
      --muted:#7b8580;
      --paper:#f7f4ee;
      --paper-2:#eeeae1;
      --white:#fffdf9;
      --line:#ddd8ce;
      --line-dark:#434b47;
      --coral:#e8664c;
      --coral-dark:#bb4936;
      --lime:#b9d875;
      --cyan:#72c7bd;
      --night:#202827;
      --shadow:0 18px 42px rgba(37,42,41,.09);
      --shadow-sm:0 8px 20px rgba(37,42,41,.07);
      --radius:18px;
      --radius-sm:11px;
      --container:1240px;
      --ease:all .28s ease;
    }
    html{scroll-behavior:smooth}
    *,*::before,*::after{box-sizing:border-box}
    body{
      margin:0;
      background:var(--paper);
      color:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:16px;
      line-height:1.8;
      overflow-x:hidden;
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{line-height:1.25;letter-spacing:-.045em}
    h1{font-size:clamp(2.4rem,5vw,4.8rem);margin-bottom:20px}
    h2{font-size:clamp(1.9rem,3vw,3rem);margin-bottom:16px}
    h3{font-size:1.32rem;margin-bottom:10px}
    p{color:var(--ink-soft)}
    a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--coral)}
    a:visited{color:var(--coral-dark)}
    a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
      outline:3px solid rgba(114,199,189,.7);
      outline-offset:3px;
    }
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .section{padding:88px 0;position:relative}
    .section-soft{background:var(--paper-2)}
    .section-dark{background:var(--night);color:var(--paper)}
    .section-dark p{color:#c4ccc6}
    .section-head{max-width:760px;margin-bottom:38px}
    .section-head p{font-size:1.06rem;max-width:690px}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;
      color:var(--coral-dark);font-size:.78rem;font-weight:800;
      letter-spacing:.12em;margin-bottom:14px
    }
    .eyebrow::before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
    .site-header{
      background:rgba(247,244,238,.95);
      border-bottom:1px solid var(--line);
      position:sticky;top:0;z-index:30;
      backdrop-filter:blur(12px)
    }
    .brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
    .brand-mark{
      width:40px;height:40px;border-radius:12px;background:var(--coral);
      display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.1rem;
      box-shadow:4px 4px 0 var(--ink)
    }
    .brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
    .live-dot{width:9px;height:9px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(232,102,76,.13)}
    .nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}
    .icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
    .icon-nav a{
      min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;
      display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700
    }
    .icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}
    .icon-nav a.active{background:var(--ink);color:#fffdf9;border-color:var(--ink);box-shadow:var(--shadow-sm)}
    .nav-icon{font-size:1.15rem;line-height:1}
    .page-hero{
      padding:76px 0 66px;
      background:var(--night);
      color:var(--white);
      position:relative;
      overflow:hidden
    }
    .page-hero::after{
      content:"";
      position:absolute;right:-80px;top:-140px;width:470px;height:470px;
      border:1px solid rgba(185,216,117,.25);border-radius:50%;
      box-shadow:0 0 0 36px rgba(185,216,117,.04),0 0 0 74px rgba(185,216,117,.025)
    }
    .page-hero p{color:#d5ddd6;max-width:760px;font-size:1.08rem}
    .page-hero .eyebrow{color:var(--lime)}
    .page-hero .eyebrow::before{background:var(--lime)}
    .crumbs{display:flex;gap:10px;align-items:center;color:#aebbb2;font-size:.84rem;margin-bottom:28px}
    .crumbs a{color:var(--lime)}
    .hero-tags,.filter-tags{display:flex;flex-wrap:wrap;gap:9px}
    .hero-tags{margin-top:28px}
    .tag{
      display:inline-flex;align-items:center;padding:5px 10px;border-radius:6px;
      background:#e8f0d8;color:#607631;font-size:.75rem;font-weight:800
    }
    .tag.coral{background:#fbe2da;color:var(--coral-dark)}
    .tag.cyan{background:#d9eeea;color:#28766e}
    .tag.dark{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2)}
    .news-layout{display:grid;grid-template-columns:minmax(0,7fr) minmax(300px,5fr);gap:30px;align-items:start}
    .feature-story{
      background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
      overflow:hidden;box-shadow:var(--shadow-sm);transition:var(--ease)
    }
    .feature-story:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .feature-story img{width:100%;aspect-ratio:16/8;object-fit:cover;object-position:center}
    .story-body{padding:28px 30px 30px}
    .story-body h3{font-size:1.75rem}
    .story-body p{font-size:1rem}
    .story-meta,.item-meta{
      display:flex;justify-content:space-between;gap:12px;color:var(--muted);
      font-size:.8rem;border-top:1px solid var(--line);padding-top:14px;margin-top:22px
    }
    .button{
      display:inline-flex;align-items:center;justify-content:center;min-height:46px;
      border-radius:10px;padding:10px 19px;font-weight:800;transition:var(--ease);
      border:1px solid transparent
    }
    .button.primary{background:var(--coral);color:#fff}
    .button.primary:hover{background:#f17a61;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}
    .button.ink{background:var(--ink);color:#fff}
    .button.ink:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}
    .button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}
    .button.outline:hover{background:var(--ink);color:#fff}
    .button.small{min-height:38px;padding:7px 13px;font-size:.84rem}
    .latest-panel{
      background:#e4ebe2;border-radius:var(--radius);padding:25px 25px 12px;
      border:1px solid #d1dbd0
    }
    .latest-panel h3{display:flex;justify-content:space-between;align-items:center}
    .latest-panel h3 span{font-size:.76rem;color:var(--muted);font-weight:600;letter-spacing:0}
    .latest-item{
      padding:17px 0;border-top:1px solid rgba(67,75,71,.16)
    }
    .latest-item:first-of-type{border-top:0}
    .latest-item strong{display:block;line-height:1.45;font-size:1rem}
    .latest-item time{font-size:.76rem;color:var(--muted)}
    .timeline-wrap{display:grid;grid-template-columns:3fr 9fr;gap:58px}
    .timeline-intro p{font-size:1.03rem}
    .timeline{position:relative;padding-left:31px}
    .timeline::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:var(--line)}
    .timeline-item{position:relative;padding:0 0 28px 20px}
    .timeline-item::before{
      content:"";position:absolute;left:-29px;top:8px;width:15px;height:15px;
      background:var(--coral);border:4px solid var(--paper);border-radius:50%;box-shadow:0 0 0 1px var(--coral)
    }
    .timeline-date{font-size:.78rem;font-weight:800;color:var(--coral-dark);letter-spacing:.08em}
    .timeline-item h3{margin:5px 0 6px}
    .timeline-item p{margin-bottom:0;font-size:.93rem}
    .filter-bar{
      display:flex;align-items:center;justify-content:space-between;gap:20px;
      padding:18px 20px;background:var(--white);border:1px solid var(--line);
      border-radius:var(--radius-sm);margin-bottom:26px
    }
    .filter-tags{align-items:center}
    .filter-label{font-weight:800;font-size:.9rem;margin-right:3px}
    .filter-button{
      border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);
      border-radius:999px;padding:7px 14px;font-size:.83rem;transition:var(--ease)
    }
    .filter-button:hover,.filter-button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
    .news-list{display:grid;grid-template-columns:1fr 1fr;gap:17px}
    .news-item{
      background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);
      padding:22px 23px;display:flex;flex-direction:column;min-height:220px;
      transition:var(--ease)
    }
    .news-item:hover{border-color:var(--coral);transform:translateY(-3px);box-shadow:var(--shadow-sm)}
    .news-item h3{font-size:1.18rem;margin:8px 0 8px}
    .news-item p{font-size:.9rem;line-height:1.7;margin-bottom:18px}
    .news-item .item-meta{margin-top:auto;padding-top:13px}
    .topic-rail{background:var(--night);color:var(--white);border-radius:var(--radius);padding:30px}
    .topic-rail h2{font-size:1.8rem}
    .topic-rail p{color:#c4ccc6}
    .topic-links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}
    .topic-link{
      min-height:110px;padding:18px;border:1px solid rgba(255,255,255,.18);
      border-radius:13px;color:#fff!important;background:rgba(255,255,255,.04)
    }
    .topic-link:hover{background:var(--coral);border-color:var(--coral);transform:translateY(-3px)}
    .topic-link strong{display:block;margin-bottom:5px}
    .topic-link span{font-size:.8rem;color:#bdc7be}
    .topic-link:hover span{color:#fff}
    .reading-section{background:var(--cyan)}
    .reading-grid{display:grid;grid-template-columns:4fr 8fr;gap:58px;align-items:start}
    .reading-copy p{font-size:1.03rem}
    .reading-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    .step{
      background:rgba(255,253,249,.74);border:1px solid rgba(37,42,41,.13);
      padding:22px;border-radius:var(--radius-sm);min-height:190px
    }
    .step-number{font-size:2rem;font-weight:900;color:var(--coral);line-height:1;margin-bottom:22px}
    .step p{font-size:.88rem;margin-bottom:0}
    .empty-reserve{
      display:none;border:1px dashed var(--line-dark);border-radius:var(--radius-sm);
      padding:28px;text-align:center;color:var(--muted);background:rgba(255,253,249,.55)
    }
    .faq-layout{display:grid;grid-template-columns:4fr 8fr;gap:60px}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:0}
    summary{
      list-style:none;cursor:pointer;padding:20px 38px 20px 0;
      position:relative;font-weight:800;font-size:1.02rem
    }
    summary::-webkit-details-marker{display:none}
    summary::after{content:"＋";position:absolute;right:3px;top:18px;color:var(--coral);font-size:1.4rem;font-weight:500;transition:var(--ease)}
    details[open] summary::after{content:"－";transform:rotate(180deg)}
    details p{padding:0 35px 20px 0;margin:0;font-size:.93rem}
    .cta-band{
      padding:42px 46px;background:#e8f0d8;border:1px solid #d1ddbc;
      border-radius:var(--radius);display:flex;align-items:center;justify-content:space-between;gap:30px
    }
    .cta-band h2{margin-bottom:8px;font-size:2rem}
    .cta-band p{margin-bottom:0;max-width:680px}
    .cta-actions{display:flex;flex-wrap:wrap;gap:10px;flex-shrink:0}
    .site-footer{background:var(--night);color:#f7f4ee;padding:64px 0 22px}
    .site-footer .brand{color:#fff!important}
    .footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:55px;padding-bottom:48px}
    .footer-text,.footer-note{color:#b8c2ba;font-size:.9rem;max-width:310px}
    .footer-title{font-size:1rem;color:#fff;margin-bottom:15px;letter-spacing:0}
    .footer-links{display:grid;grid-template-columns:1fr 1fr;gap:7px 20px}
    .footer-links a,.footer-note a{color:#c8d2ca;font-size:.88rem}
    .footer-links a:hover,.footer-note a:hover{color:var(--lime)}
    .footer-bottom{
      border-top:1px solid rgba(255,255,255,.14);padding-top:18px;
      display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
      color:#aeb8b0;font-size:.78rem
    }
    @media(max-width:1024px){
      .news-layout,.timeline-wrap,.reading-grid,.faq-layout{grid-template-columns:1fr;gap:34px}
      .topic-links{grid-template-columns:repeat(3,1fr)}
      .hero-side{position:relative;right:auto;bottom:auto;margin:30px 0 0;width:min(100%,360px)}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 28px))}
      .section{padding:62px 0}
      .brand-row{min-height:66px}
      .brand-meta{display:none}
      .icon-nav{padding:8px 0}
      .icon-nav a{min-width:auto;padding:8px 11px}
      .page-hero{padding:53px 0 48px}
      .news-list,.reading-steps{grid-template-columns:1fr}
      .filter-bar{align-items:flex-start;flex-direction:column}
      .topic-links{grid-template-columns:1fr}
      .topic-link{min-height:auto}
      .cta-band{padding:30px 24px;display:block}
      .cta-actions{margin-top:22px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
      .footer-grid>div:first-child{grid-column:1/-1}
    }
    @media(max-width:520px){
      body{font-size:15px}
      h1{font-size:2.35rem}
      h2{font-size:1.9rem}
      .section-head{margin-bottom:28px}
      .story-body{padding:22px}
      .story-body h3{font-size:1.42rem}
      .news-item{min-height:unset;padding:19px}
      .timeline-wrap,.reading-grid,.faq-layout{gap:23px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
      .footer-links{grid-template-columns:1fr 1fr}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:6px}
      .button{width:100%}
      .cta-actions{display:grid}
    }

/* roulang page: category3 */
:root{
      --ink:#252a29;
      --ink-soft:#58615e;
      --muted:#7b8580;
      --paper:#f7f4ee;
      --paper-2:#eeeae1;
      --white:#fffdf9;
      --line:#ddd8ce;
      --line-dark:#434b47;
      --coral:#e8664c;
      --coral-dark:#bb4936;
      --lime:#b9d875;
      --cyan:#72c7bd;
      --night:#202827;
      --shadow:0 18px 42px rgba(37,42,41,.09);
      --shadow-sm:0 8px 20px rgba(37,42,41,.07);
      --radius:18px;
      --radius-sm:11px;
      --container:1240px;
      --ease:all .28s ease;
    }
    html{scroll-behavior:smooth}
    *{box-sizing:border-box}
    body{
      margin:0;background:var(--paper);color:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:16px;line-height:1.8;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{line-height:1.25;letter-spacing:-.035em}
    h1{font-size:clamp(2.5rem,5vw,5.2rem);margin-bottom:22px}
    h2{font-size:clamp(2rem,3.4vw,3.3rem);margin-bottom:18px}
    h3{font-size:1.35rem;margin-bottom:10px}
    a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--coral)}
    a:visited{color:var(--coral-dark)}
    a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
      outline:3px solid rgba(114,199,189,.65);outline-offset:3px
    }
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--coral-dark);
      font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:15px
    }
    .eyebrow:before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
    .section{padding:92px 0;position:relative}
    .section-soft{background:var(--paper-2)}
    .section-dark{background:var(--night);color:var(--paper)}
    .section-dark p{color:#c4ccc6}
    .section-dark h2,.section-dark h3{color:var(--white)}
    .section-dark .eyebrow{color:var(--lime)}
    .section-dark .eyebrow:before{background:var(--lime)}
    .section-head{max-width:720px;margin-bottom:40px}
    .section-head p{font-size:1.07rem;color:var(--ink-soft)}
    .site-header{
      background:rgba(247,244,238,.95);border-bottom:1px solid var(--line);
      position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)
    }
    .brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
    .brand-mark{
      width:40px;height:40px;border-radius:12px;background:var(--coral);display:grid;
      place-items:center;color:#fff;font-weight:900;font-size:1.1rem;box-shadow:4px 4px 0 var(--ink)
    }
    .brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
    .live-dot{width:9px;height:9px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(232,102,76,.13)}
    .nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}
    .icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
    .icon-nav a{
      min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;
      display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700
    }
    .icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}
    .icon-nav a.active{background:var(--ink);color:var(--white);border-color:var(--ink);box-shadow:var(--shadow-sm)}
    .icon-nav a.active .nav-icon{color:var(--lime)}
    .nav-icon{font-size:1.15rem;line-height:1}
    .topic-hero{
      min-height:590px;display:flex;align-items:flex-end;position:relative;
      background:linear-gradient(90deg,rgba(32,40,39,.95),rgba(32,40,39,.56) 56%,rgba(32,40,39,.16)),
      url('/assets/images/backpic/back-2.webp') center/cover;color:var(--white);overflow:hidden
    }
    .topic-hero:after{
      content:"";position:absolute;inset:auto 0 0;height:130px;
      background:linear-gradient(transparent,var(--paper))
    }
    .topic-hero-inner{width:100%;position:relative;z-index:1;padding:76px 0 94px}
    .topic-copy{max-width:760px}
    .topic-hero .eyebrow{color:var(--lime)}
    .topic-hero .eyebrow:before{background:var(--lime)}
    .topic-hero h1{max-width:730px}
    .topic-intro{font-size:1.12rem;line-height:1.95;color:#e4e9e3;max-width:700px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 30px}
    .button{
      display:inline-flex;align-items:center;justify-content:center;min-height:48px;
      border-radius:10px;padding:11px 20px;font-weight:800;transition:var(--ease);
      border:1px solid transparent
    }
    .button.primary{background:var(--coral);color:#fff}
    .button.primary:hover{background:#f17a61;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}
    .button.secondary{background:transparent;border-color:rgba(255,255,255,.45);color:#fff}
    .button.secondary:hover{background:#fff;color:var(--ink)}
    .button.ink{background:var(--ink);color:#fff}
    .button.ink:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}
    .button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}
    .button.outline:hover{background:var(--ink);color:#fff}
    .hero-tags{display:flex;flex-wrap:wrap;gap:10px}
    .hero-tag{padding:7px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.1);font-size:.84rem}
    .date-ribbon{
      position:absolute;right:5%;bottom:78px;width:260px;padding:20px;background:rgba(32,40,39,.76);
      border:1px solid rgba(255,255,255,.25);border-radius:var(--radius);z-index:2
    }
    .date-ribbon strong{display:block;color:var(--lime);font-size:2rem;line-height:1.1}
    .date-ribbon span{color:#d8dfd8;font-size:.86rem}
    .topic-layout{display:grid;grid-template-columns:7fr 5fr;gap:38px;align-items:start}
    .lead-image{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
    .lead-image img{width:100%;aspect-ratio:16/10;object-fit:cover}
    .lead-copy{padding:28px 4px 0}
    .tag{
      display:inline-flex;align-items:center;padding:4px 9px;border-radius:6px;
      background:#e8f0d8;color:#607631;font-size:.75rem;font-weight:800;margin-bottom:13px
    }
    .tag.coral{background:#fbe2da;color:var(--coral-dark)}
    .tag.cyan{background:#d9eeea;color:#28766e}
    .lead-copy p{color:var(--ink-soft);font-size:1.02rem}
    .meta-line{display:flex;flex-wrap:wrap;gap:15px;color:var(--muted);font-size:.82rem;margin:18px 0}
    .side-news{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:14px 22px;box-shadow:var(--shadow-sm)}
    .side-news h3{padding:8px 0 16px;border-bottom:1px solid var(--line)}
    .side-item{padding:18px 0;border-bottom:1px solid var(--line)}
    .side-item:last-child{border-bottom:0}
    .side-item time{display:block;color:var(--coral-dark);font-size:.78rem;font-weight:800;margin-bottom:4px}
    .side-item a{color:var(--ink);font-weight:800;line-height:1.5}
    .side-item a:hover{color:var(--coral)}
    .side-item p{font-size:.88rem;color:var(--muted);margin:6px 0 0;line-height:1.65}
    .timeline-wrap{display:grid;grid-template-columns:3fr 9fr;gap:54px}
    .timeline-intro p{color:var(--ink-soft)}
    .timeline{border-left:2px solid var(--coral);padding-left:28px}
    .timeline-item{position:relative;padding:0 0 27px}
    .timeline-item:before{
      content:"";position:absolute;left:-37px;top:7px;width:14px;height:14px;border-radius:50%;
      background:var(--lime);border:3px solid var(--paper)
    }
    .timeline-item time{font-size:.78rem;color:var(--coral-dark);font-weight:800}
    .timeline-item h3{margin:4px 0 5px}
    .timeline-item p{margin-bottom:0;color:var(--ink-soft);font-size:.94rem}
    .catalog-section{background:var(--night);color:var(--white)}
    .catalog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
    .catalog-card{
      min-height:220px;padding:24px;background:#2a3431;border:1px solid #43504a;border-radius:var(--radius-sm);
      transition:var(--ease);display:flex;flex-direction:column;justify-content:space-between
    }
    .catalog-card:nth-child(2){transform:translateY(26px)}
    .catalog-card:nth-child(3){background:var(--coral);border-color:var(--coral)}
    .catalog-card:nth-child(4){transform:translateY(12px);background:#dcebb9;color:var(--ink)}
    .catalog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .catalog-card:nth-child(2):hover,.catalog-card:nth-child(4):hover{transform:translateY(20px)}
    .catalog-number{font-family:monospace;color:var(--lime);font-size:.82rem}
    .catalog-card:nth-child(3) .catalog-number{color:#ffe3d8}
    .catalog-card:nth-child(4) .catalog-number{color:var(--coral-dark)}
    .catalog-card h3{color:inherit;margin-top:20px}
    .catalog-card p{font-size:.9rem;color:#c4ccc6;margin-bottom:0}
    .catalog-card:nth-child(3) p,.catalog-card:nth-child(4) p{color:inherit}
    .deep-grid{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:center}
    .deep-grid.reverse{grid-template-columns:7fr 5fr}
    .deep-grid.reverse .deep-copy{order:2}
    .deep-grid.reverse .deep-image{order:1}
    .deep-image{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
    .deep-image img{width:100%;aspect-ratio:4/3;object-fit:cover}
    .deep-copy p{color:var(--ink-soft)}
    .reading-points{margin:24px 0 28px;padding:0;list-style:none}
    .reading-points li{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);color:var(--ink-soft)}
    .reading-points li:before{content:"＋";color:var(--coral);font-weight:900}
    .article-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:36px;box-shadow:var(--shadow-sm)}
    .article-panel p{color:var(--ink-soft)}
    .article-panel blockquote{margin:25px 0;padding:18px 22px;border-left:4px solid var(--coral);background:#fbebe5;color:var(--ink);font-size:1.08rem}
    .article-footer{display:flex;justify-content:space-between;align-items:center;gap:18px;border-top:1px solid var(--line);padding-top:18px;margin-top:25px}
    .related-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:18px}
    .related-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:var(--ease)}
    .related-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .related-card img{width:100%;aspect-ratio:16/9;object-fit:cover}
    .related-body{padding:20px 22px}
    .related-body p{font-size:.9rem;color:var(--ink-soft)}
    .related-body .button{min-height:40px;padding:7px 13px;font-size:.86rem}
    .editor-note{display:grid;grid-template-columns:4fr 8fr;gap:60px;align-items:start}
    .note-stamp{border-top:5px solid var(--coral);padding-top:18px}
    .note-stamp strong{display:block;font-size:2.8rem;line-height:1.05}
    .note-stamp span{color:var(--muted)}
    .note-copy p{color:var(--ink-soft);font-size:1.03rem}
    .faq-grid{display:grid;grid-template-columns:4fr 8fr;gap:64px}
    .faq-intro p{color:var(--ink-soft)}
    .faq-list{display:grid;gap:10px}
    .faq-item{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
    .faq-item summary{list-style:none;padding:18px 22px;font-weight:800;cursor:pointer;position:relative;padding-right:54px}
    .faq-item summary::-webkit-details-marker{display:none}
    .faq-item summary:after{content:"＋";position:absolute;right:22px;color:var(--coral);font-size:1.3rem;transition:var(--ease)}
    .faq-item[open] summary{background:#fbebe5;color:var(--coral-dark)}
    .faq-item[open] summary:after{content:"－"}
    .faq-answer{padding:0 22px 19px;color:var(--ink-soft);font-size:.94rem}
    .cta-band{background:#dcebb9;padding:48px 0}
    .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .cta-inner h2{margin-bottom:8px}
    .cta-inner p{margin:0;color:var(--ink-soft)}
    .site-footer{background:var(--night);color:var(--paper);padding:64px 0 22px}
    .site-footer .brand{color:var(--white)!important}
    .footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:58px}
    .footer-text,.footer-note{color:#b9c2bc;font-size:.9rem;max-width:310px}
    .footer-title{font-size:1rem;color:var(--white);margin-bottom:15px}
    .footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:7px 20px}
    .footer-links a,.footer-note a{color:#cbd4cc;font-size:.88rem}
    .footer-links a:hover,.footer-note a:hover{color:var(--lime)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #414b47;margin-top:45px;padding-top:18px;color:#aab4ad;font-size:.78rem}
    .state-reserve{display:none;margin-top:20px;padding:18px;border:1px dashed var(--line-dark);border-radius:var(--radius-sm);color:var(--muted)}
    .subscribe{margin-top:24px;display:flex;max-width:430px}
    .subscribe input{min-width:0;flex:1;border:1px solid var(--line);border-radius:10px 0 0 10px;padding:10px 13px;background:var(--white);color:var(--ink)}
    .subscribe button{border:0;border-radius:0 10px 10px 0;background:var(--coral);color:#fff;padding:0 16px;font-weight:800}
    .subscribe button:hover{background:var(--coral-dark)}
    @media(max-width:1024px){
      .date-ribbon{right:3%;width:220px}
      .catalog-grid{grid-template-columns:repeat(2,1fr)}
      .topic-layout,.deep-grid,.deep-grid.reverse,.timeline-wrap,.faq-grid,.editor-note{grid-template-columns:1fr;gap:34px}
      .deep-grid.reverse .deep-copy,.deep-grid.reverse .deep-image{order:initial}
      .related-grid{grid-template-columns:1fr 1fr}
      .related-card:first-child{grid-column:span 2}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 28px))}
      .brand-meta{display:none}
      .section{padding:68px 0}
      .topic-hero{min-height:600px}
      .topic-hero-inner{padding:60px 0 84px}
      .date-ribbon{position:relative;right:auto;bottom:auto;margin-top:25px;width:100%;max-width:270px}
      .catalog-card:nth-child(2),.catalog-card:nth-child(4){transform:none}
      .catalog-card:nth-child(2):hover,.catalog-card:nth-child(4):hover{transform:translateY(-4px)}
      .cta-inner{align-items:flex-start;flex-direction:column}
      .cta-inner .button{width:100%}
      .footer-grid{grid-template-columns:1fr 1fr;gap:34px}
      .footer-grid>div:first-child{grid-column:span 2}
      .footer-bottom{flex-direction:column;gap:6px}
    }
    @media(max-width:520px){
      h1{font-size:2.45rem}
      h2{font-size:2rem}
      .icon-nav a{min-width:92px;padding:8px 10px}
      .topic-intro{font-size:1rem}
      .hero-actions,.hero-actions .button{width:100%}
      .hero-actions .button{display:flex}
      .catalog-grid,.related-grid{grid-template-columns:1fr}
      .related-card:first-child{grid-column:auto}
      .article-panel{padding:24px 20px}
      .article-footer{align-items:flex-start;flex-direction:column}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
      .footer-links{grid-template-columns:1fr 1fr}
      .subscribe{width:100%}
    }

/* roulang page: category4 */
:root{
      --ink:#252a29;
      --ink-soft:#58615e;
      --muted:#7b8580;
      --paper:#f7f4ee;
      --paper-2:#eeeae1;
      --white:#fffdf9;
      --line:#ddd8ce;
      --line-dark:#434b47;
      --coral:#e8664c;
      --coral-dark:#bb4936;
      --lime:#b9d875;
      --cyan:#72c7bd;
      --night:#202827;
      --shadow:0 18px 42px rgba(37,42,41,.09);
      --shadow-sm:0 8px 20px rgba(37,42,41,.07);
      --radius:18px;
      --radius-sm:11px;
      --container:1240px;
      --ease:all .28s ease;
    }
    html{scroll-behavior:smooth}
    *{box-sizing:border-box}
    body{
      margin:0;background:var(--paper);color:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:16px;line-height:1.8;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{line-height:1.25;letter-spacing:-.035em}
    h1{font-size:clamp(2.35rem,5vw,4.8rem);margin-bottom:22px}
    h2{font-size:clamp(1.85rem,3vw,3.1rem);margin-bottom:16px}
    h3{font-size:1.35rem;margin-bottom:10px}
    p{color:var(--ink-soft)}
    a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--coral)}
    a:visited{color:var(--coral-dark)}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .section{padding:88px 0;position:relative}
    .section-soft{background:var(--paper-2)}
    .section-dark{background:var(--night);color:var(--paper)}
    .section-dark p{color:#c4ccc6}
    .section-dark h2,.section-dark h3{color:var(--white)}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--coral-dark);
      font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:15px
    }
    .eyebrow:before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
    .section-head{max-width:760px;margin-bottom:38px}
    .section-head p{font-size:1.06rem}
    .brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .site-header{
      background:rgba(247,244,238,.95);border-bottom:1px solid var(--line);
      position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)
    }
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
    .brand-mark{
      width:40px;height:40px;border-radius:12px;background:var(--coral);
      display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.1rem;
      box-shadow:4px 4px 0 var(--ink)
    }
    .brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
    .live-dot{width:9px;height:9px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(232,102,76,.14)}
    .nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}
    .icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
    .icon-nav a{
      min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;
      display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700
    }
    .icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}
    .icon-nav a.active{background:var(--ink);color:#fffdf9;border-color:var(--ink);box-shadow:var(--shadow-sm)}
    .icon-nav a.active:visited{color:#fffdf9}
    .nav-icon{font-size:1.15rem;line-height:1}
    .button{
      display:inline-flex;align-items:center;justify-content:center;min-height:47px;
      border-radius:10px;padding:10px 19px;font-weight:800;border:1px solid transparent;transition:var(--ease)
    }
    .button.primary{background:var(--coral);color:#fff}
    .button.primary:hover{background:#f17a61;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}
    .button.ink{background:var(--ink);color:#fff}
    .button.ink:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}
    .button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}
    .button.outline:hover{background:var(--ink);color:#fff}
    .button.light{background:var(--white);color:var(--ink)}
    .button.light:hover{background:var(--lime);color:var(--ink)}
    .page-hero{
      min-height:400px;display:flex;align-items:flex-end;position:relative;color:var(--white);
      background:
      linear-gradient(90deg,rgba(32,40,39,.93),rgba(32,40,39,.66) 52%,rgba(32,40,39,.3)),
      url('/assets/images/backpic/back-2.webp') center/cover
    }
    .page-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(32,40,39,.7),transparent 58%)}
    .page-hero-inner{position:relative;z-index:1;padding:72px 0 62px;width:100%}
    .page-hero h1{max-width:720px;margin-bottom:15px}
    .page-hero p{max-width:730px;color:#e4e9e2;font-size:1.08rem}
    .crumbs{display:flex;gap:10px;align-items:center;color:#d2dad2;font-size:.86rem;margin-bottom:25px}
    .crumbs a{color:var(--lime)}
    .topic-strip{background:var(--night);color:#fff;position:relative;z-index:2}
    .topic-strip-inner{display:flex;align-items:center;gap:22px;overflow-x:auto;padding:15px 0;white-space:nowrap}
    .topic-label{color:var(--lime);font-weight:800;font-size:.86rem}
    .topic-strip a{color:#d8dfd8;font-size:.88rem;padding:5px 12px;border-left:1px solid #53605a}
    .topic-strip a:hover{color:var(--lime)}
    .filter-bar{
      display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:16px 18px;
      background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm)
    }
    .filter-title{font-weight:800;margin-right:8px}
    .filter-btn{
      border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);
      border-radius:999px;padding:7px 14px;font-size:.86rem;transition:var(--ease)
    }
    .filter-btn:hover,.filter-btn.active{background:var(--coral);border-color:var(--coral);color:#fff}
    .feature-person{
      display:grid;grid-template-columns:1.08fr .92fr;background:var(--white);
      border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)
    }
    .feature-person img{width:100%;height:100%;min-height:410px;object-fit:cover;object-position:center}
    .person-copy{padding:42px 44px;display:flex;flex-direction:column;justify-content:center}
    .person-kicker{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.86rem;margin-bottom:18px}
    .person-kicker b{color:var(--coral-dark)}
    .person-copy h2{font-size:clamp(2rem,3.5vw,3.35rem)}
    .person-copy p{font-size:1.03rem}
    .person-stats{display:flex;gap:28px;border-top:1px solid var(--line);padding-top:20px;margin-top:16px;margin-bottom:25px}
    .stat strong{display:block;font-size:1.7rem;line-height:1;color:var(--ink)}
    .stat span{display:block;color:var(--muted);font-size:.78rem;margin-top:6px}
    .index-layout{display:grid;grid-template-columns:3fr 9fr;gap:46px;align-items:start}
    .index-intro{position:sticky;top:155px}
    .index-intro h2{font-size:2.25rem}
    .index-intro p{font-size:.97rem}
    .team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    .team-item{
      background:var(--white);border:1px solid var(--line);border-radius:14px;padding:20px;
      min-height:142px;transition:var(--ease);position:relative;overflow:hidden
    }
    .team-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);border-color:var(--coral)}
    .team-item:after{content:"";position:absolute;width:58px;height:58px;border-radius:50%;background:var(--lime);right:-24px;bottom:-25px;opacity:.55}
    .team-symbol{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--lime);font-weight:900;margin-bottom:13px}
    .team-item h3{font-size:1.08rem;margin-bottom:5px}
    .team-item p{font-size:.8rem;margin:0}
    .dynamic-layout{display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:start}
    .dynamic-list{border-top:1px solid var(--line)}
    .dynamic-item{
      display:grid;grid-template-columns:96px 1fr auto;gap:20px;align-items:center;
      padding:20px 0;border-bottom:1px solid var(--line)
    }
    .dynamic-date{color:var(--muted);font-size:.82rem}
    .dynamic-item h3{font-size:1.13rem;margin-bottom:5px}
    .dynamic-item p{font-size:.88rem;margin:0}
    .arrow{font-size:1.4rem;color:var(--coral);transition:var(--ease)}
    .dynamic-item:hover .arrow{transform:translateX(5px)}
    .side-note{background:var(--night);color:var(--white);border-radius:var(--radius);padding:30px}
    .side-note p{color:#c8d0c8;font-size:.94rem}
    .side-note ul{padding:0;margin:22px 0 0;list-style:none}
    .side-note li{padding:12px 0;border-top:1px solid rgba(255,255,255,.16);display:flex;justify-content:space-between;gap:15px;color:#e8eee7;font-size:.88rem}
    .side-note li span:last-child{color:var(--lime);font-weight:800}
    .observation{
      display:grid;grid-template-columns:5fr 7fr;gap:54px;align-items:center
    }
    .observation-image{position:relative}
    .observation-image img{width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}
    .image-caption{position:absolute;left:18px;bottom:18px;background:rgba(32,40,39,.86);color:#fff;padding:8px 12px;border-radius:8px;font-size:.78rem}
    .bars{display:grid;gap:18px;margin:27px 0}
    .bar-row{display:grid;grid-template-columns:120px 1fr 44px;gap:12px;align-items:center;font-size:.88rem}
    .bar-track{height:9px;background:#d8ddd3;border-radius:9px;overflow:hidden}
    .bar-fill{height:100%;background:var(--coral);border-radius:9px}
    .bar-fill.cyan{background:var(--cyan)}
    .bar-fill.lime{background:#99b95a}
    .note{font-size:.8rem;color:var(--muted);border-left:3px solid var(--cyan);padding-left:13px}
    .feedback-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:28px;align-items:stretch}
    .quote-main{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:38px 40px;box-shadow:var(--shadow-sm)}
    blockquote{font-size:1.55rem;line-height:1.65;margin:0 0 26px;color:var(--ink);font-weight:700}
    .quote-author{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.86rem}
    .avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--coral);color:#fff;font-weight:900}
    .feedback-side{display:grid;gap:14px}
    .mini-feedback{background:#e6eee1;border-left:4px solid var(--lime);padding:20px 22px;border-radius:0 12px 12px 0}
    .mini-feedback p{margin:0;color:var(--ink-soft);font-size:.91rem}
    .mini-feedback strong{display:block;color:var(--ink);font-size:.88rem;margin-top:10px}
    .faq-wrap{display:grid;grid-template-columns:4fr 8fr;gap:55px;align-items:start}
    .faq-intro p{font-size:.98rem}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);transition:var(--ease)}
    summary{cursor:pointer;list-style:none;padding:20px 44px 20px 0;font-weight:800;position:relative}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";position:absolute;right:5px;top:15px;color:var(--coral);font-size:1.5rem;font-weight:400}
    details[open] summary:after{content:"−"}
    details[open]{background:rgba(255,253,249,.45)}
    details p{padding:0 45px 20px 0;margin:0;font-size:.92rem}
    .cta-band{background:var(--coral);color:#fff;padding:46px 0}
    .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .cta-band h2{font-size:clamp(1.7rem,3vw,2.6rem);margin-bottom:8px}
    .cta-band p{color:#fff0e8;margin:0}
    .cta-actions{display:flex;gap:10px;flex-wrap:wrap}
    .site-footer{background:var(--night);color:#e8eee7;padding:58px 0 22px}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px}
    .site-footer .brand{color:#fff!important}
    .footer-text,.footer-note{color:#bfc9c0;font-size:.88rem;max-width:310px}
    .footer-title{font-size:1rem;color:#fff;margin-bottom:15px}
    .footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 18px}
    .footer-links a,.footer-note a{color:#cbd4ca;font-size:.86rem}
    .footer-links a:hover,.footer-note a:hover{color:var(--lime)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.16);margin-top:42px;padding-top:18px;color:#aab5ad;font-size:.78rem}
    .status-chip{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;background:#d9eeea;color:#28766e;font-size:.75rem;font-weight:800}
    @media(max-width:1024px){
      .feature-person,.observation{grid-template-columns:1fr 1fr}
      .index-layout{grid-template-columns:1fr;gap:25px}
      .index-intro{position:static;max-width:700px}
      .team-grid{grid-template-columns:repeat(3,1fr)}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 28px))}
      .brand-meta{display:none}
      .section{padding:64px 0}
      .page-hero{min-height:370px}
      .feature-person,.dynamic-layout,.observation,.feedback-grid,.faq-wrap{grid-template-columns:1fr}
      .feature-person img{min-height:280px}
      .person-copy{padding:30px 24px}
      .team-grid{grid-template-columns:repeat(2,1fr)}
      .index-intro h2{font-size:1.9rem}
      .observation-image img{aspect-ratio:16/10}
      .cta-inner{align-items:flex-start;flex-direction:column}
      .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
      .footer-grid>div:first-child{grid-column:1/-1}
      .footer-bottom{flex-direction:column;gap:5px}
    }
    @media(max-width:520px){
      h1{font-size:2.35rem}
      h2{font-size:1.9rem}
      .page-hero-inner{padding:55px 0 45px}
      .topic-strip-inner{gap:10px}
      .filter-bar{align-items:flex-start}
      .filter-title{width:100%;margin-bottom:2px}
      .team-grid{grid-template-columns:1fr 1fr;gap:10px}
      .team-item{padding:15px;min-height:126px}
      .dynamic-item{grid-template-columns:1fr auto;gap:5px 12px}
      .dynamic-date{grid-column:1/-1}
      .dynamic-item p{font-size:.84rem}
      .bar-row{grid-template-columns:82px 1fr 32px;gap:8px;font-size:.78rem}
      blockquote{font-size:1.2rem}
      .quote-main{padding:28px 23px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
      .footer-links{grid-template-columns:repeat(2,1fr)}
      .cta-actions,.cta-actions .button{width:100%}
    }

/* roulang page: category6 */
:root{
 --ink:#252a29;
 --ink-soft:#58615e;
 --muted:#7b8580;
 --paper:#f7f4ee;
 --paper-2:#eeeae1;
 --white:#fffdf9;
 --line:#ddd8ce;
 --line-dark:#434b47;
 --coral:#e8664c;
 --coral-dark:#bb4936;
 --lime:#b9d875;
 --cyan:#72c7bd;
 --night:#202827;
 --shadow:0 18px 42px rgba(37,42,41,.09);
 --shadow-sm:0 8px 20px rgba(37,42,41,.07);
 --radius:18px;
 --radius-sm:11px;
 --container:1240px;
 --ease:all .28s ease;
}
html{scroll-behavior:smooth}
*,:before,:after{box-sizing:border-box}
body{
 margin:0;background:var(--paper);color:var(--ink);
 font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
 font-size:16px;line-height:1.8;overflow-x:hidden
}
h1,h2,h3,h4,p{margin-top:0}
h1,h2,h3,h4{color:var(--ink);line-height:1.25;letter-spacing:-.045em}
h1{font-size:clamp(2.4rem,5vw,4.8rem);margin-bottom:20px}
h2{font-size:clamp(1.8rem,3.2vw,3rem);margin-bottom:16px}
h3{font-size:1.3rem;margin-bottom:10px}
p{color:var(--ink-soft)}
a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}
a:hover{color:var(--coral)}
a:visited{color:var(--coral-dark)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
 outline:3px solid rgba(114,199,189,.65);outline-offset:3px
}
img{display:block;max-width:100%;height:auto}
button,input{font:inherit}
button{cursor:pointer}
.container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
.section{padding:86px 0;position:relative}
.section-soft{background:var(--paper-2)}
.section-dark{background:var(--night);color:var(--paper)}
.section-dark h2,.section-dark h3{color:var(--white)}
.section-dark p{color:#cbd2cc}
.section-head{max-width:720px;margin-bottom:38px}
.section-head p{font-size:1.06rem}
.eyebrow{
 display:inline-flex;align-items:center;gap:8px;color:var(--coral-dark);
 font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:14px
}
.eyebrow:before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
.site-header{
 background:rgba(247,244,238,.95);border-bottom:1px solid var(--line);
 position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)
}
.brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
.brand-mark{
 width:40px;height:40px;border-radius:12px;background:var(--coral);display:grid;place-items:center;
 color:#fff;font-weight:900;font-size:1.1rem;box-shadow:4px 4px 0 var(--ink)
}
.brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
.live-dot{width:9px;height:9px;background:var(--coral);border-radius:50%;box-shadow:0 0 0 5px rgba(232,102,76,.12)}
.nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}
.icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
.icon-nav a{
 min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;
 display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700
}
.icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}
.icon-nav a.active{background:var(--ink);color:var(--white);border-color:var(--ink);box-shadow:var(--shadow-sm)}
.icon-nav a.active .nav-icon{color:var(--lime)}
.nav-icon{font-size:1.15rem;line-height:1;color:var(--coral-dark)}
.page-banner{
 position:relative;min-height:330px;display:flex;align-items:end;overflow:hidden;
 background:linear-gradient(90deg,rgba(32,40,39,.95),rgba(32,40,39,.72) 52%,rgba(32,40,39,.3)),
 url('/assets/images/backpic/back-2.webp') center/cover;color:var(--white)
}
.page-banner:after{
 content:"";position:absolute;right:8%;top:32px;width:180px;height:180px;
 border:1px solid rgba(185,216,117,.45);border-radius:50%
}
.banner-inner{position:relative;z-index:1;width:100%;padding:62px 0 58px}
.page-banner h1{color:var(--white);max-width:760px;font-size:clamp(2.2rem,5vw,4.2rem)}
.page-banner p{color:#d8ded8;max-width:700px;font-size:1.06rem}
.banner-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.banner-chip,.tag{
 display:inline-flex;align-items:center;border-radius:999px;padding:5px 12px;
 font-size:.76rem;font-weight:800
}
.banner-chip{border:1px solid rgba(255,255,255,.25);color:var(--white);background:rgba(255,255,255,.08)}
.tag{background:#e8f0d8;color:#607631;border-radius:6px}
.tag.coral{background:#fbe2da;color:var(--coral-dark)}
.tag.cyan{background:#d9eeea;color:#28766e}
.ticker{border-bottom:1px solid var(--line);background:var(--white)}
.ticker-inner{display:flex;align-items:center;gap:18px;min-height:58px;overflow:hidden}
.ticker-label{font-weight:900;white-space:nowrap;color:var(--coral-dark)}
.ticker-line{display:flex;gap:30px;white-space:nowrap;color:var(--ink-soft);font-size:.9rem}
.ticker-line span:before{content:"◆";color:var(--lime);font-size:.6rem;margin-right:9px}
.filter-wrap{display:flex;justify-content:space-between;align-items:center;gap:22px;flex-wrap:wrap}
.filter-tabs{display:flex;gap:9px;flex-wrap:wrap}
.filter-tab{
 border:1px solid var(--line);background:var(--white);color:var(--ink-soft);
 border-radius:999px;padding:9px 16px;font-weight:700;transition:var(--ease)
}
.filter-tab:hover,.filter-tab.active{background:var(--ink);border-color:var(--ink);color:var(--white)}
.search-box{display:flex;gap:8px;max-width:280px}
.search-box input{
 width:100%;height:44px;border:1px solid var(--line);border-radius:10px;background:var(--white);
 padding:8px 13px;color:var(--ink);box-shadow:none
}
.search-box button{
 border:0;border-radius:10px;background:var(--coral);color:#fff;padding:0 16px;font-weight:800
}
.pin-layout{display:grid;grid-template-columns:7fr 5fr;gap:30px;align-items:stretch}
.feature-story{
 background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
 overflow:hidden;box-shadow:var(--shadow-sm);height:100%
}
.feature-story:hover,.article-item:hover,.topic-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.feature-story img{width:100%;aspect-ratio:16/8;object-fit:cover;object-position:center}
.story-body{padding:27px 30px 30px}
.story-body h2{font-size:clamp(1.6rem,3vw,2.45rem);margin-bottom:14px}
.story-body p{font-size:1rem}
.story-meta,.article-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:.8rem}
.story-meta{border-top:1px solid var(--line);padding-top:14px;margin-top:22px;justify-content:space-between}
.button{
 display:inline-flex;align-items:center;justify-content:center;min-height:46px;
 border-radius:10px;padding:10px 19px;font-weight:800;border:1px solid transparent;transition:var(--ease)
}
.button.primary{background:var(--coral);color:#fff}
.button.primary:hover{background:#f17a61;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}
.button.ink{background:var(--ink);color:#fff}
.button.ink:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}
.button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}
.button.outline:hover{background:var(--ink);color:#fff}
.latest-panel{background:var(--night);border-radius:var(--radius);padding:27px;color:var(--white)}
.latest-panel h2{color:var(--white);font-size:1.6rem;margin-bottom:18px}
.latest-list{list-style:none;margin:0;padding:0}
.latest-list li{padding:16px 0;border-top:1px solid rgba(255,255,255,.15)}
.latest-list li:first-child{border-top:0}
.latest-list a{color:var(--white);display:block;font-weight:800;line-height:1.5}
.latest-list a:hover{color:var(--lime)}
.latest-list time{color:#aeb9b1;font-size:.78rem;display:block;margin-bottom:4px}
.latest-list small{color:#bfc8c1}
.axis{position:relative;margin-top:18px;padding-left:30px}
.axis:before{content:"";position:absolute;left:7px;top:5px;bottom:8px;width:2px;background:var(--line)}
.axis-item{position:relative;padding:0 0 26px 24px}
.axis-item:before{
 content:"";position:absolute;left:-29px;top:8px;width:14px;height:14px;border-radius:50%;
 background:var(--paper);border:4px solid var(--coral);z-index:1
}
.axis-date{font-size:.8rem;color:var(--coral-dark);font-weight:900}
.axis-item h3{font-size:1.17rem;margin:3px 0 5px}
.axis-item p{margin:0;font-size:.92rem}
.news-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.article-item{
 background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);
 padding:21px;transition:var(--ease);display:flex;flex-direction:column;min-height:245px
}
.article-item:nth-child(1){grid-column:span 7;min-height:290px}
.article-item:nth-child(2){grid-column:span 5}
.article-item:nth-child(n+3){grid-column:span 4}
.article-item h3{font-size:1.22rem;margin:12px 0 8px}
.article-item p{font-size:.9rem;line-height:1.7;margin-bottom:15px}
.article-item .read-link{margin-top:auto;font-weight:800;font-size:.88rem}
.article-meta{font-size:.78rem}
.topic-layout{display:grid;grid-template-columns:4fr 8fr;gap:34px;align-items:start}
.topic-intro{position:sticky;top:150px}
.topic-intro p{font-size:1.04rem}
.topic-map{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.topic-card{
 background:var(--white);border:1px solid var(--line);border-radius:14px;padding:22px;transition:var(--ease)
}
.topic-card strong{display:flex;justify-content:space-between;align-items:center;font-size:1.08rem}
.topic-card strong span{color:var(--coral);font-size:1.2rem}
.topic-card p{font-size:.88rem;margin:9px 0 0}
.subscribe-panel{
 display:grid;grid-template-columns:5fr 7fr;gap:30px;align-items:center;
 background:#d9eeea;border:1px solid #b8d9d2;border-radius:var(--radius);padding:32px 36px
}
.subscribe-panel h2{margin-bottom:9px}
.subscribe-form{display:flex;gap:10px;align-items:center}
.subscribe-form input{
 flex:1;min-width:0;height:48px;border:1px solid #b6ccc5;border-radius:10px;background:var(--white);
 padding:10px 14px;box-shadow:none
}
.form-message{font-size:.82rem;color:#28766e;margin-top:9px;display:none}
.form-message.show{display:block}
.faq-layout{display:grid;grid-template-columns:4fr 8fr;gap:50px}
.faq-list{display:grid;gap:10px}
.faq-item{border:1px solid var(--line);border-radius:12px;background:var(--white);overflow:hidden}
.faq-item summary{
 list-style:none;cursor:pointer;padding:18px 22px;font-weight:800;position:relative;padding-right:48px
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";position:absolute;right:20px;color:var(--coral);font-size:1.4rem;top:13px;transition:var(--ease)}
.faq-item[open] summary:after{content:"−";transform:rotate(180deg)}
.faq-answer{padding:0 22px 20px;color:var(--ink-soft);font-size:.94rem}
.empty-state{
 margin-top:24px;padding:18px 20px;border:1px dashed var(--line-dark);border-radius:12px;
 color:var(--muted);background:rgba(255,253,249,.55);display:none
}
.empty-state.show{display:block}
.cta-band{
 background:var(--coral);color:#fff;position:relative;overflow:hidden
}
.cta-band:after{content:"09 / 24";position:absolute;right:5%;bottom:-24px;font-size:9rem;line-height:1;font-weight:900;color:rgba(255,255,255,.12)}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;z-index:1}
.cta-band h2{color:#fff;margin-bottom:9px}
.cta-band p{color:#ffe7df;max-width:650px;margin-bottom:0}
.cta-actions{display:flex;gap:10px;flex-wrap:wrap}
.cta-band .button.ink{background:var(--ink)}
.cta-band .button.ink:hover{background:#fff;color:var(--ink)}
.site-footer{background:var(--night);color:var(--paper);padding:62px 0 24px}
.footer-grid{display:grid;grid-template-columns:5fr 4fr 3fr;gap:42px}
.site-footer .brand{color:var(--white)!important}
.footer-text,.footer-note{color:#b9c2ba;font-size:.9rem;max-width:340px}
.footer-title{font-size:1rem;color:var(--white);margin-bottom:14px}
.footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:7px 18px}
.footer-links a,.footer-note a{color:#cbd3cc;font-size:.86rem}
.footer-links a:hover,.footer-note a:hover{color:var(--lime)}
.footer-bottom{
 border-top:1px solid rgba(255,255,255,.14);margin-top:42px;padding-top:20px;
 display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:#9ca79f;font-size:.78rem
}
@media(max-width:1024px){
 .pin-layout,.subscribe-panel{grid-template-columns:1fr}
 .topic-layout,.faq-layout{grid-template-columns:1fr;gap:30px}
 .topic-intro{position:static}
 .hero-side{right:3%;width:280px}
}
@media(max-width:768px){
 .container{width:min(var(--container),calc(100% - 28px))}
 .section{padding:64px 0}
 .brand-row{min-height:66px}
 .brand-meta{display:none}
 .page-banner{min-height:310px}
 .banner-inner{padding:54px 0 48px}
 .ticker-inner{min-height:52px}
 .ticker-line{gap:20px;font-size:.82rem}
 .filter-wrap{align-items:stretch}
 .search-box{max-width:none;width:100%}
 .news-grid{grid-template-columns:1fr}
 .article-item,.article-item:nth-child(1),.article-item:nth-child(2),.article-item:nth-child(n+3){
  grid-column:auto;min-height:0
 }
 .article-item:nth-child(1){min-height:250px}
 .topic-map{grid-template-columns:1fr}
 .subscribe-panel{padding:25px 22px}
 .subscribe-form{align-items:stretch;flex-direction:column}
 .subscribe-form .button{width:100%}
 .cta-inner{align-items:flex-start;flex-direction:column}
 .cta-actions{width:100%}
 .cta-actions .button{flex:1}
 .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
 .footer-grid>div:first-child{grid-column:span 2}
}
@media(max-width:520px){
 h1{font-size:2.35rem}
 h2{font-size:1.85rem}
 .icon-nav{padding:8px 0}
 .icon-nav a{min-width:auto;padding:8px 11px}
 .icon-nav a span:last-child{font-size:.8rem}
 .nav-icon{font-size:1rem}
 .story-body{padding:22px}
 .latest-panel{padding:22px}
 .footer-grid{grid-template-columns:1fr}
 .footer-grid>div:first-child{grid-column:auto}
 .footer-links{grid-template-columns:1fr 1fr}
 .footer-bottom{display:block}
 .footer-bottom span{display:block;margin-bottom:7px}
}

/* roulang page: category7 */
:root{
      --ink:#252a29;--ink-soft:#58615e;--muted:#7b8580;--paper:#f7f4ee;--paper-2:#eeeae1;
      --white:#fffdf9;--line:#ddd8ce;--line-dark:#434b47;--coral:#e8664c;--coral-dark:#bb4936;
      --lime:#b9d875;--cyan:#72c7bd;--night:#202827;--shadow:0 18px 42px rgba(37,42,41,.09);
      --shadow-sm:0 8px 20px rgba(37,42,41,.07);--radius:18px;--radius-sm:11px;--container:1240px;
      --ease:all .28s ease
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:16px;line-height:1.8;overflow-x:hidden}
    h1,h2,h3,h4,p{margin-top:0}h1,h2,h3,h4{line-height:1.25;letter-spacing:-.035em}
    h1{font-size:clamp(2.35rem,5vw,4.5rem);margin-bottom:20px}h2{font-size:clamp(1.8rem,3vw,2.8rem);margin-bottom:18px}h3{font-size:1.35rem}
    a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}a:hover{color:var(--coral)}a:visited{color:var(--coral-dark)}
    a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid rgba(114,199,189,.65);outline-offset:3px}
    img{display:block;max-width:100%;height:auto}button,input{font:inherit}button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .section{padding:88px 0;position:relative}.section-soft{background:var(--paper-2)}.section-dark{background:var(--night);color:var(--paper)}
    .section-dark p{color:#c4ccc6}.section-dark h2,.section-dark h3{color:var(--white)}
    .section-head{max-width:720px;margin-bottom:40px}.section-head p{font-size:1.06rem;color:var(--ink-soft)}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--coral-dark);font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:14px}
    .eyebrow:before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
    .site-header{background:rgba(247,244,238,.96);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)}
    .brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
    .brand-mark{width:40px;height:40px;border-radius:12px;background:var(--coral);display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.1rem;box-shadow:4px 4px 0 var(--ink)}
    .brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}.live-dot{width:8px;height:8px;background:var(--cyan);border-radius:50%;box-shadow:0 0 0 5px rgba(114,199,189,.18)}
    .nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}.icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
    .icon-nav a{min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700}
    .icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}.icon-nav a.active{background:var(--ink);color:var(--white);border-color:var(--ink);box-shadow:var(--shadow-sm)}
    .nav-icon{font-size:1.15rem;line-height:1}
    .page-banner{padding:72px 0 66px;background:var(--night);color:var(--white);position:relative;overflow:hidden}
    .page-banner:after{content:"07";position:absolute;right:7%;bottom:-44px;color:rgba(185,216,117,.12);font-size:12rem;font-weight:900;line-height:1}
    .banner-inner{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:end;gap:40px}.banner-copy{max-width:760px}.banner-copy p{color:#c9d1cb;font-size:1.12rem;max-width:700px}
    .crumbs{color:var(--lime);font-size:.82rem;font-weight:800;margin-bottom:18px}.crumbs a{color:var(--lime)}
    .label-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px}.label{border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:6px 13px;color:#e7ece5;font-size:.82rem}
    .intro-grid{display:grid;grid-template-columns:4fr 8fr;gap:70px;align-items:start}.intro-lead{font-size:1.3rem;line-height:1.7;font-weight:700}.intro-copy p{color:var(--ink-soft);font-size:1.02rem}
    .rule-line{height:1px;background:var(--line);margin:25px 0}.note-box{padding:25px;background:var(--white);border-left:4px solid var(--coral);border-radius:0 var(--radius-sm) var(--radius-sm) 0;box-shadow:var(--shadow-sm)}
    .map-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:16px}.map-card{background:var(--white);border:1px solid var(--line);padding:27px;border-radius:var(--radius);min-height:235px;transition:var(--ease)}.map-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--coral)}
    .map-card:nth-child(1){background:var(--coral);color:#fff}.map-card:nth-child(1) p{color:#fff0eb}.map-card:nth-child(4){grid-column:span 2;background:#e4efcf}.map-index{font-size:2rem;font-weight:900;color:var(--coral);margin-bottom:12px}.map-card:nth-child(1) .map-index{color:var(--lime)}
    .route{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.route-item{padding:28px 24px 30px;border-right:1px solid var(--line);position:relative}.route-item:last-child{border-right:0}.route-item:before{content:"";width:12px;height:12px;background:var(--coral);border:3px solid var(--paper-2);border-radius:50%;position:absolute;top:-7px;left:24px}.route-no{color:var(--coral-dark);font-weight:900;font-size:.8rem}.route-item p{color:var(--ink-soft);font-size:.94rem}
    .split-feature{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center}.split-feature.reverse{grid-template-columns:5fr 7fr}.split-feature.reverse .feature-text{order:2}.feature-image{overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow)}.feature-image img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .5s ease}.feature-image:hover img{transform:scale(1.035)}.feature-text p{color:#c4ccc6;font-size:1.02rem}.section-dark .feature-text .eyebrow{color:var(--lime)}
    .matrix{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.matrix-item{padding:24px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm)}.matrix-item strong{display:block;font-size:1.15rem;margin-bottom:8px}.matrix-item span{color:var(--muted);font-size:.85rem}.matrix-item p{color:var(--ink-soft);font-size:.93rem;margin:12px 0 0}
    .rhythm{display:grid;grid-template-columns:220px 1fr;gap:36px;align-items:start}.rhythm-number{font-size:4.5rem;line-height:1;color:var(--coral);font-weight:900}.rhythm-list{display:grid;gap:0}.rhythm-row{display:grid;grid-template-columns:125px 1fr;gap:25px;padding:18px 0;border-bottom:1px solid var(--line)}.rhythm-row strong{color:var(--coral-dark)}
    .quote-wrap{display:grid;grid-template-columns:7fr 5fr;gap:28px;align-items:stretch}.quote-main{background:var(--coral);color:#fff;padding:40px;border-radius:var(--radius);display:flex;flex-direction:column;justify-content:space-between}.quote-main blockquote{font-size:1.7rem;line-height:1.55;margin:0 0 28px;font-weight:700}.quote-main cite{font-style:normal;color:#ffe4dc}.quote-list{display:grid;gap:14px}.quote-small{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);padding:21px}.quote-small p{margin-bottom:8px;color:var(--ink-soft);font-size:.94rem}.quote-small strong{font-size:.85rem}
    .faq-grid{display:grid;grid-template-columns:5fr 7fr;gap:70px}.faq-intro p{color:var(--ink-soft)}.faq-list{display:grid;gap:10px}.faq-list details{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);padding:0 21px;transition:var(--ease)}.faq-list details[open]{border-color:var(--coral);box-shadow:var(--shadow-sm)}summary{cursor:pointer;padding:19px 28px 19px 0;font-weight:800;position:relative;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"＋";position:absolute;right:0;color:var(--coral);font-size:1.25rem}.faq-list details[open] summary:after{content:"－"}.faq-answer{padding:0 0 19px;color:var(--ink-soft);font-size:.95rem}
    .cta{padding:54px 0;background:#e4efcf}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{margin-bottom:10px}.cta p{margin:0;color:var(--ink-soft)}.cta-actions{display:flex;gap:11px;flex-wrap:wrap}
    .button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;border-radius:10px;padding:11px 20px;font-weight:800;transition:var(--ease);border:1px solid transparent}.button.primary{background:var(--coral);color:#fff}.button.primary:hover{background:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}.button.ink{background:var(--ink);color:#fff}.button.ink:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}.button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}.button.outline:hover{background:var(--ink);color:#fff}.button:active{transform:translateY(1px)}
    .site-footer{background:var(--night);color:var(--paper);padding:62px 0 22px}.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:60px}.site-footer .brand{color:var(--white)!important}.footer-text,.footer-note{color:#b8c1bb;font-size:.9rem;max-width:310px}.footer-title{color:var(--lime);font-size:1rem;margin-bottom:15px}.footer-links{display:grid;grid-template-columns:1fr 1fr;gap:7px 18px}.footer-links a,.footer-note a{color:#dce5da;font-size:.88rem}.footer-links a:hover,.footer-note a:hover{color:var(--lime)}.footer-bottom{border-top:1px solid #48514d;margin-top:44px;padding-top:19px;display:flex;justify-content:space-between;gap:20px;color:#aeb8b1;font-size:.78rem}
    @media(max-width:1024px){.intro-grid,.faq-grid{gap:38px}.map-grid{grid-template-columns:1fr 1fr}.map-card:nth-child(4){grid-column:span 1}.split-feature,.split-feature.reverse{grid-template-columns:1fr 1fr;gap:28px}.hero-side{right:2%;width:280px}.footer-grid{gap:28px}}
    @media(max-width:768px){.container{width:min(var(--container),calc(100% - 28px))}.brand-meta{display:none}.section{padding:65px 0}.banner-inner,.intro-grid,.split-feature,.split-feature.reverse,.quote-wrap,.faq-grid{display:block}.banner-copy{max-width:100%}.map-grid,.matrix{grid-template-columns:1fr 1fr}.map-card{min-height:0}.route{grid-template-columns:1fr 1fr}.route-item:nth-child(2){border-right:0}.route-item:nth-child(3),.route-item:nth-child(4){border-top:1px solid var(--line)}.split-feature .feature-text,.split-feature.reverse .feature-text{order:initial;margin-bottom:28px}.quote-main{margin-bottom:14px}.rhythm{grid-template-columns:1fr;gap:18px}.rhythm-number{font-size:3.3rem}.cta-inner{display:block}.cta-actions{margin-top:24px}.footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:7px}}
    @media(max-width:520px){h1{font-size:2.45rem}.page-banner{padding:52px 0}.map-grid,.matrix,.route{grid-template-columns:1fr}.route-item{border-right:0!important;border-top:1px solid var(--line)}.route-item:first-child{border-top:0}.rhythm-row{grid-template-columns:88px 1fr;gap:15px}.footer-grid{grid-template-columns:1fr}.footer-links{grid-template-columns:1fr 1fr}.hero-actions .button,.cta-actions .button{width:100%}}

/* roulang page: category5 */
:root{
      --ink:#252a29;
      --ink-soft:#58615e;
      --muted:#7b8580;
      --paper:#f7f4ee;
      --paper-2:#eeeae1;
      --white:#fffdf9;
      --line:#ddd8ce;
      --line-dark:#434b47;
      --coral:#e8664c;
      --coral-dark:#bb4936;
      --lime:#b9d875;
      --cyan:#72c7bd;
      --night:#202827;
      --shadow:0 18px 42px rgba(37,42,41,.09);
      --shadow-sm:0 8px 20px rgba(37,42,41,.07);
      --radius:18px;
      --radius-sm:11px;
      --container:1240px;
      --ease:all .28s ease;
    }
    html{scroll-behavior:smooth}
    *{box-sizing:border-box}
    body{
      margin:0;background:var(--paper);color:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:16px;line-height:1.8;overflow-x:hidden
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{line-height:1.25;letter-spacing:-.035em}
    h1{font-size:clamp(2.4rem,5vw,4.7rem);margin-bottom:22px}
    h2{font-size:clamp(1.9rem,3.4vw,3.15rem);margin-bottom:18px}
    h3{font-size:1.28rem;margin-bottom:10px}
    a{color:var(--coral-dark);text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--coral)}
    a:visited{color:var(--coral-dark)}
    a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
      outline:3px solid rgba(114,199,189,.65);outline-offset:3px
    }
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--coral-dark);
      font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:15px
    }
    .eyebrow:before{content:"";width:24px;height:3px;background:var(--coral);border-radius:4px}
    .section{padding:88px 0;position:relative}
    .section-head{max-width:720px;margin-bottom:40px}
    .section-head p{font-size:1.05rem;color:var(--ink-soft)}
    .section-soft{background:var(--paper-2)}
    .section-dark{background:var(--night);color:#f7f4ee}
    .section-dark p{color:#c4ccc6}
    .section-dark h2,.section-dark h3{color:#fffdf9}
    .site-header{
      background:rgba(247,244,238,.95);border-bottom:1px solid var(--line);
      position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)
    }
    .brand-row{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink)!important;font-weight:900;font-size:1.45rem;letter-spacing:-.06em}
    .brand-mark{
      width:40px;height:40px;border-radius:12px;background:var(--coral);
      display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.1rem;
      box-shadow:4px 4px 0 var(--ink)
    }
    .brand-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
    .live-dot{width:9px;height:9px;background:var(--cyan);border-radius:50%;box-shadow:0 0 0 5px rgba(114,199,189,.18)}
    .nav-strip{border-top:1px solid rgba(221,216,206,.7);overflow-x:auto}
    .icon-nav{display:flex;gap:8px;min-width:max-content;padding:9px 0}
    .icon-nav a{
      min-width:104px;padding:9px 13px;border:1px solid transparent;border-radius:12px;
      display:flex;align-items:center;gap:9px;color:var(--ink-soft);font-size:.88rem;font-weight:700
    }
    .icon-nav a:hover{background:var(--white);border-color:var(--line);color:var(--coral-dark)}
    .icon-nav a.active{background:var(--ink);color:#fffdf9;border-color:var(--ink);box-shadow:var(--shadow-sm)}
    .icon-nav a.active .nav-icon{color:var(--lime)}
    .nav-icon{font-size:1.15rem;line-height:1}
    .page-banner{
      padding:70px 0 64px;background:
      linear-gradient(105deg,rgba(32,40,39,.94),rgba(32,40,39,.73)),
      url('/assets/images/backpic/back-2.webp') center/cover;color:#fffdf9
    }
    .page-banner h1{max-width:760px;margin-bottom:16px}
    .page-banner p{max-width:720px;color:#dce4dc;font-size:1.08rem}
    .crumbs{display:flex;flex-wrap:wrap;gap:10px;color:#bdc9c0;font-size:.82rem;margin-bottom:24px}
    .crumbs a{color:var(--lime)}
    .banner-tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:28px}
    .banner-tag{border:1px solid rgba(255,255,255,.28);padding:6px 12px;border-radius:999px;font-size:.82rem;color:#f8fbf5}
    .intro-grid{display:grid;grid-template-columns:4fr 8fr;gap:72px;align-items:center}
    .intro-copy p{color:var(--ink-soft);font-size:1.03rem}
    .image-frame{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:var(--night)}
    .image-frame img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center}
    .caption{font-size:.78rem;color:var(--muted);padding:10px 15px;background:var(--white)}
    .metric-layout{display:grid;grid-template-columns:3fr 9fr;gap:28px;align-items:stretch}
    .metric-lead{background:var(--night);color:#fffdf9;border-radius:var(--radius);padding:30px;display:flex;flex-direction:column;justify-content:space-between}
    .metric-lead h3{font-size:2rem}
    .metric-lead p{color:#c9d3cc}
    .metric-number{font-size:4.2rem;line-height:1;font-weight:900;color:var(--lime);letter-spacing:-.08em}
    .metric-note{font-size:.8rem;color:#aab7ae;margin-top:8px}
    .metric-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
    .metric-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);padding:23px;transition:var(--ease)}
    .metric-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);border-color:var(--cyan)}
    .metric-card h3{font-size:1.08rem}
    .metric-card p{font-size:.87rem;color:var(--muted);margin-bottom:16px}
    .progress{height:9px;background:#e4e7df;border-radius:99px;overflow:hidden}
    .progress span{display:block;height:100%;background:var(--coral);border-radius:99px}
    .progress.cyan span{background:var(--cyan)}
    .progress.lime span{background:#8fac42}
    .value-row{display:flex;align-items:center;justify-content:space-between;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem}
    .value-row strong{font-size:1.2rem;color:var(--ink)}
    .compare-grid{display:grid;grid-template-columns:7fr 5fr;gap:54px;align-items:start}
    .compare-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:30px}
    .compare-row{padding:17px 0;border-bottom:1px solid var(--line)}
    .compare-row:last-child{border-bottom:0}
    .compare-label{display:flex;justify-content:space-between;gap:15px;font-size:.92rem;font-weight:800;margin-bottom:8px}
    .dual-bars{display:grid;gap:7px}
    .dual-bar{height:12px;border-radius:3px;background:#e8e6de;overflow:hidden}
    .dual-bar span{display:block;height:100%;background:var(--coral)}
    .dual-bar.alt span{background:var(--cyan)}
    .legend{display:flex;gap:18px;font-size:.78rem;color:var(--muted);margin-top:18px}
    .legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;background:var(--coral)}
    .legend i.cyan{background:var(--cyan)}
    .reading-note{padding:25px 28px;border-left:4px solid var(--coral);background:#fbf0e9}
    .reading-note p:last-child{margin-bottom:0;color:var(--ink-soft)}
    .timeline{position:relative;padding-left:30px;border-left:2px solid var(--line)}
    .timeline-item{position:relative;padding:0 0 30px 20px}
    .timeline-item:last-child{padding-bottom:0}
    .timeline-item:before{content:"";position:absolute;left:-39px;top:8px;width:15px;height:15px;border:4px solid var(--paper-2);background:var(--coral);border-radius:50%}
    .timeline-date{font-family:ui-monospace,monospace;font-size:.78rem;color:var(--coral-dark);font-weight:800}
    .timeline-item p{color:var(--ink-soft);margin-bottom:0}
    .deep-grid{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:center}
    .deep-grid.reverse{grid-template-columns:7fr 5fr}
    .deep-grid.reverse .deep-copy
    .deep-copy p{color:var(--ink-soft)}
    .deep-copy .tag{margin-bottom:14px}
    .data-index{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:25px}
    .index-item{padding:14px;background:var(--paper-2);border-radius:10px}
    .index-item strong{display:block;font-size:1.35rem}
    .index-item span{font-size:.76rem;color:var(--muted)}
    .matrix{display:grid;grid-template-columns:1.2fr repeat(4,1fr);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--white)}
    .matrix > div{padding:17px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.88rem}
    .matrix > div:nth-child(5n){border-right:0}
    .matrix .head{background:var(--ink);color:#fff;font-weight:800}
    .matrix .team{font-weight:800}
    .matrix .good{color:#597829;background:#f0f5e6;font-weight:800}
    .matrix .steady{color:#28766e;background:#e8f3f0;font-weight:800}
    .matrix .watch{color:var(--coral-dark);background:#fbe8e1;font-weight:800}
    .feedback-strip{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:16px}
    .feedback{padding:25px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm)}
    .feedback.main{background:var(--coral);color:#fff}
    .feedback.main p{color:#fff5f0;font-size:1.05rem}
    .feedback p{font-size:.92rem;color:var(--ink-soft)}
    .feedback cite{font-style:normal;font-weight:800;font-size:.85rem}
    .faq-wrap{max-width:900px;margin:auto}
    .faq-item{border-top:1px solid var(--line)}
    .faq-item:last-child{border-bottom:1px solid var(--line)}
    .faq-item summary{list-style:none;cursor:pointer;padding:21px 42px 21px 0;font-weight:800;position:relative}
    .faq-item summary::-webkit-details-marker{display:none}
    .faq-item summary:after{content:"+";position:absolute;right:5px;top:15px;color:var(--coral);font-size:1.6rem;font-weight:400;transition:var(--ease)}
    .faq-item[open] summary:after{content:"−";transform:rotate(180deg)}
    .faq-answer{padding:0 50px 23px 0;color:var(--ink-soft);font-size:.94rem}
    .cta-band{background:var(--coral);color:#fff;padding:42px 0}
    .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
    .cta-inner h2{margin-bottom:8px;font-size:2rem}
    .cta-inner p{margin-bottom:0;color:#fff3ee}
    .cta-actions{display:flex;gap:10px;flex-wrap:wrap}
    .button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;border-radius:10px;padding:11px 20px;font-weight:800;transition:var(--ease);border:1px solid transparent}
    .button.primary{background:var(--coral);color:#fff}
    .button.primary:hover{background:#f17a61;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(232,102,76,.25)}
    .button.ink{background:var(--ink);color:#fff}
    .button.ink:hover{background:#fff;color:var(--ink);transform:translateY(-2px)}
    .button.light{background:#fff;color:var(--coral-dark)}
    .button.light:hover{background:var(--lime);color:var(--ink)}
    .button.outline{background:transparent;border-color:var(--line-dark);color:var(--ink)}
    .button.outline:hover{background:var(--ink);color:#fff}
    .site-footer{background:var(--night);color:#f7f4ee;padding:62px 0 22px}
    .site-footer .brand{color:#fff!important}
    .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:60px;padding-bottom:42px}
    .footer-text,.footer-note{color:#b7c3bb;font-size:.88rem;max-width:340px}
    .footer-title{font-size:1rem;color:#fff;margin-bottom:15px}
    .footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:7px 20px}
    .footer-links a,.footer-note a{color:#bdcbc2;font-size:.86rem}
    .footer-links a:hover,.footer-note a:hover{color:var(--lime)}
    .footer-bottom{border-top:1px solid #414a46;padding-top:18px;display:flex;justify-content:space-between;gap:20px;color:#9ca9a1;font-size:.77rem}
    .state-reserve{display:none}
    @media(max-width:1024px){
      .intro-grid,.compare-grid,.deep-grid,.deep-grid.reverse{grid-template-columns:1fr;gap:30px}
      .deep-grid.reverse .deep-copy{order:0}
      .metric-layout{grid-template-columns:1fr}
      .metric-lead{min-height:230px}
      .feedback-strip{grid-template-columns:1fr 1fr}
      .feedback.main{grid-column:1/-1}
      .hero-side{position:relative;right:auto;bottom:auto;margin:35px 0 0;width:min(100%,360px)}
    }
    @media(max-width:768px){
      .container{width:min(var(--container),calc(100% - 28px))}
      .brand-row{min-height:66px}
      .brand-meta{font-size:.75rem;text-align:right}
      .section{padding:64px 0}
      .page-banner{padding:53px 0 48px}
      .metric-grid{grid-template-columns:1fr 1fr}
      .matrix{display:block}
      .matrix > div{display:flex;justify-content:space-between;border-right:0}
      .matrix .head{display:none}
      .matrix .team:before{content:"球队";color:var(--muted);font-weight:400;margin-right:20px}
      .feedback-strip{grid-template-columns:1fr}
      .feedback.main{grid-column:auto}
      .cta-inner{align-items:flex-start;flex-direction:column}
      .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
      .footer-grid>div:first-child{grid-column:1/-1}
      .footer-bottom{flex-direction:column;gap:7px}
    }
    @media(max-width:520px){
      h1{font-size:2.35rem}
      h2{font-size:1.9rem}
      .brand-meta{display:none}
      .icon-nav a{min-width:92px;padding:8px 10px;font-size:.82rem}
      .metric-grid,.data-index{grid-template-columns:1fr}
      .metric-lead{padding:24px}
      .compare-panel{padding:21px}
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
      .footer-links{grid-template-columns:1fr 1fr}
      .cta-actions,.cta-actions .button{width:100%}
    }