/* ============================================================
   Codex Harness Research · 站点样式
   设计语言取自 ResearchHub（PowerPulse）：学术 × 科技浅色风
   ============================================================ */
:root {
  --bg: #f7f9fc; --card: #ffffff; --border: #e2e8f0; --border-hover: #cbd5e1;
  --text: #1a202c; --dim: #64748b; --muted: #94a3b8;
  --primary: #1a365d; --primary-light: #2b6cb0; --link: #2b6cb0;
  --tag-bg: #f1f5f9;
  --accent-blue: #3b82f6; --accent-purple: #a855f7; --accent-green: #22c55e; --accent-gold: #f59e0b;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --serif: "Source Serif Pro", Georgia, serif;
  --sans: -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  --mono: "SF Mono", Consolas, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--sans); color: var(--text); line-height: 1.7;
  background-color: var(--bg);
  background-image:
    linear-gradient(rgba(26,54,93,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,54,93,0.05) 1px, transparent 1px);
  background-size: 34px 34px;
}

/* ============ 导航 ============ */
.nav {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255,255,255,0.85); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border);
  padding: 13px 32px;
  display: flex; align-items: center; justify-content: space-between;
}
.nav a { color: var(--dim); text-decoration: none; font-size: 13.5px; transition: color .2s; }
.nav a:hover { color: var(--primary); }
.nav-brand { font-weight: 700; font-size: 15px; color: var(--primary); letter-spacing: .3px; text-decoration: none; }
.nav-links { display: flex; gap: 20px; align-items: center; }

/* ============ HERO ============ */
.hero { position: relative; overflow: hidden; padding: 56px 32px 36px; }
.blob { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .5; pointer-events: none; }
.blob-1 { width: 460px; height: 460px; background: radial-gradient(circle, rgba(43,108,176,.26), transparent 65%); top: -160px; left: -80px; animation: drift1 22s ease-in-out infinite; }
.blob-2 { width: 400px; height: 400px; background: radial-gradient(circle, rgba(168,85,247,.18), transparent 65%); top: -60px; right: -60px; animation: drift2 26s ease-in-out infinite; }
.blob-3 { width: 300px; height: 300px; background: radial-gradient(circle, rgba(34,197,94,.13), transparent 65%); bottom: -140px; left: 42%; animation: drift3 30s ease-in-out infinite; }
@keyframes drift1 { 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(70px,50px) scale(1.12);} }
@keyframes drift2 { 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-60px,70px) scale(1.08);} }
@keyframes drift3 { 0%,100%{transform:translate(0,0);} 50%{transform:translate(40px,-60px);} }
.hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(rgba(26,54,93,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,54,93,0.06) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: radial-gradient(ellipse 75% 90% at 50% 0%, black 30%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 75% 90% at 50% 0%, black 30%, transparent 78%);
}
.hero-inner { position: relative; max-width: 1200px; margin: 0 auto; }
.hero h1 {
  font-family: var(--serif); font-size: 38px; font-weight: 700; letter-spacing: -.5px;
  background: linear-gradient(90deg, var(--primary), var(--primary-light) 45%, var(--accent-purple) 90%);
  background-size: 220% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  animation: titleFlow 9s linear infinite;
}
@keyframes titleFlow { 0% { background-position: 0% 50%; } 100% { background-position: 220% 50%; } }
.hero-sub { color: var(--dim); font-size: 15.5px; margin: 10px 0 14px; max-width: 860px; }
.hero-line { width: 88px; height: 3px; border-radius: 2px; margin-bottom: 26px;
  background: linear-gradient(90deg, var(--primary), var(--accent-purple)); }

/* ============ 统计卡 ============ */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; margin-top: 10px; }
.stat-card {
  background: rgba(255,255,255,.85); backdrop-filter: blur(8px);
  border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px;
  transition: transform .25s var(--ease), box-shadow .25s, border-color .25s;
  position: relative; overflow: hidden;
}
.stat-card::after { content:""; position:absolute; inset:auto -30% -60% auto; width: 120px; height: 120px; border-radius: 50%;
  background: radial-gradient(circle, rgba(43,108,176,.10), transparent 70%); }
.stat-card:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(26,54,93,.10); border-color: var(--border-hover); }
.stat-num { font-family: var(--serif); font-size: 28px; font-weight: 700; color: var(--primary); font-variant-numeric: tabular-nums; }
.stat-label { font-size: 12.5px; color: var(--dim); margin-top: 2px; }

/* ============ 通用区块 ============ */
.wrap { max-width: 1200px; margin: 0 auto; padding: 28px 32px 48px; }
.sec-title { font-family: var(--serif); font-size: 24px; color: var(--primary); margin: 36px 0 6px; }
.sec-sub { color: var(--dim); font-size: 14px; margin-bottom: 18px; }

/* 卡片网格 */
.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.card {
  background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 20px 22px;
  transition: transform .25s var(--ease), box-shadow .25s, border-color .25s;
}
.card:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(26,54,93,.10); border-color: var(--border-hover); }
.card h3 { font-family: var(--serif); font-size: 17.5px; color: var(--primary); margin-bottom: 8px; }
.card p { font-size: 14px; color: var(--dim); }
.card a { color: inherit; text-decoration: none; }
.chip { display:inline-block; background: var(--tag-bg); color: var(--primary); font-size: 12px;
  padding: 2px 11px; border-radius: 999px; margin: 0 6px 6px 0; }
.kw-tag { background: rgba(43,108,176,0.1); color: var(--link); padding: 3px 12px; border-radius: 999px; font-size: 12.5px; display: inline-block; margin: 2px 4px 2px 0; }
.tag { background: var(--tag-bg); padding: 2px 10px; border-radius: 4px; font-size: 12px; color: var(--primary); }

/* 高亮横幅（significance 风格） */
.callout {
  background: linear-gradient(135deg, #1a365d, #2b6cb0); color: #fff;
  padding: 18px 24px; border-radius: 12px; margin: 22px 0;
  font-size: 16px; font-family: var(--serif); font-weight: 500; line-height: 1.65;
  box-shadow: 0 4px 14px rgba(26,54,93,0.15);
}
.callout::before { content: "💡 "; }

/* ============ 正文页（报告章节） ============ */
.doc { max-width: 880px; margin: 0 auto; padding: 32px 24px 56px; }
.doc-head { margin-bottom: 26px; }
.doc-head h1 { font-family: var(--serif); font-size: 27px; color: var(--primary); line-height: 1.4; margin-bottom: 10px; }
.doc-meta { font-size: 13.5px; color: var(--dim); display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.pager { display: flex; justify-content: space-between; margin-top: 40px; gap: 12px; }
.pager a { background: var(--card); border: 1px solid var(--border); border-radius: 10px;
  padding: 12px 18px; text-decoration: none; color: var(--primary); font-size: 14px;
  transition: border-color .2s, box-shadow .2s; }
.pager a:hover { border-color: var(--border-hover); box-shadow: 0 6px 18px rgba(26,54,93,.08); }

/* 内容块 */
.block { background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 24px 28px; margin: 18px 0; }
.block h2 { font-family: var(--serif); font-size: 19px; color: var(--primary); margin-bottom: 14px;
  padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.block h3 { font-family: var(--serif); font-size: 16px; color: var(--primary); margin: 18px 0 8px; }
.block h4 { font-size: 14.5px; color: var(--primary); margin: 14px 0 6px; }
.block p { font-size: 15px; line-height: 1.9; margin: 10px 0; }
.block ul, .block ol { padding-left: 24px; margin: 10px 0; }
.block li { font-size: 14.5px; line-height: 1.85; margin: 4px 0; }
.block strong { color: var(--primary); }
.block a { color: var(--link); }

/* 公式容器：KaTeX 展示公式允许横向滚动 */
.katex-display { overflow-x: auto; overflow-y: hidden; padding: 4px 0; }

/* ASCII 图 / 等宽内容 */
pre.diagram {
  background: #0f1e33; color: #dbe7f5; font-family: var(--mono); font-size: 12.5px; line-height: 1.5;
  border-radius: 10px; padding: 18px 20px; overflow-x: auto; margin: 14px 0;
}

/* 源码代码块 */
pre.code {
  background: #f8fafc; border: 1px solid var(--border); border-left: 3px solid var(--primary-light);
  font-family: var(--mono); font-size: 12.5px; line-height: 1.6;
  border-radius: 8px; padding: 16px 18px; overflow-x: auto; margin: 14px 0; color: #24344d;
}
pre.code code { font-family: inherit; }
code.inline {
  background: var(--tag-bg); border-radius: 4px; padding: 1px 6px;
  font-family: var(--mono); font-size: 0.9em; color: var(--primary);
}

/* Mermaid 图表容器 */
.mermaid {
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  padding: 18px; margin: 16px 0; text-align: center; overflow-x: auto;
}
.mermaid svg { max-width: 100%; }

/* 表格 */
.tbl-wrap { overflow-x: auto; margin: 14px 0; }
table.tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; background: var(--card); }
table.tbl th { background: var(--primary); color: #fff; font-weight: 600; padding: 9px 12px; text-align: left; white-space: nowrap; }
table.tbl td { border-bottom: 1px solid var(--border); padding: 8px 12px; color: var(--text); vertical-align: top; }
table.tbl tr:nth-child(even) td { background: #fbfcfe; }
table.tbl tr:hover td { background: var(--tag-bg); }

/* 引用块 */
blockquote { border-left: 3px solid var(--primary-light); background: var(--tag-bg);
  margin: 14px 0; padding: 12px 18px; border-radius: 0 8px 8px 0; color: var(--text); font-size: 14.5px; }

/* 目录树 */
.toc-link { display: block; padding: 7px 12px; border-radius: 6px; text-decoration: none; color: var(--link);
  font-size: 13.5px; border-left: 2px solid transparent; }
.toc-link:hover { background: var(--tag-bg); border-left-color: var(--link); }

/* 页脚 */
.footer { text-align: center; padding: 26px; color: var(--muted); font-size: 12px;
  border-top: 1px solid var(--border); margin-top: 40px; }

@media (max-width: 640px) {
  .nav { padding: 12px 16px; }
  .hero { padding: 40px 16px 28px; }
  .hero h1 { font-size: 28px; }
  .wrap, .doc { padding: 20px 14px 40px; }
  .block { padding: 18px 16px; }
}

/* ============ 日报侧边栏与日历 ============ */
.layout { display: flex; min-height: 100vh; align-items: stretch; }
.sidebar {
  width: 236px; flex: 0 0 236px; position: sticky; top: 0; height: 100vh;
  padding: 22px 16px; border-right: 1px solid var(--border);
  background: rgba(255,255,255,.72); backdrop-filter: blur(10px);
}
.sidebar .brand { font-weight: 700; font-size: 13.5px; color: var(--primary); margin-bottom: 16px; letter-spacing: .3px; }
.content-area { flex: 1; min-width: 0; }

.cal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.cal-title { font-size: 13px; font-weight: 600; color: var(--primary); font-variant-numeric: tabular-nums; }
.cal-nav { background: none; border: 1px solid var(--border); border-radius: 6px; width: 24px; height: 24px;
  cursor: pointer; color: var(--dim); font-size: 12px; line-height: 1; transition: border-color .2s, color .2s; }
.cal-nav:hover { border-color: var(--border-hover); color: var(--primary); }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.cal-dow { font-size: 11px; color: var(--muted); text-align: center; padding: 3px 0; }
.cal-day { position: relative; font-size: 12.5px; text-align: center; padding: 7px 0; border-radius: 8px;
  color: var(--dim); font-variant-numeric: tabular-nums; }
.cal-day.empty { visibility: hidden; }
.cal-day.has-report { color: #fff; background: var(--primary); cursor: pointer; font-weight: 600;
  transition: background .2s, transform .15s; }
.cal-day.has-report:hover { background: var(--primary-light); transform: translateY(-1px); }
.cal-day.today-outline { box-shadow: inset 0 0 0 2px var(--accent-gold); }
.cal-day.today-outline.has-report { box-shadow: inset 0 0 0 2px var(--accent-gold); }
.cal-tip { font-size: 11.5px; color: var(--muted); margin-top: 12px; line-height: 1.6; }

@media (max-width: 760px) {
  .layout { flex-direction: column; }
  .sidebar { position: static; width: auto; flex: none; height: auto; border-right: none;
    border-bottom: 1px solid var(--border); }
}
