/* 苍银之墟 - 写实历史风格 */
:root {
  --bg: #f5f0e8;
  --bg2: #ede7d9;
  --card: #faf6ed;
  --text: #2c2419;
  --text2: #5a4e3c;
  --muted: #8b7355;
  --coalition: #4a6fa5;
  --league: #c44536;
  --neutral: #d4a574;
  --danger: #8b0000;
  --border: #c9b896;
  --gold: #8b6914;
}
[data-theme=dark] { --bg:#1a1510;--bg2:#252018;--card:#2d2620;--text:#e8dcc8;--text2:#c4b896;--muted:#8b7355;--border:#4a3f30; }
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:Noto Serif SC,serif; background:var(--bg); color:var(--text); line-height:1.8; }
.top-bar { background:linear-gradient(135deg,#8b0000,#5c0000); color:#f5f0e8; padding:8px 20px; font-size:12px; letter-spacing:1px; border-bottom:3px solid #4a0000; }
.classification-stamp { background:#fff; color:#8b0000; padding:2px 12px; font-weight:bold; border:2px solid #8b0000; transform:rotate(-2deg); font-family:monospace; }
.main-nav { background:linear-gradient(to bottom,#3d2b1f,#2c1f15); padding:15px 30px; display:flex; justify-content:space-between; align-items:center; border-bottom:4px solid var(--gold); position:sticky; top:0; z-index:100; }
.nav-brand { display:flex; align-items:center; gap:15px; }
.emblem { font-size:36px; }
.brand-text h1 { font-size:28px; color:#f5f0e8; letter-spacing:4px; }
.brand-text .subtitle { font-size:11px; color:#c9b896; letter-spacing:2px; }
.nav-links { display:flex; list-style:none; gap:5px; }
.nav-links a { color:#c9b896; text-decoration:none; padding:8px 16px; font-size:14px; border-radius:3px; transition:all .3s; border:1px solid transparent; }
.nav-links a:hover,.nav-links a.active { background:rgba(139,105,20,.3); color:#f5f0e8; border-color:var(--gold); }
.btn-theme { background:transparent; border:1px solid var(--gold); color:#c9b896; padding:6px 12px; cursor:pointer; }
.main-content { max-width:1200px; margin:0 auto; padding:30px; }
.hero { background:linear-gradient(135deg,#2c1f15,#3d2b1f,#4a3528); padding:80px 40px; text-align:center; border:4px solid var(--gold); margin-bottom:40px; }
.hero-stamp { display:inline-block; background:#8b0000; color:#fff; padding:8px 24px; font-weight:bold; border:3px solid #fff; transform:rotate(-3deg); margin-bottom:20px; }
.hero-title { font-size:48px; color:#f5f0e8; margin-bottom:15px; letter-spacing:8px; }
.hero-subtitle { font-size:18px; color:#c9b896; margin-bottom:30px; font-style:italic; }
.hero-meta { display:flex; justify-content:center; gap:30px; flex-wrap:wrap; }
.meta-item { background:rgba(139,105,20,.2); padding:8px 20px; border:1px solid var(--gold); color:#e8dcc8; font-size:13px; }
.section-header { display:flex; align-items:center; gap:15px; margin-bottom:25px; padding-bottom:10px; border-bottom:2px solid var(--border); }
.section-header h3 { font-size:22px; }
.header-line { flex:1; height:2px; background:linear-gradient(to right,var(--border),transparent); }
.card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:25px; margin-bottom:40px; }
.info-card { background:var(--card); border:2px solid var(--border); padding:25px; display:flex; gap:20px; text-decoration:none; color:inherit; transition:all .3s; position:relative; overflow:hidden; }
.info-card:hover { transform:translateY(-3px); box-shadow:0 8px 25px rgba(0,0,0,.15); border-color:var(--gold); }
.card-icon { font-size:40px; flex-shrink:0; }
.card-content h4 { font-size:18px; margin-bottom:8px; }
.card-tagline { font-size:13px; color:var(--muted); margin-bottom:12px; }
.card-members { display:flex; flex-wrap:wrap; gap:6px; }
.member { background:var(--bg2); padding:3px 10px; font-size:11px; border-radius:3px; }
.card-arrow { position:absolute; top:20px; right:20px; font-size:24px; color:var(--muted); opacity:0; transition:all .3s; }
.info-card:hover .card-arrow { opacity:1; right:15px; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:20px; margin-bottom:40px; }
.stat-box { background:var(--card); border:2px solid var(--border); padding:25px; text-align:center; }
.stat-number { font-size:36px; font-weight:700; color:var(--coalition); }
.stat-label { font-size:13px; color:var(--muted); margin-top:5px; }
.intel-list { display:flex; flex-direction:column; gap:12px; }
.intel-item { display:flex; gap:15px; padding:15px; background:var(--card); border:1px solid var(--border); align-items:center; }
.intel-date { font-family:monospace; font-size:12px; color:var(--muted); min-width:90px; }
.intel-content { flex:1; font-size:14px; }
.intel-tag { padding:3px 10px; font-size:11px; border-radius:3px; font-weight:bold; }
.tag-priority { background:#c44536; color:#fff; }
.tag-warning { background:#d4a574; color:#2c1f15; }
.tag-info { background:#4a6fa5; color:#fff; }
.tag-danger { background:#8b0000; color:#fff; }
.faction-filter { display:flex; gap:10px; margin-bottom:30px; flex-wrap:wrap; }
.filter-btn { background:var(--card); border:2px solid var(--border); padding:8px 20px; font-size:14px; cursor:pointer; transition:all .3s; font-family:inherit; }
.filter-btn:hover,.filter-btn.active { background:var(--gold); color:#fff; border-color:var(--gold); }
.faction-card { background:var(--card); border:2px solid var(--border); padding:30px; margin-bottom:30px; }
.faction-header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:20px; padding-bottom:15px; border-bottom:2px solid var(--border); }
.faction-title h2 { font-size:24px; margin-bottom:5px; }
.faction-title .en-name { font-size:14px; color:var(--muted); font-style:italic; }
.faction-emblem { font-size:48px; }
.faction-section { margin-bottom:20px; }
.faction-section h4 { font-size:14px; color:var(--muted); margin-bottom:8px; text-transform:uppercase; letter-spacing:1px; }
.faction-section p,.faction-section ul { font-size:15px; }
.faction-section ul { list-style:none; padding-left:0; }
.faction-section li { padding:5px 0; padding-left:20px; position:relative; }
.faction-section li:before { content:"-"; position:absolute; left:0; color:var(--gold); }
.faction-tag { display:inline-block; background:var(--bg2); padding:4px 12px; border-radius:3px; font-size:12px; margin-right:8px; margin-bottom:8px; }
.territory-map { background:var(--bg2); padding:20px; border:1px dashed var(--border); font-family:monospace; font-size:13px; color:var(--muted); }
.page-header { margin-bottom:30px; padding-bottom:20px; border-bottom:3px solid var(--border); }
.page-header h2 { font-size:32px; margin-bottom:10px; }
.page-desc { color:var(--muted); font-size:15px; }
.grayzone-warning { background:#8b0000; color:#fff; padding:15px 20px; border-radius:4px; display:flex; align-items:center; gap:12px; margin-bottom:30px; }
.warning-icon { font-size:24px; }
.grayzone-card { background:var(--card); border:2px solid var(--border); padding:25px; margin-bottom:20px; border-left:5px solid var(--danger); }
.grayzone-card h3 { font-size:20px; margin-bottom:10px; }
.grayzone-meta { display:flex; gap:20px; margin-bottom:15px; flex-wrap:wrap; }
.grayzone-meta span { font-size:13px; color:var(--muted); }
.danger-level { padding:4px 12px; border-radius:3px; font-weight:bold; font-size:12px; }
.danger-high { background:#8b0000; color:#fff; }
.danger-mid { background:#d4a574; color:#2c1f15; }
.tech-section { margin-bottom:40px; }
.tech-section h3 { font-size:20px; margin-bottom:20px; padding-bottom:10px; border-bottom:2px solid var(--border); }
.tech-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px; }
.tech-card { background:var(--card); border:2px solid var(--border); padding:20px; }
.tech-card h4 { font-size:16px; margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.tech-card p { font-size:14px; color:var(--text2); }
.limitation-list { list-style:none; }
.limitation-list li { padding:10px 15px; background:var(--card); border:1px solid var(--border); margin-bottom:10px; font-size:15px; }
.limitation-list li:before { content:"⚠ "; color:var(--danger); }
.timeline-container { position:relative; padding-left:40px; }
.timeline-container:before { content:""; position:absolute; left:15px; top:0; bottom:0; width:2px; background:var(--border); }
.timeline-item { position:relative; margin-bottom:30px; padding:20px; background:var(--card); border:2px solid var(--border); }
.timeline-item:before { content:""; position:absolute; left:-33px; top:25px; width:12px; height:12px; background:var(--gold); border-radius:50%; border:3px solid var(--bg); }
.timeline-date { font-family:monospace; font-size:13px; color:var(--gold); margin-bottom:8px; }
.timeline-event { font-size:16px; }
.map-container { background:var(--card); border:3px solid var(--border); padding:30px; margin-bottom:30px; }
.map-placeholder { position:relative; min-height:400px; background:linear-gradient(135deg,#e8dcc8,#d4c4a8); border:2px solid var(--border); display:flex; align-items:center; justify-content:center; }
.map-frame { text-align:center; }
.map-title { font-size:28px; font-weight:bold; margin-bottom:10px; color:var(--text); }
.map-subtitle { font-size:12px; color:var(--muted); margin-bottom:30px; letter-spacing:2px; }
.map-legend { margin-top:20px; text-align:left; }
.map-legend h4 { margin-bottom:10px; }
.legend-item { display:flex; align-items:center; gap:10px; margin-bottom:8px; font-size:14px; }
.legend-color { width:20px; height:14px; border:1px solid var(--border); }
.coalition-color { background:var(--coalition); }
.league-color { background:var(--league); }
.neutral-color { background:var(--neutral); }
.grayzone-color { background:var(--danger); }
.map-controls { display:flex; gap:10px; margin-top:20px; }
.map-btn { background:var(--card); border:2px solid var(--border); padding:8px 16px; cursor:pointer; font-family:inherit; }
.map-btn:hover { background:var(--gold); color:#fff; }
.site-footer { margin-top:50px; padding:30px; background:var(--bg2); border-top:3px solid var(--border); text-align:center; }
.footer-disclaimer { font-size:13px; color:var(--muted); }
.footer-date { margin-top:10px; font-family:monospace; }
/* 势力卡片样式增强 */
.faction-card { background:var(--card); border:2px solid var(--border); padding:30px; margin-bottom:30px; position:relative; }
.faction-card:before { content:"机密"; position:absolute; top:10px; right:10px; font-size:10px; color:var(--danger); border:1px solid var(--danger); padding:2px 8px; transform:rotate(5deg); }

/* 时间线样式增强 */
.timeline-container { position:relative; padding-left:40px; }
.timeline-container:before { content:""; position:absolute; left:15px; top:0; bottom:0; width:2px; background:var(--border); }
.timeline-item { position:relative; margin-bottom:30px; padding:20px; background:var(--card); border:2px solid var(--border); }
.timeline-item:before { content:""; position:absolute; left:-33px; top:25px; width:12px; height:12px; background:var(--gold); border-radius:50%; border:3px solid var(--bg); }
.timeline-date { font-family:monospace; font-size:13px; color:var(--gold); margin-bottom:8px; }
.timeline-event { font-size:16px; }

/* 灰域卡片样式增强 */
.grayzone-card { background:var(--card); border:2px solid var(--border); padding:25px; margin-bottom:20px; border-left:5px solid var(--danger); }
.grayzone-card h3 { font-size:20px; margin-bottom:10px; }
.grayzone-meta { display:flex; gap:20px; margin-bottom:15px; flex-wrap:wrap; }
.grayzone-meta span { font-size:13px; color:var(--muted); }
.danger-level { padding:4px 12px; border-radius:3px; font-weight:bold; font-size:12px; }
.danger-high { background:#8b0000; color:#fff; }
.danger-mid { background:#d4a574; color:#2c1f15; }

/* 科技卡片样式 */
.tech-card { background:var(--card); border:2px solid var(--border); padding:20px; }
.tech-card h4 { font-size:16px; margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.tech-card p { font-size:14px; color:var(--text2); }

@media(max-width:768px) { 
    .nav-links { display:none; } 
    .hero-title { font-size:32px; } 
    .card-grid { grid-template-columns:1fr; }
    .faction-header { flex-direction:column; }
    .faction-emblem { font-size:36px; margin-top:10px; }
}