:root { --ink:#142320; --muted:#68736f; --paper:#f5f7f5; --line:#e0e6e1; --green:#b4f05b; --deep:#132f28; --accent:#22653e; --white:#fff; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.75 "Microsoft YaHei","PingFang SC",system-ui,sans-serif; overflow-wrap:anywhere; }
a { color:inherit; text-decoration:none; }
a:hover { color:var(--accent); }
button, input { font:inherit; }
button, .button { cursor:pointer; }
button:focus-visible, a:focus-visible { outline:3px solid #76af2f; outline-offset:5px; }
img { display:block; max-width:100%; }
button { color:inherit; }
.wrap { width:min(1240px,calc(100% - 64px)); margin-inline:auto; }
.masthead { background:var(--deep); color:white; }
.utility { display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid #ffffff20; font-size:12px; letter-spacing:1px; color:#c3d2cc; }
.brand-row { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:112px; }
.brand { display:flex; gap:15px; align-items:center; }
.brand img { width:53px; height:53px; }
.brand h1, .brand .wordmark { font-size:30px; line-height:1.2; margin:0; font-weight:800; letter-spacing:2px; }
.brand small { display:block; margin-top:8px; font-size:12px; color:#bfcec7; letter-spacing:3px; }
.edition { font-size:14px; color:#c3d2cc; text-align:right; }
.edition strong { color:var(--green); display:block; letter-spacing:2px; }
.nav-wrap { background:#fff; border-bottom:1px solid var(--line); }
.navigation { display:grid; grid-template-columns:repeat(9,1fr); }
.navigation a { display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px; padding:18px 3px; border-bottom:3px solid transparent; white-space:nowrap; }
.navigation a.active { background:#edf5e7; border-color:#80b945; font-weight:700; }
.navigation span { font-size:19px; }
.mobile-toggle { display:none; background:none; border:1px solid #638075; border-radius:6px; color:white; padding:8px 13px; }
.ticker { display:flex; gap:20px; align-items:center; padding:14px 0; color:var(--muted); font-size:13px; }
.ticker b { color:var(--accent); white-space:nowrap; }
.ticker p { margin:0; }
main { padding-bottom:44px; }
.hero-grid { display:grid; grid-template-columns:minmax(0,2.2fr) minmax(280px,1fr); gap:24px; margin-top:12px; }
.hero { position:relative; border-radius:12px; background:#16352c; overflow:hidden; min-width:0; }
.slide { position:relative; width:100%; height:100%; aspect-ratio:16/9; min-height:390px; display:none; }
.slide:first-child { display:block; }
.hero.enhanced .slide { display:none; }
.hero.enhanced .slide.current { display:block; animation:reveal .5s ease; }
@keyframes reveal { from { opacity:.55; } to { opacity:1; } }
.slide > img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; background:#294f44; }
.slide::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#081f19f5 0%,#102a2470 60%,#14251b15); }
.slide-copy { position:absolute; bottom:62px; left:30px; right:30px; z-index:1; color:white; }
.tag { display:inline-flex; font-size:12px; padding:3px 9px; font-weight:700; color:var(--accent); background:#edf4e9; border-radius:3px; }
.slide .tag { background:var(--green); color:#17321f; }
.slide h2 { font-size:30px; line-height:1.4; max-width:650px; margin:13px 0 8px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.slide p { color:#d3dfd7; margin:0 0 12px; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.slide-copy > a { font-size:14px; color:var(--green); }
.hero-controls { position:absolute; bottom:17px; left:30px; right:25px; z-index:2; display:flex; gap:9px; align-items:center; }
.hero-controls button { border:1px solid #ffffff50; background:#102a2350; color:white; width:32px; height:30px; border-radius:4px; line-height:1; }
.hero-controls .dot { width:19px; height:5px; border:0; padding:0; border-radius:5px; background:#ffffff60; }
.hero-controls .dot[aria-current="true"] { width:34px; background:var(--green); }
.hero-controls .prev { margin-left:auto; }
.hero-controls .pause { font-size:12px; width:48px; }
.wire { background:white; border:1px solid var(--line); border-radius:12px; padding:24px; display:flex; flex-direction:column; }
.section-head { display:flex; justify-content:space-between; align-items:center; gap:14px; margin:0 0 20px; }
.section-head h2 { font-size:23px; margin:0; letter-spacing:-.5px; }
.section-head h2 span { margin-right:9px; color:var(--accent); }
.section-head > a { font-size:13px; color:var(--muted); white-space:nowrap; }
.eyebrow { font-size:12px; font-weight:700; color:var(--accent); letter-spacing:2px; margin:0 0 7px; }
.wire article { padding:13px 0; border-bottom:1px solid var(--line); flex:1; }
.wire article:last-child { border:0; padding-bottom:0; }
.wire time { color:var(--accent); font-size:12px; }
.wire h3 { font-size:17px; line-height:1.6; margin:4px 0; }
.wire p { font-size:13px; line-height:1.6; color:var(--muted); margin:0; }
.section { margin-top:38px; }
.section-intro { color:var(--muted); font-size:14px; margin:-12px 0 22px; }
.cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.card { display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:9px; background:white; min-width:0; transition:transform .2s; }
.card:hover { transform:translateY(-3px); }
.card .image { overflow:hidden; position:relative; background:#dbe4de; }
.card img { width:100%; aspect-ratio:16/10; object-fit:cover; transition:transform .35s; }
.card:hover img { transform:scale(1.035); }
.card-body { padding:18px; display:flex; flex-direction:column; flex:1; align-items:flex-start; }
.card h3 { font-size:18px; line-height:1.55; margin:10px 0; }
.card p { color:var(--muted); font-size:14px; margin:0 0 16px; }
.card .meta { font-size:12px; color:var(--muted); margin-top:auto; padding-top:5px; }
.band { background:var(--deep); color:white; padding:28px; border-radius:12px; }
.band .section-head h2 span, .band .section-head > a { color:var(--green); }
.band .section-intro { color:#bbccc4; }
.band .card { background:#214237; border-color:#3a584b; }
.band .card p, .band .card .meta { color:#c0d0c7; }
.band a:hover { color:var(--green); }
.duo { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.duo > .section { min-width:0; }
.duo .cards { grid-template-columns:1fr 1fr; gap:16px; }
.compact .cards { grid-template-columns:1fr 1fr; }
.compact .card { flex-direction:row; }
.compact .image { width:37%; flex-shrink:0; }
.compact img { height:100%; aspect-ratio:1; }
.compact .card h3 { font-size:17px; }
.rank-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid var(--line); border-radius:10px; background:white; }
.rank-item { padding:24px; border-right:1px solid var(--line); }
.rank-item:last-child { border:0; }
.rank-item b { font-size:38px; line-height:1; color:#99b293; font-family:Georgia,serif; font-style:italic; }
.rank-item h3 { font-size:17px; line-height:1.6; }
.rank-item p { font-size:13px; color:var(--muted); }
.about { display:grid; grid-template-columns:1fr 2fr; gap:45px; padding:32px 0; border-top:1px solid var(--line); }
.about h2 { font-size:27px; margin:0; }
.about p { color:var(--muted); margin:0 0 10px; }
.subscribe { background:#e3efcf; border:1px solid #d1dfb8; border-radius:12px; padding:28px 34px; display:flex; align-items:center; gap:28px; margin-top:30px; }
.subscribe img { width:92px; height:92px; }
.subscribe div { flex:1; }
.subscribe h2 { font-size:24px; margin:0 0 6px; }
.subscribe p { margin:0; color:#4a6244; font-size:14px; }
.button { background:var(--deep); color:white; border:0; border-radius:6px; padding:12px 22px; display:inline-block; font-size:14px; text-align:center; }
.button:hover { color:var(--green); }
.footer { background:#10291f; padding:42px 0 20px; color:#bfcdc4; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:38px; }
.footer h2 { color:white; font-size:23px; margin:0 0 10px; }
.footer h3 { color:white; font-size:14px; margin:0 0 14px; }
.footer p, .footer a { font-size:13px; }
.footer a { display:block; margin:7px 0; }
.footer a:hover { color:var(--green); }
.copyright { border-top:1px solid #ffffff20; margin-top:30px; padding-top:18px; font-size:12px; display:flex; justify-content:space-between; gap:20px; }
.breadcrumb { display:flex; flex-wrap:wrap; gap:10px; font-size:13px; color:var(--muted); margin:25px 0; }
.page-heading { border-bottom:1px solid var(--line); padding:8px 0 30px; margin-bottom:28px; }
.page-heading h1 { font-size:40px; margin:0 0 13px; line-height:1.35; }
.page-heading p { color:var(--muted); max-width:800px; }
.category-feature { display:grid; grid-template-columns:1.25fr 1fr; overflow:hidden; border-radius:12px; background:var(--deep); color:white; }
.category-feature > img { width:100%; height:100%; min-height:290px; aspect-ratio:16/9; object-fit:cover; }
.feature-copy { padding:32px; }
.feature-copy h2 { font-size:27px; line-height:1.5; }
.feature-copy p { color:#bfd0c6; }
.feature-copy .button { background:var(--green); color:var(--deep); }
.more-panel { padding:23px; margin-top:26px; border:1px dashed #b3c8af; border-radius:8px; font-size:14px; background:#edf3e8; }
.more-panel p { margin:0 0 10px; }
.more-panel a { display:inline-block; margin-right:22px; color:var(--accent); }
.article-layout { display:grid; grid-template-columns:minmax(0,820px) minmax(240px,1fr); gap:40px; align-items:start; }
.article { background:white; padding:36px; border:1px solid var(--line); border-radius:10px; }
.article h1 { font-size:34px; line-height:1.5; margin:13px 0 18px; }
.article .lead { font-size:19px; color:#4d6358; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.article .byline { color:var(--muted); font-size:13px; }
.notice { background:#f0f5eb; border-left:3px solid #8cab59; padding:13px 17px; font-size:13px; color:#5f7257; }
.article section { margin-top:30px; }
.article section h2 { font-size:24px; }
.article section p { line-height:2.1; }
figure { margin:24px 0; }
figure img { width:100%; aspect-ratio:16/9; object-fit:cover; background:#dae4dc; border-radius:7px; }
figcaption { font-size:12px; color:var(--muted); margin-top:8px; }
.chapter-end { color:var(--muted); font-size:13px; border-top:1px solid var(--line); padding-top:12px; }
.article-nav { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:28px; }
.article-nav a, .article-nav div { padding:16px; border:1px solid var(--line); border-radius:6px; font-size:14px; }
.article-nav small { display:block; color:var(--muted); margin-bottom:7px; }
.aside { background:white; border:1px solid var(--line); padding:24px; border-radius:9px; }
.aside h2 { font-size:21px; margin:0 0 16px; }
.aside a { display:block; padding:14px 0; border-top:1px solid var(--line); font-size:15px; }
.aside p { color:var(--muted); font-size:14px; }
.prose { max-width:850px; background:white; padding:36px; border:1px solid var(--line); border-radius:10px; }
.prose h1 { font-size:32px; }
.prose h2 { font-size:23px; margin-top:30px; }
.prose p { line-height:2; }
dialog { width:min(520px,calc(100% - 32px)); padding:30px; border:1px solid var(--line); border-radius:12px; }
dialog::backdrop { background:#102a22aa; }
dialog h2 { margin-top:0; font-size:24px; }
dialog p { font-size:14px; }
dialog .close-dialog { float:right; border:0; background:none; font-size:23px; }
.feed-address { display:block; padding:12px; background:#f0f4ed; font-size:13px; overflow-wrap:anywhere; margin-bottom:18px; }
.image-failed { opacity:.65; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *, *::before, *::after { animation:none !important; transition:none !important; } }
