:root {
  --ink: #17201d;
  --muted: #66716c;
  --paper: #f5f2ea;
  --white: #fff;
  --green: #174d3d;
  --green-2: #21634f;
  --lime: #d9e55c;
  --orange: #dc623a;
  --blue: #3877a7;
  --gold: #a97816;
  --purple: #765895;
  --line: #dedfd8;
  --shadow: 0 18px 60px rgba(20, 35, 29, .18);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); }
button, input { font: inherit; }
button { cursor: pointer; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 9999; padding: 10px 14px; color: #fff; background: #111; transform: translateY(-150%); }
.skip-link:focus { transform: none; }

.site-header {
  height: 84px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 clamp(22px, 5vw, 76px); background: rgba(245, 242, 234, .94);
  border-bottom: 1px solid rgba(23, 32, 29, .1); position: relative; z-index: 20;
}
.brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; color: var(--paper); background: var(--green); border-radius: 50%; }
.brand-mark svg { width: 27px; }
.brand-mark svg path:first-child { fill: currentColor; stroke: none; opacity: .15; }
.brand strong, .brand small { display: block; }
.brand strong { font-family: Georgia, serif; font-size: 18px; }
.brand small { margin-top: 2px; color: var(--muted); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.header-actions, .intro-actions, .trust-row { display: flex; align-items: center; }
.header-actions { gap: 8px; }
.button { border: 0; border-radius: 8px; padding: 12px 17px; font-weight: 700; }
.button svg { width: 18px; margin-left: 8px; vertical-align: middle; }
.button-quiet { color: var(--ink); background: transparent; }
.button-quiet:hover { background: rgba(23, 77, 61, .08); }
.button-primary { color: white; background: var(--green); box-shadow: 0 7px 20px rgba(23, 77, 61, .18); }
.button-primary:hover { background: var(--green-2); transform: translateY(-1px); }
.button-large { padding: 15px 24px; }

.intro {
  min-height: 455px; padding: 72px clamp(24px, 8vw, 130px) 60px; position: relative; overflow: hidden;
  background: radial-gradient(circle at 82% 45%, rgba(23, 77, 61, .12), transparent 23%), var(--paper);
}
.intro > * { position: relative; z-index: 2; }
.intro::after {
  content: ""; position: absolute; right: 6vw; top: 26px; width: min(31vw, 430px); aspect-ratio: 1;
  z-index: 0; border: 1px solid rgba(23,77,61,.12); border-radius: 50%; box-shadow: inset 0 0 0 42px var(--paper), inset 0 0 0 43px rgba(23,77,61,.08), inset 0 0 0 95px var(--paper), inset 0 0 0 96px rgba(23,77,61,.06); pointer-events: none;
}
.intro::before { content: "+"; position: absolute; right: 21%; top: 48%; z-index: 1; color: var(--orange); font-size: 40px; font-weight: 200; }
.eyebrow, .section-kicker { color: var(--green); font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 30px; height: 2px; background: var(--orange); }
h1 { max-width: 750px; margin: 19px 0 18px; font: 500 clamp(45px, 6.2vw, 78px)/.98 Georgia, serif; letter-spacing: -.045em; }
h1 em { color: var(--green); font-weight: 500; }
.intro-copy { max-width: 650px; margin: 0; color: #4f5b56; font-size: 17px; line-height: 1.65; }
.intro-actions { gap: 22px; margin-top: 28px; }
.updated { color: var(--muted); font-size: 12px; }
.updated strong { color: var(--ink); }
.trust-row { gap: 28px; margin-top: 38px; color: #5d6964; font-size: 11px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.trust-row span { display: inline-flex; align-items: center; gap: 7px; }
.trust-row svg { width: 17px; color: var(--green); }

.timeline-section {
  display: grid; grid-template-columns: minmax(240px, .7fr) minmax(0, 1.7fr); gap: clamp(35px, 7vw, 100px);
  padding: 72px clamp(24px, 7vw, 110px) 90px; border-top: 1px solid var(--line); background: #fff;
}
.timeline-intro { position: sticky; top: 28px; align-self: start; }
.timeline-intro h2 { margin: 9px 0 16px; font: 600 clamp(34px, 4vw, 52px)/1 Georgia, serif; }
.timeline-intro p { max-width: 420px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.timeline-count { display: inline-block; margin-top: 22px; padding: 8px 10px; border-left: 3px solid var(--orange); color: var(--green); background: #f3f5ee; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.timeline-list { position: relative; min-width: 0; }
.timeline-list::before { content: ""; position: absolute; left: 122px; top: 0; bottom: 0; width: 1px; background: #d7dad3; }
.timeline-phase { position: relative; z-index: 1; display: grid; grid-template-columns: 105px 1fr; margin: 30px 0 12px; }
.timeline-phase:first-child { margin-top: 0; }
.timeline-phase span { grid-column: 2; justify-self: start; padding: 5px 8px; border: 1px solid #cbd2cb; border-radius: 4px; color: var(--green); background: white; font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.timeline-event { position: relative; display: grid; grid-template-columns: 105px 1fr; gap: 36px; padding: 0 0 28px; }
.timeline-event::before { content: ""; position: absolute; z-index: 1; left: 117px; top: 5px; width: 9px; height: 9px; border: 3px solid white; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 1px var(--green); }
.timeline-event.barrier::before { background: var(--blue); box-shadow: 0 0 0 1px var(--blue); }
.timeline-event.infrastructure::before { background: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
.timeline-event.diplomacy::before, .timeline-event.observation::before { background: var(--purple); box-shadow: 0 0 0 1px var(--purple); }
.timeline-date { padding-top: 1px; text-align: right; }
.timeline-date strong, .timeline-date span { display: block; }
.timeline-date strong { font: 600 14px/1.25 Georgia, serif; }
.timeline-date span { margin-top: 4px; color: var(--muted); font-size: 9px; font-weight: 700; }
.timeline-body { min-width: 0; padding: 18px 20px; border: 1px solid var(--line); border-radius: 8px; background: #fbfaf6; }
.timeline-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.timeline-heading h3 { margin: 4px 0 0; font: 600 20px/1.22 Georgia, serif; }
.event-type { color: var(--green); font-size: 8px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.timeline-body > p { margin: 12px 0 15px; color: #55615c; font-size: 12px; line-height: 1.65; }
.timeline-actions { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.timeline-sources, .timeline-locations { display: flex; flex-wrap: wrap; gap: 6px; }
.timeline-sources a { color: #5a655f; font-size: 9px; font-weight: 700; }
.timeline-locations { justify-content: flex-end; }
.timeline-locations button { padding: 7px 9px; border: 1px solid var(--green); border-radius: 5px; color: white; background: var(--green); font-size: 9px; font-weight: 800; }
.timeline-locations button:hover { background: var(--green-2); }

.map-section { height: max(720px, calc(100vh - 84px)); display: grid; grid-template-columns: 370px 1fr; border-top: 1px solid var(--line); background: #fff; }
.map-sidebar { display: flex; flex-direction: column; min-width: 0; padding: 30px 24px 20px; border-right: 1px solid var(--line); background: #fbfaf6; position: relative; z-index: 10; }
.sidebar-top { display: flex; justify-content: space-between; }
.section-kicker { margin: 0 0 7px; }
.map-sidebar h2 { margin: 0; font: 600 27px/1.15 Georgia, serif; }
.search-field { display: flex; align-items: center; gap: 9px; margin: 24px 0 15px; padding: 11px 12px; border: 1px solid #d7d9d3; border-radius: 7px; background: white; }
.search-field:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px rgba(23,77,61,.1); }
.search-field svg { width: 18px; color: #7e8883; }
.search-field input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 13px; }
.filter-group { display: flex; flex-wrap: wrap; gap: 7px; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.filter-chip { padding: 8px 10px; border: 1px solid #d8dad4; border-radius: 100px; color: #5c6662; background: white; font-size: 11px; font-weight: 700; }
.filter-chip:hover, .filter-chip.active { color: white; border-color: var(--green); background: var(--green); }
.filter-chip span { margin-left: 5px; opacity: .75; }
.dot { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; }
.dot-change { background: var(--orange); }.dot-position { background: var(--blue); }.dot-infrastructure { background: var(--gold); }.dot-incident { background: var(--green); }
.location-list { flex: 1; min-height: 160px; overflow: auto; margin: 0 -8px; padding: 8px; }
.location-card { width: 100%; margin: 0 0 8px; padding: 15px; text-align: left; border: 1px solid transparent; border-radius: 8px; background: transparent; }
.location-card:hover, .location-card.active { border-color: #d7dad2; background: white; box-shadow: 0 6px 20px rgba(29,45,38,.07); }
.card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.type-label { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.status { padding: 4px 7px; border-radius: 100px; color: #7a5527; background: #f4e7cf; font-size: 8px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.status.verified, .status.corroborated { color: var(--green); background: #e2eee8; }
.status.official { color: #74520f; background: #f4ead2; }
.status.independent { color: #5b4278; background: #ebe4f1; }
.location-card h3 { margin: 8px 0 5px; font-size: 14px; }
.location-card p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.card-meta { display: flex; align-items: center; gap: 7px; margin-top: 10px; color: #7d8782; font-size: 10px; }
.empty-results { padding: 30px 14px; color: var(--muted); text-align: center; font-size: 13px; }
.sidebar-note { display: flex; gap: 10px; padding: 14px; border-radius: 7px; color: #58645f; background: #edf0e9; }
.sidebar-note svg { flex: 0 0 auto; width: 17px; color: var(--green); }
.sidebar-note p { margin: 0; font-size: 10px; line-height: 1.5; }
.sidebar-note strong { display: block; color: var(--ink); font-size: 10px; text-transform: uppercase; }

.map-wrap { position: relative; min-width: 0; }
#map { width: 100%; height: 100%; background: #d9ddd4; }
.map-toolbar { position: absolute; z-index: 500; top: 18px; left: 18px; display: flex; padding: 3px; border-radius: 7px; background: white; box-shadow: 0 5px 18px rgba(30,40,35,.2); }
.map-tool { padding: 8px 12px; border: 0; border-radius: 5px; color: var(--muted); background: transparent; font-size: 11px; font-weight: 700; }
.map-tool.active { color: white; background: var(--green); }
.map-legend { position: absolute; z-index: 500; left: 18px; bottom: 18px; display: flex; gap: 14px; padding: 11px 14px; border-radius: 7px; color: #4d5954; background: rgba(255,255,255,.94); box-shadow: 0 5px 18px rgba(30,40,35,.14); font-size: 9px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.legend-pin { display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 50%; }.legend-pin.change{background:var(--orange)}.legend-pin.position{background:var(--blue)}.legend-pin.infrastructure{background:var(--gold)}.legend-pin.incident{background:var(--green)}
.demo-banner { position: absolute; z-index: 500; top: 18px; left: 50%; transform: translateX(-50%); padding: 8px 13px; border-radius: 5px; color: #6e4a1f; background: #fff0cf; box-shadow: 0 4px 15px rgba(40,30,10,.12); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.evidence-marker { display: grid; place-items: center; width: 32px; height: 32px; border: 3px solid white; border-radius: 50% 50% 50% 5px; color: white; box-shadow: 0 5px 12px rgba(0,0,0,.3); transform: rotate(-45deg); }
.evidence-marker span { transform: rotate(45deg); font-size: 12px; font-weight: 900; }.evidence-marker.change{background:var(--orange)}.evidence-marker.position{background:var(--blue)}.evidence-marker.infrastructure{background:var(--gold)}.evidence-marker.incident{background:var(--green)}
.leaflet-control-zoom { border: 0 !important; box-shadow: 0 5px 18px rgba(30,40,35,.17) !important; }.leaflet-control-zoom a { color: var(--green) !important; }

dialog { padding: 0; border: 0; color: var(--ink); background: white; box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(14, 24, 20, .68); backdrop-filter: blur(3px); }
.evidence-dialog { width: min(1050px, calc(100vw - 32px)); max-height: calc(100vh - 32px); border-radius: 12px; overflow: auto; }
.dialog-close { position: absolute; z-index: 3; top: 15px; right: 15px; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; color: var(--ink); background: rgba(255,255,255,.9); box-shadow: 0 3px 12px rgba(0,0,0,.15); font-size: 22px; }
.dialog-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(290px, .8fr); }
.compare-panel { min-height: 520px; padding: 24px; background: #18231f; }
.compare-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; color: white; }
.compare-title span { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; opacity: .65; }
.compare { position: relative; aspect-ratio: 5/3; overflow: hidden; border-radius: 7px; background: #27352f; user-select: none; }
.compare img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.map-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; pointer-events: none; }
.before-wrap { position: absolute; z-index: 1; inset: 0; width: 50%; overflow: hidden; }
.before-wrap .map-frame { max-width: none; }
.compare-line { position: absolute; z-index: 2; top: 0; bottom: 0; left: 50%; width: 2px; background: white; box-shadow: 0 0 8px rgba(0,0,0,.4); }
.compare-handle { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: grid; place-items: center; width: 40px; height: 40px; border: 2px solid white; border-radius: 50%; color: white; background: var(--green); font-weight: 900; }
.compare input { position: absolute; z-index: 4; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; }
.compare-meta { display: flex; justify-content: space-between; gap: 18px; margin-top: 12px; color: rgba(255,255,255,.65); font-size: 10px; }.compare-meta strong{display:block;color:white;font-size:11px}
.compare-meta span:last-child { text-align: right; }
.provider-note { margin: 10px 0 0; color: rgba(255,255,255,.52); font-size: 9px; line-height: 1.5; }
.archive-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.archive-links a { padding: 6px 8px; border: 1px solid rgba(255,255,255,.2); border-radius: 4px; color: rgba(255,255,255,.78); text-decoration: none; font-size: 9px; font-weight: 700; }
.archive-links a:hover { color: white; border-color: rgba(255,255,255,.48); }
.dialog-grid.no-visual { display: block; }
.dialog-grid.no-visual .detail-panel { width: min(760px, 100%); margin: 0 auto; }
.single-evidence { margin: 0; }
.single-evidence img { display: block; width: 100%; max-height: 670px; object-fit: contain; border-radius: 7px; background: #101713; }
.single-evidence figcaption { margin-top: 11px; color: rgba(255,255,255,.66); font-size: 10px; line-height: 1.45; }
.supporting-exhibit { margin-top: 22px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.15); }
.detail-panel { padding: 42px 30px 30px; }
.detail-panel h2 { margin: 12px 0 7px; font: 600 31px/1.1 Georgia, serif; }.detail-place{margin:0;color:var(--muted);font-size:12px}.detail-summary{margin:23px 0;color:#4f5a55;font-size:13px;line-height:1.7}
.detail-tags { display:flex;gap:7px;flex-wrap:wrap }.detail-tag{padding:6px 8px;border-radius:4px;color:#53605b;background:#eef0eb;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.source-heading{margin:26px 0 10px;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.source-link{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;padding:12px;border:1px solid var(--line);border-radius:6px;color:var(--ink);text-decoration:none;font-size:12px;font-weight:700}.source-link:hover{border-color:var(--green);background:#f6f8f4}.source-link.disabled{cursor:not-allowed;color:#939b97;background:#f5f5f2}.source-link small{display:block;margin-top:3px;color:var(--muted);font-size:9px;font-weight:500}.source-link svg{width:17px}.primary-source{border-left:3px solid var(--orange)}
.site-timeline { margin: 28px 0 8px; padding-top: 20px; border-top: 1px solid var(--line); }
.site-timeline > h3 { margin: 0 0 16px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.site-event { display: grid; grid-template-columns: 87px 1fr; gap: 12px; padding: 0 0 16px 12px; border-left: 2px solid #d8ddd7; }
.site-event-date strong, .site-event-date span { display: block; }
.site-event-date strong { color: var(--green); font-size: 9px; line-height: 1.35; }
.site-event-date span { margin-top: 3px; color: var(--muted); font-size: 8px; }
.site-event h4 { margin: 0; font-size: 11px; line-height: 1.35; }
.site-event p { margin: 5px 0 8px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.event-source-row { display: flex; flex-wrap: wrap; gap: 5px; }
.source-link.compact { display: inline-flex; width: auto; max-width: 100%; margin: 0; padding: 6px 7px; font-size: 9px; }
.source-link.compact small, .source-link.compact svg { display: none; }
.map-links { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px }.map-link{padding:10px;border:1px solid var(--line);border-radius:6px;color:var(--green);text-align:center;text-decoration:none;font-size:10px;font-weight:800}.map-link:hover{background:#edf3ef}
.method-dialog { width: min(620px, calc(100vw - 32px)); border-radius: 12px; }.method-content{padding:45px}.method-content h2{margin:8px 0 12px;font:600 32px Georgia,serif}.method-content>p{color:#58635e;line-height:1.65}.method-content ol{list-style:none;margin:25px 0;padding:0;counter-reset:method}.method-content li{display:grid;grid-template-columns:34px 80px 1fr;gap:10px;align-items:start;padding:13px 0;border-top:1px solid var(--line);counter-increment:method}.method-content li::before{content:counter(method,decimal-leading-zero);color:var(--orange);font:600 13px Georgia,serif}.method-content li strong{font-size:12px}.method-content li span{color:var(--muted);font-size:12px;line-height:1.5}.method-warning{padding:13px;border-left:3px solid var(--orange);background:#f7f0e8;font-size:11px}
.mobile-only { display: none; }

@media (max-width: 820px) {
  .site-header { height: 68px; padding: 0 16px; }.brand small,.button-quiet{display:none}.header-actions .button-primary{padding:10px 12px;font-size:11px}
  .intro { min-height: auto; padding: 55px 22px 46px; }.intro::after{right:-90px;top:15px;width:300px}.intro::before{display:none}h1{font-size:clamp(36px,7vw,45px)}.intro-copy{font-size:15px}.trust-row{gap:12px;flex-wrap:wrap}.trust-row span{font-size:9px}.updated{display:none}
  .timeline-section{display:block;padding:50px 18px 65px}.timeline-intro{position:static;margin-bottom:35px}.timeline-list::before{left:7px}.timeline-phase{display:block;margin:25px 0 12px 28px}.timeline-event{display:block;padding:0 0 18px 28px}.timeline-event::before{left:3px;top:9px}.timeline-date{text-align:left;margin-bottom:7px}.timeline-date strong,.timeline-date span{display:inline;margin-right:6px}.timeline-body{padding:15px}.timeline-heading{display:block}.timeline-heading .status{display:inline-block;margin-top:8px}.timeline-actions{display:block}.timeline-locations{justify-content:flex-start;margin-top:12px}
  .map-section { height: calc(100vh - 68px); min-height: 620px; display: block; position: relative; }.map-sidebar{position:absolute;z-index:900;inset:0 auto 0 0;width:min(88vw,370px);transform:translateX(-105%);transition:transform .25s ease;box-shadow:8px 0 30px rgba(0,0,0,.2)}.map-sidebar.open{transform:none}.map-wrap{height:100%}.mobile-only{display:grid}.icon-button{place-items:center;width:34px;height:34px;border:0;border-radius:50%;background:#eceee9;font-size:20px}.locations-toggle{position:absolute;z-index:500;top:68px;left:12px;grid-auto-flow:column;align-items:center;gap:7px;padding:10px 13px;border:0;border-radius:6px;color:white;background:var(--green);box-shadow:0 4px 13px rgba(0,0,0,.2);font-size:11px;font-weight:800}.locations-toggle svg{width:16px}.map-toolbar{top:12px;left:12px}.demo-banner{top:14px;left:auto;right:12px;transform:none}.map-legend{left:12px;right:12px;bottom:12px;justify-content:center;gap:9px;white-space:nowrap}.map-legend span{font-size:8px}
  .dialog-grid{display:block}.compare-panel{min-height:auto;padding:56px 14px 18px}.detail-panel{padding:25px 20px 30px}.compare-meta{font-size:9px}.evidence-dialog{max-height:calc(100vh - 16px)}.method-content{padding:42px 23px 25px}.method-content li{grid-template-columns:28px 75px 1fr}
}

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }