/* The Diaspora Initiative — brand system (coral + slate, Inter).
   Data colours are on-brand: slate = pro-EU, coral = anti-EU / pro-Russia. */
:root{
  --coral:#D4776B; --coral-light:#E8998D; --coral-deep:#B0554A;
  --slate:#5B7C8A; --slate-dark:#3D5A68; --slate-deep:#2E4753;
  --text:#2D3748; --text-light:#5A6778; --bg:#FAFBFC; --white:#FFFFFF; --line:#e7ebef;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  /* data */
  --eu:#3f6d86; --eu-deep:#2E4C5A; --anti:#C85C4E; --anti-deep:#A8483C;
  --ease:cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6;color:var(--text);
  background:var(--bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,.hero p,.stream-head h2,.detail h3,.method h3{font-family:var(--serif);font-weight:400;letter-spacing:.1px}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}

/* header + hero */
.site-head{background:var(--white);border-bottom:1px solid var(--line);padding:22px 0 18px}
.site-head .wrap{display:flex;align-items:center;gap:18px}
.site-head img{height:52px;width:auto}
.site-head .htext{border-left:1px solid var(--line);padding-left:18px}
.site-head .htext .kicker{font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--coral)}
.site-head .htext h1{font-size:1.22rem;font-weight:400;color:var(--slate-dark);margin-top:1px;line-height:1.3}
.hero{background:linear-gradient(135deg,var(--slate) 0%,var(--slate-dark) 100%);color:#fff}
.hero .wrap{padding:30px 28px}
.hero p{font-size:1.18rem;font-weight:400;max-width:860px;line-height:1.65;opacity:.97}
.hero strong{font-weight:600}

/* domain menus (two top-level sections) */
.domains{display:flex;gap:10px;background:var(--white);padding-top:18px;padding-bottom:4px;flex-wrap:wrap}
.domain{appearance:none;border:1.5px solid var(--line);background:var(--white);border-radius:11px;padding:11px 20px;
  font-family:var(--serif);font-size:1.02rem;color:var(--text-light);cursor:pointer;transition:all .18s var(--ease)}
.domain:hover{border-color:var(--slate);color:var(--text)}
.domain.on{background:var(--slate-dark);color:#fff;border-color:var(--slate-dark);box-shadow:0 3px 10px rgba(61,90,104,.2)}

/* tabs */
.tabs{display:flex;gap:2px;margin-top:0;border-bottom:1px solid var(--line);background:var(--white)}
.tab{appearance:none;border:0;background:transparent;padding:14px 18px;font-size:.9rem;color:var(--text-light);
  cursor:pointer;border-bottom:2.5px solid transparent;font-weight:500;font-family:inherit}
.tab:hover{color:var(--text)}
.tab.active{color:var(--coral);border-bottom-color:var(--coral)}

main{padding:22px 0 70px}
.controls{display:flex;align-items:center;gap:22px;flex-wrap:wrap;background:var(--white);border:1px solid var(--line);
  border-radius:10px;padding:12px 18px;margin-bottom:20px;box-shadow:0 1px 2px rgba(45,55,72,.04)}
.controls label{font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-light)}
.controls select{font-size:.92rem;font-family:inherit;padding:8px 12px;border:1px solid var(--line);border-radius:8px;
  background:#fff;color:var(--text);min-width:250px;margin-left:8px}
.controls select:focus{outline:2px solid var(--coral-light)}
.legend{font-size:.76rem;color:var(--text-light);display:flex;align-items:center;gap:12px;margin-left:auto}
.sw{width:13px;height:13px;border-radius:3px;display:inline-block;vertical-align:-2px;margin-right:3px}
.sw-eu{background:var(--eu)}.sw-anti{background:var(--anti)}
.sw-total{background:none;height:0;border-top:2px solid #7c8894;border-radius:0;width:15px}
.hatchnote{color:#9aa6b2}

.tabpane{display:none}.tabpane.active{display:block;animation:fadeUp .38s var(--ease)}
.tab,.seg button,.cta,.controls select,.geo{transition:all .18s var(--ease)}
.card,.stream-block{background:var(--white);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 1px 3px rgba(45,55,72,.05);transition:box-shadow .2s var(--ease),transform .2s var(--ease)}
.stream-block:hover{box-shadow:0 6px 20px rgba(45,55,72,.08)}
.stream-block{padding:10px 16px 6px;margin-bottom:18px}
.stream-head{display:flex;align-items:baseline;gap:12px;padding:8px 6px 2px}
.stream-head h2{margin:0;font-size:1.15rem;color:var(--slate-dark)}
.stream-sub{font-size:.78rem;color:var(--text-light)}
.stream svg{display:block;width:100%;height:auto}
.axisnote{font-size:.76rem;color:var(--text-light);font-style:italic;margin:4px 4px}
.nodata{padding:30px;text-align:center;color:var(--text-light)}

/* thesis caption (moved from the top hero to under the graphs) */
.thesis{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--coral);
  border-radius:0 12px 12px 0;padding:16px 22px;margin-top:16px;box-shadow:0 1px 3px rgba(45,55,72,.05)}
.thesis p{font-family:var(--serif);font-size:1.06rem;color:var(--slate-dark);line-height:1.6}
.thesis strong{color:var(--coral-deep)}

/* evolution controls + views */
.evo-controls{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.grid-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.grid-cell{background:var(--white);border:1px solid var(--line);border-radius:11px;padding:8px 10px 4px;
  box-shadow:0 1px 2px rgba(45,55,72,.04);transition:box-shadow .18s var(--ease)}
.grid-cell:hover{box-shadow:0 6px 18px rgba(45,55,72,.09)}
.gc-title{display:flex;justify-content:space-between;align-items:baseline;font-size:.82rem;color:var(--text)}
.gc-title span{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gc-title b{font-size:.86rem;font-variant-numeric:tabular-nums}
.gc-chart{height:88px;margin-top:2px}
.gc-chart svg{display:block;width:100%;height:88px}
#evo-swing{padding:14px 18px}
#evo-swing svg{display:block;margin:0 auto;width:700px;max-width:100%;height:auto}

/* section-title (brand) */
.section-title{font-size:.7rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--coral);margin-bottom:12px}

/* network 3D */
.net-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.net-hint{font-size:.76rem;color:var(--text-light)}
#net-graph{height:620px;border-radius:14px;overflow:hidden;background:#0d1a24;border:1px solid var(--line);
  box-shadow:0 1px 3px rgba(45,55,72,.05)}
#net-graph .scene-tooltip{pointer-events:none}

/* map */
.map-controls{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.seg{display:inline-flex;background:var(--white);border:1px solid var(--line);border-radius:9px;overflow:hidden}
.seg button{appearance:none;border:0;background:transparent;padding:8px 14px;font-size:.84rem;font-family:inherit;
  color:var(--text-light);cursor:pointer;font-weight:500}
.seg button+button{border-left:1px solid var(--line)}
.seg button.on{background:var(--slate-dark);color:#fff}
#seg-metric button.on{background:var(--coral)}
.map-wrap{position:relative;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:10px;
  box-shadow:0 1px 3px rgba(45,55,72,.05)}
.map-hint{position:absolute;top:16px;right:18px;font-size:.74rem;color:var(--text-light);
  background:rgba(255,255,255,.85);padding:4px 9px;border-radius:7px;border:1px solid var(--line)}
.map-wrap svg{display:block;width:100%;height:auto}
.map-legend{position:absolute;left:16px;bottom:14px;background:rgba(255,255,255,.9);border:1px solid var(--line);
  border-radius:8px;padding:8px 10px;font-size:.72rem;color:var(--text-light)}
.geo{stroke:#fff;stroke-width:.5px;cursor:pointer;transition:opacity .15s}
.geo.nodata{fill:#eef1f4;cursor:default}
.geo.eu27{stroke:#E0A82E;stroke-width:1.3px}
.geo.faded{opacity:.28}
.geo.sel{stroke:var(--slate-dark);stroke-width:2px}
.geo:hover{opacity:.82}
.graticule{fill:none;stroke:#eef1f4;stroke-width:.5px}
.sphere{fill:#f4f7f9}

/* modal */
.modal[hidden]{display:none}
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center}
.modal-backdrop{position:absolute;inset:0;background:rgba(30,45,55,.5);animation:fadeIn .2s var(--ease)}
.modal-card{position:relative;background:var(--white);border-radius:16px;padding:26px 30px;max-width:470px;width:92%;
  max-height:88vh;overflow:auto;box-shadow:0 26px 64px rgba(30,45,55,.32);animation:pop .3s var(--ease)}
.modal-close{position:absolute;top:12px;right:16px;border:0;background:transparent;font-size:26px;color:#9aa6b2;
  cursor:pointer;line-height:1;transition:color .15s var(--ease)}
.modal-close:hover{color:var(--slate-dark)}
@keyframes pop{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
/* detail (rendered inside the modal) */
.modal-card .detail{border:0;padding:0;box-shadow:none;background:none}
.detail-empty{color:var(--text-light);font-size:.9rem;text-align:center;padding:30px 0}
.detail h3{font-size:1.05rem;color:var(--slate-dark);margin-bottom:2px}
.detail .dloc{font-size:.78rem;color:var(--coral);margin-bottom:14px}
.detail .stat{display:flex;justify-content:space-between;font-size:.86rem;padding:5px 0;border-bottom:1px solid var(--line)}
.detail .stat span:last-child{font-weight:600;color:var(--slate-dark);font-variant-numeric:tabular-nums}
.detail .mini{margin-top:14px}
.detail .mini h4{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-light);margin-bottom:8px}
.detail .demo-note{font-size:.72rem;color:#9aa6b2;font-style:italic;margin-top:6px}
.detail .cta{margin-top:16px;display:inline-block;background:var(--coral);color:#fff;border:0;border-radius:8px;
  padding:9px 14px;font-size:.82rem;font-weight:600;cursor:pointer;font-family:inherit}
.detail .cta:hover{background:var(--coral-deep)}

/* overlap / Romanian-only estimate */
.ov-intro{max-width:none;margin-bottom:16px}
.ov-caveat{color:#a06a2c!important}
.ov-summary{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.ovs{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:13px 20px;box-shadow:0 1px 3px rgba(45,55,72,.05)}
.ovs span{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--text-light);margin-bottom:2px}
.ovs b{font-size:1.4rem;font-variant-numeric:tabular-nums;color:var(--slate-dark);font-family:var(--serif);font-weight:500}
#overlap-chart{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:16px 22px;
  box-shadow:0 1px 3px rgba(45,55,72,.05)}
#overlap-chart svg{display:block;width:100%;height:auto}

/* method */
.method{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:22px 26px;max-width:840px;
  box-shadow:0 1px 3px rgba(45,55,72,.05)}
.method h3{margin-bottom:10px;color:var(--slate-dark)}
.method p{font-size:.9rem;color:var(--text-light);margin-bottom:12px}
.method strong{color:var(--text)}

/* chart bits — unified typography + cleaner lines */
svg text{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;font-variant-numeric:tabular-nums}
.zero-line{stroke:#33414d;stroke-width:1.2;shape-rendering:crispEdges}
.axis text{fill:#98a4b0;font-size:10.5px;font-weight:400}
.evt-label{fill:#7c8894;font-size:10px;font-weight:500}
.total-line{stroke:#5b6b78;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.annot{fill:#98a4b0;font-size:10px;font-style:italic;font-weight:500}
.hover-guide{stroke:#7c8894;stroke-width:1;opacity:.5;stroke-dasharray:2 2}
.yearlab{fill:#b3bcc6;font-size:10px}

/* tooltip */
.tooltip{position:fixed;pointer-events:none;background:var(--slate-deep);color:#fff;font-size:12px;border-radius:9px;
  padding:9px 12px;box-shadow:0 8px 26px rgba(46,71,83,.3);max-width:250px;z-index:60}
.tooltip b{font-size:12.5px}
.tooltip .tdate{color:#b9c7cf;font-size:11px;margin-bottom:2px}
.tooltip .row{display:flex;justify-content:space-between;gap:18px;margin-top:3px;font-variant-numeric:tabular-nums}
.tooltip .eu{color:#a9c6d2}.tooltip .anti{color:#f0b3a9}
.tooltip .der{color:#ffd98a;font-style:italic;margin-top:5px;font-size:11px}
.net-legend{font-size:.76rem;color:var(--text-light);display:inline-flex;gap:12px;flex-wrap:wrap;align-items:center}
.net-legend b{font-size:1rem;vertical-align:-1px}