:root { --ink: #111310; --paper: #f5f5ef; --white: #fff; --muted: #6a6e67; --line: #d8dad2; --acid: #c6ff3f; --cobalt: #3b5cff; --shell: 1180px; }
* { box-sizing: border-box; } html { scroll-behavior: smooth; } body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, "SF Pro Display", "PingFang SC", "Microsoft YaHei", Arial, sans-serif; line-height: 1.6; letter-spacing: 0; -webkit-font-smoothing: antialiased; } a { color: inherit; text-decoration: none; } button { color: inherit; font: inherit; letter-spacing: 0; } [hidden] { display: none !important; }.news-shell { width: min(var(--shell), calc(100% - 64px)); margin-inline: auto; }.skip-link { position: fixed; z-index: 100; left: 16px; top: -80px; padding: 10px 14px; background: var(--acid); }.skip-link:focus { top: 12px; }
.news-site-header { height: 76px; display: flex; align-items: center; justify-content: space-between; padding: 0 max(32px, calc((100vw - var(--shell)) / 2)); color: var(--white); background: var(--ink); border-bottom: 1px solid rgba(255,255,255,.14); }.news-brand { display: flex; align-items: center; gap: 11px; }.news-brand b { font-size: 18px; }.news-brand img, .news-brand-mark { width: 30px; height: 30px; object-fit: contain; }.news-brand-mark { position: relative; display: block; border: 1px solid currentColor; }.news-brand-mark i { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--acid); }.news-brand-mark i:nth-child(1) { left: 6px; top: 6px; }.news-brand-mark i:nth-child(2) { right: 6px; top: 11px; }.news-brand-mark i:nth-child(3) { left: 9px; bottom: 5px; }.news-brand-mark::before, .news-brand-mark::after { content: ""; position: absolute; height: 1px; background: currentColor; opacity: .7; }.news-brand-mark::before { width: 15px; left: 9px; top: 9px; transform: rotate(21deg); }.news-brand-mark::after { width: 13px; left: 12px; top: 19px; transform: rotate(-25deg); }.news-site-header nav { display: flex; gap: 30px; color: rgba(255,255,255,.62); font-size: 12px; }.news-site-header nav a:hover, .news-site-header nav a[aria-current] { color: var(--white); }
.news-index { min-height: calc(100svh - 76px); padding: 86px 0 110px; }.news-index-heading { display: grid; grid-template-columns: 1fr 410px; align-items: end; gap: 60px; padding-bottom: 48px; border-bottom: 1px solid var(--ink); }.news-index-heading span, .article-meta, .article-byline span, .article-footer > span { color: var(--cobalt); font: 600 10px/1.2 "SFMono-Regular", Consolas, monospace; }.news-index-heading h1 { margin: 16px 0 0; font-size: 68px; line-height: 1.05; }.news-index-heading p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.8; }.news-filter-row { min-height: 76px; display: flex; align-items: center; gap: 8px; overflow-x: auto; }.news-filter-row button { min-height: 34px; padding: 0 12px; border: 1px solid var(--line); border-radius: 2px; background: transparent; font-size: 11px; white-space: nowrap; cursor: pointer; }.news-filter-row button.active { color: var(--white); background: var(--ink); border-color: var(--ink); }.news-list-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; }.news-featured { grid-row: span 2; min-height: 620px; color: var(--white); background: var(--ink) !important; border-color: var(--ink) !important; }.news-index-card { min-height: 300px; display: flex; flex-direction: column; padding: 30px; border: 1px solid var(--line); border-radius: 6px; background: var(--white); transition: transform .22s ease, border-color .22s ease; }.news-index-card:hover { transform: translateY(-3px); border-color: #aeb2aa; }.news-index-card .card-meta { display: flex; justify-content: space-between; color: var(--cobalt); font: 600 10px/1.2 monospace; }.news-index-card .card-meta time { color: var(--muted); }.news-featured .card-meta { color: var(--acid); }.news-featured .card-meta time { color: rgba(255,255,255,.42); }.news-index-card h2 { margin: auto 0 14px; font-size: 26px; line-height: 1.38; }.news-featured h2 { font-size: 40px; }.news-index-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.8; }.news-featured p { color: rgba(255,255,255,.58); }.news-index-card .card-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 32px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }.news-featured .card-foot { border-color: rgba(255,255,255,.16); color: rgba(255,255,255,.5); }.news-index-card .card-foot b { font-size: 20px; }.news-empty { min-height: 360px; display: grid; place-content: center; justify-items: center; border: 1px solid var(--line); color: var(--muted); }.news-empty span { font: 700 46px/1 monospace; }.news-empty h2 { margin: 15px 0 0; font-size: 18px; }
.news-article { padding: 58px 0 110px; }.article-top { display: flex; justify-content: space-between; align-items: center; }.article-top a, .article-top button { border: 0; background: transparent; color: var(--muted); font-size: 11px; cursor: pointer; }.article-top button { padding: 9px 12px; border: 1px solid var(--line); }.article-header { max-width: 980px; padding-top: 92px; }.article-meta { display: flex; gap: 22px; }.article-header h1 { max-width: 960px; margin: 22px 0 28px; font-size: 58px; line-height: 1.18; }.article-header > p { max-width: 760px; margin: 0; color: var(--muted); font-size: 20px; line-height: 1.75; }.article-byline { display: flex; gap: 12px; align-items: center; margin-top: 36px; font-size: 11px; }.article-rule { height: 160px; margin: 70px 0; background: var(--ink); }.article-body { max-width: 820px; }.article-body p { margin: 0 0 28px; color: #383c36; font-size: 17px; line-height: 2; white-space: pre-line; }.article-body h2 { margin: 58px 0 22px; font-size: 31px; line-height: 1.35; }.article-body blockquote { margin: 44px 0; padding: 20px 0 20px 28px; border-left: 3px solid var(--cobalt); font-size: 21px; line-height: 1.7; }.article-footer { max-width: 900px; display: grid; grid-template-columns: 120px 1fr; gap: 30px; margin-top: 100px; padding-top: 36px; border-top: 1px solid var(--ink); }.article-footer div { display: flex; align-items: center; justify-content: space-between; gap: 30px; }.article-footer h2 { margin: 0; font-size: 25px; }.article-footer a { color: var(--cobalt); font-size: 12px; font-weight: 650; }
.news-state { min-height: calc(100svh - 146px); display: grid; place-content: center; justify-items: center; text-align: center; }.news-state > span { font: 700 54px/1 monospace; }.news-state h1 { margin: 20px 0 4px; font-size: 26px; }.news-state p { margin: 0; color: var(--muted); }.news-footer { min-height: 78px; display: flex; align-items: center; color: rgba(255,255,255,.55); background: var(--ink); }.news-footer > div { display: flex; align-items: center; gap: 30px; font-size: 10px; }.news-footer b { color: var(--white); }.news-footer a { margin-left: auto; color: var(--acid); }
@media (max-width: 860px) { .news-index-heading { grid-template-columns: 1fr; gap: 24px; }.news-index-heading h1 { font-size: 54px; }.news-list-grid { grid-template-columns: 1fr; }.news-featured { grid-row: auto; min-height: 460px; }.news-featured h2 { font-size: 34px; }.article-header h1 { font-size: 46px; }.article-rule { height: 110px; } }
@media (max-width: 600px) { .news-shell { width: calc(100% - 36px); }.news-site-header { height: 66px; padding-inline: 18px; }.news-site-header nav { gap: 16px; }.news-site-header nav a:first-child { display: none; }.news-index { padding: 62px 0 80px; }.news-index-heading h1 { font-size: 44px; }.news-index-heading p { font-size: 14px; }.news-index-card, .news-featured { min-height: 340px; padding: 24px; }.news-index-card h2, .news-featured h2 { font-size: 25px; }.news-article { padding-top: 34px; }.article-header { padding-top: 58px; }.article-header h1 { font-size: 35px; }.article-header > p { font-size: 17px; }.article-rule { height: 76px; margin: 52px 0; }.article-body p { font-size: 16px; }.article-footer { grid-template-columns: 1fr; }.article-footer div { align-items: flex-start; flex-direction: column; }.news-footer > div { align-items: flex-start; flex-direction: column; gap: 6px; padding-block: 20px; }.news-footer a { margin-left: 0; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition-duration: .01ms !important; } }