/* ---- Self-hosted fonts (no runtime external calls) ---- */
@font-face { font-family:"Inter"; src:url("fonts/inter-latin.woff2") format("woff2"); font-weight:100 900; font-display:swap; }
@font-face { font-family:"JetBrains Mono"; src:url("fonts/jetbrains-mono-400.woff2") format("woff2"); font-weight:400; font-display:swap; }
@font-face { font-family:"JetBrains Mono"; src:url("fonts/jetbrains-mono-700.woff2") format("woff2"); font-weight:700; font-display:swap; }

/* ---- PurpleOps palette ---- */
:root{
  --bg-0:#0d0825; --bg-1:#140f30; --bg-3:#1e1540;
  --pri:#7b2fbe; --violet:#9b3eff; --lilac:#c084fc; --ink:#f0edf5;
  --muted:#a9a0b8; --muted-2:#7a6f8e; --line:#ffffff14; --pline:#7b2fbe40;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Inter",system-ui,Segoe UI,Roboto,sans-serif;
  --radius:16px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; min-height:100vh; color:var(--ink); font-family:var(--sans); font-size:15px; line-height:1.6;
  background:radial-gradient(1200px 600px at 50% -10%,#3d1070 0%,transparent 60%),linear-gradient(135deg,#1a1035,#0d0825 60%,#140f30);
  background-attachment:fixed;
}
/* atmosphere */
.bg-grid{position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(123,47,190,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(123,47,190,.06) 1px,transparent 1px);
  background-size:42px 42px; -webkit-mask-image:radial-gradient(circle at 50% 0%,#000,transparent 75%); mask-image:radial-gradient(circle at 50% 0%,#000,transparent 75%);}
.bg-glow{position:fixed; top:-20%; left:50%; transform:translateX(-50%); width:900px; height:600px; z-index:0; pointer-events:none;
  background:radial-gradient(circle,rgba(155,62,255,.18),transparent 60%); filter:blur(20px);}
.site-header,.wrap{position:relative; z-index:1;}

/* header / brand */
.site-header{max-width:1100px; margin:0 auto; padding:40px 24px 8px;}
.brand{display:flex; align-items:center; gap:10px; margin-bottom:26px;}
.brand a{display:inline-flex; line-height:0;}
.brand-logo{height:36px; width:auto; display:block;}
.headline{margin:0 0 12px; font-size:clamp(2rem,5vw,3.2rem); font-weight:800; letter-spacing:-.03em; line-height:1.05;}
.headline-gradient{background:linear-gradient(90deg,#9b3eff,#c084fc); -webkit-background-clip:text; background-clip:text; color:transparent;}
.lede{max-width:80ch; margin:14px 0 16px;}
.lede p{color:#cfc7e0; font-size:1.02rem; line-height:1.65; margin:0 0 12px;}
.lede p:last-child{margin-bottom:0;}
.disclaimer{color:var(--muted); max-width:80ch; font-size:.86rem; border-left:2px solid var(--pline); padding-left:12px;}
.site-footer{position:relative; z-index:1; max-width:1100px; margin:0 auto; padding:22px 24px 48px; border-top:1px solid var(--line); color:var(--muted-2); font-family:var(--mono); font-size:.74rem;}
.site-footer a{color:var(--lilac); text-decoration:none;}
.site-footer a:hover{text-decoration:underline;}

/* layout */
.wrap{max-width:1100px; margin:0 auto; padding:20px 24px 80px; display:flex; flex-direction:column; gap:22px;}

/* counters / stat-cards */
.counters{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px;}
.counter{position:relative; padding:20px; border-radius:var(--radius); border:1px solid var(--pline); background:linear-gradient(180deg,#1e1540,#140f30); box-shadow:0 12px 40px #7b2fbe1f; overflow:hidden;}
.counter::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 100% 0%,rgba(155,62,255,.12),transparent 50%); pointer-events:none;}
.counter .num{font-family:var(--mono); font-weight:700; font-size:2rem; line-height:1; letter-spacing:-.02em; background:linear-gradient(90deg,#fff,#c084fc); -webkit-background-clip:text; background-clip:text; color:transparent;}
.counter .label{margin-top:8px; color:var(--muted); font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.14em;}

/* terminal window */
.win{border:1px solid var(--pline); border-radius:var(--radius); background:linear-gradient(180deg,#160f33,#100b28); box-shadow:0 12px 40px #7b2fbe1f; overflow:hidden;}
.win-bar{display:flex; align-items:center; gap:8px; padding:11px 14px; border-bottom:1px solid var(--line); background:#ffffff05;}
.dot{width:11px; height:11px; border-radius:50%;}
.dot-r{background:#ff5f57;} .dot-y{background:#febc2e;} .dot-g{background:#28c840;}
.win-title{margin-left:8px; font-family:var(--mono); font-size:.74rem; color:var(--muted-2);}
.win-body{padding:18px;}

/* top countries */
.top-countries{list-style:none; margin:0; padding:0; display:grid; gap:7px;}
.top-countries li{display:grid; grid-template-columns:26px 1fr 150px; gap:12px; align-items:center; cursor:pointer; transition:transform .12s;}
.top-countries li:hover{transform:translateX(2px);}
.top-countries li > span:first-child{font-family:var(--mono); color:var(--muted-2); font-size:.8rem; text-align:right;}
.top-countries .bar{position:relative; height:26px; border-radius:7px; background:#ffffff08; overflow:hidden;}
.top-countries .bar > span{position:absolute; inset:0 auto 0 0; background:linear-gradient(90deg,#7b2fbe,#9b3eff); box-shadow:0 0 14px #7b2fbe80;}
.top-countries .bar > em{position:relative; font-style:normal; line-height:26px; padding:0 10px; font-size:.85rem; font-weight:600;}
.top-countries li > span:last-child{font-family:var(--mono); font-size:.78rem; color:var(--muted); text-align:right;}

/* controls */
.controls{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:14px;}
input,select,button{font-family:var(--sans); font-size:.9rem; color:var(--ink); background:#ffffff08; border:1px solid var(--pline); border-radius:10px; padding:9px 12px;}
#search{flex:1; min-width:220px; font-family:var(--mono);}
input::placeholder{color:var(--muted-2);}
input:focus,select:focus{outline:none; border-color:var(--violet); box-shadow:0 0 0 1px var(--violet),0 0 18px #7b2fbe66;}
button{cursor:pointer; color:var(--lilac);}
button:hover{border-color:var(--violet); box-shadow:0 0 16px #7b2fbe66;}
.result-count{margin-left:auto; font-family:var(--mono); font-size:.78rem; color:var(--muted);}

/* table */
.table{border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#0d0a22;}
.thead,.row{display:grid; grid-template-columns:1fr 220px;}
.thead{background:#ffffff08; border-bottom:1px solid var(--pline);}
.th{background:transparent; border:0; border-right:1px solid var(--line); border-radius:0; text-align:left; padding:11px 14px; color:var(--muted); font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; cursor:pointer;}
.th:hover{color:var(--lilac);}
.table-scroll{height:520px; overflow:auto; position:relative;}
.row{border-bottom:1px solid #ffffff0a;}
.row:hover{background:#7b2fbe14;}
.row > div{padding:9px 14px; border-right:1px solid #ffffff0a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-family:var(--mono); font-size:.82rem;}
.row > div:last-child{font-family:var(--sans); color:var(--muted);}

/* map */
.map svg{width:100%; height:auto; display:block; border-radius:10px; background:radial-gradient(circle at 50% 30%,#1a1142,#0d0a22);}
.map path{stroke:#0d0825; stroke-width:.3; transition:filter .15s;}
.map path:hover{filter:brightness(1.4) drop-shadow(0 0 6px #c084fc);}
.tooltip{position:fixed; pointer-events:none; z-index:20; background:#0d0825; border:1px solid var(--pline); box-shadow:0 0 20px #7b2fbe66; padding:7px 10px; border-radius:8px; font-family:var(--mono); font-size:.78rem; color:var(--ink);}

/* page-load stagger */
@keyframes rise{from{opacity:0; transform:translateY(14px);}to{opacity:1; transform:none;}}
.site-header,.wrap > section{animation:rise .6s both;}
.wrap > section:nth-child(1){animation-delay:.05s;}
.wrap > section:nth-child(2){animation-delay:.12s;}
.wrap > section:nth-child(3){animation-delay:.18s;}
.wrap > section:nth-child(4){animation-delay:.24s;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;}}
