@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Noto+Sans+SC:wght@400;700&display=swap");
:root {
  --bg:#071019; --panel:rgba(13,29,42,.78); --line:rgba(142,197,214,.22);
  --text:#eaf4f5; --muted:#a5bdc3; --cyan:#67e8f9; --mint:#8df7d1;
  --shadow:0 24px 80px rgba(0,0,0,.28);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:var(--bg); font-family:Inter,"Noto Sans SC","Microsoft YaHei",system-ui,sans-serif; line-height:1.8; overflow-wrap:break-word; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; z-index:-1; opacity:.38; background-image:linear-gradient(rgba(103,232,249,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(103,232,249,.045) 1px,transparent 1px); background-size:44px 44px; mask-image:linear-gradient(to bottom,#000,transparent 76%); }
a { color:inherit; text-decoration:none; }
a:focus-visible, summary:focus-visible { outline:3px solid var(--cyan); outline-offset:5px; border-radius:3px; }
.shell { width:min(800px,calc(100% - 48px)); margin:0 auto; }
.shell-wide { width:min(1160px,calc(100% - 48px)); margin:0 auto; }
.skip-link { position:fixed; top:8px; left:12px; z-index:30; padding:10px 16px; color:var(--bg); background:var(--mint); transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.topbar { position:fixed; inset:0 0 auto; z-index:10; border-bottom:1px solid var(--line); background:rgba(7,16,25,.95); backdrop-filter:blur(18px); }
.nav { height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.03em; white-space:nowrap; }
.brand-mark { width:43px; height:32px; display:inline-flex; flex-shrink:0; filter:drop-shadow(0 0 8px rgba(103,232,249,.18)); }
.brand-mark svg { width:43px; height:32px; display:block; }
.nav-links { display:flex; gap:18px; color:var(--muted); font-size:14px; }
.nav-links a { padding:10px 0; white-space:nowrap; }
.nav-links a:hover, .nav-links a.active { color:var(--cyan); }
.language-switch { display:inline-flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:999px; background:rgba(13,29,42,.72); }
.language-switch button { border:0; border-radius:999px; padding:5px 9px; color:var(--muted); background:transparent; font:700 12px/1 inherit; cursor:pointer; }
.language-switch button:hover, .language-switch button[aria-pressed="true"] { color:var(--bg); background:var(--mint); }
.nav-cta { color:var(--bg); background:var(--mint); padding:9px 16px; border-radius:999px; font-size:14px; font-weight:800; white-space:nowrap; }
.mobile-menu { display:none; }
.page-main { padding:120px 0 80px; }
.section-kicker { color:var(--cyan); letter-spacing:.13em; font-size:12px; text-transform:uppercase; font-weight:800; }
.page-main h1 { margin:8px 0 12px; font-size:clamp(32px,5vw,48px); letter-spacing:-.03em; }
.page-intro { color:var(--muted); margin:0 0 36px; }
.post-list { display:grid; gap:18px; }
.post-card { display:block; padding:26px 28px; border:1px solid var(--line); border-radius:18px; background:var(--panel); box-shadow:var(--shadow); }
.post-card:hover { border-color:rgba(103,232,249,.45); }
.post-card time { color:var(--cyan); font-size:13px; font-weight:700; letter-spacing:.04em; }
.post-card h2 { margin:8px 0 10px; font-size:24px; }
.post-card p { margin:0; color:var(--muted); }
.post-empty { padding:40px 28px; border:1px dashed var(--line); border-radius:18px; color:var(--muted); }
.article-body { padding-bottom:40px; }
.article-body time { color:var(--cyan); font-size:13px; font-weight:700; }
.article-body h1 { margin:10px 0 24px; }
.article-content { color:var(--text); }
.article-content a { color:var(--cyan); }
.article-content p { margin:0 0 1.1em; }
.back-link { display:inline-block; margin-bottom:28px; color:var(--mint); font-weight:700; }
.pagination { display:flex; gap:12px; margin-top:28px; color:var(--muted); }
.pagination a, .pagination span { color:var(--cyan); }
.site-foot { border-top:1px solid var(--line); padding:28px 0 40px; color:var(--muted); font-size:14px; }
@media (max-width:960px) {
  .nav-links { display:none; }
  .mobile-menu { display:block; margin-left:auto; }
  .mobile-menu summary { cursor:pointer; list-style:none; min-height:44px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; color:var(--cyan); font-size:14px; }
  .mobile-menu summary::-webkit-details-marker { display:none; }
  .mobile-links { position:absolute; top:75px; left:0; right:0; padding:16px 24px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; background:#0d1d2a; border-bottom:1px solid var(--line); box-shadow:var(--shadow); }
  .mobile-links a { padding:10px 14px; border-radius:6px; font-size:15px; }
  .mobile-links a:hover, .mobile-links a.active { background:rgba(103,232,249,.1); color:var(--cyan); }
}
@media (max-width:360px) {
  .brand > span:last-child { font-size:11px; }
  .nav-cta { padding:9px; }
}