:root {
  --bg: #f7f5ef; --surface: #fffdf9; --surface-2: #efeee8; --text: #20282e;
  --muted: #6b767a; --line: #d9ddd8; --accent: #aa602d; --accent-soft: #f3dfcf;
  --blue: #dce9ef; --green: #e0e9dc; --yellow: #f3e5b8; --rose: #efd7d1;
  --lavender: #dad8ec; --shadow: 0 18px 42px rgba(35,43,47,.08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 15px/1.65 "Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
button,input { font: inherit; } button { cursor: pointer; touch-action:manipulation; } a { color: inherit; text-decoration: none; }
button:focus-visible,input:focus-visible,a:focus-visible { outline: 3px solid rgba(170,96,45,.35); outline-offset: 2px; }
.skip-link { position:absolute; top:8px; left:8px; z-index:20; padding:8px 12px; border-radius:6px; background:var(--text); color:var(--surface); transform:translateY(-140%); transition-property:transform; transition-duration:.16s; }
.skip-link:focus { transform:translateY(0); }
.site-header { display:flex; align-items:center; justify-content:space-between; min-height:78px; padding:0 34px; border-bottom:1px solid var(--line); background:var(--surface); position:sticky; top:0; z-index:4; }
.brand { display:flex; align-items:center; gap:11px; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; border-radius:8px; background:var(--text); color:var(--surface); font-size:20px; font-weight:800; }
.brand small,.brand strong { display:block; line-height:1.15; }.brand small,.eyebrow { color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.13em; }.brand strong { margin-top:3px; font-size:19px; }
.header-actions { display:flex; gap:9px; }.icon-button,.quiet-button,.filter-button,.text-button { border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--text); }
.icon-button { width:36px; height:36px; padding:0; font-size:21px; }.quiet-button { padding:8px 12px; font-size:13px; }
.icon-button:hover,.quiet-button:hover,.filter-button:hover,.text-button:hover { border-color:var(--accent); }
.icon-button:active,.quiet-button:active,.filter-button:active,.text-button:active,.region-button:active { transform:scale(.96); }
.app-shell { display:grid; grid-template-columns:250px minmax(0,1fr); max-width:1500px; margin:auto; }
.sidebar { min-height:calc(100vh - 78px); padding:30px 20px; border-right:1px solid var(--line); }
.side-label { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; color:var(--muted); font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.side-label b { display:grid; place-items:center; width:23px; height:23px; border-radius:50%; background:var(--surface-2); color:var(--text); font-size:11px; }
#region-nav { display:grid; gap:4px; }.region-button { display:flex; align-items:center; gap:9px; width:100%; padding:10px 11px; border:0; border-radius:7px; background:transparent; color:var(--muted); text-align:left; }
.region-button:hover,.region-button.active { background:var(--accent-soft); color:var(--text); }.region-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); }
.side-rule { height:1px; margin:30px 0; background:var(--line); }.progress { height:6px; overflow:hidden; border-radius:99px; background:var(--surface-2); }.progress span { display:block; width:0; height:100%; border-radius:inherit; background:var(--accent); transition:width .2s; }
.progress-copy { margin:8px 0; color:var(--muted); font-size:12px; }
.content { min-width:0; padding:30px clamp(20px,4vw,68px) 80px; }.hero { display:flex; align-items:end; justify-content:space-between; gap:24px; min-height:240px; padding:clamp(25px,5vw,58px); border:1px solid var(--line); border-radius:10px; background:linear-gradient(100deg,rgba(255,253,249,.97),rgba(255,253,249,.7)),radial-gradient(circle at 85% 25%,var(--blue) 0,transparent 33%),radial-gradient(circle at 70% 90%,var(--accent-soft) 0,transparent 30%); box-shadow:var(--shadow); }
h1,h2,h3,p { margin-top:0; }.hero h1 { max-width:720px; margin:0 0 10px; font-size:clamp(38px,6vw,70px); line-height:1.12; }.hero-summary { max-width:700px; margin:0; color:var(--muted); font-size:17px; }.hero-stat { min-width:135px; padding-left:20px; border-left:1px solid var(--line); }.hero-stat small,.hero-stat span { display:block; color:var(--muted); font-size:12px; }.hero-stat strong { display:block; margin:7px 0 0; font-size:42px; line-height:1; }
.toolbar { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:24px 0 5px; }.search-box { display:flex; align-items:center; gap:9px; width:min(520px,100%); padding:10px 12px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }.search-box span { color:var(--muted); font-size:25px; line-height:1; }.search-box input { width:100%; border:0; outline:0; background:transparent; color:var(--text); } kbd { padding:2px 6px; border:1px solid var(--line); border-radius:4px; color:var(--muted); font-size:11px; }.filters { display:flex; flex-wrap:wrap; justify-content:end; gap:7px; }.filter-button { padding:7px 10px; color:var(--muted); font-size:12px; }.filter-button.active { border-color:var(--accent); background:var(--accent-soft); color:var(--text); }
.compact-section { margin-top:34px; }.stage-strip { display:flex; gap:9px; overflow-x:auto; padding:2px 2px 8px; scrollbar-width:thin; }.stage-button { flex:0 0 164px; min-height:78px; padding:12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text); text-align:left; }.stage-button:hover,.stage-button.active { border-color:var(--accent); background:var(--accent-soft); }.stage-button strong,.stage-button span { display:block; }.stage-button strong { margin-bottom:5px; font-size:13px; }.stage-button span { color:var(--muted); font-size:11px; line-height:1.45; }.thread-row { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; }.thread-button { min-height:74px; padding:11px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text); text-align:left; }.thread-button:hover,.thread-button.active { border-color:var(--accent); background:var(--accent-soft); }.thread-button strong,.thread-button span { display:block; }.thread-button strong { margin-bottom:4px; font-size:14px; }.thread-button span { color:var(--muted); font-size:11px; line-height:1.4; }.compact-empty { width:100%; padding:24px 16px; }
.section { margin-top:64px; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:23px; }.section-heading h2 { margin:0; font-size:32px; line-height:1.2; }.section-heading > p { margin:0 0 4px; color:var(--muted); font-size:13px; }
.timeline { display:grid; grid-template-columns:repeat(6,minmax(120px,1fr)); }.timeline-item { appearance:none; border:0; padding:20px 15px 0 0; background:transparent; color:inherit; cursor:pointer; font:inherit; text-align:left; transition:color .18s,transform .18s; }.timeline-item:hover { color:var(--accent); transform:translateY(-2px); }.timeline-item:focus-visible { outline:3px solid var(--accent); outline-offset:4px; border-radius:4px; }.timeline-item::before { content:""; display:block; height:4px; margin-bottom:16px; background:var(--line); }.timeline-item:first-child::before { background:var(--accent); border-radius:5px 0 0 5px; }.timeline-item:last-child::before { border-radius:0 5px 5px 0; }.timeline-year { margin-bottom:4px; color:var(--accent); font-size:12px; font-weight:800; }.timeline-item h3 { margin-bottom:5px; font-size:16px; }.timeline-item p { margin:0; color:var(--muted); font-size:13px; line-height:1.55; }
.map-board { display:grid; grid-template-columns:1.1fr .9fr; gap:16px; }
.method-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }.method-card { min-height:178px; padding:18px; border-top:3px solid var(--accent); background:var(--surface); box-shadow:0 5px 16px rgba(35,43,47,.04); }.method-index { display:block; margin-bottom:22px; color:var(--accent); font-size:12px; font-weight:800; letter-spacing:.12em; }.method-card h3 { margin-bottom:8px; font-size:16px; }.method-card p { margin:0; color:var(--muted); font-size:13px; line-height:1.65; }
.map-card { padding:20px; border-radius:10px; background:var(--surface); box-shadow:0 8px 24px rgba(35,43,47,.05); }
.map-card:first-child { grid-column:1 / -1; }
.map-head { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:17px; }
.map-head span { color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.map-head h3 { margin:0; font-size:20px; }
.map-items { display:grid; gap:10px; }
.map-chain .map-items { grid-template-columns:repeat(6,minmax(0,1fr)); }
.map-grid .map-items { grid-template-columns:repeat(2,minmax(0,1fr)); }
.map-layer .map-items { grid-template-columns:1fr; }
.map-node { min-height:96px; padding:13px; border-radius:8px; background:var(--surface-2); }
.map-node-button { display:block; width:100%; border:0; color:inherit; font:inherit; text-align:left; cursor:pointer; transition:transform .18s,box-shadow .18s; }.map-node-button:hover { transform:translateY(-2px); box-shadow:0 8px 18px rgba(35,43,47,.1); }.map-node-button:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.map-node:nth-child(3n+1) { background:var(--blue); }.map-node:nth-child(3n+2) { background:var(--green); }.map-node:nth-child(3n) { background:var(--yellow); }
.map-node b { display:block; margin-bottom:5px; font-size:14px; }
.map-node p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
.map-note { margin:14px 0 0; color:var(--muted); font-size:13px; }
.topic-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.topic-card { display:flex; min-height:285px; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:0 8px 24px rgba(35,43,47,.04); transition:transform .18s,box-shadow .18s; }.topic-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
.card-visual { position:relative; height:128px; overflow:hidden; background:var(--blue); }.card-visual img { width:100%; height:100%; object-fit:cover; }.card-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%,rgba(20,27,29,.38)); }.visual-label { position:absolute; right:12px; bottom:8px; z-index:1; color:white; font-size:11px; }.card-body { display:flex; flex:1; flex-direction:column; padding:17px; }.card-meta,.card-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; }.card-meta { margin-bottom:9px; color:var(--muted); font-size:11px; }.topic-card h3 { margin-bottom:7px; font-size:20px; line-height:1.3; }.topic-card p { margin-bottom:12px; color:var(--muted); font-size:14px; line-height:1.6; }.tag-list { display:flex; flex-wrap:wrap; gap:5px; margin-top:auto; }.tag { padding:3px 7px; border-radius:4px; background:var(--surface-2); color:var(--muted); font-size:11px; }.card-footer { margin-top:15px; padding-top:12px; border-top:1px solid var(--line); }.text-button { padding:5px 8px; font-size:12px; }.source-mark { color:var(--muted); font-size:11px; }.empty { padding:60px 20px; border:1px dashed var(--line); border-radius:8px; text-align:center; color:var(--muted); }.empty b { display:block; margin-bottom:7px; color:var(--text); }
.anchor-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.anchor-panel { padding:20px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }.anchor-panel:nth-child(1) { background:var(--blue); }.anchor-panel:nth-child(2) { background:var(--green); }.anchor-panel:nth-child(3) { background:var(--yellow); }.anchor-panel h3 { margin-bottom:14px; }.anchor-list { display:grid; gap:10px; margin:0; padding:0; list-style:none; }.anchor-list li { padding-bottom:10px; border-bottom:1px solid rgba(32,40,46,.13); font-size:14px; }.anchor-list li:last-child { padding-bottom:0; border-bottom:0; }.anchor-list small { display:block; color:var(--muted); font-size:12px; }
.country-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.country-card { display:flex; min-height:190px; flex-direction:column; padding:17px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }.country-card:nth-child(4n+1) { background:var(--blue); }.country-card:nth-child(4n+2) { background:var(--green); }.country-card:nth-child(4n+3) { background:var(--yellow); }.country-card:nth-child(4n) { background:var(--rose); }.country-card.selected { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-soft); }.country-card-head { display:flex; justify-content:space-between; gap:8px; margin-bottom:14px; color:var(--muted); font-size:11px; }.country-card-head b { color:var(--accent); }.country-card h3 { margin-bottom:7px; font-size:19px; }.country-card p { margin-bottom:14px; color:var(--muted); font-size:13px; line-height:1.55; }.country-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:auto; }.country-card .text-button,.object-card .text-button { align-self:flex-start; }
.object-tabs { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:14px; }.object-tab { min-height:40px; padding:7px 12px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--muted); }.object-tab:hover,.object-tab.active { border-color:var(--accent); background:var(--accent-soft); color:var(--text); }.object-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.object-card { display:flex; min-height:190px; flex-direction:column; padding:16px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }.object-card.selected { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-soft); }.object-card-head { display:flex; justify-content:space-between; gap:8px; margin-bottom:15px; color:var(--muted); font-size:11px; }.object-card-head b { color:var(--accent); }.object-card h3 { margin-bottom:7px; font-size:18px; }.object-card p { margin-bottom:14px; color:var(--muted); font-size:13px; line-height:1.55; }.object-card .text-button { margin-top:auto; align-self:flex-start; }.evidence-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.evidence-card { display:flex; min-height:230px; flex-direction:column; padding:16px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }.evidence-card:hover { border-color:var(--accent); }.evidence-head { display:flex; justify-content:space-between; gap:8px; margin-bottom:14px; }.evidence-head span { color:var(--accent); font-size:11px; font-weight:800; }.evidence-head small { color:var(--muted); font-size:10px; }.evidence-card strong { margin-bottom:7px; font-size:16px; line-height:1.35; }.evidence-card p { margin-bottom:10px; color:var(--muted); font-size:13px; line-height:1.55; }.evidence-note { margin-top:auto; color:var(--muted); font-size:11px; line-height:1.45; }.evidence-primary { background:linear-gradient(145deg,var(--surface),var(--blue)); }.evidence-archaeology { background:linear-gradient(145deg,var(--surface),var(--yellow)); }.evidence-visual { background:linear-gradient(145deg,var(--surface),var(--rose)); }.evidence-secondary { background:linear-gradient(145deg,var(--surface),var(--green)); }
.reading-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.reading-item { display:flex; min-height:188px; flex-direction:column; padding:17px; border:1px solid var(--line); border-radius:8px; background:var(--surface); box-shadow:0 5px 16px rgba(35,43,47,.04); }.reading-item:hover { border-color:var(--accent); }.reading-type { margin-bottom:10px; color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.reading-item strong { font-size:17px; line-height:1.35; }.reading-item p { margin:8px 0 14px; color:var(--muted); font-size:13px; line-height:1.6; }.reading-open { margin-top:auto; color:var(--accent); font-size:12px; }
dialog { width:min(760px,calc(100% - 30px)); max-height:86vh; padding:0; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--text); box-shadow:0 30px 90px rgba(22,30,34,.23); } dialog::backdrop { background:rgba(24,31,34,.38); }.dialog-head { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:24px 26px 18px; border-bottom:1px solid var(--line); }.dialog-head h2 { margin:0; font-size:30px; }.dialog-body,#dialog-body { padding:22px 26px 28px; }.dialog-body p,#dialog-body p { color:var(--muted); }.fact-list { display:grid; gap:9px; margin:0; padding:0; list-style:none; }.fact-list li { display:grid; grid-template-columns:92px 1fr; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }.fact-list b { color:var(--accent); font-size:13px; }.fact-list span { color:var(--muted); }.impact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.impact-grid div { padding:12px; border-radius:8px; background:var(--surface-2); }.impact-grid b { display:block; margin-bottom:5px; }.impact-grid p { margin:0; font-size:13px; }.link-cluster { display:flex; flex-wrap:wrap; gap:7px; }.link-cluster span { padding:5px 9px; border-radius:5px; background:var(--accent-soft); color:var(--text); font-size:12px; }.source-card { margin-top:18px; padding:13px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2); font-size:13px; }.source-card strong { display:block; margin-bottom:5px; }.source-card a { color:var(--accent); }.dialog-body ol { padding-left:22px; color:var(--muted); }code { padding:2px 4px; border-radius:4px; background:var(--surface-2); color:var(--text); }
.question-block { margin-bottom:20px; padding:14px 16px; border-left:3px solid var(--accent); background:var(--accent-soft); }.question-block span { display:block; margin-bottom:5px; color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.1em; }.question-block p { margin:0; color:var(--text) !important; font-size:16px; }.relation-section { margin-top:18px; }.relation-section h3 { margin-bottom:8px; }.relation-chips { display:flex; flex-wrap:wrap; gap:7px; }.relation-chip { min-height:34px; padding:5px 9px; border:1px solid var(--line); border-radius:5px; background:var(--surface-2); color:var(--text); font-size:12px; }.relation-chip:hover { border-color:var(--accent); }.dialog-evidence { display:grid; gap:8px; }.dialog-evidence a { padding:11px 12px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2); }.dialog-evidence a:hover { border-color:var(--accent); }.dialog-evidence span { display:block; margin-bottom:3px; color:var(--accent); font-size:11px; }.dialog-evidence strong { display:block; margin-bottom:3px; font-size:13px; }.dialog-evidence p,.dialog-evidence small { display:block; margin:0; color:var(--muted); font-size:12px; line-height:1.5; }
.related-topics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.related-topic { display:flex; min-height:68px; flex-direction:column; align-items:flex-start; padding:10px 12px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2); color:var(--text); text-align:left; }.related-topic:hover { border-color:var(--accent); }.related-topic span { margin-bottom:3px; color:var(--accent); font-size:11px; }.related-topic strong { font-size:13px; }
.country-profile-intro { margin-bottom:22px; padding:16px; border-left:3px solid var(--accent); background:var(--accent-soft); }.country-profile-intro span,.country-profile-intro strong { display:block; }.country-profile-intro span { margin-bottom:4px; color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.1em; }.country-profile-intro strong { margin-bottom:7px; font-size:22px; }.country-profile-intro p { margin:0; color:var(--text) !important; }.country-profile-actions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.country-compare { display:grid; gap:14px; }.compare-controls { display:flex; align-items:end; gap:12px; max-width:620px; }.compare-controls label { flex:1; }.compare-controls label span { display:block; margin-bottom:5px; color:var(--muted); font-size:11px; font-weight:800; }.compare-controls select { width:100%; min-height:40px; padding:7px 10px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--text); }.compare-mark { padding-bottom:8px; color:var(--accent); font-size:20px; font-weight:800; }.compare-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.compare-card { min-height:235px; padding:19px; border:1px solid var(--line); border-radius:9px; background:var(--surface); }.compare-card-a { background:linear-gradient(145deg,var(--surface),var(--blue)); }.compare-card-b { background:linear-gradient(145deg,var(--surface),var(--green)); }.compare-card-head { display:flex; justify-content:space-between; gap:10px; margin-bottom:16px; color:var(--muted); font-size:11px; }.compare-card-head strong { color:var(--accent); }.compare-card h3 { margin-bottom:7px; font-size:24px; }.compare-card p { min-height:48px; margin-bottom:12px; color:var(--muted); font-size:13px; }.compare-stat { display:flex; align-items:baseline; gap:7px; margin-bottom:15px; }.compare-stat b { color:var(--accent); font-size:28px; line-height:1; }.compare-stat span { color:var(--muted); font-size:12px; }.compare-insight { display:grid; grid-template-columns:1fr 1.5fr; gap:12px; }.compare-insight div { padding:14px 16px; border-left:3px solid var(--accent); background:var(--accent-soft); }.compare-insight span,.compare-insight strong { display:block; }.compare-insight span { margin-bottom:4px; color:var(--accent); font-size:11px; font-weight:800; }.compare-insight strong { font-size:13px; font-weight:600; }.compare-stages { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }.compare-stage { padding:12px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }.compare-stage > span { display:block; min-height:40px; color:var(--muted); font-size:12px; }.compare-stage i { display:block; height:8px; margin:9px 0 7px; border-radius:5px; background:linear-gradient(90deg,var(--accent) 0 calc(var(--a) * 12%),var(--line) calc(var(--a) * 12%) calc(var(--a) * 12% + 2px),var(--blue) calc(var(--a) * 12% + 2px) calc((var(--a) + var(--b)) * 12%),var(--line) calc((var(--a) + var(--b)) * 12%)); }.compare-stage small { color:var(--muted); font-size:11px; }
.cross-region-compare { display:grid; gap:14px; }.cross-compare-controls { display:flex; align-items:end; gap:12px; max-width:760px; }.cross-compare-controls label { flex:1; }.cross-compare-controls label span { display:block; margin-bottom:5px; color:var(--muted); font-size:11px; font-weight:800; }.cross-compare-controls select { width:100%; min-height:40px; padding:7px 10px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--text); }.cross-compare-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.cross-compare-card { min-height:235px; padding:19px; border:1px solid var(--line); border-radius:9px; }.cross-compare-card-a { background:linear-gradient(145deg,var(--surface),var(--yellow)); }.cross-compare-card-b { background:linear-gradient(145deg,var(--surface),var(--rose)); }.cross-compare-card h3 { margin-bottom:7px; font-size:24px; }.cross-compare-card p { min-height:48px; margin-bottom:12px; color:var(--muted); font-size:13px; }.cross-stage-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
body.dark { --bg:#1e2427; --surface:#252d30; --surface-2:#303a3e; --text:#edf0eb; --muted:#a9b4b2; --line:#3c484b; --accent:#e19a61; --accent-soft:#563c2d; --blue:#32464f; --green:#35463a; --yellow:#524a2d; --rose:#523a38; --lavender:#3d3a52; --shadow:0 18px 42px rgba(0,0,0,.22); } body.dark .site-header { background:rgba(37,45,48,.94); }
@media (max-width:1050px) { .topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.timeline,.map-chain .map-items { grid-template-columns:repeat(3,minmax(120px,1fr)); row-gap:20px; }.map-board { grid-template-columns:1fr; }.method-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.thread-row { grid-template-columns:repeat(3,minmax(0,1fr)); }.object-grid,.country-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.evidence-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .site-header { min-height:68px; padding:0 16px; }.quiet-button { display:inline-flex; align-items:center; }.app-shell { display:block; }.sidebar { min-height:0; padding:15px 16px; border-right:0; border-bottom:1px solid var(--line); }.side-rule,.sidebar>.side-label:nth-of-type(2),.sidebar>.progress,.sidebar>.progress-copy { display:none; } #region-nav { display:flex; overflow:auto; }.region-button { min-width:max-content; }.content { padding:18px 16px 60px; }.hero { align-items:flex-start; flex-direction:column; min-height:0; padding:28px 22px; }.hero-stat { width:100%; padding:14px 0 0; border-top:1px solid var(--line); border-left:0; }.toolbar { align-items:stretch; flex-direction:column; }.filters { justify-content:flex-start; }.section-heading { align-items:flex-start; flex-direction:column; gap:4px; }.timeline,.map-chain .map-items,.map-grid .map-items { grid-template-columns:repeat(2,minmax(120px,1fr)); }.topic-grid,.anchor-grid,.reading-grid,.object-grid,.country-grid,.evidence-grid,.method-grid { grid-template-columns:1fr; }.thread-row { grid-template-columns:1fr 1fr; }.related-topics { grid-template-columns:1fr; }.impact-grid { grid-template-columns:1fr; }.fact-list li { grid-template-columns:1fr; gap:3px; }.compare-controls,.compare-grid,.compare-insight,.cross-compare-controls,.cross-compare-grid { grid-template-columns:1fr; flex-direction:column; }.compare-mark { display:none; }.compare-stages,.cross-stage-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:430px) { .timeline { grid-template-columns:1fr; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
.learning-overview-section,.learning-path-section{scroll-margin-top:5rem}.global-overview-controls{display:grid;grid-template-columns:minmax(12rem,1fr) minmax(12rem,1fr) auto;gap:.75rem;align-items:end;margin-bottom:1.25rem;padding:1rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.global-overview-controls label{display:grid;gap:.35rem}.global-overview-controls label span{font-size:.72rem;font-weight:800;text-transform:uppercase;color:var(--muted)}.global-overview-controls select{width:100%;min-height:2.65rem;padding:.55rem .7rem;border:1px solid var(--line);background:var(--paper);color:var(--ink)}.global-overview-controls p{margin:0;padding:.65rem .8rem;text-align:right;color:var(--muted)}.global-overview-controls p b{font-size:1.35rem;color:var(--ink)}.global-era-list{display:grid;gap:1rem}.global-era-band{display:grid;grid-template-columns:minmax(11rem,.34fr) 1fr;gap:1.25rem;padding:1.2rem 0;border-bottom:1px solid var(--line)}.global-era-band>header{position:relative;padding-left:1rem;border-left:4px solid var(--red)}.global-era-band>header span{display:block;font-size:.75rem;font-weight:800;color:var(--muted);margin-bottom:.45rem}.global-era-band>header h3{margin:0;font-size:1.1rem;line-height:1.3}.global-era-nodes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.global-node{min-width:0;padding:1rem;border:1px solid var(--line);background:var(--paper)}.global-node small{font-weight:800;color:var(--red)}.global-node h4{margin:.35rem 0;font-size:1rem}.global-node p{margin:0;color:var(--muted);line-height:1.65}.global-region-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.8rem}.global-region-tags button{padding:.25rem .45rem;border:1px solid var(--line);background:transparent;color:var(--ink);font-size:.72rem;cursor:pointer}.global-region-tags button:hover{border-color:var(--red);color:var(--red)}.learning-path-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin-bottom:.8rem}.learning-path-tabs button{min-width:0;padding:1rem;border:1px solid var(--line);background:transparent;color:var(--ink);text-align:left;cursor:pointer}.learning-path-tabs button.active{border-color:var(--red);box-shadow:inset 0 -3px 0 var(--red);background:var(--paper)}.learning-path-tabs strong,.learning-path-tabs span{display:block}.learning-path-tabs span{margin-top:.3rem;font-size:.78rem;line-height:1.5;color:var(--muted)}.learning-step-card{display:grid;grid-template-columns:minmax(12rem,.4fr) 1fr;gap:.6rem 1.4rem;padding:1.3rem;border:1px solid var(--line);background:var(--paper)}.learning-step-meta,.learning-progress,.learning-step-actions{grid-column:1/-1}.learning-step-meta{display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.75rem}.learning-step-meta b{color:var(--red)}.learning-progress{height:.32rem;background:var(--line)}.learning-progress i{display:block;height:100%;background:var(--red);transition:width .2s ease}.learning-question{margin:.4rem 0 0;font-size:.78rem;font-weight:800;text-transform:uppercase;color:var(--red)}.learning-step-card h3{margin:.4rem 0 0;font-size:1.45rem}.learning-step-card>p:not(.learning-question){margin:.4rem 0 0;color:var(--muted);line-height:1.7}.learning-step-actions{display:grid;grid-template-columns:2.7rem 1fr 2.7rem;gap:.5rem;align-items:center;margin-top:.6rem}.learning-step-actions .quiet-button{justify-self:center}.learning-step-actions button:disabled{opacity:.35;cursor:not-allowed}

@media (max-width:760px){.global-overview-controls{grid-template-columns:1fr}.global-overview-controls p{text-align:left}.global-era-band{grid-template-columns:1fr}.global-era-nodes{grid-template-columns:1fr}.learning-path-tabs{grid-template-columns:1fr}.learning-path-tabs button{display:grid;grid-template-columns:minmax(7rem,.35fr) 1fr;gap:.7rem;align-items:center}.learning-path-tabs span{margin-top:0}.learning-step-card{grid-template-columns:1fr}.learning-step-meta{align-items:flex-start}.learning-step-actions{grid-template-columns:2.7rem minmax(0,1fr) 2.7rem}.learning-step-actions .quiet-button{width:100%;white-space:normal}}
.essay-section{scroll-margin-top:5rem}.essay-grid,#essay-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.essay-card{display:flex;min-width:0;flex-direction:column;padding:1.15rem;border:1px solid var(--line);background:var(--paper)}.essay-card-meta{display:flex;justify-content:space-between;gap:.75rem;color:var(--muted);font-size:.72rem}.essay-card-meta b{color:var(--red);text-transform:uppercase}.essay-card h3{margin:.55rem 0 .35rem;font-size:1.15rem;line-height:1.35}.essay-card p{margin:.35rem 0;color:var(--muted);line-height:1.7}.essay-card .essay-question{color:var(--ink);font-weight:800}.essay-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin:.65rem 0 1rem}.essay-tags span{padding:.22rem .42rem;border:1px solid var(--line);font-size:.7rem;color:var(--muted)}.essay-card .text-button{align-self:flex-start;margin-top:auto}.essay-intro{padding:1rem 0 1.2rem;border-bottom:1px solid var(--line)}.essay-intro span{font-size:.72rem;font-weight:800;color:var(--red);text-transform:uppercase}.essay-intro p{font-size:1.12rem;line-height:1.6}.essay-intro strong{display:block;color:var(--muted);line-height:1.75}.essay-dialog-section{padding:1rem 0;border-bottom:1px solid var(--line)}.essay-dialog-section h3,.essay-related h3{margin:.1rem 0 .55rem;font-size:1rem}.essay-dialog-section p{margin:.5rem 0;color:var(--muted);line-height:1.85}.essay-section-debate{border-left:3px solid var(--yellow);padding-left:1rem}.essay-section-sources{border-left:3px solid var(--red);padding-left:1rem}.essay-related{padding-top:1rem}
.site-footer { margin:10px 0 0; padding:24px 0 8px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; letter-spacing:.08em; text-align:center; text-transform:uppercase; }

@media (max-width:760px){#essay-grid{grid-template-columns:1fr}.essay-card-meta{align-items:flex-start}.essay-intro p{font-size:1rem}}
.essay-relations{margin-top:1.1rem;padding-top:1rem;border-top:2px solid var(--ink)}.essay-relation-group{margin:.85rem 0}.essay-relation-group h4{margin:0 0 .45rem;font-size:.78rem;color:var(--muted);text-transform:uppercase}.essay-relation-group .relation-chips{margin:0}
.country-deep-profile{margin:1.15rem 0;padding:1.1rem 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}.country-deep-profile>.eyebrow{margin:0;color:var(--red)}.country-deep-profile>h3{margin:.45rem 0 1rem;font-size:1.15rem;line-height:1.55}.country-deep-section{padding:.8rem 0;border-top:1px solid var(--line)}.country-deep-section h4{margin:0 0 .4rem;font-size:.95rem}.country-deep-section p{margin:0;color:var(--muted);line-height:1.8}.country-deep-debate{border-left:3px solid var(--yellow);padding-left:.8rem}.country-deep-modern{border-left:3px solid var(--red);padding-left:.8rem}
.city-deep-profile{margin:1.15rem 0;padding:1.1rem 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}.city-deep-profile>.eyebrow{margin:0;color:var(--red)}.city-deep-profile>h3{margin:.45rem 0 1rem;font-size:1.15rem;line-height:1.55}.city-deep-section{padding:.8rem 0;border-top:1px solid var(--line)}.city-deep-section h4{margin:0 0 .4rem;font-size:.95rem}.city-deep-section p{margin:0;color:var(--muted);line-height:1.8}.city-deep-network{border-left:3px solid var(--red);padding-left:.8rem}.city-deep-memory{border-left:3px solid var(--yellow);padding-left:.8rem}