.brand{ display:flex; align-items:center; gap:10px; font-weight:800; }
.brand-link{ text-decoration:none; }

.badge{
  font-size:12px;
  padding:2px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--muted);
}

.nav{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  background: rgba(255,255,255,.03);
}
.pill:hover{ background: rgba(255,255,255,.06); text-decoration:none; }

.btn{
  border:1px solid var(--line);
  background: rgba(255,255,255,.03);
  color:var(--text);
  padding:8px 12px;
  border-radius:999px;
  cursor:pointer;
}
.btn:hover{ background: rgba(255,255,255,.06); }



/* ===== Prose: readable article typography ===== */
.prose {
  line-height: 1.75;
  font-size: 16px;
}

.prose h1, .prose h2, .prose h3 {
  line-height: 1.25;
  margin: 1.2em 0 0.6em;
}

.prose p, .prose ul, .prose ol, .prose blockquote, .prose pre {
  margin: 0.9em 0;
}

.prose pre {
  overflow: auto;
  padding: 0.9em 1em;
  border-radius: 12px;
}

.prose code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.95em;
}








/* =========================
   Admonition (FixIt-like) - 13 types
   ========================= */
.admonition {
  border-radius: 10px;
  margin: 1.2rem 0;
  border-left: 4px solid rgba(var(--adm-color), 1);
  overflow: hidden;
}



.admonition summary {
  cursor: pointer;
  padding: 0.65rem 0.9rem;
  background: rgba(var(--adm-color), 0.3);
  font-weight: 650;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  list-style: none;
  user-select: none;
}

.admonition summary::-webkit-details-marker { display: none; }

.admonition .admonition-icon {
  width: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  line-height: 1;
}

.admonition .admonition-text { line-height: 1.2; }

.admonition .admonition-title::after {
  content: "▸";
  margin-left: auto;
  opacity: 0.65;
  transform: rotate(0deg);
  transition: transform 0.12s ease-out;
}

.admonition[open] .admonition-title::after {
  transform: rotate(90deg);
}

.admonition .admonition-content {
  background: rgba(var(--adm-color), 0.1);
  padding: 0.85rem 1rem 1rem;
  border-top: 1px solid rgba(0,0,0,0.06);
}

/* open 时加一点点动效 */
.admonition[open] .admonition-content {
  animation: admonitionFadeIn 0.15s ease-out;
}
@keyframes admonitionFadeIn {
  from { opacity: 0; transform: translateY(-2px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 类型配色 */
/* 基色（100% 不透明） */
:root {
  --adm-note:     59,130,246;   /* 蓝 */
  --adm-abstract: 56,189,248;   /* 浅蓝 */
  --adm-info:     6,182,212;    /* 青 */
  --adm-todo:     96,165,250;   /* 蓝灰 */

  --adm-tip:      16,185,129;   /* 绿 */
  --adm-success:  34,197,94;    /* 绿 */

  --adm-question: 245,158,11;   /* 黄 */
  --adm-warning:  249,115,22;   /* 橙 */

  --adm-failure:  239,68,68;    /* 红 */
  --adm-danger:   251,113,133;  /* 深红 */

  --adm-bug:      236,72,153;   /* 粉 */
  --adm-example:  168,85,247;   /* 紫 */
  --adm-quote:    156,163,175;  /* 灰 */
}

.admonition-note     { --adm-color: var(--adm-note); }
.admonition-abstract { --adm-color: var(--adm-abstract); }
.admonition-info     { --adm-color: var(--adm-info); }
.admonition-todo     { --adm-color: var(--adm-todo); }

.admonition-tip      { --adm-color: var(--adm-tip); }
.admonition-success  { --adm-color: var(--adm-success); }

.admonition-question { --adm-color: var(--adm-question); }
.admonition-warning  { --adm-color: var(--adm-warning); }

.admonition-failure  { --adm-color: var(--adm-failure); }
.admonition-danger   { --adm-color: var(--adm-danger); }

.admonition-bug      { --adm-color: var(--adm-bug); }
.admonition-example  { --adm-color: var(--adm-example); }
.admonition-quote    { --adm-color: var(--adm-quote); }







/* ===== Home list (subdomain index) ===== */
.home-wrap {
  max-width: 980px;
  margin: 0 auto;
  padding: 24px 16px;
}

.home-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.home-title {
  margin: 0;
  font-size: 22px;
  letter-spacing: 0.5px;
}

.home-sort {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.sort-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04);
  text-decoration: none;
}

.sort-pill.is-active {
  border-color: rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.08);
}

.post-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.post-card {
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04);
  padding: 16px 16px 14px;
}

.post-title {
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 1.25;
}

.post-title a {
  text-decoration: none;
}

.post-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  opacity: 0.8;
  font-size: 13px;
  margin-bottom: 10px;
}

.post-excerpt {
  opacity: 0.85;
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 10px;
}

.post-more {
  display: inline-block;
  font-size: 13px;
  text-decoration: none;
  opacity: 0.9;
}

.empty-hint {
  opacity: 0.7;
  padding: 20px 0;
}

/* ===== Blog Light: clearer post cards ===== */
:root[data-theme='light'] body.theme-blog .post-card {
  border-color: rgba(70, 106, 156, 0.28);
  background: rgba(255, 255, 255, 0.90);
  box-shadow: 0 10px 22px rgba(53, 84, 130, 0.10);
}

:root[data-theme='light'] body.theme-blog .post-title a {
  color: #123f75;
}

:root[data-theme='light'] body.theme-blog .post-meta {
  color: rgba(25, 52, 86, 0.86);
}

:root[data-theme='light'] body.theme-blog .sort-pill {
  border-color: rgba(77, 121, 182, 0.34);
  background: rgba(247, 251, 255, 0.92);
  color: #163f72;
}

:root[data-theme='light'] body.theme-blog .sort-pill.is-active {
  border-color: rgba(62, 112, 184, 0.56);
  background: rgba(222, 236, 255, 0.90);
  color: #113766;
}


