/* ============================================================
   安网 · anwang-tech  设计系统
   深色 · 终端极客  |  单一强调色: 磷光绿  |  无衬线(Inter)+ 等宽(JetBrains Mono)
   taste 规则: 无紫 / 无 em-dash / hero 适配视口 / 无三等分卡 / 单 CTA 意图 / reduced-motion 门控
   ============================================================ */

:root{
  /* 颜色: 中性近黑底 + 磷光绿强调 */
  --bg:#0a0a0a;
  --bg-soft:#0e0e0e;
  --surface:#141414;
  --surface-2:#1a1a1a;
  --border:#262626;
  --border-soft:#1b1b1b;
  --text:#e8e8e4;
  --text-dim:#b8b8b0;
  --text-faint:#8c8c84;
  --accent:#4ade80;          /* 磷光绿 (green-400) */
  --accent-dim:#22c55e;
  --accent-ink:#052012;      /* 绿底上的深色文字 */
  --glow:rgba(74,222,128,.16);
  --cyan:#22d3ee;            /* 仅用于终端输出里的语法高亮,非主色 */

  /* 字体 */
  --font-sans:"Inter",-apple-system,"Segoe UI",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono","Cascadia Code",Menlo,Consolas,monospace;

  /* 间距 / 圆角 / 字号 */
  --wrap:1140px;
  --pad-x:clamp(20px,5vw,48px);
  --r-sm:8px; --r-md:12px; --r-lg:18px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-sans);
  font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  /* 顶部磷光绿晕 + 极淡网格 */
  background-image:
    radial-gradient(1200px 600px at 78% -8%, rgba(74,222,128,.10), transparent 60%),
    radial-gradient(1px 1px at 1px 1px, rgba(255,255,255,.035) 1px, transparent 0);
  background-size:auto, 34px 34px;
  background-attachment:fixed;
}
::selection{ background:rgba(74,222,128,.28); color:#eafff1; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.mono{ font-family:var(--font-mono); }

/* ---------- 布局容器 ---------- */
.wrap{ max-width:var(--wrap); margin:0 auto; padding-inline:var(--pad-x); }
.section{ padding-block:clamp(56px,9vw,104px); }

/* ---------- 顶部状态栏 ---------- */
.aw-status{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.02em;
  color:var(--text-faint);
  border-bottom:1px solid var(--border-soft);
  background:rgba(10,10,10,.7);
}
.aw-status .wrap{ display:flex; align-items:center; gap:10px; height:34px; }
.aw-dot{ width:7px; height:7px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 0 0 var(--glow); animation:aw-pulse 2.4s ease-out infinite; }
.aw-status .r{ margin-left:auto; }

/* ---------- 头部导航 ---------- */
.aw-header{ position:sticky; top:0; z-index:50;
  background:rgba(10,10,10,.82); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border-soft); }
.aw-nav{ display:flex; align-items:center; gap:28px; height:64px; }
.aw-logo{ font-family:var(--font-mono); font-weight:700; font-size:17px; letter-spacing:-.01em; color:var(--text); }
.aw-logo b{ color:var(--accent); font-weight:700; }
.aw-logo .slash{ color:var(--text-faint); }
.aw-links{ display:flex; gap:28px; margin-left:8px; padding-left:24px; border-left:1px solid var(--border-soft); }
.aw-links a{ font-size:14.5px; color:var(--text-dim); transition:color .18s; }
.aw-links a:hover{ color:var(--text); }
.aw-nav .cta{ margin-left:auto; }

/* ---------- 按钮 ---------- */
.btn{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono);
  font-size:14px; font-weight:500; letter-spacing:.01em; cursor:pointer;
  padding:11px 18px; min-height:42px; border-radius:var(--r-sm); border:1px solid transparent; transition:.18s; }
.btn--primary{ background:var(--accent); color:var(--accent-ink); }
.btn--primary:hover{ background:#5ee79a; box-shadow:0 6px 26px -8px var(--glow),0 0 0 1px rgba(74,222,128,.5); transform:translateY(-1px); }
.btn--ghost{ border-color:var(--border); color:var(--text); background:transparent; }
.btn--ghost:hover{ border-color:var(--accent); color:var(--accent); }
.btn .arrow{ transition:transform .18s; } .btn:hover .arrow{ transform:translateX(3px); }

/* ---------- eyebrow (代码注释风, 非破折号) ---------- */
.eyebrow{ font-family:var(--font-mono); font-size:12.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent); margin:0 0 14px; }
.eyebrow .hash{ color:var(--text-faint); margin-right:6px; }

/* ---------- Hero ---------- */
.aw-hero{ min-height:calc(100dvh - 98px); display:flex; align-items:center; position:relative; }
.aw-hero::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(520px 420px at 82% 46%, rgba(74,222,128,.075), transparent 65%); }
.aw-hero .grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px,5vw,64px); align-items:center; width:100%; }
.aw-h1{ font-size:clamp(2.3rem,5.4vw,4rem); line-height:1.06; letter-spacing:-.025em;
  font-weight:800; margin:0 0 22px; }
.aw-h1 .accent{ color:var(--accent); }
.aw-sub{ font-size:clamp(1rem,1.4vw,1.14rem); color:var(--text-dim); max-width:46ch; margin:0 0 30px; }
.aw-cta{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:34px; }
.aw-stack{ font-family:var(--font-mono); font-size:13px; color:var(--text-faint); }
.aw-stack i{ color:var(--border); font-style:normal; margin:0 8px; }
.aw-stack .k{ color:var(--text-dim); }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ---------- 终端窗口 ---------- */
.term{ background:linear-gradient(180deg,#151515,#0e0e0e); border:1px solid #323232;
  border-radius:var(--r-md); overflow:hidden; box-shadow:0 40px 90px -40px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.03) inset,0 0 60px -30px var(--glow); }
.term-bar{ display:flex; align-items:center; gap:8px; padding:11px 14px; border-bottom:1px solid var(--border-soft);
  background:rgba(255,255,255,.02); font-family:var(--font-mono); font-size:12px; color:var(--text-faint); }
.term-bar .dots{ display:flex; gap:6px; }
.term-bar .dots i{ width:10px; height:10px; border-radius:50%; background:#2a2a2a; }
.term-bar .dots i:first-child{ background:#ff5f57; } .term-bar .dots i:nth-child(2){ background:#febc2e; } .term-bar .dots i:nth-child(3){ background:#28c840; }
.term-bar .title{ margin-left:6px; letter-spacing:.02em; }
.term-body{ padding:22px 22px 24px; font-family:var(--font-mono); font-size:14px; line-height:1.9; }
.term-body .ln{ white-space:pre-wrap; word-break:break-word; margin-block:4px; }
.term-body .p{ color:var(--accent); margin-right:9px; }
.term-body .cmd{ color:var(--text); }
.term-body .out{ color:var(--text-dim); }
.term-body .out .hl{ color:var(--cyan); }
.term-body .out .g{ color:var(--accent); }
.caret{ display:inline-block; width:8px; height:1.05em; background:var(--accent); vertical-align:-2px; animation:aw-blink 1.1s steps(2) infinite; }

/* ---------- 小节头 ---------- */
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:38px; }
.sec-head h2{ font-size:clamp(1.6rem,3vw,2.3rem); letter-spacing:-.02em; font-weight:700; margin:0; }
.sec-head .more{ font-family:var(--font-mono); font-size:13px; color:var(--text-faint); }
.sec-head .more:hover{ color:var(--accent); }

/* ---------- 最新文章 (编辑式列表, 非三等分卡) ---------- */
.post-featured{ border:1px solid var(--border); border-radius:var(--r-lg); padding:clamp(24px,3vw,38px);
  background:linear-gradient(135deg,rgba(74,222,128,.06),transparent 55%),var(--surface); margin-bottom:26px; position:relative; overflow:hidden; }
.post-featured::after{ content:""; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--accent); opacity:.8; }
.post-meta{ font-family:var(--font-mono); font-size:12.5px; color:var(--text-faint); letter-spacing:.02em; margin-bottom:14px; }
.post-meta .cat{ color:var(--accent); }
.post-featured h3{ font-size:clamp(1.4rem,2.6vw,2rem); line-height:1.18; letter-spacing:-.02em; font-weight:700; margin:0 0 14px; }
.post-featured h3 a:hover{ color:var(--accent); }
.post-featured p{ color:var(--text-dim); max-width:62ch; margin:0 0 18px; }
.readmore{ font-family:var(--font-mono); font-size:13.5px; color:var(--accent); }
.readmore .arrow{ transition:transform .18s; } .readmore:hover .arrow{ transform:translateX(4px); }

.postlist{ border-top:1px solid var(--border-soft); }
.postrow{ display:grid; grid-template-columns:52px 1fr auto; gap:18px; align-items:center;
  padding:20px 10px; border-bottom:1px solid var(--border-soft); transition:background .18s; position:relative; }
.postrow:hover{ background:rgba(255,255,255,.02); }
.postrow .idx{ font-family:var(--font-mono); font-size:13px; color:var(--text-faint); }
.postrow h4{ font-size:1.08rem; font-weight:600; margin:0 0 6px; letter-spacing:-.01em; }
.postrow h4 a:hover{ color:var(--accent); }
.postrow .meta{ font-family:var(--font-mono); font-size:12px; color:var(--text-faint); }
.postrow .meta .cat{ color:var(--text-dim); }
.postrow .arrow{ color:var(--text-faint); opacity:0; transition:.18s; }
.postrow:hover .arrow{ opacity:1; color:var(--accent); transform:translateX(3px); }

/* ---------- 专栏 bento (非等分) ---------- */
.bento{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.cell{ border:1px solid var(--border); border-radius:var(--r-md); padding:22px; background:var(--surface);
  display:flex; flex-direction:column; justify-content:space-between; gap:18px; min-height:150px; transition:.2s; position:relative; overflow:hidden; }
.cell:hover{ border-color:rgba(74,222,128,.5); background:var(--surface-2); transform:translateY(-2px); }
.cell .top{ display:flex; align-items:center; justify-content:space-between; }
.cell h4{ margin:0; font-size:1.08rem; font-weight:700; }
.cell .en{ font-family:var(--font-mono); font-size:12px; color:var(--text-faint); }
.cell .count{ font-family:var(--font-mono); font-size:12px; color:var(--accent); border:1px solid var(--border); border-radius:999px; padding:3px 9px; }
.cell p{ margin:0; color:var(--text-dim); font-size:14px; max-width:34ch; }
.cell--big{ grid-column:span 3; grid-row:span 2; min-height:320px; background:linear-gradient(150deg,rgba(74,222,128,.10),transparent 60%),var(--surface); }
.cell--big h4{ font-size:1.5rem; }
.cell--big .glyph{ font-family:var(--font-mono); font-size:34px; color:var(--accent); opacity:.9; }
.cell--w{ grid-column:span 3; }
.cell--s{ grid-column:span 3; }

/* ---------- 订阅 ---------- */
.sub-term{ max-width:720px; margin:0 auto; }
.sub-row{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.sub-row input{ flex:1; min-width:220px; background:var(--bg); border:1px solid var(--border); border-radius:var(--r-sm);
  color:var(--text); font-family:var(--font-mono); font-size:14px; padding:11px 14px; outline:none; transition:.18s; }
.sub-row input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px var(--glow); }
.sub-note{ font-family:var(--font-mono); font-size:12.5px; color:var(--text-faint); margin-top:14px; }

/* ---------- 页脚 ---------- */
.aw-footer{ border-top:1px solid var(--border-soft); background:var(--bg-soft); }
.aw-footer .wrap{ display:flex; align-items:center; gap:24px; flex-wrap:wrap; padding-block:34px; }
.aw-footer .brand{ font-family:var(--font-mono); font-size:14px; color:var(--text-dim); }
.aw-footer .brand b{ color:var(--accent); }
.aw-footer p{ margin:2px 0 0; font-size:13px; color:var(--text-faint); }
.aw-footer nav{ display:flex; gap:22px; margin-left:auto; }
.aw-footer nav a{ font-size:13.5px; color:var(--text-dim); } .aw-footer nav a:hover{ color:var(--accent); }
.aw-footer .exit{ font-family:var(--font-mono); font-size:12px; color:var(--text-faint); width:100%; }

/* ---------- 入场动画 (JS 加 .in, reduced-motion 关闭) ---------- */
.anwang-front .reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }

@keyframes aw-blink{ 50%{ opacity:0; } }
@keyframes aw-pulse{ 0%{ box-shadow:0 0 0 0 var(--glow); } 70%{ box-shadow:0 0 0 7px transparent; } 100%{ box-shadow:0 0 0 0 transparent; } }

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .aw-hero .grid{ grid-template-columns:1fr; }
  .aw-hero{ min-height:auto; padding-block:40px; }
  .aw-links{ display:none; }
  .bento{ grid-template-columns:repeat(2,1fr); }
  .cell--big{ grid-column:span 2; grid-row:span 1; min-height:180px; }
  .cell--w,.cell--s{ grid-column:span 1; }
}
@media (max-width:560px){
  .bento{ grid-template-columns:1fr; }
  .cell--big,.cell--w,.cell--s{ grid-column:span 1; }
  .postrow{ grid-template-columns:34px 1fr; } .postrow .arrow{ display:none; }
  .aw-footer .wrap{ flex-direction:column; align-items:flex-start; }
  .aw-footer nav{ margin-left:0; }
}

/* ---------- 无障碍: 减弱动态 ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .caret,.aw-dot{ animation:none; }
  .anwang-front .reveal, .reveal.in{ opacity:1; transform:none; transition:none; }
  *{ transition-duration:.001ms !important; }
}