/* ══ 典藏级版式组件 ══ */

/* 封面 */
.lay-cover{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(180px,.68fr);align-items:center;gap:clamp(26px,5vw,88px)}
.big-num{color:transparent;text-align:right;font:700 clamp(100px,15.5vw,230px)/.68 var(--serif);letter-spacing:-.08em;
  -webkit-text-stroke:1px color-mix(in srgb,var(--accent) 50%,transparent)}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:26px;
  border:1px solid var(--hairline);background:var(--hairline)}
.fact{position:relative;padding:14px 15px;background:rgba(6,11,16,.92)}
.fact::before{content:"";position:absolute;left:0;top:0;width:26%;height:2px;background:var(--accent)}
.fact small{display:block;color:var(--fg-3);font:7px/1 var(--mono);letter-spacing:.18em}
.fact b{display:block;margin-top:9px;font:500 clamp(12px,1.08vw,15.5px)/1.32 var(--serif)}

/* 章节 */
.lay-chapter{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:clamp(24px,5vw,80px)}
.ch-num{color:transparent;font:700 clamp(88px,13.5vw,204px)/.7 var(--serif);
  -webkit-text-stroke:1px color-mix(in srgb,var(--accent) 66%,transparent)}

/* 事件 */
.lay-event{display:grid;grid-template-columns:minmax(180px,.33fr) minmax(0,1.67fr);gap:clamp(22px,4vw,64px);align-items:stretch}
.chrono{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:22px;overflow:hidden;
  border:1px solid color-mix(in srgb,var(--accent) 38%,var(--hairline));
  background:linear-gradient(164deg,color-mix(in srgb,var(--accent) 16%,var(--ink-3)),var(--ink-1));
  box-shadow:0 22px 54px rgba(0,0,0,.32)}
.chrono::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);
  animation:barGlow 3.6s ease-in-out infinite}
@keyframes barGlow{0%,100%{opacity:.55}50%{opacity:1;box-shadow:0 0 20px var(--accent)}}
.chrono::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(152deg,rgba(255,255,255,.08),transparent 46%)}
.c-date{position:relative;z-index:1;font:700 clamp(31px,3.6vw,54px)/.88 var(--serif);letter-spacing:-.046em}
.c-era{position:relative;z-index:1;display:block;margin-top:12px;
  color:color-mix(in srgb,var(--accent) 80%,white);font:8px/1.5 var(--mono);letter-spacing:.2em}
.c-clock{position:relative;z-index:1;margin-top:20px;padding-top:15px;border-top:1px solid var(--hairline)}
.c-clock b{display:block;font:400 clamp(19px,2.1vw,30px)/1 var(--mono)}
.c-clock span{display:block;margin-top:9px;color:var(--fg-3);font:8px/1.6 var(--mono);letter-spacing:.13em}
.hits{display:grid;gap:8px;margin-top:18px}
.hit{position:relative;padding:11px 14px 11px 29px;color:#c8cfc8;font-size:clamp(10px,.92vw,12.5px);line-height:1.62;
  border:1px solid var(--hairline);background:rgba(255,255,255,.018);transition:.22s var(--ease)}
.hit::before{content:"";position:absolute;left:12px;top:16px;width:5.5px;height:5.5px;background:var(--accent);
  transform:rotate(45deg);box-shadow:0 0 8px color-mix(in srgb,var(--accent) 60%,transparent)}
.hit:hover{transform:translateX(4px);border-color:color-mix(in srgb,var(--accent) 46%,transparent);
  background:color-mix(in srgb,var(--accent) 6%,transparent)}

/* 人物 */
.lay-figure{display:grid;grid-template-columns:minmax(200px,.54fr) minmax(0,1.46fr);gap:clamp(24px,4.8vw,70px);align-items:center}
.face{position:relative;aspect-ratio:3/3.7;max-height:min(60vh,460px);overflow:hidden;
  display:grid;place-items:end center;border:1px solid var(--line-2);
  background:radial-gradient(circle at 50% 24%,rgba(245,242,228,.26) 0 14%,transparent 14.5%),
    linear-gradient(164deg,color-mix(in srgb,var(--accent) 40%,#1d2c33),#050a0e);
  box-shadow:0 26px 64px rgba(0,0,0,.42)}
.face::after{content:"";position:absolute;bottom:-16%;width:66%;height:56%;
  border-radius:50% 50% 4% 4%;background:rgba(239,241,227,.15)}
.face::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(158deg,rgba(255,255,255,.09),transparent 42%)}
.face b{position:relative;z-index:2;margin-bottom:26%;font:700 clamp(27px,3.1vw,46px)/1 var(--serif);
  text-shadow:0 4px 18px rgba(0,0,0,.85)}
.face i{position:absolute;left:13px;top:13px;z-index:2;color:rgba(255,255,255,.66);
  font:7px/1 var(--mono);font-style:normal;letter-spacing:.22em}
.f-role{color:color-mix(in srgb,var(--accent) 78%,white);font:8.5px/1.4 var(--mono);letter-spacing:.22em}
.f-name{margin:12px 0 14px;font:700 clamp(35px,5.4vw,74px)/.95 var(--serif);letter-spacing:-.048em;
  background:linear-gradient(150deg,#f6f4ed 40%,#b5bfc0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px}
.chip{padding:7px 12px;color:color-mix(in srgb,var(--accent) 74%,white);font:8px/1 var(--mono);letter-spacing:.13em;
  border:1px solid color-mix(in srgb,var(--accent) 38%,var(--hairline));transition:.22s var(--ease)}
.chip:hover{background:color-mix(in srgb,var(--accent) 13%,transparent);transform:translateY(-1px)}

/* 国家 */
.lay-state{display:grid;grid-template-columns:minmax(235px,.74fr) minmax(0,1.26fr);gap:clamp(20px,3.8vw,58px);align-items:stretch}
.crest-panel{position:relative;display:flex;flex-direction:column;justify-content:center;overflow:hidden;
  padding:clamp(22px,2.8vw,38px);border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line-2));
  background:radial-gradient(88% 62% at 88% 6%,color-mix(in srgb,var(--accent) 24%,transparent),transparent 64%),
    linear-gradient(160deg,var(--ink-3),var(--ink-1) 76%);
  box-shadow:0 26px 66px rgba(0,0,0,.4)}
.crest{position:relative;width:clamp(62px,6.8vw,90px);height:clamp(62px,6.8vw,90px);
  display:grid;place-items:center;margin-bottom:22px;border-radius:50%;
  color:color-mix(in srgb,var(--accent) 78%,white);font:700 clamp(24px,2.6vw,35px)/1 var(--serif);
  border:1px solid color-mix(in srgb,var(--accent) 74%,white 8%);
  box-shadow:inset 0 0 0 7px rgba(0,0,0,.2),0 0 46px color-mix(in srgb,var(--accent) 20%,transparent)}
.crest::after{content:"";position:absolute;inset:-11px;border-radius:50%;
  border:1px dashed color-mix(in srgb,var(--accent) 34%,transparent);animation:orbit 26s linear infinite}
@keyframes orbit{to{transform:rotate(360deg)}}
.crest-panel h2{position:relative;z-index:1;font:700 clamp(26px,3.3vw,47px)/1.02 var(--serif);letter-spacing:-.044em;
  background:linear-gradient(150deg,#f6f4ed 45%,#b0bab4 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.s-ideo{position:relative;z-index:1;margin-top:13px;color:color-mix(in srgb,var(--accent) 70%,white);
  font-size:clamp(10px,.92vw,12.5px);line-height:1.68}
.s-motto{position:relative;z-index:1;margin-top:auto;padding-top:18px;border-top:1px solid var(--hairline);
  color:#dbded4;font:italic clamp(12px,1.02vw,15px)/1.68 var(--serif)}
.panel{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--hairline);
  background:linear-gradient(154deg,var(--ink-2),var(--ink-1));box-shadow:0 20px 50px rgba(0,0,0,.3)}
.p-head{display:flex;align-items:center;gap:11px;padding:12px 16px;border-bottom:1px solid var(--hairline);
  background:var(--ink-3);font:600 10.5px/1.2 var(--serif);letter-spacing:.14em}
.p-head::before{content:"";width:6.5px;height:6.5px;background:var(--accent);transform:rotate(45deg);
  box-shadow:0 0 8px color-mix(in srgb,var(--accent) 55%,transparent)}
.p-head span{margin-right:auto}
.p-head small{color:var(--fg-3);font:7px/1 var(--mono);letter-spacing:.18em}
.p-body{flex:1;display:flex;flex-direction:column;gap:16px;padding:clamp(14px,1.8vw,22px);min-height:0}
.gauge{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--hairline)}
.g-cell{padding:13px;background:var(--ink-0)}
.g-cell small{display:block;color:var(--fg-3);font:7px/1.2 var(--mono);letter-spacing:.16em}
.g-cell b{display:block;margin-top:10px;color:#eaede3;font:500 clamp(14px,1.55vw,23px)/1.1 var(--serif)}
.g-cell.key b{color:color-mix(in srgb,var(--accent) 82%,white)}
.lines{display:grid}
.line{display:grid;grid-template-columns:minmax(80px,.56fr) 1.44fr;gap:15px;padding:10.5px 0;
  border-bottom:1px solid var(--hairline);font-size:clamp(10px,.9vw,12.5px);line-height:1.58}
.line:last-child{border-bottom:0}
.line span{color:var(--fg-3)}
.line b{font-weight:500;color:#dfe3db;text-align:right}

/* 要点 */
.lay-notes{display:grid;grid-template-columns:minmax(0,1fr) minmax(275px,.78fr);gap:clamp(22px,4vw,62px);align-items:center}
.notes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
.note{position:relative;padding:15px;overflow:hidden;border:1px solid var(--hairline);border-left:2px solid var(--accent);
  background:linear-gradient(150deg,rgba(255,255,255,.045),rgba(255,255,255,.007));transition:.24s var(--ease)}
.note:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 48%,transparent);
  box-shadow:0 14px 34px rgba(0,0,0,.3)}
.note small{display:block;color:var(--accent);font:7.5px/1 var(--mono);letter-spacing:.18em}
.note b{display:block;margin:10px 0 8px;font:600 clamp(12px,1.08vw,15.5px)/1.32 var(--serif)}
.note p{color:var(--fg-3);font-size:clamp(9px,.85vw,11.5px);line-height:1.68}

/* 时间轴 */
.tl{position:relative;margin-top:24px;padding-left:38px;display:grid;gap:16px}
.tl::before{content:"";position:absolute;left:6px;top:5px;bottom:5px;width:1px;
  background:linear-gradient(var(--accent),var(--line),transparent)}
.tl-row{position:relative;display:grid;grid-template-columns:minmax(96px,124px) 1fr;gap:19px}
.tl-row::before{content:"";position:absolute;left:-36px;top:5px;width:7.5px;height:7.5px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 0 3px var(--ink-0);animation:nodeBeat 3s ease-in-out infinite}
@keyframes nodeBeat{0%,100%{box-shadow:0 0 0 3px var(--ink-0)}50%{box-shadow:0 0 0 3px var(--ink-0),0 0 16px var(--accent)}}
.tl-row time{color:var(--accent);font:600 8.5px/1.5 var(--mono);letter-spacing:.13em}
.tl-row h3{margin-bottom:6px;font:600 clamp(12px,1.12vw,15.5px)/1.34 var(--serif)}
.tl-row p{color:var(--fg-3);font-size:clamp(9px,.88vw,11.5px);line-height:1.68}

/* 区域 */
.zones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:24px}
.zone-card{position:relative;padding:16px;overflow:hidden;border:1px solid var(--hairline);
  background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.009));transition:.24s var(--ease)}
.zone-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--zc) 54%,transparent);
  box-shadow:0 14px 36px rgba(0,0,0,.3)}
.zone-card i{display:block;width:26px;height:2px;margin-bottom:13px;background:var(--zc);
  box-shadow:0 0 8px color-mix(in srgb,var(--zc) 55%,transparent)}
.zone-card small{display:block;color:var(--fg-3);font:7px/1 var(--mono);letter-spacing:.18em}
.zone-card b{display:block;margin:9px 0 8px;font:600 clamp(12px,1.08vw,15.5px)/1.3 var(--serif)}
.zone-card p{color:var(--fg-3);font-size:clamp(9px,.85vw,11.5px);line-height:1.68}

/* 结尾 */
.lay-end{display:grid;grid-template-columns:minmax(170px,.46fr) minmax(0,1.54fr);gap:clamp(26px,5vw,80px);align-items:center}
.end-sign{color:transparent;font:700 clamp(115px,17.5vw,260px)/.72 var(--serif);
  -webkit-text-stroke:1px color-mix(in srgb,var(--accent) 56%,transparent)}