@charset "utf-8";
/* 无翼鸟漫画 wuyiniao —— 墨底 + 单彩黄（H≈66°），层次全靠 1px 描边（layer_lang=rule）
   刻度自定：间距走 1.618 递增（.34/.55/.89/1.44/2.33/3.77rem），
   字号走 1.165→1.31 混合递增（.7/.815/.95/1.11/1.42/1.86/2.44rem），
   断点 430 / 592 / 838 / 1136，刻意避开常见的 640 / 768 / 1024。
   边缘语言 mixed：图片圆角 9px，容器一律直角。 */

:root {
  /* 墨底：HSV 240 / 11.1 / 7.1，明度 V<8 */
  --wy-ink: #001C23;
  --wy-ink-azure: #001F28;      /* 压在黄底上的深字 */
  /* 描边层：面板与页面底同色，边界只靠这两条线 */
  --wy-rule: #56706D;          /* 对 --wy-ink 3.09:1 */
  --wy-rule-hi: #96958E;       /* 对 --wy-ink 6.32:1 */
  /* 中性灰阶文字 */
  --wy-feather: #F1F0EB;       /* 16.66:1 */
  --wy-feather-2: #B7B6AF;     /* 9.34:1 */
  --wy-feather-3: #96958E;     /* 6.32:1 */
  /* 唯一彩色：黄，色相 65.7° */
  --wy-azure: #87DDF5;          /* 13.08:1 */
  --wy-azure-rim: #6EC8E0;      /* 11.25:1 */

  --wy-sp-1: .34rem;
  --wy-sp-2: .55rem;
  --wy-sp-3: .89rem;
  --wy-sp-4: 1.44rem;
  --wy-sp-5: 2.33rem;
  --wy-sp-6: 3.77rem;

  --wy-ft-1: .7rem;
  --wy-ft-2: .815rem;
  --wy-ft-3: .95rem;
  --wy-ft-4: 1.11rem;
  --wy-ft-5: 1.42rem;
  --wy-ft-6: 1.86rem;
  --wy-ft-7: 2.44rem;

  --wy-rad: 9px;
  --wy-aerie-max: 74.5rem;
  --wy-sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--wy-ink);
  color: var(--wy-feather);
  font-family: var(--wy-sans);
  font-size: var(--wy-ft-3);
  font-weight: 400;
  line-height: 1.72;
}

img { max-width: 100%; height: auto; display: block; border-radius: var(--wy-rad); }
a { color: var(--wy-feather); text-decoration: none; }
a:hover { color: var(--wy-azure); }
h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: 1.34; }
p { margin: 0; }
ul, ol, dl, dd { margin: 0; padding: 0; }
li { list-style: none; }

:focus-visible {
  outline: 2px solid var(--wy-azure);
  outline-offset: 2px;
}

.wy-figs { font-variant-numeric: tabular-nums; letter-spacing: .02em; }

/* ---------- 跳读链接 ---------- */
.wy-swoop {
  position: absolute;
  left: var(--wy-sp-3);
  top: -6rem;
  z-index: 90;
  padding: var(--wy-sp-2) var(--wy-sp-4);
  background: var(--wy-azure);
  color: var(--wy-ink-azure);
  font-size: var(--wy-ft-2);
  transition: top .16s ease;
}
.wy-swoop:hover { color: var(--wy-ink-azure); }
.wy-swoop:focus { top: var(--wy-sp-2); }

/* ---------- 页头 sticky2：细顶条 + 第二层画风导航 ---------- */
.wy-perch {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--wy-ink);
  border-bottom: 1px solid var(--wy-rule);
}

.wy-perch-ledge {
  max-width: var(--wy-aerie-max);
  margin: 0 auto;
  padding: var(--wy-sp-2) var(--wy-sp-4);
  display: flex;
  align-items: center;
  gap: var(--wy-sp-3);
  min-height: 3.05rem;
}

.wy-vane { display: inline-flex; align-items: center; gap: var(--wy-sp-2); flex: 0 0 auto; }
.wy-vane-notch {
  width: .62rem;
  height: 1.32rem;
  border: 1px solid var(--wy-azure-rim);
  border-right-width: 3px;
  border-radius: 0 var(--wy-rad) var(--wy-rad) 0;
}
.wy-vane-word {
  font-size: var(--wy-ft-4);
  font-weight: 700;
  letter-spacing: .07em;
}
.wy-vane:hover .wy-vane-word { color: var(--wy-azure); }

.wy-talon {
  display: none;
  align-items: center;
  gap: var(--wy-sp-1);
  padding: var(--wy-sp-1) var(--wy-sp-3);
  background: transparent;
  border: 1px solid var(--wy-rule);
  color: var(--wy-feather-2);
  font: inherit;
  font-size: var(--wy-ft-2);
  cursor: pointer;
}
.wy-talon-claw {
  width: .95rem;
  height: .62rem;
  border-top: 1px solid var(--wy-rule-hi);
  border-bottom: 1px solid var(--wy-rule-hi);
}
.wy-talon[aria-expanded="true"] { border-color: var(--wy-azure-rim); color: var(--wy-azure); }

.wy-preen { margin-left: auto; display: flex; align-items: center; gap: var(--wy-sp-2); }
.wy-preen-lab {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.wy-preen input {
  width: 13.4rem;
  max-width: 42vw;
  padding: var(--wy-sp-1) var(--wy-sp-3);
  background: var(--wy-ink);
  border: 1px solid var(--wy-rule);
  color: var(--wy-feather);
  font: inherit;
  font-size: var(--wy-ft-2);
}
.wy-preen input::placeholder { color: var(--wy-feather-3); }
.wy-preen input:hover { border-color: var(--wy-rule-hi); }
.wy-preen-echo { font-size: var(--wy-ft-1); color: var(--wy-feather-3); min-width: 3.2rem; }

.wy-wingbar {
  border-top: 1px solid var(--wy-rule);
  max-height: 4.2rem;
  overflow: hidden;
  transition: max-height .22s ease, opacity .22s ease;
}
.wy-perch.wy-tucked .wy-wingbar { max-height: 0; opacity: 0; border-top-color: transparent; }

.wy-wingbar-inner {
  max-width: var(--wy-aerie-max);
  margin: 0 auto;
  padding: var(--wy-sp-1) var(--wy-sp-4);
  display: flex;
  flex-wrap: wrap;
  gap: var(--wy-sp-1) var(--wy-sp-4);
}
.wy-wingbar-inner a {
  padding: var(--wy-sp-1) 0;
  font-size: var(--wy-ft-2);
  color: var(--wy-feather-2);
  border-bottom: 2px solid transparent;
}
.wy-wingbar-inner a:hover { color: var(--wy-azure); border-bottom-color: var(--wy-rule-hi); }
.wy-wingbar-inner a.wy-alit { color: var(--wy-azure); border-bottom-color: var(--wy-azure-rim); }

/* ---------- 主体 ---------- */
.wy-aerie {
  max-width: var(--wy-aerie-max);
  margin: 0 auto;
  padding: var(--wy-sp-5) var(--wy-sp-4) var(--wy-sp-6);
  display: flex;
  flex-direction: column;
  gap: var(--wy-sp-5);
}

.wy-fluff {
  font-size: var(--wy-ft-1);
  letter-spacing: .18em;
  color: var(--wy-azure);
  text-transform: none;
}

.wy-murmur { font-size: var(--wy-ft-2); color: var(--wy-feather-3); }

/* ---------- 便当格首屏 ---------- */
.wy-hollow {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--wy-sp-3);
}
.wy-nook {
  grid-column: span 2;
  border: 1px solid var(--wy-rule);
  background: var(--wy-ink);
  padding: var(--wy-sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--wy-sp-2);
  min-width: 0;
}
.wy-nook:hover { border-color: var(--wy-rule-hi); }
.wy-nook--gape { grid-column: span 4; grid-row: span 2; }
.wy-nook--wingtip { grid-column: span 2; grid-row: span 2; }
.wy-nook--scapular { grid-column: span 6; }
.wy-nook h2, .wy-nook h3 { font-size: var(--wy-ft-4); }
.wy-nook-gape-body { display: flex; gap: var(--wy-sp-4); align-items: flex-start; }
.wy-nook-gape-body .wy-mount { flex: 0 0 12.6rem; }
.wy-nook h1 { font-size: var(--wy-ft-7); letter-spacing: .01em; }

.wy-hood {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wy-sp-2) var(--wy-sp-3);
  font-size: var(--wy-ft-2);
  color: var(--wy-feather-3);
}
.wy-hood span { border: 1px solid var(--wy-rule); padding: 0 var(--wy-sp-2); }

/* ---------- 分区面板 ---------- */
.wy-covert { border: 1px solid var(--wy-rule); padding: var(--wy-sp-4) var(--wy-sp-4) var(--wy-sp-5); }
.wy-covert-brow {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--wy-sp-2) var(--wy-sp-4);
  padding-bottom: var(--wy-sp-3);
  margin-bottom: var(--wy-sp-4);
  border-bottom: 1px solid var(--wy-rule);
}
.wy-covert-brow h2 { font-size: var(--wy-ft-5); }
.wy-covert-brow h3 { font-size: var(--wy-ft-4); }
.wy-glide {
  margin-left: auto;
  font-size: var(--wy-ft-2);
  color: var(--wy-azure);
  border-bottom: 1px solid var(--wy-azure-rim);
}
.wy-glide:hover { color: var(--wy-feather); border-bottom-color: var(--wy-rule-hi); }

/* ---------- 卡片 framed：图带外框，文字在框外侧 ---------- */
.wy-aviary {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9.7rem, 1fr));
  gap: var(--wy-sp-4) var(--wy-sp-3);
}
.wy-pinion { display: flex; flex-direction: column; gap: var(--wy-sp-2); min-width: 0; }
.wy-pinion-mat {
  display: block;
  position: relative;
  border: 1px solid var(--wy-rule);
  padding: var(--wy-sp-2);
  background: var(--wy-ink);
}
.wy-pinion-mat img { aspect-ratio: 3 / 4; object-fit: cover; width: 100%; }
.wy-pinion:hover .wy-pinion-mat { border-color: var(--wy-azure-rim); }
.wy-pinion-h { font-size: var(--wy-ft-3); }
.wy-pinion-h a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wy-pinion-tuft {
  font-size: var(--wy-ft-1);
  color: var(--wy-feather-3);
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--wy-sp-2);
}

.wy-barb {
  position: absolute;
  left: var(--wy-sp-2);
  top: var(--wy-sp-2);
  padding: 0 var(--wy-sp-2);
  background: var(--wy-azure);
  color: var(--wy-ink-azure);
  font-size: var(--wy-ft-1);
  font-weight: 600;
  line-height: 1.6;
}

.wy-mount { border: 1px solid var(--wy-rule); padding: var(--wy-sp-2); background: var(--wy-ink); }
.wy-mount img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }

/* ---------- 按钮 ---------- */
.wy-alight {
  display: inline-block;
  padding: var(--wy-sp-2) var(--wy-sp-4);
  background: var(--wy-azure);
  color: var(--wy-ink-azure);
  border: 1px solid var(--wy-azure);
  font-size: var(--wy-ft-2);
  font-weight: 600;
}
.wy-alight:hover { background: var(--wy-azure-rim); border-color: var(--wy-azure-rim); color: var(--wy-ink-azure); }
.wy-alight--downy {
  background: transparent;
  color: var(--wy-feather);
  border-color: var(--wy-rule-hi);
}
.wy-alight--downy:hover { background: transparent; color: var(--wy-azure); border-color: var(--wy-azure-rim); }

/* ---------- 栏目页：按小标题分组 + 分段锚点 ---------- */
.wy-flyway {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wy-sp-2);
  border: 1px solid var(--wy-rule);
  padding: var(--wy-sp-3);
}
.wy-flyway-leg {
  padding: var(--wy-sp-1) var(--wy-sp-3);
  border: 1px solid var(--wy-rule);
  font-size: var(--wy-ft-2);
  color: var(--wy-feather-2);
}
.wy-flyway-leg:hover { color: var(--wy-azure); border-color: var(--wy-azure-rim); }
.wy-flyway-leg .wy-figs { color: var(--wy-feather-3); }

.wy-brood { border: 1px solid var(--wy-rule); padding: var(--wy-sp-4) var(--wy-sp-4) var(--wy-sp-5); scroll-margin-top: 7.4rem; }

/* ---------- 面包屑 ---------- */
.wy-rachis { font-size: var(--wy-ft-2); color: var(--wy-feather-3); display: flex; flex-wrap: wrap; gap: var(--wy-sp-2); }
.wy-rachis a { color: var(--wy-feather-2); }
.wy-rachis a:hover { color: var(--wy-azure); }

/* ---------- 详情页 ---------- */
.wy-eyrie { display: grid; grid-template-columns: 15.6rem minmax(0, 1fr); gap: var(--wy-sp-5); align-items: start; }
.wy-eyrie h1 { font-size: var(--wy-ft-6); margin-bottom: var(--wy-sp-2); }

.wy-mantle { border: 1px solid var(--wy-rule); padding: var(--wy-sp-4); }
.wy-mantle dl { display: grid; grid-template-columns: 5.2rem minmax(0, 1fr); gap: var(--wy-sp-2) var(--wy-sp-3); font-size: var(--wy-ft-2); }
.wy-mantle dt { color: var(--wy-feather-3); }
.wy-mantle dd { color: var(--wy-feather); }

.wy-bough { display: grid; grid-template-columns: repeat(auto-fill, minmax(6.4rem, 1fr)); gap: var(--wy-sp-2); }
.wy-bough a {
  padding: var(--wy-sp-1) var(--wy-sp-2);
  border: 1px solid var(--wy-rule);
  font-size: var(--wy-ft-2);
  color: var(--wy-feather-2);
  text-align: center;
}
.wy-bough a:hover { color: var(--wy-azure); border-color: var(--wy-azure-rim); }

.wy-warble { max-width: 68ch; display: flex; flex-direction: column; gap: var(--wy-sp-3); color: var(--wy-feather-2); }
.wy-warble h3 { font-size: var(--wy-ft-4); color: var(--wy-feather); margin-top: var(--wy-sp-2); }

.wy-hedge { display: grid; grid-template-columns: repeat(auto-fit, minmax(15.4rem, 1fr)); gap: var(--wy-sp-3); }
.wy-twig { border: 1px solid var(--wy-rule); padding: var(--wy-sp-4); display: flex; flex-direction: column; gap: var(--wy-sp-2); }
.wy-twig h3 { font-size: var(--wy-ft-4); }
.wy-twig li { font-size: var(--wy-ft-2); color: var(--wy-feather-2); padding-left: var(--wy-sp-3); position: relative; }
.wy-twig li::before { content: ""; position: absolute; left: 0; top: .82em; width: .4rem; height: 1px; background: var(--wy-azure-rim); }
.wy-twig p { font-size: var(--wy-ft-2); color: var(--wy-feather-2); }

/* ---------- APP 页 ---------- */
.wy-nestbox { border: 1px solid var(--wy-rule); padding: var(--wy-sp-5); display: grid; grid-template-columns: minmax(0, 1fr) 13.4rem; gap: var(--wy-sp-5); align-items: center; }
.wy-strand { display: grid; grid-template-columns: repeat(auto-fit, minmax(13.4rem, 1fr)); gap: var(--wy-sp-3); counter-reset: wy-strand; }
.wy-strand-tile { border: 1px solid var(--wy-rule); padding: var(--wy-sp-4); counter-increment: wy-strand; }
.wy-strand-tile h3 { font-size: var(--wy-ft-3); margin-bottom: var(--wy-sp-1); }
.wy-strand-tile h3::before { content: counter(wy-strand) " · "; color: var(--wy-azure); font-variant-numeric: tabular-nums; }
.wy-strand-tile p { font-size: var(--wy-ft-2); color: var(--wy-feather-2); }

/* ---------- 404 ---------- */
.wy-astray { border: 1px solid var(--wy-rule); padding: var(--wy-sp-6) var(--wy-sp-4); text-align: center; display: flex; flex-direction: column; gap: var(--wy-sp-3); align-items: center; }
.wy-astray h1 { font-size: var(--wy-ft-6); }
.wy-astray-num { font-size: var(--wy-ft-7); color: var(--wy-azure); font-variant-numeric: tabular-nums; letter-spacing: .12em; }

/* ---------- 友情链接 ---------- */
.wy-flock { border: 1px solid var(--wy-rule); padding: var(--wy-sp-4); }
.wy-flock h2 { font-size: var(--wy-ft-4); margin-bottom: var(--wy-sp-3); }
.wy-flock-bough { display: flex; flex-wrap: wrap; gap: var(--wy-sp-2) var(--wy-sp-4); font-size: var(--wy-ft-2); }
.wy-flock-bough a { color: var(--wy-feather-3); }
.wy-flock-bough a:hover { color: var(--wy-azure); }

/* ---------- 页脚 duo：两行 ---------- */
.wy-roost { border-top: 1px solid var(--wy-rule); }
.wy-roost-inner {
  max-width: var(--wy-aerie-max);
  margin: 0 auto;
  padding: var(--wy-sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--wy-sp-2);
}
.wy-roost-bough { display: flex; flex-wrap: wrap; gap: var(--wy-sp-2) var(--wy-sp-4); font-size: var(--wy-ft-2); color: var(--wy-feather-3); }
.wy-roost-bough a { color: var(--wy-feather-2); }
.wy-roost-bough a:hover { color: var(--wy-azure); }
.wy-roost-hood { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--wy-sp-2) var(--wy-sp-3); font-size: var(--wy-ft-1); color: var(--wy-feather-3); border-top: 1px solid var(--wy-rule); padding-top: var(--wy-sp-2); }
.wy-roost-pennon { font-size: var(--wy-ft-2); font-weight: 700; color: var(--wy-feather); letter-spacing: .06em; }
.wy-roost-murmur { color: var(--wy-feather-3); }
.wy-roost-filing { margin-left: auto; }

/* ---------- 回到顶部 ---------- */
.wy-updraft {
  position: fixed;
  right: var(--wy-sp-4);
  bottom: var(--wy-sp-5);
  width: 2.62rem;
  height: 2.62rem;
  background: var(--wy-ink);
  border: 1px solid var(--wy-rule-hi);
  color: var(--wy-feather);
  font: inherit;
  font-size: var(--wy-ft-4);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
}
.wy-updraft.wy-astir { opacity: 1; pointer-events: auto; }
.wy-updraft:hover { border-color: var(--wy-azure-rim); color: var(--wy-azure); }

/* ---------- 响应式：断点 1136 / 838 / 592 / 430 ---------- */
@media (max-width: 1136px) {
  .wy-eyrie { grid-template-columns: 12.8rem minmax(0, 1fr); gap: var(--wy-sp-4); }
  .wy-nestbox { grid-template-columns: minmax(0, 1fr) 11.2rem; }
}

@media (max-width: 838px) {
  .wy-hollow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wy-nook, .wy-nook--gape, .wy-nook--wingtip, .wy-nook--scapular { grid-column: span 2; grid-row: auto; }
  .wy-nook h1 { font-size: var(--wy-ft-6); }
  .wy-aviary { grid-template-columns: repeat(auto-fill, minmax(8.6rem, 1fr)); }
}

@media (max-width: 592px) {
  body { font-size: var(--wy-ft-2); }
  .wy-talon { display: inline-flex; }
  .wy-perch-ledge { flex-wrap: wrap; padding: var(--wy-sp-2) var(--wy-sp-3); }
  .wy-preen { width: 100%; margin-left: 0; order: 3; }
  .wy-preen input { width: 100%; max-width: none; }
  .wy-wingbar { max-height: 0; opacity: 0; }
  .wy-wingbar.wy-fanned { max-height: 22rem; opacity: 1; }
  .wy-perch.wy-tucked .wy-wingbar.wy-fanned { max-height: 22rem; opacity: 1; border-top-color: var(--wy-rule); }
  .wy-wingbar-inner { flex-direction: column; gap: 0; padding: var(--wy-sp-2) var(--wy-sp-3); }
  .wy-wingbar-inner a { border-bottom: 1px solid var(--wy-rule); padding: var(--wy-sp-2) 0; }
  .wy-hollow { grid-template-columns: minmax(0, 1fr); }
  .wy-nook, .wy-nook--gape, .wy-nook--wingtip, .wy-nook--scapular { grid-column: span 1; }
  .wy-nook-gape-body { flex-direction: column; }
  .wy-nook-gape-body .wy-mount { flex: none; width: 100%; max-width: 14.6rem; }
  .wy-eyrie { grid-template-columns: minmax(0, 1fr); }
  .wy-nestbox { grid-template-columns: minmax(0, 1fr); }
  .wy-covert, .wy-brood { padding: var(--wy-sp-4) var(--wy-sp-3); }
  .wy-aerie { padding: var(--wy-sp-4) var(--wy-sp-3) var(--wy-sp-5); gap: var(--wy-sp-4); }
  .wy-roost-filing { margin-left: 0; }
}

@media (max-width: 430px) {
  .wy-aviary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wy-nook h1 { font-size: var(--wy-ft-5); }
  .wy-astray { padding: var(--wy-sp-5) var(--wy-sp-3); }
  .wy-bough { grid-template-columns: repeat(auto-fill, minmax(5.2rem, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ---------- 补齐内页时才用得上的三条，沿用上面的令牌，没有新增变量 ----------
   1) 栏目页 / 客户端页的 h1 落在 .wy-covert 里，原表只给了 .wy-nook h1 和 .wy-astray h1；
   2) script.js 给当前分段的锚点打了 aria-current="true"，原表没有对应的高亮规则，点了看不出在哪一段；
   3) h1 在最小断点上要跟着降一档，跟 .wy-nook h1 的处理保持一致。 */
.wy-covert h1 { font-size: var(--wy-ft-6); letter-spacing: .01em; }
.wy-flyway-leg[aria-current="true"] { color: var(--wy-azure); border-color: var(--wy-azure-rim); }

@media (max-width: 430px) {
  .wy-covert h1 { font-size: var(--wy-ft-5); }
}


/* --- 内容库 --- */
/* 暗·153°·r2·宽1460·间距39 */
:root{
  --wy-ink:#111815;
  --wy-rule:#3A4A43;
  --wy-feather:#F4F5F5;
  --wy-feather-2:#CDD5D1;
  --wy-feather-3:#BAC5C0;
  --wy-azure:#E7E127;
  --wy-azure-rim:#A5A012;
  --wy-ink-azure:#E7E127;
  --wy-max:1460px;
  --wy-on:#10131A;
  --wy-on2:#FFFFFF;
  --wy-on3:#10131A;
}

