/* =========================================================
   薪火长征路 · 山河作证 — 子页暗色皮肤
   与首页（home.css / fusion.css）共用一套设计语言：
   墨底 · 宣纸字 · 丹砂点缀 · 旧金细线。
   加载顺序：css/style.css → css/pages-skin.css（本文件）
   ========================================================= */

/* ---------- 设计令牌：把薪火的色板映射到山河纪 ---------- */
:root{
  --c-red:        #a6241b;
  --c-red-deep:   #5a1410;
  --c-red-bright: #c0392b;
  --c-army:       #8a6e3c;
  --c-army-deep:  #5c4a28;
  --c-beige:      #ede3d2;
  --c-beige-soft: #0c0908;   /* 原为浅米黄底，这里翻成墨底 */
  --c-gray:       #ede3d2;   /* 原为主文字深灰，这里翻成宣纸色 */
  --c-gray-soft:  #a2947f;
  --c-line:       #3a2e24;

  --font-title: "Songti SC","STSong","Noto Serif CJK SC","Source Han Serif SC","SimSun",Georgia,serif;
  --font-body:  "PingFang SC","Microsoft YaHei","Noto Sans CJK SC","Hiragino Sans GB",sans-serif;

  --shadow:    0 22px 60px rgba(0,0,0,.46);
  --shadow-sm: 0 12px 34px rgba(0,0,0,.34);
  --radius:    3px;
  --radius-lg: 4px;

  /* 山河纪补充令牌 */
  --ink:      #0c0908;
  --ink-2:    #100b09;
  --paper:    #ede3d2;
  --paper-2:  #d8ccba;
  --gold:     #d8ae62;
  --gold-lt:  #e8c985;
  --gold-dk:  #8a6e3c;
  --muted:    #a2947f;
  --crimson:  #a6241b;
  --ok:       #8fae6a;   /* 答题正确的提示色，墨底上可读 */
  --hairline: rgba(216,174,98,.14);
}

/* ---------- 基底 ---------- */
html{scroll-behavior:smooth}
body{
  background:var(--ink);
  color:var(--paper-2);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(60% 42% at 50% -6%,rgba(166,36,27,.13),transparent 70%),
    radial-gradient(42% 34% at 88% 12%,rgba(216,174,98,.05),transparent 72%);
}
body::after{
  content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}
h1,h2,h3,h4{color:var(--paper);font-family:var(--font-title);font-weight:600}
::selection{background:rgba(166,36,27,.5);color:#fff}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ---------- 顶部导航 ---------- */
.site-header{
  background:linear-gradient(180deg,rgba(12,9,8,.97),rgba(12,9,8,.88));
  border-bottom:1px solid rgba(216,174,98,.16);
  box-shadow:none;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.site-header::after{
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(216,174,98,.5),transparent);
}
.site-header.scrolled{
  background:rgba(10,7,6,.97);
  box-shadow:0 14px 40px rgba(0,0,0,.5);
}
.brand{color:var(--paper)}
.brand .star{
  background:transparent;color:var(--c-red-bright);
  box-shadow:none;font-size:22px;border-radius:0;
  filter:drop-shadow(0 0 10px rgba(192,57,43,.45));
}
.brand .brand-text b{font-weight:700;letter-spacing:.12em;color:var(--paper)}
.brand .brand-text span{color:var(--muted);opacity:1;letter-spacing:.08em}
.nav-links > li > a{color:var(--paper-2);letter-spacing:.1em}
.nav-links > li > a:hover,
.nav-links > li > a.active{background:transparent;color:var(--paper)}
.nav-links > li > a{position:relative}
.nav-links > li > a::after{
  content:"";position:absolute;left:14px;right:100%;bottom:4px;height:1px;
  background:var(--gold);transition:right .4s var(--ease, cubic-bezier(.22,.8,.24,1));
}
.nav-links > li > a:hover::after,
.nav-links > li > a.active::after{right:14px}
.menu-toggle{color:var(--paper)}

.search-box{
  background:rgba(255,255,255,.035);
  border:1px solid rgba(216,174,98,.22);
  border-radius:999px;overflow:hidden;
}
.search-box input{color:var(--paper);background:transparent}
.search-box input::placeholder{color:var(--muted)}
.search-box button{
  background:transparent;color:var(--gold);box-shadow:none;
  border-left:1px solid rgba(216,174,98,.18);
}
.search-box button:hover{background:rgba(216,174,98,.1);color:var(--gold-lt)}

.lang-switch{
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 0 0 1px rgba(216,174,98,.2);
}
.lang-switch button{color:var(--muted)}
.lang-switch button:hover{color:var(--paper)}
.lang-switch button.on{background:var(--crimson);color:#f7ecdb;font-weight:600}

/* ---------- 内页首屏 ---------- */
.page-hero{
  background:
    radial-gradient(64% 118% at 50% 0%,rgba(166,36,27,.30),transparent 68%),
    linear-gradient(180deg,#0f0b09 0%,#0a0706 100%);
  border-bottom:1px solid rgba(216,174,98,.12);
  padding:86px 0 66px;
}
.page-hero .kicker{color:var(--gold);letter-spacing:.34em;font-size:12px;opacity:1}
.page-hero h1{
  color:var(--paper);font-weight:600;letter-spacing:.14em;
  text-shadow:0 2px 26px rgba(0,0,0,.6);
}
.page-hero p{color:var(--muted);letter-spacing:.06em}

/* ---------- 面包屑 / 二级导航 ---------- */
.breadcrumb{
  background:#0a0706;color:var(--muted);
  border-bottom:1px solid rgba(216,174,98,.08);
  letter-spacing:.06em;
}
.breadcrumb a:hover{color:var(--gold-lt)}
.subnav{
  background:rgba(12,9,8,.95);
  box-shadow:0 1px 0 rgba(216,174,98,.12);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.subnav a{color:var(--muted);border:1px solid transparent;border-radius:999px}
.subnav a:hover,.subnav a.active{
  background:rgba(166,36,27,.9);color:var(--paper);
  border-color:rgba(216,174,98,.28);
}

/* ---------- 区块 ---------- */
.section{padding:66px 0}
.section-alt{
  background:linear-gradient(180deg,#0c0908 0%,#110c0a 50%,#0c0908 100%);
  border-top:1px solid rgba(216,174,98,.08);
  border-bottom:1px solid rgba(216,174,98,.08);
}
.section-head .kicker{
  color:var(--gold);letter-spacing:.3em;font-size:12px;font-weight:600;
}
.section-head h2{
  color:var(--paper);font-weight:600;letter-spacing:.08em;
  text-shadow:0 2px 20px rgba(0,0,0,.5);
}
.section-head h2::after{
  height:2px;width:72px;
  background:linear-gradient(90deg,var(--crimson),var(--gold));
}
.section-head p{color:var(--muted);letter-spacing:.04em}

/* ---------- 按钮 ---------- */
.btn{
  background:var(--crimson);color:#f7ecdb;
  border-radius:2px;box-shadow:none;letter-spacing:.08em;
  border:1px solid rgba(216,174,98,.18);
}
.btn:hover{background:var(--c-red-bright);transform:translateY(-2px)}
.btn-army{
  background:transparent;color:var(--gold);
  border:1px solid rgba(216,174,98,.4);
}
.btn-army:hover{background:rgba(216,174,98,.1);color:var(--gold-lt)}
.btn-outline{border:1px solid rgba(216,174,98,.5);color:var(--paper)}
.btn-outline:hover{background:rgba(216,174,98,.12);color:#fff}

/* ---------- 通用卡片 ---------- */
.ov-card,.article-card,.tl-card,.person-card,.quiz-box,.res-item,.gb-list .gb-item,.guestbook form{
  background:linear-gradient(158deg,rgba(26,20,15,.94),rgba(11,8,7,.96));
  border:1px solid var(--hairline);
  box-shadow:none;
  border-radius:var(--radius);
}
.ov-card{border-top:2px solid var(--crimson)}
.article-card{border-left:2px solid rgba(216,174,98,.42)}
.article-card.red{border-left-color:var(--c-red-bright)}
.gb-list .gb-item{border-left:2px solid var(--crimson)}

.ov-card:hover,.article-card:hover,.person-card:hover,.res-item:hover,.tl-card:hover{
  transform:translateY(-4px);
  border-color:rgba(216,174,98,.42);
  box-shadow:0 22px 54px rgba(0,0,0,.42);
}
.ov-card,.article-card,.tl-card,.person-card,.res-item{transition:transform .45s cubic-bezier(.22,.8,.24,1),border-color .45s,box-shadow .45s}

/* 卡片文字 */
.ov-card h3,.article-card h3,.tl-card h4,.person-card h3{color:var(--paper)}
.ov-card p,.article-card p,.tl-card p,.person-card p{color:var(--muted)}
.ov-card .num{color:var(--gold);font-weight:600}
.article-card .meta{color:var(--gold);letter-spacing:.16em;font-weight:600;font-size:11.5px}
.article-card .src{
  color:var(--gold-dk);
  border-bottom-color:rgba(216,174,98,.28);
}
a.article-card.is-link:hover .src{border-bottom-color:var(--gold);color:var(--gold-lt)}
.person-card .role{color:var(--gold);letter-spacing:.1em}
.person-avatar{
  background:linear-gradient(150deg,#4a120f 0%,#7a2a1f 45%,#5c4a28 100%);
  color:var(--paper);
  border-bottom:1px solid rgba(216,174,98,.16);
}

/* ---------- 时间轴 ---------- */
.timeline::before{
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(216,174,98,.4) 12%,rgba(216,174,98,.4) 88%,transparent);
}
.tl-item .dot{
  background:var(--crimson);
  border-color:var(--ink);
  box-shadow:0 0 0 1px rgba(216,174,98,.5),0 0 18px rgba(166,36,27,.45);
}
.tl-card .year{color:var(--gold);letter-spacing:.08em}

/* ---------- 数字条 ---------- */
.stat{
  background:linear-gradient(160deg,#171110,#0b0807);
  border:1px solid var(--hairline);
  color:var(--paper);
}
.stat .v{color:var(--gold);font-weight:600}
.stat .l{color:var(--muted)}

/* ---------- 测验 ---------- */
.quiz-box{border:1px solid rgba(216,174,98,.18)}
.quiz-q{color:var(--paper);font-weight:600}
.quiz-opt{
  border-color:rgba(216,174,98,.18);color:var(--paper-2);
  background:rgba(255,255,255,.02);border-radius:2px;
}
.quiz-opt:hover{background:rgba(216,174,98,.07);border-color:rgba(216,174,98,.5)}
.quiz-opt.correct{background:rgba(74,93,51,.3);border-color:#7f955c;color:#e8f2dc}
.quiz-opt.wrong{background:rgba(166,36,27,.24);border-color:var(--c-red-bright);color:#f5dcda}
.quiz-feedback{color:var(--gold)}

/* ---------- 留言板 ---------- */
.guestbook form{border:1px solid rgba(216,174,98,.18);padding:26px}
.guestbook input,.guestbook textarea{
  background:rgba(255,255,255,.035);
  border:1px solid rgba(216,174,98,.22);
  color:var(--paper);border-radius:2px;
}
.guestbook input::placeholder,.guestbook textarea::placeholder{color:var(--muted);opacity:.75}
.guestbook input:focus,.guestbook textarea:focus{
  border-color:var(--gold);background:rgba(216,174,98,.05);
}
.gb-item .who{color:var(--gold)}
.gb-item .when{color:var(--muted)}
.gb-item p{color:var(--paper-2)}

/* ---------- 资源下载 ---------- */
.res-icon{
  background:rgba(216,174,98,.1);
  color:var(--gold);
  border:1px solid rgba(216,174,98,.18);
  border-radius:2px;
}
.res-item .r-info b{color:var(--paper);font-weight:600}
.res-item .r-info span{color:var(--muted)}
.res-item .ft{color:var(--gold-dk)}

/* ---------- 游戏横幅 ---------- */
.game-banner,
.game-banner.gb-alt,
.game-banner.gb-night{
  background:
    radial-gradient(70% 120% at 100% 0%,rgba(166,36,27,.28),transparent 62%),
    linear-gradient(135deg,#2a0d0b 0%,#150f0d 52%,#0b0807 100%);
  border:1px solid rgba(216,174,98,.18);
  border-radius:3px;
  box-shadow:0 22px 60px rgba(0,0,0,.4);
  color:var(--paper);
}
.game-banner::before{color:rgba(216,174,98,.05)}
.gb-tag{
  background:rgba(216,174,98,.08);
  border:1px solid rgba(216,174,98,.28);
  color:var(--gold-lt);letter-spacing:.16em;
}
.game-banner h3{color:var(--paper);font-weight:600;letter-spacing:.1em}
.game-banner p{color:var(--muted)}
.game-banner .btn,
.game-banner .btn:hover{
  background:var(--gold);color:#241a10;border-color:transparent;
}
.game-banner .btn:hover{background:var(--gold-lt)}
.gb-art svg{opacity:.92}

/* ---------- 页脚 ---------- */
.site-footer{
  background:#080605;
  border-top:1px solid rgba(216,174,98,.12);
  color:var(--muted);
}
.footer-grid h4{color:var(--paper);font-weight:600;letter-spacing:.1em}
.footer-grid h4::before{background:linear-gradient(180deg,var(--crimson),var(--gold))}
.footer-grid a,.footer-grid p{color:var(--muted)}
.footer-grid a:hover{color:var(--paper)}
.footer-slogan-marquee{
  background:rgba(166,36,27,.14);
  border-top:1px solid rgba(216,174,98,.1);
  border-bottom:1px solid rgba(216,174,98,.1);
}
.footer-slogan-marquee .mq-track{color:var(--gold-dk);letter-spacing:.18em}
.footer-bottom{
  color:rgba(162,148,127,.72);
  border-top:1px solid rgba(216,174,98,.1);
}

/* ---------- 杂项 ---------- */
.kicker{color:var(--gold)}
.meta{color:var(--gold)}
.red{color:var(--c-red-bright)}
a{color:inherit}
strong,b{color:var(--paper)}