/* roulang page: index */
:root {
      color-scheme: light;
      --paper: #f5f5f2;
      --surface: #ffffff;
      --ink: #20251f;
      --muted: #68716a;
      --line: #dfe3dc;
      --green: #176b46;
      --green-dark: #104b33;
      --lime: #d9f36c;
      --red: #c74c3d;
      --soft-green: #eaf2e9;
      --soft-yellow: #f4f1df;
      --radius: 6px;
      --shadow: 0 10px 28px rgba(24, 37, 28, .08);
      --container: 1180px;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: var(--paper);
      color: var(--ink);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      font-size: 15px;
      line-height: 1.7;
      -webkit-font-smoothing: antialiased;
    }
    a { color: inherit; text-decoration: none; }
    img { display: block; max-width: 100%; }
    button { font: inherit; }
    a:focus-visible, button:focus-visible { outline: 3px solid #a0c84b; outline-offset: 3px; }
    .container { width: min(var(--container), calc(100% - 48px)); margin-inline: auto; }
    .site-header {
      position: relative;
      z-index: 5;
      background: rgba(255,255,255,.96);
      border-bottom: 1px solid var(--line);
    }
    .nav-wrap { min-height: 74px; display: flex; align-items: center; gap: 38px; }
    .brand { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; font-size: 23px; font-weight: 850; }
    .brand-mark { width: 28px; height: 28px; display: grid; place-items: center; background: var(--green); color: white; border-radius: 4px; font-size: 17px; line-height: 1; }
    .brand-mark::before { content: "A"; font-weight: 900; font-style: italic; }
    .primary-nav { display: flex; align-items: center; gap: 27px; margin-left: auto; }
    .primary-nav a { position: relative; padding: 25px 0; color: #4e5750; font-size: 14px; font-weight: 650; transition: color .18s ease; }
    .primary-nav a:hover, .primary-nav a[aria-current="page"] { color: var(--green); }
    .primary-nav a[aria-current="page"]::after { content: ""; position: absolute; height: 3px; left: 0; right: 0; bottom: 15px; background: var(--lime); }
    .nav-toggle { display: none; margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 4px; background: white; color: var(--ink); cursor: pointer; }
    .nav-toggle span, .nav-toggle::before, .nav-toggle::after { display: block; content: ""; width: 18px; height: 2px; background: currentColor; margin: 4px auto; }
    .hero {
      min-height: 490px;
      position: relative;
      overflow: hidden;
      display: flex;
      align-items: end;
      background: #243b2d url("/assets/images/9cf891739fc45a08.webp") center 43% / cover no-repeat;
      color: white;
    }
    .hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,24,16,.83) 0%, rgba(12,28,18,.58) 48%, rgba(12,28,18,.13) 100%), linear-gradient(0deg, rgba(10,20,14,.48), transparent 65%); }
    .hero-inner { position: relative; width: 100%; padding: 74px 0 63px; }
    .eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--lime); font-size: 12px; font-weight: 800; letter-spacing: 0; text-transform: uppercase; }
    .eyebrow::before { content: ""; width: 24px; height: 2px; background: currentColor; }
    .hero h1 { max-width: 700px; margin: 14px 0 13px; font-size: clamp(38px, 5vw, 62px); line-height: 1.15; font-weight: 850; }
    .hero p { max-width: 600px; margin: 0; color: rgba(255,255,255,.86); font-size: 17px; }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 27px; }
    .button { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 18px; border: 1px solid transparent; border-radius: 4px; font-size: 14px; font-weight: 750; transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease; }
    .button:hover { transform: translateY(-2px); }
    .button-primary { background: var(--lime); color: #1c2a1d; }
    .button-primary:hover { background: #e5ff82; }
    .button-ghost { border-color: rgba(255,255,255,.58); color: white; background: rgba(255,255,255,.08); }
    .button-ghost:hover { background: white; color: var(--ink); }
    main { padding-bottom: 60px; }
    .ticker { background: var(--green-dark); color: white; }
    .ticker-inner { min-height: 58px; display: flex; align-items: center; gap: 22px; overflow: hidden; }
    .ticker-label { flex: 0 0 auto; padding: 4px 8px; background: var(--lime); color: #26321b; font-size: 11px; font-weight: 850; border-radius: 2px; }
    .ticker-text { color: rgba(255,255,255,.88); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ticker-text strong { color: white; margin-right: 9px; }
    .section { padding: 62px 0; border-bottom: 1px solid var(--line); }
    .section-alt { background: #eeefea; }
    .section-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 25px; }
    .section-kicker { margin: 0 0 5px; color: var(--green); font-size: 11px; font-weight: 850; text-transform: uppercase; }
    .section-heading h2 { margin: 0; font-size: 28px; line-height: 1.25; letter-spacing: 0; }
    .section-heading p { max-width: 520px; margin: 0; color: var(--muted); font-size: 14px; }
    .text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--green); font-size: 13px; font-weight: 800; white-space: nowrap; }
    .text-link::after { content: "→"; transition: transform .18s ease; }
    .text-link:hover::after { transform: translateX(4px); }
    .score-layout { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(250px, .75fr); gap: 22px; }
    .score-panel, .note-panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
    .score-panel { overflow: hidden; }
    .panel-top { display: flex; align-items: center; justify-content: space-between; padding: 17px 20px; border-bottom: 1px solid var(--line); }
    .panel-top h3 { margin: 0; font-size: 16px; }
    .status-note { color: var(--muted); font-size: 11px; }
    .match-row { display: grid; grid-template-columns: 90px 1fr 100px; align-items: center; gap: 14px; padding: 17px 20px; border-bottom: 1px solid #edf0eb; }
    .match-row:last-child { border-bottom: 0; }
    .match-time { color: var(--muted); font-size: 12px; }
    .match-team { font-size: 14px; font-weight: 700; }
    .match-league { display: block; color: var(--muted); font-size: 11px; font-weight: 500; }
    .match-score { color: var(--green-dark); text-align: right; font-size: 14px; font-weight: 800; }
    .match-score small { display: block; color: var(--muted); font-size: 10px; font-weight: 550; }
    .note-panel { padding: 23px; background: var(--soft-green); }
    .note-panel .number { display: block; color: var(--green); font-size: 36px; line-height: 1.1; font-weight: 850; }
    .note-panel h3 { margin: 10px 0 8px; font-size: 18px; }
    .note-panel p { margin: 0; color: #4e5a50; font-size: 13px; }
    .pill { display: inline-flex; padding: 4px 8px; border-radius: 2px; background: #edf3e6; color: var(--green-dark); font-size: 10px; font-weight: 800; }
    .feature-grid { display: grid; grid-template-columns: 1.45fr 1fr 1fr; gap: 18px; }
    .feature-card { min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: box-shadow .2s ease, transform .2s ease; }
    .feature-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
    .feature-card img { width: 100%; height: 185px; object-fit: cover; background: #d9dfd7; }
    .feature-card:first-child img { height: 245px; }
    .feature-body { padding: 17px 18px 20px; }
    .feature-meta { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; }
    .feature-body h3 { margin: 9px 0 7px; font-size: 18px; line-height: 1.45; }
    .feature-body p { margin: 0; color: var(--muted); font-size: 13px; }
    .feature-card:first-child .feature-body h3 { font-size: 21px; }
    .timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); overflow: hidden; }
    .timeline-item { position: relative; min-height: 164px; padding: 22px 20px; border-right: 1px solid var(--line); }
    .timeline-item:last-child { border-right: 0; }
    .timeline-date { color: var(--red); font-size: 12px; font-weight: 850; }
    .timeline-item h3 { margin: 12px 0 6px; font-size: 16px; line-height: 1.4; }
    .timeline-item p { margin: 0; color: var(--muted); font-size: 12px; }
    .split-feature { display: grid; grid-template-columns: 1fr 1fr; min-height: 320px; background: #21382a; color: white; border-radius: var(--radius); overflow: hidden; }
    .split-image { min-height: 320px; background: url("/assets/images/07a32e46eb0a2829.webp") center / cover no-repeat; }
    .split-copy { display: flex; flex-direction: column; justify-content: center; padding: 38px 44px; }
    .split-copy .section-kicker { color: var(--lime); }
    .split-copy h2 { max-width: 430px; margin: 9px 0 12px; font-size: 29px; line-height: 1.3; }
    .split-copy p { max-width: 460px; margin: 0; color: rgba(255,255,255,.77); font-size: 14px; }
    .split-copy .text-link { margin-top: 20px; color: var(--lime); }
    .league-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
    .league-item { display: flex; min-height: 92px; align-items: center; gap: 15px; padding: 17px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); transition: border-color .18s ease, background .18s ease; }
    .league-item:hover { border-color: #88aa77; background: #fbfdf9; }
    .league-icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; background: var(--soft-green); color: var(--green); border-radius: 50%; font-size: 13px; font-weight: 850; }
    .league-item strong { display: block; font-size: 14px; }
    .league-item small { display: block; color: var(--muted); font-size: 11px; }
    .news-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: 28px; }
    .news-list { border-top: 1px solid var(--line); }
    .news-item { display: grid; grid-template-columns: 104px 1fr auto; gap: 16px; align-items: center; padding: 17px 0; border-bottom: 1px solid var(--line); }
    .news-tag { width: fit-content; padding: 3px 7px; background: var(--soft-yellow); color: #766128; font-size: 10px; font-weight: 800; }
    .news-item h3 { margin: 0; font-size: 15px; line-height: 1.45; }
    .news-item time { color: var(--muted); font-size: 11px; white-space: nowrap; }
    .quote-block { align-self: stretch; display: flex; flex-direction: column; justify-content: center; padding: 27px; background: var(--green); color: white; border-radius: var(--radius); }
    .quote-block blockquote { margin: 0; font-size: 19px; font-weight: 750; line-height: 1.55; }
    .quote-block p { margin: 15px 0 0; color: rgba(255,255,255,.75); font-size: 12px; }
    .player-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .player-card { display: grid; grid-template-columns: 90px 1fr; min-height: 130px; overflow: hidden; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
    .player-image { background-size: cover; background-position: center; }
    .player-card:nth-child(1) .player-image { background-image: url("/assets/images/f02435ed83091415.webp"); }
    .player-card:nth-child(2) .player-image { background-image: url("/assets/images/b45da7fc2a0dd49c.webp"); }
    .player-card:nth-child(3) .player-image { background-image: url("/assets/images/dec83d630c57a431.webp"); }
    .player-info { padding: 16px 14px; }
    .player-info strong { display: block; font-size: 14px; }
    .player-info p { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
    .tactics-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; align-items: start; }
    .tactics-copy h3 { margin: 0 0 10px; font-size: 21px; }
    .tactics-copy p { margin: 0; color: var(--muted); }
    .stat-list { border-top: 1px solid var(--line); }
    .stat-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }
    .stat-row span { font-size: 13px; }
    .stat-row strong { color: var(--green); font-size: 13px; }
    .stat-row small { grid-column: 1 / -1; margin-top: -9px; color: var(--muted); font-size: 10px; }
    .topic-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 16px; }
    .topic { min-height: 190px; display: flex; flex-direction: column; justify-content: end; padding: 22px; color: white; background-size: cover; background-position: center; border-radius: var(--radius); overflow: hidden; position: relative; }
    .topic::before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,18,11,.86), rgba(8,18,11,.04) 80%); }
    .topic > * { position: relative; }
    .topic span { color: var(--lime); font-size: 11px; font-weight: 800; }
    .topic h3 { margin: 6px 0 0; font-size: 19px; }
    .topic:nth-child(1) { background-image: url("/assets/images/d1a0bac35926db8e.webp"); }
    .topic:nth-child(2) { background-image: url("/assets/images/50428be9266520c5.webp"); }
    .topic:nth-child(3) { background-image: url("/assets/images/bf2e11538a570d19.webp"); }
    .guide-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
    .guide-item { min-height: 160px; padding: 23px; background: white; }
    .guide-item .guide-no { color: var(--red); font-size: 11px; font-weight: 850; }
    .guide-item h3 { margin: 8px 0 6px; font-size: 16px; }
    .guide-item p { margin: 0; color: var(--muted); font-size: 12px; }
    .people-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }
    .person-row { display: flex; align-items: center; gap: 14px; padding: 15px 0; border-bottom: 1px solid var(--line); }
    .person-number { color: #9ba59a; font-size: 12px; font-weight: 850; }
    .person-row strong { display: block; font-size: 14px; }
    .person-row small { display: block; color: var(--muted); font-size: 11px; }
    .channels { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
    .channel-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 15px 13px; border: 1px solid var(--line); border-radius: 4px; background: white; font-size: 12px; font-weight: 750; transition: background .18s ease, border-color .18s ease; }
    .channel-link::after { content: "↗"; color: var(--green); }
    .channel-link:hover { background: var(--soft-green); border-color: #a9bea6; }
    .site-footer { background: #1e2a22; color: white; }
    .footer-main { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 50px; padding: 43px 0 35px; }
    .footer-brand p { max-width: 350px; margin: 12px 0 0; color: #b8c1b9; font-size: 12px; }
    .footer-title { margin: 0 0 12px; font-size: 12px; color: #dce4dc; }
    .footer-links { display: flex; flex-wrap: wrap; gap: 10px 18px; }
    .footer-links a { color: #b8c1b9; font-size: 12px; }
    .footer-links a:hover { color: var(--lime); }
    .footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding: 15px 0; border-top: 1px solid rgba(255,255,255,.15); color: #9eaaa0; font-size: 11px; }
    @media (max-width: 1024px) {
      .primary-nav { gap: 17px; }
      .feature-grid { grid-template-columns: 1.2fr 1fr; }
      .feature-card:first-child { grid-row: span 2; }
      .feature-card:first-child img { height: 245px; }
      .league-grid { grid-template-columns: repeat(2, 1fr); }
      .channels { grid-template-columns: repeat(3, 1fr); }
      .player-grid { grid-template-columns: 1fr; }
    }
    @media (max-width: 768px) {
      .container { width: min(100% - 36px, var(--container)); }
      .nav-wrap { min-height: 66px; gap: 12px; }
      .nav-toggle { display: block; }
      .primary-nav { display: none; position: absolute; left: 0; right: 0; top: 65px; padding: 8px 18px 15px; flex-direction: column; align-items: stretch; gap: 0; background: white; border-bottom: 1px solid var(--line); box-shadow: var(--shadow); }
      .primary-nav.is-open { display: flex; }
      .primary-nav a { padding: 12px 5px; border-bottom: 1px solid #eef0ec; }
      .primary-nav a:last-child { border-bottom: 0; }
      .primary-nav a[aria-current="page"]::after { left: auto; right: 4px; top: 19px; bottom: auto; width: 7px; height: 7px; border-radius: 50%; }
      .hero { min-height: 435px; background-position: 58% center; }
      .hero-inner { padding: 58px 0 45px; }
      .hero p { font-size: 15px; }
      .section { padding: 48px 0; }
      .section-heading { align-items: start; flex-direction: column; gap: 9px; }
      .score-layout, .news-layout, .tactics-layout { grid-template-columns: 1fr; }
      .feature-grid { grid-template-columns: 1fr 1fr; }
      .feature-card:first-child { grid-column: 1 / -1; grid-row: auto; }
      .feature-card:first-child img { height: 250px; }
      .timeline { grid-template-columns: 1fr 1fr; }
      .timeline-item:nth-child(2) { border-right: 0; }
      .timeline-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
      .split-feature { grid-template-columns: 1fr; }
      .split-image { min-height: 250px; }
      .split-copy { padding: 30px; }
      .player-grid { grid-template-columns: repeat(3, 1fr); }
      .player-card { grid-template-columns: 1fr; }
      .player-image { min-height: 115px; }
      .guide-grid { grid-template-columns: 1fr 1fr; }
      .footer-main { grid-template-columns: 1fr 1fr; gap: 30px; }
      .footer-brand { grid-column: 1 / -1; }
    }
    @media (max-width: 520px) {
      body { font-size: 14px; }
      .container { width: calc(100% - 32px); }
      .brand { font-size: 21px; }
      .hero { min-height: 420px; }
      .hero h1 { font-size: 39px; }
      .hero-actions { gap: 9px; }
      .button { min-height: 44px; padding: 0 13px; font-size: 12px; }
      .ticker-inner { min-height: 52px; gap: 10px; }
      .ticker-text { font-size: 11px; }
      .section { padding: 40px 0; }
      .section-heading h2 { font-size: 24px; }
      .match-row { grid-template-columns: 58px 1fr 74px; gap: 8px; padding: 14px 12px; }
      .match-time { font-size: 10px; }
      .match-team { font-size: 12px; }
      .feature-grid { grid-template-columns: 1fr; }
      .feature-card:first-child { grid-column: auto; }
      .feature-card img, .feature-card:first-child img { height: 205px; }
      .timeline { grid-template-columns: 1fr; }
      .timeline-item { min-height: auto; padding: 17px; border-right: 0; border-bottom: 1px solid var(--line); }
      .timeline-item:nth-child(2) { border-bottom: 1px solid var(--line); }
      .timeline-item:last-child { border-bottom: 0; }
      .league-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
      .league-item { min-height: 78px; gap: 9px; padding: 11px; }
      .league-icon { width: 32px; height: 32px; font-size: 11px; }
      .league-item strong { font-size: 12px; }
      .league-item small { font-size: 10px; }
      .news-item { grid-template-columns: 1fr auto; gap: 7px 12px; }
      .news-tag { grid-column: 1 / -1; }
      .news-item h3 { font-size: 13px; }
      .player-grid { grid-template-columns: 1fr; }
      .player-card { grid-template-columns: 90px 1fr; min-height: 110px; }
      .player-image { min-height: 110px; }
      .topic-grid { grid-template-columns: 1fr; }
      .topic { min-height: 165px; }
      .guide-grid { grid-template-columns: 1fr; }
      .guide-item { min-height: 130px; padding: 18px; }
      .people-list { grid-template-columns: 1fr; }
      .channels { grid-template-columns: 1fr 1fr; }
      .footer-main { grid-template-columns: 1fr; gap: 24px; }
      .footer-brand { grid-column: auto; }
      .footer-bottom { flex-direction: column; gap: 4px; }
    }

/* roulang page: category2 */
:root {
 color-scheme: light;
 --paper: #f5f5f2;
 --surface: #ffffff;
 --ink: #20251f;
 --muted: #68716a;
 --line: #dfe3dc;
 --green: #176b46;
 --green-dark: #104b33;
 --lime: #d9f36c;
 --red: #c74c3d;
 --soft-green: #eaf2e9;
 --soft-yellow: #f4f1df;
 --radius: 6px;
 --shadow: 0 10px 28px rgba(24, 37, 28, .08);
 --container: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
 margin: 0;
 background: var(--paper);
 color: var(--ink);
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
 font-size: 15px;
 line-height: 1.7;
 -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, select { font: inherit; }
button { color: inherit; }
a:focus-visible, button:focus-visible, select:focus-visible {
 outline: 3px solid #a0c84b;
 outline-offset: 3px;
}
.container { width: min(var(--container), calc(100% - 48px)); margin-inline: auto; }
.site-header {
 position: relative;
 z-index: 20;
 background: rgba(255,255,255,.96);
 border-bottom: 1px solid var(--line);
}
.nav-wrap { min-height: 74px; display: flex; align-items: center; gap: 38px; }
.brand {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 flex: 0 0 auto;
 font-size: 23px;
 font-weight: 850;
}
.brand-mark {
 width: 28px;
 height: 28px;
 display: grid;
 place-items: center;
 background: var(--green);
 color: white;
 border-radius: 4px;
 font-size: 17px;
 line-height: 1;
}
.brand-mark::before { content: "A"; font-weight: 900; font-style: italic; }
.primary-nav { display: flex; align-items: center; gap: 27px; margin-left: auto; }
.primary-nav a {
 position: relative;
 padding: 25px 0;
 color: #4e5750;
 font-size: 14px;
 font-weight: 650;
 transition: color .18s ease;
}
.primary-nav a:hover, .primary-nav a[aria-current="page"] { color: var(--green); }
.primary-nav a[aria-current="page"]::after {
 content: "";
 position: absolute;
 height: 3px;
 left: 0;
 right: 0;
 bottom: 15px;
 background: var(--lime);
}
.nav-toggle {
 display: none;
 margin-left: auto;
 width: 42px;
 height: 42px;
 border: 1px solid var(--line);
 border-radius: 4px;
 background: white;
 cursor: pointer;
}
.nav-toggle span, .nav-toggle::before, .nav-toggle::after {
 display: block;
 content: "";
 width: 18px;
 height: 2px;
 background: currentColor;
 margin: 4px auto;
}
main { padding-bottom: 60px; }
.page-head {
 padding: 24px 0 48px;
 background: var(--green-dark);
 color: white;
}
.breadcrumb {
 display: flex;
 align-items: center;
 gap: 9px;
 margin: 0 0 30px;
 color: rgba(255,255,255,.68);
 font-size: 13px;
}
.breadcrumb a:hover { color: var(--lime); }
.breadcrumb span::before { content: "/"; margin-right: 9px; color: rgba(255,255,255,.35); }
.page-head-grid {
 display: grid;
 grid-template-columns: minmax(0, 1.25fr) minmax(310px, .75fr);
 align-items: end;
 gap: 64px;
}
.page-kicker {
 display: inline-flex;
 align-items: center;
 gap: 9px;
 margin-bottom: 10px;
 color: var(--lime);
 font-size: 12px;
 font-weight: 800;
}
.page-kicker::before { content: ""; width: 24px; height: 2px; background: currentColor; }
.page-head h1 {
 margin: 0 0 14px;
 font-size: clamp(38px, 5vw, 58px);
 line-height: 1.12;
 font-weight: 850;
}
.page-head p { max-width: 690px; margin: 0; color: rgba(255,255,255,.79); font-size: 16px; }
.head-note {
 padding: 20px;
 border-left: 3px solid var(--lime);
 background: rgba(255,255,255,.07);
}
.head-note strong { display: block; margin-bottom: 5px; font-size: 14px; }
.head-note span { color: rgba(255,255,255,.68); font-size: 12px; }
.section { padding: 58px 0; border-bottom: 1px solid var(--line); }
.section-alt { background: #eeefea; }
.section-heading {
 display: flex;
 justify-content: space-between;
 align-items: end;
 gap: 24px;
 margin-bottom: 25px;
}
.section-kicker { margin: 0 0 5px; color: var(--green); font-size: 11px; font-weight: 850; }
.section-heading h2 { margin: 0; font-size: 28px; line-height: 1.25; }
.section-heading p { max-width: 520px; margin: 0; color: var(--muted); font-size: 14px; }
.filter-bar {
 display: flex;
 align-items: center;
 gap: 12px;
 padding: 14px;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
}
.filter-group { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-button {
 min-height: 38px;
 padding: 0 15px;
 border: 1px solid var(--line);
 border-radius: 4px;
 background: white;
 font-size: 13px;
 font-weight: 700;
 cursor: pointer;
 transition: .18s ease;
}
.filter-button:hover { border-color: var(--green); color: var(--green); }
.filter-button.active { border-color: var(--green); background: var(--green); color: white; }
.filter-select {
 min-height: 38px;
 margin-left: auto;
 padding: 0 34px 0 12px;
 border: 1px solid var(--line);
 border-radius: 4px;
 background: white;
 color: var(--ink);
}
.schedule-shell {
 overflow: hidden;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
}
.date-divider {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 12px 20px;
 background: var(--soft-green);
 border-bottom: 1px solid var(--line);
}
.date-divider strong { font-size: 14px; }
.date-divider span { color: var(--muted); font-size: 12px; }
.match-row {
 display: grid;
 grid-template-columns: 120px minmax(110px,.7fr) minmax(280px,1.7fr) 90px;
 align-items: center;
 gap: 18px;
 padding: 18px 20px;
 border-bottom: 1px solid #edf0eb;
 transition: background .18s ease;
}
.match-row:last-child { border-bottom: 0; }
.match-row:hover { background: #fafbf8; }
.match-time strong { display: block; font-size: 16px; }
.match-time span, .league-name { color: var(--muted); font-size: 12px; }
.teams { display: grid; grid-template-columns: 1fr 42px 1fr; align-items: center; gap: 10px; font-weight: 750; }
.teams span:first-child { text-align: right; }
.teams span:last-child { text-align: left; }
.score {
 display: grid;
 place-items: center;
 min-height: 34px;
 background: #252c27;
 color: white;
 border-radius: 3px;
 font-size: 14px;
}
.status { justify-self: end; color: var(--green); font-size: 12px; font-weight: 800; }
.status.finished { color: var(--muted); }
.status.changed { color: var(--red); }
.content-layout { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(250px, .75fr); gap: 28px; }
.lead-story {
 display: grid;
 grid-template-columns: 1.05fr .95fr;
 min-height: 320px;
 overflow: hidden;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
}
.lead-story img { width: 100%; height: 100%; min-height: 320px; object-fit: cover; }
.story-copy { display: flex; flex-direction: column; justify-content: center; padding: 30px; }
.badge {
 display: inline-flex;
 align-self: flex-start;
 padding: 4px 8px;
 border-radius: 2px;
 background: var(--soft-green);
 color: var(--green-dark);
 font-size: 10px;
 font-weight: 800;
}
.story-copy h3 { margin: 14px 0 10px; font-size: 24px; line-height: 1.35; }
.story-copy p { margin: 0; color: var(--muted); font-size: 14px; }
.meta { margin-top: 18px; color: var(--muted); font-size: 12px; }
.side-list { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.side-list h3 { margin: 0; padding: 17px 18px; border-bottom: 1px solid var(--line); font-size: 16px; }
.side-item { padding: 17px 18px; border-bottom: 1px solid var(--line); }
.side-item:last-child { border-bottom: 0; }
.side-item span { color: var(--green); font-size: 11px; font-weight: 800; }
.side-item h4 { margin: 5px 0 0; font-size: 14px; line-height: 1.5; }
.side-item a:hover h4 { color: var(--green); }
.result-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.result-card {
 padding: 20px;
 background: var(--surface);
 border: 1px solid var(--line);
 border-top: 3px solid var(--green);
 border-radius: var(--radius);
 transition: transform .18s ease, box-shadow .18s ease;
}
.result-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.result-card header { display: flex; justify-content: space-between; color: var(--muted); font-size: 11px; }
.result-teams { margin: 18px 0; }
.result-team { display: flex; justify-content: space-between; align-items: center; padding: 5px 0; font-weight: 750; }
.result-team strong { font-size: 20px; }
.result-card p { margin: 0; padding-top: 13px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.timeline { position: relative; display: grid; grid-template-columns: repeat(4,1fr); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.timeline-item { position: relative; min-height: 185px; padding: 24px 20px; border-right: 1px solid var(--line); }
.timeline-item:last-child { border-right: 0; }
.timeline-item time { color: var(--green); font-size: 12px; font-weight: 850; }
.timeline-item h3 { margin: 13px 0 7px; font-size: 16px; line-height: 1.45; }
.timeline-item p { margin: 0; color: var(--muted); font-size: 12px; }
.feature-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.feature-card {
 overflow: hidden;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
 transition: transform .18s ease, box-shadow .18s ease;
}
.feature-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.feature-card img { width: 100%; height: 180px; object-fit: cover; background: #d9dfd7; }
.feature-body { padding: 18px; }
.feature-body h3 { margin: 9px 0 7px; font-size: 17px; line-height: 1.45; }
.feature-body p { margin: 0; color: var(--muted); font-size: 13px; }
.text-link {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 color: var(--green);
 font-size: 13px;
 font-weight: 800;
 white-space: nowrap;
}
.text-link::after { content: "→"; transition: transform .18s ease; }
.text-link:hover::after { transform: translateX(4px); }
.guide-band {
 display: grid;
 grid-template-columns: .8fr 1.2fr;
 overflow: hidden;
 background: var(--green-dark);
 color: white;
 border-radius: var(--radius);
}
.guide-band img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; }
.guide-copy { align-self: center; padding: 38px; }
.guide-copy h2 { margin: 8px 0 13px; font-size: 29px; }
.guide-copy p { margin: 0; color: rgba(255,255,255,.75); }
.guide-points { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 22px; }
.guide-point { padding: 12px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.05); }
.guide-point strong { display: block; color: var(--lime); font-size: 13px; }
.guide-point span { color: rgba(255,255,255,.67); font-size: 11px; }
.notice {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 24px;
 padding: 24px 28px;
 background: var(--soft-yellow);
 border-left: 4px solid #c1ad3c;
}
.notice h2 { margin: 0 0 4px; font-size: 19px; }
.notice p { margin: 0; color: var(--muted); font-size: 13px; }
.notice-tag { flex: 0 0 auto; color: #776914; font-size: 12px; font-weight: 800; }
.site-footer { padding-top: 52px; background: #17221b; color: white; }
.footer-main { display: grid; grid-template-columns: 1.7fr 1fr 1fr; gap: 60px; padding-bottom: 44px; }
.footer-brand p { max-width: 430px; margin: 16px 0 0; color: rgba(255,255,255,.62); font-size: 13px; }
.footer-title { margin: 3px 0 15px; color: rgba(255,255,255,.9); font-size: 13px; }
.footer-links { display: grid; gap: 9px; }
.footer-links a { color: rgba(255,255,255,.61); font-size: 13px; transition: color .18s ease; }
.footer-links a:hover { color: var(--lime); }
.footer-bottom {
 display: flex;
 justify-content: space-between;
 gap: 20px;
 padding-top: 18px;
 padding-bottom: 18px;
 border-top: 1px solid rgba(255,255,255,.1);
 color: rgba(255,255,255,.45);
 font-size: 11px;
}
@media (max-width: 1024px) {
 .primary-nav { gap: 18px; }
 .primary-nav a { font-size: 13px; }
 .page-head-grid { gap: 30px; }
 .content-layout { grid-template-columns: 1fr; }
 .side-list { display: grid; grid-template-columns: repeat(3,1fr); }
 .side-list h3 { grid-column: 1/-1; }
 .side-item { border-right: 1px solid var(--line); border-bottom: 0; }
 .result-grid, .feature-list { grid-template-columns: repeat(2,1fr); }
 .timeline { grid-template-columns: repeat(2,1fr); }
 .timeline-item:nth-child(2) { border-right: 0; }
 .timeline-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}
@media (max-width: 768px) {
 .container { width: min(100% - 30px, var(--container)); }
 .nav-wrap { min-height: 66px; }
 .nav-toggle { display: block; }
 .primary-nav {
 display: none;
 position: absolute;
 top: 66px;
 left: 0;
 right: 0;
 padding: 10px 15px 16px;
 background: white;
 border-bottom: 1px solid var(--line);
 box-shadow: var(--shadow);
 }
 .primary-nav.open { display: grid; }
 .primary-nav a { padding: 11px 15px; border-radius: 4px; }
 .primary-nav a:hover, .primary-nav a[aria-current="page"] { background: var(--soft-green); }
 .primary-nav a[aria-current="page"]::after { display: none; }
 .page-head { padding-bottom: 38px; }
 .page-head-grid { grid-template-columns: 1fr; gap: 25px; }
 .page-head h1 { font-size: 40px; }
 .section { padding: 45px 0; }
 .section-heading { display: block; }
 .section-heading p, .section-heading .text-link { margin-top: 9px; }
 .filter-bar { align-items: stretch; flex-direction: column; }
 .filter-select { width: 100%; margin-left: 0; }
 .match-row {
 grid-template-columns: 76px 1fr auto;
 gap: 10px;
 padding: 16px;
 }
 .league-name { grid-column: 2; grid-row: 2; }
 .teams { grid-column: 2/4; grid-row: 1; }
 .status { grid-column: 3; grid-row: 2; }
 .lead-story { grid-template-columns: 1fr; }
 .lead-story img { min-height: 230px; height: 230px; }
 .side-list { grid-template-columns: 1fr; }
 .side-item { border-right: 0; border-bottom: 1px solid var(--line); }
 .result-grid, .feature-list { grid-template-columns: 1fr 1fr; }
 .guide-band { grid-template-columns: 1fr; }
 .guide-band img { min-height: 220px; height: 220px; }
 .footer-main { grid-template-columns: 1.5fr 1fr 1fr; gap: 25px; }
}
@media (max-width: 520px) {
 .container { width: min(100% - 24px, var(--container)); }
 .brand { font-size: 21px; }
 .breadcrumb { margin-bottom: 22px; }
 .page-head h1 { font-size: 35px; }
 .page-head p { font-size: 14px; }
 .head-note { padding: 16px; }
 .section-heading h2 { font-size: 24px; }
 .filter-group { display: grid; grid-template-columns: repeat(2,1fr); }
 .match-row { grid-template-columns: 62px 1fr; }
 .teams { grid-column: 2; grid-template-columns: 1fr 34px 1fr; font-size: 12px; }
 .league-name { grid-column: 2; }
 .status { grid-column: 1; grid-row: 2; justify-self: start; }
 .date-divider { padding: 11px 14px; }
 .story-copy { padding: 22px; }
 .story-copy h3 { font-size: 21px; }
 .result-grid, .feature-list, .timeline { grid-template-columns: 1fr; }
 .timeline-item, .timeline-item:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); }
 .timeline-item:last-child { border-bottom: 0; }
 .feature-card img { height: 205px; }
 .guide-copy { padding: 26px 22px; }
 .guide-copy h2 { font-size: 24px; }
 .guide-points { grid-template-columns: 1fr; }
 .notice { display: block; padding: 21px; }
 .notice-tag { display: block; margin-top: 12px; }
 .footer-main { grid-template-columns: 1fr 1fr; }
 .footer-brand { grid-column: 1/-1; }
 .footer-bottom { flex-direction: column; gap: 4px; }
}

/* roulang page: category1 */
:root {
      color-scheme: light;
      --paper: #f5f5f2;
      --surface: #ffffff;
      --ink: #20251f;
      --muted: #68716a;
      --line: #dfe3dc;
      --green: #176b46;
      --green-dark: #104b33;
      --lime: #d9f36c;
      --red: #c74c3d;
      --soft-green: #eaf2e9;
      --soft-yellow: #f4f1df;
      --radius: 6px;
      --shadow: 0 10px 28px rgba(24, 37, 28, .08);
      --container: 1180px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: var(--paper);
      color: var(--ink);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      font-size: 15px;
      line-height: 1.7;
      -webkit-font-smoothing: antialiased;
    }
    a { color: inherit; text-decoration: none; }
    img { display: block; max-width: 100%; }
    button, input, select { font: inherit; }
    button { cursor: pointer; }
    a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
      outline: 3px solid #a0c84b;
      outline-offset: 3px;
    }
    .container {
      width: min(var(--container), calc(100% - 48px));
      margin-inline: auto;
    }

    .site-header {
      position: relative;
      z-index: 5;
      background: rgba(255,255,255,.97);
      border-bottom: 1px solid var(--line);
    }
    .nav-wrap {
      min-height: 74px;
      display: flex;
      align-items: center;
      gap: 38px;
    }
    .brand {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      flex: 0 0 auto;
      font-size: 23px;
      font-weight: 850;
    }
    .brand-mark {
      width: 28px;
      height: 28px;
      display: grid;
      place-items: center;
      background: var(--green);
      color: white;
      border-radius: 4px;
      font-size: 17px;
      line-height: 1;
    }
    .brand-mark::before {
      content: "A";
      font-weight: 900;
      font-style: italic;
    }
    .primary-nav {
      display: flex;
      align-items: center;
      gap: 27px;
      margin-left: auto;
    }
    .primary-nav a {
      position: relative;
      padding: 25px 0;
      color: #4e5750;
      font-size: 14px;
      font-weight: 650;
      transition: color .18s ease;
    }
    .primary-nav a:hover,
    .primary-nav a[aria-current="page"] { color: var(--green); }
    .primary-nav a[aria-current="page"]::after {
      content: "";
      position: absolute;
      height: 3px;
      left: 0;
      right: 0;
      bottom: 15px;
      background: var(--lime);
    }
    .nav-toggle {
      display: none;
      margin-left: auto;
      width: 42px;
      height: 42px;
      border: 1px solid var(--line);
      border-radius: 4px;
      background: white;
      color: var(--ink);
    }
    .nav-toggle span,
    .nav-toggle::before,
    .nav-toggle::after {
      display: block;
      content: "";
      width: 18px;
      height: 2px;
      background: currentColor;
      margin: 4px auto;
    }

    .page-hero {
      position: relative;
      overflow: hidden;
      min-height: 360px;
      display: flex;
      align-items: end;
      color: #fff;
      background:
        linear-gradient(90deg, rgba(10,24,16,.84), rgba(12,28,18,.44)),
        url("/assets/images/07a32e46eb0a2829.webp") center / cover no-repeat;
    }
    .page-hero-inner {
      position: relative;
      width: 100%;
      padding: 72px 0 56px;
    }
    .breadcrumb {
      display: flex;
      align-items: center;
      gap: 9px;
      margin: 0 0 20px;
      color: rgba(255,255,255,.72);
      font-size: 12px;
    }
    .breadcrumb a:hover { color: var(--lime); }
    .breadcrumb span { color: rgba(255,255,255,.42); }
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      color: var(--lime);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }
    .eyebrow::before {
      content: "";
      width: 24px;
      height: 2px;
      background: currentColor;
    }
    .page-hero h1 {
      max-width: 760px;
      margin: 13px 0 12px;
      font-size: clamp(38px, 5vw, 60px);
      line-height: 1.15;
      font-weight: 850;
    }
    .page-hero p {
      max-width: 690px;
      margin: 0;
      color: rgba(255,255,255,.86);
      font-size: 17px;
    }

    main { padding-bottom: 60px; }
    .section {
      padding: 58px 0;
      border-bottom: 1px solid var(--line);
    }
    .section-alt { background: #eeefea; }
    .section-heading {
      display: flex;
      justify-content: space-between;
      align-items: end;
      gap: 24px;
      margin-bottom: 25px;
    }
    .section-kicker {
      margin: 0 0 5px;
      color: var(--green);
      font-size: 11px;
      font-weight: 850;
      letter-spacing: .04em;
      text-transform: uppercase;
    }
    .section-heading h2 {
      margin: 0;
      font-size: 28px;
      line-height: 1.25;
    }
    .section-heading p {
      max-width: 560px;
      margin: 0;
      color: var(--muted);
      font-size: 14px;
    }
    .text-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--green);
      font-size: 13px;
      font-weight: 800;
      white-space: nowrap;
    }
    .text-link::after {
      content: "→";
      transition: transform .18s ease;
    }
    .text-link:hover::after { transform: translateX(4px); }

    .filter-bar {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 10px;
      padding: 16px 18px;
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius);
    }
    .filter-label {
      margin-right: 5px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 700;
    }
    .filter-select {
      min-width: 128px;
      padding: 9px 30px 9px 11px;
      color: var(--ink);
      background: #fafbf8;
      border: 1px solid var(--line);
      border-radius: 4px;
    }
    .filter-chip {
      padding: 8px 13px;
      color: var(--green-dark);
      background: var(--soft-green);
      border: 1px solid transparent;
      border-radius: 4px;
      font-size: 13px;
      font-weight: 700;
    }
    .filter-chip:hover,
    .filter-chip.active {
      color: #1c2a1d;
      background: var(--lime);
    }

    .lead-grid {
      display: grid;
      grid-template-columns: 1.35fr .65fr;
      gap: 18px;
    }
    .lead-card, .side-story, .article-card, .timeline, .notice-panel {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius);
    }
    .lead-card {
      overflow: hidden;
      display: grid;
      grid-template-columns: 1.08fr .92fr;
    }
    .lead-card img {
      width: 100%;
      height: 100%;
      min-height: 315px;
      object-fit: cover;
    }
    .lead-content { padding: 28px; }
    .pill {
      display: inline-flex;
      padding: 4px 8px;
      border-radius: 2px;
      background: #edf3e6;
      color: var(--green-dark);
      font-size: 10px;
      font-weight: 800;
    }
    .lead-content h3 {
      margin: 15px 0 10px;
      font-size: 25px;
      line-height: 1.35;
    }
    .lead-content p {
      margin: 0;
      color: var(--muted);
      font-size: 14px;
    }
    .meta {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 20px;
      color: var(--muted);
      font-size: 12px;
    }
    .side-stack {
      display: grid;
      gap: 18px;
    }
    .side-story {
      display: grid;
      grid-template-columns: 132px 1fr;
      min-height: 148px;
      overflow: hidden;
    }
    .side-story img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .side-story-body { padding: 17px; }
    .side-story h3 {
      margin: 9px 0 6px;
      font-size: 17px;
      line-height: 1.4;
    }
    .side-story p {
      margin: 0;
      color: var(--muted);
      font-size: 12px;
    }

    .timeline {
      padding: 5px 22px;
    }
    .timeline-row {
      display: grid;
      grid-template-columns: 116px 108px 1fr 92px;
      align-items: center;
      gap: 17px;
      padding: 18px 0;
      border-bottom: 1px solid #edf0eb;
    }
    .timeline-row:last-child { border-bottom: 0; }
    .timeline-date {
      color: var(--green);
      font-size: 12px;
      font-weight: 800;
    }
    .timeline-type {
      color: var(--muted);
      font-size: 12px;
    }
    .timeline-row h3 {
      margin: 0;
      font-size: 15px;
      line-height: 1.4;
    }
    .status {
      justify-self: end;
      padding: 5px 8px;
      border-radius: 2px;
      color: var(--green-dark);
      background: var(--soft-green);
      font-size: 11px;
      font-weight: 800;
    }
    .status.hot {
      color: #8e2e25;
      background: #f8e8e3;
    }

    .article-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }
    .article-card {
      overflow: hidden;
      transition: transform .2s ease, box-shadow .2s ease;
    }
    .article-card:hover {
      transform: translateY(-3px);
      box-shadow: var(--shadow);
    }
    .article-card img {
      width: 100%;
      height: 170px;
      object-fit: cover;
      background: #d9dfd7;
    }
    .article-body { padding: 17px 18px 20px; }
    .article-body h3 {
      margin: 10px 0 7px;
      font-size: 18px;
      line-height: 1.45;
    }
    .article-body p {
      margin: 0;
      color: var(--muted);
      font-size: 13px;
    }

    .split-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 18px;
    }
    .notice-panel {
      padding: 25px;
    }
    .notice-panel h3 {
      margin: 0 0 11px;
      font-size: 21px;
    }
    .notice-panel p {
      margin: 0;
      color: var(--muted);
      font-size: 14px;
    }
    .notice-list {
      display: grid;
      gap: 12px;
      margin: 18px 0 0;
      padding: 0;
      list-style: none;
    }
    .notice-list li {
      display: flex;
      gap: 11px;
      align-items: flex-start;
      color: #475149;
      font-size: 13px;
    }
    .notice-list li::before {
      content: "•";
      color: var(--green);
      font-size: 20px;
      line-height: 1;
    }

    .site-footer {
      color: rgba(255,255,255,.76);
      background: #18251d;
    }
    .footer-main {
      display: grid;
      grid-template-columns: 1.5fr 1fr 1fr;
      gap: 48px;
      padding: 52px 0 40px;
    }
    .footer-brand .brand { color: white; }
    .footer-brand p {
      max-width: 360px;
      margin: 17px 0 0;
      color: rgba(255,255,255,.64);
      font-size: 13px;
    }
    .footer-title {
      margin: 4px 0 15px;
      color: white;
      font-size: 14px;
    }
    .footer-links {
      display: grid;
      gap: 9px;
      font-size: 13px;
    }
    .footer-links a:hover { color: var(--lime); }
    .footer-bottom {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      padding: 17px 0 21px;
      border-top: 1px solid rgba(255,255,255,.14);
      color: rgba(255,255,255,.5);
      font-size: 11px;
    }

    @media (max-width: 1024px) {
      .primary-nav { gap: 17px; }
      .lead-grid { grid-template-columns: 1fr; }
      .timeline-row { grid-template-columns: 105px 90px 1fr 80px; }
    }
    @media (max-width: 768px) {
      .container { width: min(var(--container), calc(100% - 32px)); }
      .nav-wrap { min-height: 66px; }
      .nav-toggle { display: block; }
      .primary-nav {
        display: none;
        position: absolute;
        top: 66px;
        left: 16px;
        right: 16px;
        padding: 8px 18px;
        background: white;
        border: 1px solid var(--line);
        box-shadow: var(--shadow);
      }
      .primary-nav.open { display: grid; gap: 0; }
      .primary-nav a { padding: 13px 0; border-bottom: 1px solid #edf0eb; }
      .primary-nav a:last-child { border-bottom: 0; }
      .primary-nav a[aria-current="page"]::after { bottom: 8px; right: auto; width: 28px; }
      .page-hero { min-height: 340px; }
      .page-hero-inner { padding: 58px 0 45px; }
      .section { padding: 45px 0; }
      .section-heading { display: block; }
      .section-heading p { margin-top: 9px; }
      .section-heading .text-link { margin-top: 15px; }
      .lead-card { grid-template-columns: 1fr; }
      .lead-card img { min-height: 220px; max-height: 270px; }
      .article-grid, .split-grid { grid-template-columns: 1fr; }
      .timeline { padding: 5px 16px; }
      .timeline-row {
        grid-template-columns: 1fr auto;
        gap: 7px 14px;
      }
      .timeline-date, .timeline-type { grid-column: 1; }
      .timeline-type { grid-row: 2; }
      .timeline-row h3 { grid-column: 1 / -1; grid-row: 3; }
      .status { grid-column: 2; grid-row: 1 / span 2; }
      .footer-main { grid-template-columns: 1fr 1fr; gap: 28px; }
      .footer-brand { grid-column: 1 / -1; }
      .footer-bottom { display: grid; gap: 6px; }
    }
    @media (max-width: 520px) {
      .page-hero h1 { font-size: 38px; }
      .page-hero p { font-size: 15px; }
      .filter-bar { align-items: stretch; }
      .filter-label { width: 100%; }
      .filter-select, .filter-chip { flex: 1 1 auto; }
      .side-story { grid-template-columns: 108px 1fr; }
      .side-story-body { padding: 13px; }
      .side-story h3 { font-size: 15px; }
      .lead-content { padding: 21px; }
      .lead-content h3 { font-size: 21px; }
      .footer-main { grid-template-columns: 1fr; }
    }

/* roulang page: category4 */
:root{color-scheme:light;--paper:#f5f5f2;--surface:#fff;--ink:#20251f;--muted:#68716a;--line:#dfe3dc;--green:#176b46;--green-dark:#104b33;--lime:#d9f36c;--red:#c74c3d;--soft-green:#eaf2e9;--soft-yellow:#f4f1df;--radius:6px;--shadow:0 10px 28px rgba(24,37,28,.08);--container:1180px}
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid #a0c84b;outline-offset:3px}.container{width:min(var(--container),calc(100% - 48px));margin:auto}
    .site-header{background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);position:relative;z-index:5}.nav-wrap{min-height:74px;display:flex;align-items:center;gap:38px}.brand{display:inline-flex;align-items:center;gap:10px;font-size:23px;font-weight:850}.brand-mark{width:28px;height:28px;display:grid;place-items:center;background:var(--green);color:#fff;border-radius:4px}.brand-mark:before{content:"A";font-weight:900;font-style:italic}.primary-nav{display:flex;align-items:center;gap:27px;margin-left:auto}.primary-nav a{position:relative;padding:25px 0;color:#4e5750;font-size:14px;font-weight:650}.primary-nav a:hover,.primary-nav a[aria-current=page]{color:var(--green)}.primary-nav a[aria-current=page]:after{content:"";position:absolute;height:3px;left:0;right:0;bottom:15px;background:var(--lime)}.nav-toggle{display:none;margin-left:auto;width:42px;height:42px;border:1px solid var(--line);border-radius:4px;background:white}.nav-toggle span,.nav-toggle:before,.nav-toggle:after{display:block;content:"";width:18px;height:2px;background:currentColor;margin:4px auto}
    .page-head{padding:70px 0 58px;background:#e9eee7;border-bottom:1px solid var(--line)}.crumb{color:var(--green);font-size:12px;font-weight:800;margin-bottom:12px}.page-head h1{font-size:clamp(36px,5vw,58px);line-height:1.15;margin:0 0 14px;font-weight:850}.page-head p{max-width:700px;color:var(--muted);font-size:17px;margin:0}.section{padding:58px 0;border-bottom:1px solid var(--line)}.section-alt{background:#eeefea}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:24px}.section-kicker{margin:0 0 5px;color:var(--green);font-size:11px;font-weight:850}.section-heading h2{margin:0;font-size:28px;line-height:1.25}.section-heading p{max-width:520px;margin:0;color:var(--muted);font-size:14px}
    .news-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:18px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.2s}.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.card img{width:100%;height:190px;object-fit:cover;background:#d9dfd7}.card:first-child img{height:245px}.card-body{padding:17px 18px 20px}.tag{display:inline-flex;padding:4px 8px;background:#edf3e6;color:var(--green-dark);font-size:10px;font-weight:800}.card h3{font-size:19px;line-height:1.4;margin:10px 0 7px}.card p{color:var(--muted);font-size:13px;margin:0}.meta{color:var(--muted);font-size:11px;margin-top:13px}
    .timeline{border-left:2px solid #b9cbb9}.timeline-item{position:relative;padding:0 0 27px 28px}.timeline-item:before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border:3px solid var(--green);background:var(--paper);border-radius:50%}.timeline-item:last-child{padding-bottom:0}.timeline time{color:var(--green);font-weight:800;font-size:12px}.timeline h3{font-size:18px;margin:5px 0}.timeline p{color:var(--muted);margin:0}.table-box{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.table-row{display:grid;grid-template-columns:150px 1fr 130px 120px;gap:14px;padding:16px 20px;border-bottom:1px solid #edf0eb;align-items:center}.table-row:last-child{border:0}.table-row.head{background:#f0f3ed;color:var(--muted);font-size:12px;font-weight:800}.status{color:var(--green);font-weight:800;font-size:13px}.split{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{background:#fff;border:1px solid var(--line);padding:24px;border-radius:var(--radius)}.panel h3{margin:0 0 12px;font-size:20px}.panel p{color:var(--muted);margin:0 0 16px}.list{list-style:none;padding:0;margin:0}.list li{padding:13px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:15px}.list li:last-child{border:0}.list small{color:var(--muted);white-space:nowrap}.more{display:inline-flex;margin-top:22px;color:var(--green);font-weight:800;font-size:13px}.more:after{content:" →";transition:.2s}.more:hover:after{margin-left:5px}.note{background:var(--green-dark);color:#fff;padding:30px;border-radius:var(--radius);display:flex;justify-content:space-between;align-items:center;gap:25px}.note h2{margin:0 0 6px;font-size:25px}.note p{margin:0;color:#dce9dc}.button{min-height:44px;padding:0 18px;border-radius:4px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}.button-primary{background:var(--lime);color:#1c2a1d}.button-primary:hover{background:#e5ff82}.site-footer{background:#183326;color:#dce8dc;padding-top:48px}.footer-main{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;padding-bottom:40px}.footer-brand .brand{color:#fff}.footer-brand p{max-width:360px;color:#abc1ae;margin:18px 0 0}.footer-title{font-size:14px;color:#fff;margin:5px 0 14px}.footer-links{display:grid;gap:8px;color:#abc1ae;font-size:13px}.footer-links a:hover{color:var(--lime)}.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding:18px 0;display:flex;justify-content:space-between;gap:15px;color:#9db39f;font-size:12px}
    @media(max-width:900px){.primary-nav{gap:15px}.news-grid{grid-template-columns:1fr 1fr}.card:first-child{grid-column:span 2}.split{grid-template-columns:1fr}.table-row{grid-template-columns:110px 1fr 90px 80px}}
    @media(max-width:768px){.container{width:min(var(--container),calc(100% - 32px))}.nav-wrap{min-height:64px}.nav-toggle{display:block}.primary-nav{display:none;position:absolute;top:64px;left:0;right:0;padding:10px 16px;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.primary-nav.open{display:flex}.primary-nav a{padding:12px 4px}.primary-nav a[aria-current=page]:after{bottom:5px}.page-head{padding:48px 0}.section{padding:42px 0}.section-heading{display:block}.section-heading p{margin-top:10px}.news-grid{grid-template-columns:1fr}.card:first-child{grid-column:auto}.card:first-child img,.card img{height:210px}.table-box{overflow:hidden}.table-row{grid-template-columns:1fr 1fr;padding:13px 15px}.table-row.head{display:none}.table-row span:nth-child(3),.table-row span:nth-child(4){font-size:12px}.note{display:block}.note .button{margin-top:18px}.footer-main{grid-template-columns:1fr 1fr}.footer-brand{grid-column:span 2}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:5px}}
    @media(max-width:520px){.footer-main{grid-template-columns:1fr}.footer-brand{grid-column:auto}.page-head h1{font-size:36px}}

/* roulang page: category3 */
:root{color-scheme:light;--paper:#f5f5f2;--surface:#fff;--ink:#20251f;--muted:#68716a;--line:#dfe3dc;--green:#176b46;--green-dark:#104b33;--lime:#d9f36c;--red:#c74c3d;--soft-green:#eaf2e9;--soft-yellow:#f4f1df;--radius:6px;--shadow:0 10px 28px rgba(24,37,28,.08);--container:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input{font:inherit}button{cursor:pointer}a,button{transition:color .18s,background .18s,border-color .18s,transform .18s}a:focus-visible,button:focus-visible{outline:3px solid #a0c84b;outline-offset:4px}a:hover{color:var(--green)}button:active,.button:active{transform:translateY(1px)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:750;letter-spacing:0}p{margin-bottom:0}.container{width:min(var(--container),calc(100% - 48px));max-width:var(--container);margin-inline:auto;padding:0}.site-header{position:relative;z-index:5;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line)}.nav-wrap{min-height:74px;display:flex;align-items:center;gap:38px}.brand{display:inline-flex;align-items:center;gap:10px;flex:0 0 auto;font-size:23px;font-weight:850}.brand-mark{width:28px;height:28px;display:grid;place-items:center;background:var(--green);color:white;border-radius:4px;font-size:17px;line-height:1}.brand-mark::before{content:"A";font-weight:900;font-style:italic}.primary-nav{display:flex;align-items:center;gap:27px;margin-left:auto}.primary-nav a{position:relative;padding:25px 0;color:#4e5750;font-size:14px;font-weight:650}.primary-nav a:hover,.primary-nav a[aria-current="page"]{color:var(--green)}.primary-nav a[aria-current="page"]::after{content:"";position:absolute;height:3px;left:0;right:0;bottom:15px;background:var(--lime)}.nav-toggle{display:none;margin-left:auto;width:42px;height:42px;border:1px solid var(--line);border-radius:4px;background:white;color:var(--ink)}.nav-toggle span,.nav-toggle::before,.nav-toggle::after{display:block;content:"";width:18px;height:2px;background:currentColor;margin:4px auto}
main{padding-bottom:64px}.breadcrumb{display:flex;gap:10px;margin:0;padding:25px 0 20px;font-size:12px;color:var(--muted)}.breadcrumb span+span::before{content:"/";margin-right:10px;color:#9ba499}.page-heading{padding:0 0 32px;border-bottom:1px solid var(--line)}.section-kicker{margin:0 0 7px;color:var(--green);font-size:12px;font-weight:800}.page-heading h1{font-size:36px;line-height:1.3;margin:0 0 12px}.page-heading p:last-child{color:var(--muted);max-width:720px;font-size:16px}.page-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:36px;align-items:start}.section{padding:34px 0;border-bottom:1px solid var(--line);scroll-margin-top:25px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.section-heading h2{font-size:23px;line-height:1.35;margin:0}.section-heading>span{font-size:12px;color:var(--muted)}.lead-image{position:relative;overflow:hidden;border-radius:var(--radius);background:#dce4db}.lead-image img{width:100%;aspect-ratio:16/8;object-fit:cover;transition:transform .4s}.lead-image:hover img{transform:scale(1.025)}.image-caption{position:absolute;left:16px;bottom:15px;padding:5px 10px;background:rgba(255,255,255,.95);color:var(--green-dark);font-size:12px;font-weight:750;border-radius:3px}.lead-copy{padding-top:20px}.lead-copy h3{font-size:25px;line-height:1.45;margin:10px 0}.lead-copy p{color:var(--muted);font-size:14px}.feature-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;color:var(--muted);font-size:12px}.pill{display:inline-flex;padding:3px 8px;border-radius:2px;background:var(--soft-green);color:var(--green-dark);font-size:11px;font-weight:750}.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--green);font-size:13px;font-weight:800}.text-link::after{content:"→";transition:transform .18s}.text-link:hover::after{transform:translateX(4px)}.lead-copy .text-link{margin-top:16px}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.filter-button{min-height:38px;padding:7px 14px;border:1px solid var(--line);background:var(--surface);border-radius:4px;color:var(--muted);font-size:13px}.filter-button:hover{border-color:var(--green);color:var(--green)}.filter-button[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#fff}.article-list{border-top:1px solid var(--line)}.article-item{padding:21px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:48px 1fr;gap:17px}.article-item[hidden]{display:none}.article-number{font-size:25px;font-weight:750;color:#a1aca0;line-height:1.4}.article-item h3{font-size:18px;margin:0 0 8px;line-height:1.5}.article-item p{color:var(--muted);font-size:13px;margin:9px 0 0}.more-row{padding-top:20px;text-align:right}.sidebar{padding-top:34px}.sidebar .section{padding:0 0 26px;margin-bottom:26px}.sidebar h2{font-size:18px;margin:0 0 17px}.index-list{list-style:none;padding:0;margin:0}.index-list li{border-bottom:1px solid var(--line)}.index-list a{display:flex;justify-content:space-between;align-items:center;padding:12px 0;font-size:14px}.index-list a span{font-size:11px;color:var(--muted)}.note-box{background:var(--soft-yellow);border-left:3px solid #b8aa56;padding:18px}.note-box p{font-size:13px;color:#666249}.note-box h3{font-size:15px;margin:0 0 9px}.topic-stack{display:grid;gap:16px}.topic-stack article{padding-bottom:16px;border-bottom:1px solid var(--line)}.topic-stack h3{font-size:15px;margin:0 0 7px;line-height:1.5}.topic-stack p{font-size:12px;color:var(--muted)}.comparison-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}th{font-weight:750;background:var(--soft-green);color:var(--green-dark)}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#fafbf8}td:first-child{font-weight:750;white-space:nowrap}.source-note{font-size:12px;color:var(--muted);margin-top:12px}.season-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:white}.season-item{padding:22px 18px;border-right:1px solid var(--line)}.season-item:last-child{border:0}.season-item strong{display:block;font-size:12px;color:var(--green);margin-bottom:12px}.season-item h3{font-size:17px;line-height:1.5;margin:0 0 9px}.season-item p{font-size:13px;color:var(--muted)}.rules-list{margin:0;display:grid;gap:0}.rules-list>div{display:grid;grid-template-columns:112px 1fr;gap:20px;padding:18px 0;border-top:1px solid var(--line)}.rules-list dt{font-size:14px;font-weight:750}.rules-list dd{font-size:14px;color:var(--muted);margin:0}.watch-section{background:var(--soft-green);padding:26px;border:0;border-radius:var(--radius);margin-top:32px}.watch-section h2{font-size:22px;margin:0 0 18px}.watch-points{display:grid;grid-template-columns:1fr 1fr;gap:24px}.watch-points h3{font-size:16px;margin:0 0 8px}.watch-points p{font-size:13px;color:#536452}.site-footer{background:#e9ece5;border-top:1px solid #d7ddd2}.footer-main{display:grid;grid-template-columns:1.8fr 1fr 1fr;gap:64px;padding-top:42px;padding-bottom:36px}.footer-brand p{max-width:380px;margin-top:14px;color:var(--muted);font-size:13px}.footer-title{font-size:14px;margin:4px 0 14px}.footer-links{display:flex;flex-direction:column;gap:9px;font-size:13px;color:var(--muted)}.footer-links a:hover{color:var(--green);text-decoration:underline}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #d7ddd2;padding-top:18px;padding-bottom:22px;font-size:11px;color:var(--muted)}
@media(min-width:769px){.primary-nav{display:flex!important}}
@media(max-width:1024px){.nav-wrap{gap:24px}.primary-nav{gap:18px}.page-grid{grid-template-columns:minmax(0,1fr) 240px;gap:26px}.footer-main{gap:32px}.season-grid{grid-template-columns:1fr}.season-item{border-right:0;border-bottom:1px solid var(--line)}}
@media(max-width:768px){.container{width:calc(100% - 36px)}.nav-wrap{min-height:68px;flex-wrap:wrap;gap:0}.nav-toggle{display:block}.primary-nav{display:none;flex-basis:100%;margin:0;padding:10px 0 16px;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 16px}.primary-nav.is-open{display:grid}.primary-nav a{padding:12px 0;text-align:center}.primary-nav a[aria-current="page"]::after{bottom:5px}.page-grid{grid-template-columns:1fr;gap:0}.page-heading h1{font-size:30px}.page-heading p:last-child{font-size:15px}.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding-top:32px}.sidebar .section{margin:0}.sidebar .section:last-child{grid-column:1/-1}.season-grid{grid-template-columns:repeat(3,1fr)}.season-item{border-bottom:0;border-right:1px solid var(--line)}.footer-main{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:6px}}
@media(max-width:520px){.container{width:calc(100% - 32px)}.brand{font-size:21px}.breadcrumb{padding-top:20px}.page-heading h1{font-size:27px}.section{padding:28px 0}.section-heading h2{font-size:21px}.section-heading>span{font-size:11px}.lead-image img{aspect-ratio:4/3}.lead-copy h3{font-size:21px}.article-item{grid-template-columns:30px 1fr;gap:11px}.article-number{font-size:20px}.article-item h3{font-size:17px}.filter-button{padding:7px 12px}.season-grid{grid-template-columns:1fr}.season-item{border-right:0;border-bottom:1px solid var(--line)}.rules-list>div{grid-template-columns:1fr;gap:5px}.watch-section{padding:22px}.watch-points,.sidebar{grid-template-columns:1fr}.sidebar .section:last-child{grid-column:auto}.comparison-wrap th,.comparison-wrap td{padding:12px 10px;font-size:12px}.footer-main{gap:24px}.footer-bottom{font-size:11px}.image-caption{font-size:11px;left:12px;bottom:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* roulang page: category5 */
:root {
 color-scheme: light;
 --paper: #f5f5f2;
 --surface: #ffffff;
 --ink: #20251f;
 --muted: #68716a;
 --line: #dfe3dc;
 --green: #176b46;
 --green-dark: #104b33;
 --lime: #d9f36c;
 --red: #c74c3d;
 --soft-green: #eaf2e9;
 --soft-yellow: #f4f1df;
 --radius: 6px;
 --shadow: 0 10px 28px rgba(24, 37, 28, .08);
 --container: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
 margin: 0;
 background: var(--paper);
 color: var(--ink);
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
 font-size: 15px;
 line-height: 1.7;
 -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, select, input { font: inherit; }
button { color: inherit; }
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible {
 outline: 3px solid #a0c84b;
 outline-offset: 3px;
}
.container { width: min(var(--container), calc(100% - 48px)); margin-inline: auto; }
.site-header {
 position: relative;
 z-index: 20;
 background: rgba(255,255,255,.96);
 border-bottom: 1px solid var(--line);
}
.nav-wrap { min-height: 74px; display: flex; align-items: center; gap: 38px; }
.brand {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 flex: 0 0 auto;
 font-size: 23px;
 font-weight: 850;
}
.brand-mark {
 width: 28px;
 height: 28px;
 display: grid;
 place-items: center;
 background: var(--green);
 color: white;
 border-radius: 4px;
 font-size: 17px;
 line-height: 1;
}
.brand-mark::before { content: "A"; font-weight: 900; font-style: italic; }
.primary-nav { display: flex; align-items: center; gap: 27px; margin-left: auto; }
.primary-nav a {
 position: relative;
 padding: 25px 0;
 color: #4e5750;
 font-size: 14px;
 font-weight: 650;
 transition: color .18s ease;
}
.primary-nav a:hover, .primary-nav a[aria-current="page"] { color: var(--green); }
.primary-nav a[aria-current="page"]::after {
 content: "";
 position: absolute;
 height: 3px;
 left: 0;
 right: 0;
 bottom: 15px;
 background: var(--lime);
}
.nav-toggle {
 display: none;
 margin-left: auto;
 width: 42px;
 height: 42px;
 border: 1px solid var(--line);
 border-radius: 4px;
 background: white;
 cursor: pointer;
}
.nav-toggle span, .nav-toggle::before, .nav-toggle::after {
 display: block;
 content: "";
 width: 18px;
 height: 2px;
 background: currentColor;
 margin: 4px auto;
 transition: transform .18s ease, opacity .18s ease;
}
.breadcrumb-bar { background: var(--surface); border-bottom: 1px solid var(--line); }
.breadcrumb-list {
 min-height: 46px;
 display: flex;
 align-items: center;
 gap: 9px;
 margin: 0;
 padding: 0;
 list-style: none;
 color: var(--muted);
 font-size: 12px;
}
.breadcrumb-list li + li::before { content: "/"; margin-right: 9px; color: #a3aaa4; }
.breadcrumb-list a:hover { color: var(--green); }
.category-head {
 position: relative;
 overflow: hidden;
 background: #1c3527 url("/assets/images/d1a0bac35926db8e.webp") center 48% / cover no-repeat;
 color: white;
}
.category-head::before {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(90deg, rgba(10,27,17,.91) 0%, rgba(13,35,22,.78) 50%, rgba(15,34,23,.35) 100%);
}
.category-head-inner {
 position: relative;
 min-height: 330px;
 display: flex;
 align-items: flex-end;
 padding-top: 65px;
 padding-bottom: 52px;
}
.category-copy { max-width: 760px; }
.eyebrow {
 display: inline-flex;
 align-items: center;
 gap: 9px;
 color: var(--lime);
 font-size: 12px;
 font-weight: 800;
}
.eyebrow::before { content: ""; width: 24px; height: 2px; background: currentColor; }
.category-head h1 {
 margin: 14px 0 13px;
 font-size: clamp(36px, 5vw, 58px);
 line-height: 1.12;
 font-weight: 850;
}
.category-head p {
 max-width: 700px;
 margin: 0;
 color: rgba(255,255,255,.86);
 font-size: 16px;
}
.head-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 23px; }
.head-tag {
 padding: 6px 10px;
 border: 1px solid rgba(255,255,255,.28);
 border-radius: 3px;
 background: rgba(255,255,255,.08);
 color: rgba(255,255,255,.9);
 font-size: 12px;
}
main { padding-bottom: 60px; }
.section { padding: 62px 0; border-bottom: 1px solid var(--line); }
.section-alt { background: #eeefea; }
.section-dark { background: var(--green-dark); color: white; }
.section-heading {
 display: flex;
 justify-content: space-between;
 align-items: end;
 gap: 24px;
 margin-bottom: 25px;
}
.section-kicker {
 margin: 0 0 5px;
 color: var(--green);
 font-size: 11px;
 font-weight: 850;
}
.section-dark .section-kicker { color: var(--lime); }
.section-heading h2 { margin: 0; font-size: 28px; line-height: 1.25; font-weight: 800; }
.section-heading p { max-width: 540px; margin: 0; color: var(--muted); font-size: 14px; }
.section-dark .section-heading p { color: rgba(255,255,255,.68); }
.text-link {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 color: var(--green);
 font-size: 13px;
 font-weight: 800;
 white-space: nowrap;
}
.text-link::after { content: "→"; transition: transform .18s ease; }
.text-link:hover::after { transform: translateX(4px); }
.filter-panel {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 20px;
 padding: 18px 20px;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
 box-shadow: 0 5px 16px rgba(24,37,28,.04);
}
.filter-groups { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.filter-label { color: var(--muted); font-size: 12px; font-weight: 700; }
.filter-button {
 min-height: 36px;
 padding: 0 13px;
 border: 1px solid var(--line);
 border-radius: 4px;
 background: #fff;
 font-size: 12px;
 font-weight: 700;
 cursor: pointer;
 transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.filter-button:hover { border-color: #9bb2a2; color: var(--green); }
.filter-button.active { background: var(--green); border-color: var(--green); color: white; }
.filter-note { margin: 0; color: var(--muted); font-size: 12px; }
.editorial-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 20px; }
.lead-story {
 display: grid;
 grid-template-rows: 290px auto;
 overflow: hidden;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
 transition: transform .2s ease, box-shadow .2s ease;
}
.lead-story:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.lead-story img { width: 100%; height: 100%; object-fit: cover; }
.story-body { padding: 22px 24px 25px; }
.story-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; }
.pill {
 display: inline-flex;
 padding: 4px 8px;
 border-radius: 2px;
 background: #edf3e6;
 color: var(--green-dark);
 font-size: 10px;
 font-weight: 800;
}
.story-body h2, .story-body h3 { margin: 10px 0 8px; line-height: 1.4; }
.story-body h2 { font-size: 25px; }
.story-body h3 { font-size: 18px; }
.story-body p { margin: 0; color: var(--muted); font-size: 13px; }
.side-stories { display: grid; gap: 14px; }
.story-row {
 display: grid;
 grid-template-columns: 155px 1fr;
 min-height: 142px;
 overflow: hidden;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
 transition: border-color .18s ease, transform .18s ease;
}
.story-row:hover { border-color: #aebcaf; transform: translateX(3px); }
.story-row img { width: 100%; height: 100%; object-fit: cover; }
.story-row .story-body { padding: 16px; }
.story-row .story-body h3 { margin-top: 7px; font-size: 16px; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.metric-card {
 position: relative;
 padding: 22px 20px;
 background: var(--surface);
 border: 1px solid var(--line);
 border-top: 4px solid var(--green);
 border-radius: var(--radius);
}
.metric-card:nth-child(2) { border-top-color: var(--red); }
.metric-card:nth-child(3) { border-top-color: #b39720; }
.metric-card:nth-child(4) { border-top-color: #657d6d; }
.metric-code { color: var(--green); font-size: 12px; font-weight: 850; }
.metric-card h3 { margin: 8px 0 6px; font-size: 18px; }
.metric-card p { margin: 0; color: var(--muted); font-size: 12px; }
.metric-scale { height: 5px; margin-top: 18px; overflow: hidden; background: #edf0eb; border-radius: 9px; }
.metric-scale span { display: block; height: 100%; background: var(--green); border-radius: inherit; }
.data-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .65fr); gap: 22px; }
.data-table-wrap {
 overflow: hidden;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
}
.data-table { width: 100%; border-collapse: collapse; }
.data-table th {
 padding: 13px 16px;
 background: var(--green-dark);
 color: white;
 font-size: 11px;
 text-align: left;
 font-weight: 750;
}
.data-table td {
 padding: 15px 16px;
 border-bottom: 1px solid #edf0eb;
 color: #374039;
 font-size: 13px;
}
.data-table tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: #f8faf7; }
.data-table td:first-child { font-weight: 800; color: var(--ink); }
.signal {
 display: inline-flex;
 align-items: center;
 gap: 7px;
 font-size: 11px;
 font-weight: 750;
}
.signal::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.signal.warm::before { background: #c8951e; }
.signal.red::before { background: var(--red); }
.source-box {
 padding: 24px;
 background: var(--soft-yellow);
 border: 1px solid #e2ddc4;
 border-radius: var(--radius);
}
.source-box h3 { margin: 0 0 11px; font-size: 18px; }
.source-box p { margin: 0 0 14px; color: #66634f; font-size: 13px; }
.source-box ul { margin: 0; padding-left: 18px; color: #66634f; font-size: 12px; }
.source-box li + li { margin-top: 7px; }
.timeline {
 position: relative;
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
}
.timeline::before {
 content: "";
 position: absolute;
 top: 35px;
 left: 12%;
 right: 12%;
 height: 2px;
 background: #cfd8cf;
}
.timeline-item { position: relative; z-index: 1; padding: 23px 20px 25px; border-right: 1px solid var(--line); }
.timeline-item:last-child { border-right: 0; }
.timeline-dot {
 width: 24px;
 height: 24px;
 display: grid;
 place-items: center;
 margin-bottom: 16px;
 border: 6px solid var(--surface);
 border-radius: 50%;
 background: var(--green);
 box-shadow: 0 0 0 1px #b7c5b9;
}
.timeline-item:nth-child(3) .timeline-dot { background: var(--red); }
.timeline-time { color: var(--green); font-size: 11px; font-weight: 850; }
.timeline-item h3 { margin: 8px 0 6px; font-size: 16px; line-height: 1.4; }
.timeline-item p { margin: 0; color: var(--muted); font-size: 12px; }
.article-list { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.article-item {
 display: grid;
 grid-template-columns: 126px minmax(0, 1fr) 110px;
 align-items: center;
 gap: 20px;
 padding: 19px 21px;
 border-bottom: 1px solid #edf0eb;
 transition: background .18s ease;
}
.article-item:last-child { border-bottom: 0; }
.article-item:hover { background: #f8faf7; }
.article-number { color: #bdc5bd; font-size: 30px; font-weight: 850; line-height: 1; }
.article-tag { color: var(--green); font-size: 11px; font-weight: 800; }
.article-copy h3 { margin: 5px 0 4px; font-size: 17px; line-height: 1.4; }
.article-copy p { margin: 0; color: var(--muted); font-size: 12px; }
.article-date { color: var(--muted); font-size: 11px; text-align: right; }
.list-footer { display: flex; justify-content: center; margin-top: 24px; }
.button {
 min-height: 46px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 9px;
 padding: 0 18px;
 border: 1px solid transparent;
 border-radius: 4px;
 font-size: 14px;
 font-weight: 750;
 transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--green); color: white; }
.button-primary:hover { background: var(--green-dark); }
.button-light { background: white; color: var(--green-dark); border-color: var(--line); }
.button-light:hover { border-color: var(--green); color: var(--green); }
.topic-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; }
.topic-card {
 min-height: 224px;
 display: flex;
 flex-direction: column;
 justify-content: space-between;
 padding: 23px;
 border: 1px solid rgba(255,255,255,.17);
 border-radius: var(--radius);
 background: rgba(255,255,255,.06);
 transition: background .18s ease, transform .18s ease;
}
.topic-card:hover { background: rgba(255,255,255,.1); transform: translateY(-3px); }
.topic-index { color: var(--lime); font-size: 12px; font-weight: 850; }
.topic-card h3 { margin: 27px 0 7px; font-size: 20px; }
.topic-card p { margin: 0; color: rgba(255,255,255,.68); font-size: 13px; }
.topic-foot { margin-top: 20px; color: rgba(255,255,255,.8); font-size: 11px; }
.guide-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 26px; align-items: stretch; }
.guide-image { min-height: 390px; overflow: hidden; border-radius: var(--radius); }
.guide-image img { width: 100%; height: 100%; object-fit: cover; }
.guide-content {
 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 34px;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
}
.guide-content h2 { margin: 7px 0 12px; font-size: 29px; line-height: 1.3; }
.guide-content > p { margin: 0 0 22px; color: var(--muted); }
.guide-points { display: grid; gap: 14px; }
.guide-point { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; }
.guide-icon {
 width: 34px;
 height: 34px;
 display: grid;
 place-items: center;
 border-radius: 4px;
 background: var(--soft-green);
 color: var(--green);
 font-size: 13px;
 font-weight: 850;
}
.guide-point h3 { margin: 0 0 2px; font-size: 15px; }
.guide-point p { margin: 0; color: var(--muted); font-size: 12px; }
.channel-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.channel-card {
 min-height: 116px;
 display: flex;
 flex-direction: column;
 justify-content: space-between;
 padding: 17px;
 background: var(--surface);
 border: 1px solid var(--line);
 border-radius: var(--radius);
 transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.channel-card:hover { border-color: #9db2a1; background: var(--soft-green); transform: translateY(-2px); }
.channel-card strong { font-size: 15px; }
.channel-card span { color: var(--muted); font-size: 11px; }
.channel-card.current { background: var(--green); border-color: var(--green); color: white; }
.channel-card.current span { color: rgba(255,255,255,.72); }
.site-footer { background: #18221b; color: white; }
.footer-main {
 display: grid;
 grid-template-columns: 1.5fr .7fr .7fr;
 gap: 58px;
 padding-top: 50px;
 padding-bottom: 42px;
}
.footer-brand p { max-width: 430px; margin: 17px 0 0; color: rgba(255,255,255,.62); font-size: 13px; }
.footer-title { margin: 3px 0 14px; color: white; font-size: 14px; font-weight: 800; }
.footer-links { display: grid; gap: 9px; }
.footer-links a { color: rgba(255,255,255,.64); font-size: 12px; transition: color .18s ease; }
.footer-links a:hover { color: var(--lime); }
.footer-bottom {
 min-height: 57px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 20px;
 border-top: 1px solid rgba(255,255,255,.1);
 color: rgba(255,255,255,.44);
 font-size: 11px;
}
@media (max-width: 1024px) {
 .primary-nav { gap: 18px; }
 .primary-nav a { font-size: 13px; }
 .editorial-grid { grid-template-columns: 1fr; }
 .side-stories { grid-template-columns: 1fr 1fr; }
 .metric-grid { grid-template-columns: repeat(2, 1fr); }
 .data-layout { grid-template-columns: 1fr; }
 .topic-grid { grid-template-columns: 1fr 1fr; }
 .channel-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
 .container { width: min(100% - 30px, var(--container)); }
 .nav-wrap { min-height: 66px; }
 .nav-toggle { display: block; }
 .primary-nav {
 position: absolute;
 top: 66px;
 left: 0;
 right: 0;
 display: none;
 align-items: stretch;
 gap: 0;
 padding: 8px 15px 14px;
 background: white;
 border-bottom: 1px solid var(--line);
 box-shadow: var(--shadow);
 }
 .primary-nav.open { display: grid; }
 .primary-nav a { padding: 12px 10px; border-bottom: 1px solid #edf0eb; }
 .primary-nav a[aria-current="page"]::after { width: 4px; height: auto; top: 11px; bottom: 11px; left: 0; right: auto; }
 .category-head-inner { min-height: 300px; padding-top: 52px; padding-bottom: 43px; }
 .section { padding: 48px 0; }
 .section-heading { align-items: start; flex-direction: column; gap: 10px; }
 .filter-panel { align-items: flex-start; flex-direction: column; }
 .side-stories { grid-template-columns: 1fr; }
 .timeline { grid-template-columns: 1fr 1fr; }
 .timeline::before { display: none; }
 .timeline-item:nth-child(2) { border-right: 0; }
 .timeline-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
 .article-item { grid-template-columns: 55px minmax(0, 1fr); }
 .article-date { grid-column: 2; text-align: left; }
 .topic-grid { grid-template-columns: 1fr; }
 .guide-layout { grid-template-columns: 1fr; }
 .guide-image { min-height: 300px; }
 .channel-grid { grid-template-columns: repeat(2, 1fr); }
 .footer-main { grid-template-columns: 1fr 1fr; gap: 35px; }
 .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
 body { font-size: 14px; }
 .container { width: min(100% - 22px, var(--container)); }
 .brand { font-size: 20px; }
 .category-head h1 { font-size: 35px; }
 .category-head p { font-size: 14px; }
 .section-heading h2 { font-size: 24px; }
 .head-tags { gap: 6px; }
 .editorial-grid { gap: 14px; }
 .lead-story { grid-template-rows: 210px auto; }
 .story-row { grid-template-columns: 112px 1fr; min-height: 132px; }
 .story-row .story-body { padding: 13px; }
 .story-row .story-body p { display: none; }
 .metric-grid { grid-template-columns: 1fr; }
 .data-table-wrap { overflow-x: auto; }
 .data-table { min-width: 670px; }
 .timeline { grid-template-columns: 1fr; }
 .timeline-item, .timeline-item:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); }
 .timeline-item:last-child { border-bottom: 0; }
 .article-item { grid-template-columns: 42px minmax(0, 1fr); padding: 17px 14px; gap: 12px; }
 .article-number { font-size: 24px; }
 .guide-content { padding: 24px 20px; }
 .guide-content h2 { font-size: 24px; }
 .channel-grid { grid-template-columns: 1fr; }
 .footer-main { grid-template-columns: 1fr; }
 .footer-brand { grid-column: auto; }
 .footer-bottom { align-items: flex-start; flex-direction: column; justify-content: center; padding: 17px 0; }
}

/* roulang: framework shim */
/* 覆盖 Bootstrap 等对 a/btn 的全局默认，避免导航出现下划线/蓝链 */
.site-header a,.site-header a:hover,.navbar a,.navbar a:hover,.nav-links a,.nav-links a:hover,header nav a,header nav a:hover{text-decoration:none}
.site-header .btn,.navbar .btn,.nav-cta{text-decoration:none}