/* ============================================================
   Annals of Open Public Science — 设计系统 v2
   ------------------------------------------------------------
   设计参考：Journal of Open Source Software (JOSS) 的做法 ——
   内容优先、极简框架、DOI 醒目、ISSN 在页脚、两个明确行动按钮。
   不使用任何外部字体、CDN 或图片，因此在中国大陆也秒开。
   ============================================================ */

:root{
  /* 文字 */
  --ink:#10151c;
  --body:#2f3742;
  --muted:#66707c;

  /* 色板：深海军蓝 + 暖纸色 + 哑光金 */
  --navy:#16365c;
  --navy-hi:#2b5c93;
  --gold:#9a7328;
  --gold-bg:#fbf6ea;
  --gold-line:#e8d9b8;

  /* 背景与线条 */
  --paper:#fbfaf7;
  --white:#ffffff;
  --line:#e5e2da;
  --line-soft:#efece5;

  --green:#1f6b3f;
  --green-bg:#eef8f1;

  /* 字体栈 */
  --serif:Georgia,"Times New Roman","Songti SC","SimSun",serif;
  --sans:-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Microsoft YaHei",sans-serif;
  --mono:Consolas,"Courier New",monospace;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

body{
  margin:0;
  background:var(--white);
  color:var(--body);
  font:16px/1.8 var(--sans);
  -webkit-font-smoothing:antialiased;
}

.wrap{max-width:900px;margin:0 auto;padding:0 26px}

/* ============================================================
   页头
   ============================================================ */
.topbar{
  background:var(--navy);
  color:#cfd9e6;
  font-size:12.5px;
  letter-spacing:.06em;
}
.topbar .wrap{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:9px;padding-bottom:9px;flex-wrap:wrap;gap:6px;
}
.topbar a{color:#e9eef5;text-decoration:none}
.topbar a:hover{text-decoration:underline}
.topbar .sep{opacity:.4;margin:0 8px}

header.masthead{
  border-bottom:1px solid var(--line);
  background:var(--paper);
  padding:34px 0 0;
}
.masthead-row{
  display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  padding-bottom:22px;
}
.mark{flex:0 0 auto;width:62px;height:62px;display:block}
.masthead-text{flex:1 1 300px;min-width:0}
.masthead h1{
  font-family:var(--serif);
  font-size:31px;line-height:1.15;margin:0 0 5px;
  color:var(--ink);font-weight:700;letter-spacing:-.3px;
}
.masthead h1 a{color:inherit;text-decoration:none}
.masthead .abbr{
  font-family:var(--sans);font-size:11.5px;font-weight:700;
  color:var(--navy);letter-spacing:.12em;
  border:1px solid var(--navy);border-radius:3px;
  padding:1px 6px;margin-left:9px;vertical-align:2px;
}
.masthead .sub{
  font-family:var(--serif);font-size:16.5px;color:var(--muted);
  margin:0;font-style:italic;line-height:1.45;
}

/* 导航 */
nav.mainnav{
  border-top:1px solid var(--line-soft);
  font-size:14px;
  letter-spacing:.01em;
}
nav.mainnav .wrap{padding-top:0;padding-bottom:0}
nav.mainnav a{
  display:inline-block;color:var(--navy);text-decoration:none;
  padding:12px 0;margin-right:26px;
  border-bottom:2px solid transparent;
}
nav.mainnav a:hover{color:var(--navy-hi);border-bottom-color:var(--navy-hi)}
nav.mainnav a.current{color:var(--ink);font-weight:700;border-bottom-color:var(--gold)}

/* ============================================================
   主内容
   ============================================================ */
main{padding:40px 0 8px}

h2{
  font-family:var(--serif);
  font-size:22px;color:var(--ink);font-weight:700;
  margin:44px 0 14px;padding-bottom:9px;
  border-bottom:1px solid var(--line);
  letter-spacing:-.2px;
}
h2:first-child{margin-top:0}
h3{
  font-family:var(--serif);
  font-size:17px;color:var(--ink);font-weight:700;
  margin:26px 0 7px;
}
p{margin:0 0 15px}
a{color:var(--navy-hi);text-decoration:none;border-bottom:1px solid rgba(43,92,147,.25)}
a:hover{color:var(--navy);border-bottom-color:var(--navy)}
ul,ol{padding-left:24px;margin:0 0 15px}
li{margin:0 0 8px}
strong{color:var(--ink)}
em{font-style:italic}

/* 小标签 */
.kicker{
  font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);margin:0 0 6px;font-weight:600;
}

/* ============================================================
   提示框
   ============================================================ */
.notice{
  background:var(--gold-bg);
  border:1px solid var(--gold-line);
  border-left:3px solid var(--gold);
  border-radius:0 6px 6px 0;
  padding:16px 20px;margin:24px 0;font-size:14.5px;line-height:1.7;
}
.notice strong{color:var(--gold)}
.notice p:last-child{margin-bottom:0}

.callout{
  background:var(--paper);
  border-left:3px solid var(--navy);
  padding:16px 20px;margin:24px 0;font-size:15px;
  border-radius:0 6px 6px 0;
}
.callout p:last-child{margin-bottom:0}

.ok{
  background:var(--green-bg);border:1px solid #c3e3cd;
  border-left:3px solid var(--green);
  border-radius:0 6px 6px 0;
  padding:16px 20px;margin:24px 0;font-size:14.5px;
}
.ok strong{color:var(--green)}

/* ============================================================
   按钮
   ============================================================ */
.btn{
  display:inline-block;background:var(--navy);color:#fff;
  text-decoration:none;border:1.5px solid var(--navy);
  padding:12px 26px;border-radius:4px;
  font-weight:600;font-size:14.5px;margin:6px 10px 6px 0;
  letter-spacing:.01em;
}
.btn:hover{background:var(--navy-hi);border-color:var(--navy-hi);color:#fff}
.btn.ghost{background:transparent;color:var(--navy)}
.btn.ghost:hover{background:var(--paper);color:var(--navy)}

/* ============================================================
   表格
   ============================================================ */
table{
  border-collapse:collapse;width:100%;font-size:14.5px;margin:18px 0 22px;
}
th,td{
  border:1px solid var(--line);padding:10px 13px;
  text-align:left;vertical-align:top;
}
th{
  background:var(--paper);font-weight:700;color:var(--ink);
  font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
}

/* ============================================================
   栏目
   ============================================================ */
.sections{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0 6px}
@media(max-width:660px){.sections{grid-template-columns:1fr}}

.card{
  border:1px solid var(--line);border-radius:6px;
  padding:18px 20px 20px;background:#fff;
}
.card h3{margin:4px 0 7px;font-size:16.5px}
.card p{font-size:14.5px;margin:0;color:var(--muted)}
.card .num{
  font-family:var(--serif);font-size:12px;font-weight:700;
  letter-spacing:.14em;color:var(--gold);display:block;margin-bottom:4px;
}
.card.humour{border-color:var(--gold-line);background:var(--gold-bg)}
.card.humour p{color:#6b5a33}

/* ============================================================
   最近发表（参考 JOSS 的首页做法：内容当主角）
   ============================================================ */
.recent{border-top:1px solid var(--line);margin-top:8px}
.recent-item{
  padding:16px 0;border-bottom:1px solid var(--line-soft);
}
.recent-item .t{
  font-family:var(--serif);font-size:16.5px;font-weight:700;
  color:var(--ink);margin:0 0 5px;line-height:1.4;
}
.recent-item .t a{color:inherit;border:0}
.recent-item .t a:hover{color:var(--navy-hi)}
.recent-item .m{font-size:13px;color:var(--muted);margin:0}
.recent-item .doi{
  font-family:var(--mono);font-size:12.5px;color:var(--navy);
  background:var(--paper);border:1px solid var(--line);
  border-radius:3px;padding:1px 6px;margin-left:8px;
}

/* ============================================================
   状态徽标
   ============================================================ */
.status{
  display:inline-block;font-size:11.5px;font-weight:700;
  padding:2px 9px;border-radius:20px;letter-spacing:.04em;
  text-transform:uppercase;
}
.status.pending{background:#fdf3d8;color:var(--gold);border:1px solid var(--gold-line)}
.status.live{background:var(--green-bg);color:var(--green);border:1px solid #c3e3cd}
.status.none{background:#f1f2f3;color:var(--muted);border:1px solid var(--line)}

/* ============================================================
   页脚
   ============================================================ */
footer.site{
  border-top:1px solid var(--line);
  background:var(--paper);
  margin-top:60px;padding:28px 0 48px;
  color:var(--muted);font-size:13.5px;
}
footer.site p{margin:0 0 9px}
footer.site a{color:var(--muted);border-bottom-color:var(--line)}
footer.site a:hover{color:var(--navy);border-bottom-color:var(--navy)}
footer.site .issn{
  font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;
}

/* ============================================================
   其他
   ============================================================ */
code{
  background:var(--paper);border:1px solid var(--line-soft);
  padding:1px 6px;border-radius:3px;
  font-family:var(--mono);font-size:13.5px;color:var(--ink);
}
.meta{font-size:13.5px;color:var(--muted);line-height:1.7}
.divider{height:1px;background:var(--line);border:0;margin:38px 0}
.small{font-size:13.5px;color:var(--muted)}

@media(max-width:560px){
  .masthead h1{font-size:25px}
  .masthead .sub{font-size:15px}
  .mark{width:50px;height:50px}
  nav.mainnav a{margin-right:18px;font-size:13.5px}
}
