/* 皮肤：宣纸横版 —— 朱红山水顶栏 + 深红导航（默认值；实际以前台 skin-palette 注入为准） */
body.skin-xuanpaper {
  --ink: #1a120e;
  --ink-soft: #3d2c22;
  --ink-faint: #6b5648;
  --paper: #f3ebe0;
  --paper-2: #fffcf6;
  --paper-deep: #e8dcc8;
  --cinnabar: #b41e24;
  --cinnabar-deep: #8e1418;
  --gold: #b0893e;
  --gold-soft: #d4b56a;
  --line: #d9c9ad;
  --line-strong: #c4ad88;
  --muted: #8a7664;
  --shadow: 0 12px 36px rgba(40, 24, 16, .09);
  --bg-glow: rgba(176,137,62,.12);
  --bg-top: #faf4ea;
  --bg-mid: var(--paper);
  --bg-bottom: #ebe1d0;
  --header-border: var(--cinnabar);
  --accent-bar: var(--cinnabar);
  --header-bg: linear-gradient(
    180deg,
    #6A0F08 0%,
    #6A0F08 38%,
    #8a221c 50%,
    #ba6153 66%,
    #deb798 86%,
    #fffcf6 100%
  );
  --footer-bg: linear-gradient(180deg, #241610, #140e0a);
  --nav-bg: linear-gradient(180deg, #6a1820 0%, #4a0e14 100%);
}

/* —— 顶栏渐变 + 水墨远山暗纹 + 装裱横线 —— */
body.skin-xuanpaper .site-header {
  position: relative;
  overflow: hidden;
  color: #fffaf5;
  border-bottom: 0;
  box-shadow: 0 10px 32px rgba(70, 18, 16, .26);
  background:
    linear-gradient(180deg, rgba(255, 210, 160, .06), transparent 18%),
    var(--header-bg);
}

/* 取消 site.css 顶栏伪元素金线，改由 header-rules 控制 */
body.skin-xuanpaper .site-header::before,
body.skin-xuanpaper .site-header::after {
  content: none !important;
  display: none !important;
}

/* 远山暗纹：云海图剪影（存于 /static/images/skins/） */
body.skin-xuanpaper .header-scape {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 46px;
  z-index: 1;
  pointer-events: none;
  background:
    url("/static/images/skins/xuan-mountains.png?v=20260729z") center bottom / 100% auto no-repeat;
  opacity: .16;
}

/* 装裱横线：隐约、两端淡出、长短不一，避开中部文字 */
body.skin-xuanpaper .header-rules {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 46px;
  z-index: 2;
  pointer-events: none;
  background:
    url("/static/images/skins/xuan-rules.svg?v=20260729l") center / 100% 100% no-repeat;
  opacity: .72;
}

/* 红匾与导航之间的米色装裱带（图1底部那条） */
/* 顶栏加高：对齐图1匾额比例 */
body.skin-xuanpaper .header-top,
body.skin-xuanpaper .brand-bar,
body.skin-xuanpaper .nav-bar {
  position: relative;
  z-index: 3;
}

body.skin-xuanpaper .header-top {
  color: rgba(255, 236, 210, .72);
  border-bottom: 0;
  padding-top: 12px;
  padding-bottom: 4px;
}
body.skin-xuanpaper .header-top a {
  color: rgba(255, 236, 200, .9);
}
body.skin-xuanpaper .header-top a:hover {
  color: #fff;
}

body.skin-xuanpaper .brand-bar {
  min-height: 176px;
  padding-top: 52px;
  padding-bottom: 44px;
  box-sizing: border-box;
  border-bottom: 0;
  box-shadow: none;
}
body.skin-xuanpaper .brand-main::before,
body.skin-xuanpaper .brand-main::after {
  color: rgba(255, 236, 200, .55);
}
body.skin-xuanpaper .brand-bar .brand {
  color: #fffef8;
  text-shadow: 0 2px 14px rgba(40, 8, 8, .35);
  font-size: clamp(30px, 4.2vw, 44px);
}
body.skin-xuanpaper .brand-bar .sub,
body.skin-xuanpaper .brand-bar.is-logo-banner .brand-text .sub {
  color: rgba(255, 236, 200, .92);
  font-size: 17px;
  letter-spacing: .22em;
  text-indent: .22em;
  text-shadow: 0 1px 8px rgba(40, 8, 8, .25);
  margin-top: 10px;
}
body.skin-xuanpaper .brand-fallback {
  color: #fffef8 !important;
  text-shadow: 0 2px 12px rgba(40, 8, 8, .35);
  font-size: clamp(26px, 3.6vw, 40px);
}
body.skin-xuanpaper .brand-icon {
  width: 88px;
  height: 88px;
  filter: drop-shadow(0 2px 10px rgba(0, 0, 0, .3));
}
body.skin-xuanpaper .brand-title-img {
  max-width: min(860px, calc(94vw - 120px));
  max-height: 128px;
}
body.skin-xuanpaper .brand-main {
  gap: 22px;
}
body.skin-xuanpaper .brand-bar.is-logo-banner {
  min-height: 200px;
  padding-top: 56px;
  padding-bottom: 48px;
  gap: 14px;
}
body.skin-xuanpaper .brand-bar.is-logo-banner .brand-icon {
  width: 92px;
  height: 92px;
}

/* 导航：跟随 --nav-bg（由后台配色注入） */
body.skin-xuanpaper .nav-bar {
  max-width: none;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 6px 12px 10px;
  background: var(--nav-bg);
  border-top: 1px solid rgba(255, 220, 160, .28);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}
body.skin-xuanpaper .nav-bar a {
  color: rgba(255, 250, 240, .94);
}
body.skin-xuanpaper .nav-bar a::after {
  background: rgba(255, 230, 180, .9);
}
body.skin-xuanpaper .nav-bar a:hover {
  color: #fff;
  background: rgba(255, 255, 255, .08);
}
body.skin-xuanpaper .nav-bar a.on {
  color: #fff;
  background: rgba(161, 28, 28, .85);
  box-shadow: inset 0 0 0 1px rgba(255, 220, 160, .4);
}
body.skin-xuanpaper .nav-bar a.on::after {
  background: rgba(255, 235, 200, .98);
}

body.skin-xuanpaper .site-footer {
  background: var(--footer-bg);
  border-top-color: var(--cinnabar);
}

body.skin-xuanpaper .panel::before {
  border-color: var(--gold);
  opacity: .45;
}
body.skin-xuanpaper .intro-seal {
  border-color: var(--cinnabar);
  color: var(--cinnabar);
}

body.skin-xuanpaper .page-title {
  color: var(--ink);
  letter-spacing: .22em;
}
body.skin-xuanpaper .page-title::before,
body.skin-xuanpaper .page-title::after {
  color: var(--ink);
  opacity: .55;
}
body.skin-xuanpaper h1.page-title {
  background-image: none;
  padding-bottom: 8px;
}

body.skin-xuanpaper .tabs {
  justify-content: center;
  gap: 10px;
  margin-bottom: 22px;
}
body.skin-xuanpaper .tabs a {
  min-width: 88px;
  text-align: center;
  border-radius: 2px;
  border: 1px solid var(--line-strong);
  background: var(--paper-2);
  color: var(--ink-soft);
  padding: 8px 18px;
}
body.skin-xuanpaper .tabs a.on,
body.skin-xuanpaper .tabs a:hover {
  background: var(--cinnabar);
  border-color: var(--cinnabar);
  color: #fff;
}

body.skin-xuanpaper .member-tabs {
  justify-content: center;
}
body.skin-xuanpaper .member-tabs a.on,
body.skin-xuanpaper .member-tabs a:hover {
  background: var(--cinnabar);
  border-color: var(--cinnabar);
  color: #fff;
}

@media (max-width: 768px) {
  body.skin-xuanpaper .brand-bar {
    min-height: 140px;
    padding-top: 32px;
    padding-bottom: 28px;
  }
  body.skin-xuanpaper .brand-bar.is-logo-banner {
    min-height: 156px;
    padding-top: 36px;
    padding-bottom: 30px;
  }
  body.skin-xuanpaper .brand-bar.is-logo-banner .brand-icon,
  body.skin-xuanpaper .brand-icon {
    width: 64px;
    height: 64px;
  }
  body.skin-xuanpaper .brand-title-img {
    max-height: 88px;
  }
  body.skin-xuanpaper .header-scape,
  body.skin-xuanpaper .header-rules {
    bottom: 40px;
  }
  body.skin-xuanpaper .header-scape {
    opacity: .14;
    background-size: 120% auto;
  }
}