/* 国际局势态势和动态 —— 单页长滚动主样式（零外链，无外部字体/图标） v7.1 */
:root{
	--bg:#070d1f; --bg2:#0b1226; --panel:rgba(15,26,58,.55); --line:rgba(99,140,255,.18);
	--tx:#dfe8ff; --tx2:hsl(221, 33%, 67%); --tx3:#5f719c; --cy:#00eaff; --gold:#ffc53d; --red:#ff5c5c; --grn:#31d17c;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font:14px/1.65 "Microsoft YaHei","PingFang SC",system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
i,em{font-style:normal}

/* ---------- 头部 ---------- */
.hero{position:relative;padding:52px 6vw 30px;text-align: center;background:
	linear-gradient(180deg,rgba(7,13,31,.2) 0%,rgba(7,13,31,.9) 100%),
	radial-gradient(1200px 420px at 20% -10%,rgba(47,129,247,.22),transparent 60%),
	radial-gradient(900px 380px at 85% -20%,rgba(255,92,92,.14),transparent 60%)}
.hero h1{font-size:30px;letter-spacing:2px;font-weight:700}
.hero h1 span{color:var(--cy)}
.hero p{margin: 0 auto;max-width: 880px;font-size: 14px;color: #8fa1c7;line-height: 1.9;}
.meta{margin-top:22px;color:var(--tx3);font-size:12px}
.meta i{color:var(--gold)}

/* ---------- 顶部导航（品牌 + 彩点目录 + 能力徽标 + 进度条，一体化） ---------- */
nav.toc{position:sticky;top:0;z-index:50;background:rgba(7,13,31,.88);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);box-shadow:0 4px 18px rgba(0,0,0,.35)}
nav.toc .in{display:flex;align-items:center;gap:10px 14px;max-width:1680px;width:96%;margin:0 auto;padding:8px 0;flex-wrap:wrap}
nav.toc .brand{display:inline-flex;align-items:baseline;gap:7px;font-size:15px;font-weight:800;color:#fff;letter-spacing:1px;padding:4px 12px 4px 10px;border-radius:8px;border:1px solid rgba(0,234,255,.28);background:linear-gradient(90deg,rgba(0,234,255,.12),rgba(0,234,255,.02));white-space:nowrap}
nav.toc .brand::before{content:"◈";color:var(--cy);font-size:14px}
nav.toc .brand .en{font-size:10px;font-weight:400;color:var(--tx3);letter-spacing:1.5px;font-family:Consolas,monospace}
nav.toc .links{display:flex;align-items:center;gap:2px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
nav.toc .links::-webkit-scrollbar{display:none}
nav.toc .links a{font-size:13px;color:var(--tx2);padding:5px 11px;border-radius:7px;white-space:nowrap;position:relative;transition:color .15s}
nav.toc .links a::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px;background:var(--cy);vertical-align:1px;opacity:.85;transition:box-shadow .15s}
nav.toc .links a.n-gd::before{background:var(--gold)}
nav.toc .links a.n-rd::before{background:var(--red)}
nav.toc .links a.n-gn::before{background:var(--grn)}
nav.toc .links a.n-cy::before{background:var(--cy)}
nav.toc .links a.n-vt::before{background:#9a6aff}
nav.toc .links a:hover{color:#fff;background:rgba(0,234,255,.08)}
nav.toc .links a:hover::before{box-shadow:0 0 6px currentColor}
nav.toc .links a.on{color:#fff;background:rgba(0,234,255,.14);text-shadow:0 0 8px rgba(0,234,255,.45)}
nav.toc .links a.on::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--cy),transparent)}
nav.toc .cap{margin-left:auto;font-size:11px;color:#7ef7d3;background:rgba(49,209,124,.08);border:1px solid rgba(49,209,124,.35);padding:2.5px 10px;border-radius:999px;white-space:nowrap}
nav.toc .prog{flex-basis:100%;height:2px;background:rgba(99,140,255,.1);border-radius:2px;overflow:hidden}
nav.toc .prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,#2f81f7,#00eaff);transition:width .12s linear;border-radius:2px}

.wrap{width: 96%;max-width: 1680px;margin:0 auto}

/* ---------- 区块 ---------- */
section{margin-top:44px;scroll-margin-top:72px}
.sec-head{display:flex;flex-direction:column;gap:4px;margin-bottom:14px}
.sec-head .tt{font-size:20px;font-weight:700;letter-spacing:1px}
.sec-head .tt::before{content:"◈";color:var(--cy);margin-right:8px;font-size:16px}
.sec-head .desc{color:var(--tx3);font-size:12.5px;max-width:1100px}

/* ---------- KPI ---------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;position:relative;overflow:hidden}
.kpi::after{content:"";position:absolute;right:-20px;top:-20px;width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,rgba(0,234,255,.12),transparent 70%)}
.kpi .num{font-size:26px;font-weight:800;color:#fff;font-family:Consolas,monospace}
.kpi .num i{font-size:12px;font-weight:400;color:var(--tx2);margin-left:4px}
.kpi .label{color:var(--tx2);font-size:12.5px;margin-top:2px}
.kpi .trend{color:var(--tx3);font-size:11.5px;margin-top:4px}

/* ---------- 力量总览 ---------- */
.power-panel{display:grid;grid-template-columns:minmax(420px,7fr) minmax(300px,4fr);gap:14px}
.map-box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;position:relative}
#world-map{width:100%;height:560px;display:block}
.map-legend{display:flex;flex-wrap:wrap;gap:10px;padding:8px 4px 2px;font-size:12px;color:var(--tx2)}
.map-legend span{display:inline-flex;align-items:center;gap:6px}
.map-legend i{width:10px;height:10px;border-radius:50%;display:inline-block}
.map-tip{position:absolute;right:14px;bottom:10px;font-size:11px;color:var(--tx3)}
.power-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.side-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.side-card h4,.panel h4{font-size:14px;color:#cfe0ff;margin-bottom:10px;font-weight:700}
.dim-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.dim-tabs button{background:rgba(0,234,255,.06);border:1px solid rgba(0,234,255,.25);color:#9fd8ff;font-size:12px;padding:4px 10px;border-radius:999px;cursor:pointer}
.dim-tabs button.on{background:rgba(0,234,255,.18);color:#fff}
#dim-chart{width:100%;height:340px}
#bloc-bars{display:flex;flex-direction:column;gap:9px}
/* 阵营力量对比条：上=名称条，下=数值行，两行结构，数值不折行 */
.bloc-row{display:flex;flex-direction:column;gap:3px}
.bloc-hd{display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.bloc-hd .bn{color:#cfe0ff;font-size:13px;font-weight:700}
.bloc-hd .bv{margin-left:auto;font-family:Consolas,monospace;font-size:12px;color:#ffd88a}
.bloc-hd .bv em{color:#9fb4dd;font-weight:400}
.bloc-row .track{background:rgba(99,140,255,.12);border-radius:4px;height:10px;overflow:hidden}
.bloc-row .fill{display:block;height:100%;border-radius:4px}

/* ---------- 格局演变时间轴 ---------- */
.timeline{position:relative;margin:8px 0 0 6px;padding-left:26px;border-left:2px solid rgba(0,234,255,.25)}
.tl-item{position:relative;padding:10px 14px;margin-bottom:12px;background:var(--panel);border:1px solid var(--line);border-radius:10px}
.tl-item::before{content:"";position:absolute;left:-33px;top:18px;width:10px;height:10px;border-radius:50%;background:var(--cy);box-shadow:0 0 0 4px rgba(0,234,255,.15)}
.tl-item .yr{font-family:Consolas,monospace;color:var(--gold);font-weight:700;font-size:13px}
.tl-item h5{display:inline-block;margin-left:8px;font-size:14px;color:#fff}
.tl-item .ld{margin-top:4px;font-size:12px;color:#9fd8ff}
.tl-item .ft{margin-top:6px;font-size:12.5px;color:var(--tx2)}
.tl-item .ev{margin-top:6px;font-size:12px;color:var(--tx3);border-left:2px solid rgba(255,197,61,.4);padding-left:8px}

/* ---------- 联盟阵营 ---------- */
.alliance-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.al-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;transition:transform .15s,border-color .15s}
.al-card:hover{transform:translateY(-2px);border-color:rgba(0,234,255,.4)}
.al-card .top{display:flex;justify-content:space-between;align-items:center}
.al-card .org{font-size:16px;font-weight:700;color:#fff}
.al-card .tag{font-size:11px;padding:2px 8px;border-radius:999px;background:rgba(0,234,255,.1);border:1px solid rgba(0,234,255,.3);color:#9fd8ff}
.al-card .full{margin-top:4px;font-size:12px;color:var(--tx3)}
.al-card .row{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--tx2)}
.al-card .row b{color:var(--gold);font-family:Consolas,monospace}
.al-card .mem{margin-top:8px;font-size:12px;color:var(--tx2);line-height:1.7}
.al-card .ds{margin-top:6px;font-size:12px;color:var(--tx3)}

/* ---------- 冲突 / 博弈（地图与右侧列表等高） ---------- */
.conflict-panel,.geo-panel{display:grid;grid-template-columns:minmax(400px,6fr) minmax(320px,5fr);gap:14px;align-items:stretch}
.conflict-panel .map-box,.geo-panel .map-box{display:flex;flex-direction:column;height:600px}
.conflict-panel #conflict-map,.geo-panel #geo-map{flex:1;min-height:0;height:auto;display:block}
.conflict-panel .map-legend,.geo-panel .map-legend{flex:none}
.conflict-panel .conf-list,.geo-panel .geo-list{height:600px;max-height:none;overflow:auto;display:flex;flex-direction:column;gap:8px;padding-right:4px}
.cf-item{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--red);border-radius:8px;padding:10px 12px}
.cf-item.mid{border-left-color:var(--gold)}
.cf-item.low{border-left-color:var(--tx3)}
.cf-item .h{display:flex;justify-content:space-between;gap:8px;align-items:center}
.cf-item .nm{font-weight:700;font-size:13.5px;color:#ffe1e1}
.cf-item .st{font-size:11px;padding:1px 8px;border-radius:999px;border:1px solid rgba(255,92,92,.4);color:#ffb0b0;white-space:nowrap}
.cf-item .st.m{border-color:rgba(255,197,61,.4);color:#ffd88a}
.cf-item .st.l{border-color:rgba(95,113,156,.55);color:#a8b8d8}
.cf-item .meta{margin-top:4px;font-size:11.5px;color:var(--tx3);display:flex;flex-wrap:wrap;gap:4px 12px}
.cf-item .ds{margin-top:5px;font-size:12px;color:var(--tx2)}

/* ---------- 博弈/争端/挑战 列表项 ---------- */
.geo-item{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.geo-item .nm{font-weight:700;font-size:13.5px;color:#dfe8ff}
.geo-item .ty{font-size:11px;padding:1px 8px;border-radius:999px;border:1px solid rgba(0,234,255,.35);color:#9fd8ff;white-space:nowrap;float:right}
.geo-item .ty.dis{border-color:rgba(255,197,61,.4);color:#ffd88a}
.geo-item .ty.cha{border-color:rgba(49,209,124,.45);color:#7ef7d3}
.geo-item .meta{margin-top:4px;font-size:11.5px;color:var(--tx3);display:flex;flex-wrap:wrap;gap:4px 12px}
.geo-item .ds{margin-top:5px;font-size:12px;color:var(--tx2)}

/* ---------- 动态 ---------- */
.news-panel{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.news-box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}
.news-list{max-height:420px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.news-item{display:flex;gap:10px;border-bottom:1px dashed rgba(99,140,255,.15);padding-bottom:8px}
.news-item .d{font-family:Consolas,monospace;color:var(--gold);font-size:12px;white-space:nowrap;padding-top:2px}
.news-item .b{min-width:0}
.news-item .t{font-size:13px;color:#cfe0ff}
.news-item .t a:hover{color:var(--cy)}
.news-item .s{margin-top:2px;font-size:11.5px;color:var(--tx3)}
.news-item .s em{color:#9fd8ff;margin-right:8px;border:1px solid rgba(0,234,255,.3);padding:0 6px;border-radius:999px;font-size:10.5px}
/* 等级徽标：inline-block 定宽居中，高/中/低三档等宽等高不变形；
   三档色相与地图气泡完全同源：高=#ff5c5c(255,92,92) 中=#ffc53d(255,197,61) 低=#5f719c(95,113,156) */
.sev{display:inline-block;min-width:25px;box-sizing:border-box;text-align:center;font-size:11px;line-height:15px;padding:0 7px;border-radius:999px;margin-left:6px;vertical-align:1px;white-space:nowrap}
.sev.h{background:rgba(255,92,92,.15);color:#ffb0b0;border:1px solid rgba(255,92,92,.4)}
.sev.m{background:rgba(255,197,61,.12);color:#ffd88a;border:1px solid rgba(255,197,61,.4)}
.sev.l{background:rgba(95,113,156,.15);color:#a8b8d8;border:1px solid rgba(95,113,156,.5)}

/* ---------- 表格（国力总表） ---------- */
.tbl-scroll{max-height:460px;overflow:auto;border:1px solid var(--line);border-radius:12px}
table.gt{width:100%;border-collapse:collapse;font-size:12.5px;min-width:760px}
table.gt th{position:sticky;top:0;background:#101a3a;color:#9fb4dd;font-weight:600;padding:9px 10px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
table.gt td{padding:8px 10px;border-bottom:1px solid rgba(99,140,255,.09);color:var(--tx2);white-space:nowrap}
table.gt td.c{color:#fff;font-weight:600}
table.gt tr:hover td{background:rgba(0,234,255,.05)}
.bar-mini{display:inline-block;height:8px;border-radius:4px;vertical-align:middle;margin-right:6px}

/* ---------- 页脚 ---------- */
footer{margin-top:46px;padding:22px 6vw;border-top:1px solid var(--line);color:var(--tx3);font-size:12px;text-align:center;line-height:2}
footer .fl{color:var(--cy);border-bottom:1px dashed rgba(0,234,255,.5);padding-bottom:1px}
footer .fl:hover{color:#fff;border-bottom-color:#fff}
footer b{color:var(--gold);font-family:Consolas,monospace}

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
	.power-panel,.conflict-panel,.geo-panel,.news-panel{grid-template-columns:1fr}
	#world-map{height:440px}
	.conflict-panel .map-box,.geo-panel .map-box{height:auto}
	.conflict-panel #conflict-map,.geo-panel #geo-map{height:400px;flex:none}
	.conflict-panel .conf-list,.geo-panel .geo-list{height:auto;max-height:480px}
}
@media (max-width:920px){
	nav.toc .cap{display:none}
	nav.toc .prog{order:4}
}
@media (max-width:640px){
	.hero h1{font-size:22px}
	nav.toc .in{padding:6px 4vw}
	nav.toc .brand .en{display:none}
}