:root{
  --px-bg0:#070a12;
  --px-bg1:#0b1220;
  --px-card: rgba(255,255,255,.06);
  --px-border: rgba(255,255,255,.12);
  --px-muted: rgba(255,255,255,.72);
  --px-ink: rgba(255,255,255,.95);
  --px-brand1:#b084ff;
  --px-brand2:#6cf6ff;
  --px-brand3:#ffd36f;
  --px-brand4:#ff4d8d;
}

html,body{height:100%}
body{
  background:
    radial-gradient(900px 500px at 20% 5%, rgba(108,246,255,.18), transparent 60%),
    radial-gradient(800px 520px at 80% 10%, rgba(176,132,255,.14), transparent 55%),
    radial-gradient(950px 700px at 50% 115%, rgba(255,77,141,.10), transparent 60%),
    linear-gradient(180deg, var(--px-bg0), var(--px-bg1) 55%, #070a12);
  color: var(--px-ink);
}

a{color:inherit}
.navbar{backdrop-filter: blur(10px);}
.px-brand{display:flex;gap:.75rem;align-items:center;text-decoration:none}
.px-logo{
  width:44px;height:44px;border-radius:16px;
  background: linear-gradient(135deg, var(--px-brand1), var(--px-brand2));
  box-shadow: 0 18px 38px rgba(0,0,0,.35);
  position:relative; overflow:hidden;
}
.px-logo:after{
  content:""; position:absolute; inset:-45%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.55), transparent 60%);
  transform: rotate(18deg);
}
.px-kicker{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:.8rem;
  padding:.35rem .6rem;
  border-radius:999px;
  border:1px solid var(--px-border);
  background: rgba(255,255,255,.04);
  color: var(--px-muted);
}
.px-card{
  background: var(--px-card);
  border:1px solid var(--px-border);
  border-radius: 20px;
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
}
.px-soft{color: var(--px-muted);}
.px-divider{height:1px;background: var(--px-border);}
.px-btn{
  border-radius: 14px;
  border: 1px solid var(--px-border);
  background: linear-gradient(135deg, rgba(176,132,255,.28), rgba(108,246,255,.12));
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
}
.px-btn:hover{filter:brightness(1.05)}
.px-btn-secondary{
  border-radius: 14px;
  border: 1px solid var(--px-border);
  background: rgba(255,255,255,.04);
}
.px-chip{
  display:inline-flex;gap:.4rem;align-items:center;
  font-size:.8rem;
  padding:.25rem .55rem;
  border-radius:999px;
  border:1px solid var(--px-border);
  background: rgba(0,0,0,.25);
}
.px-tile{
  transition: transform .15s ease, filter .15s ease;
}
.px-tile:hover{transform: translateY(-2px); filter: brightness(1.05);}

.px-map{
  position: relative;
  border-radius: 20px;
  border: 1px solid var(--px-border);
  background:
    radial-gradient(circle at 20% 20%, rgba(255,211,111,.16), transparent 45%),
    radial-gradient(circle at 70% 30%, rgba(255,77,141,.12), transparent 40%),
    radial-gradient(circle at 40% 75%, rgba(108,246,255,.12), transparent 45%),
    rgba(255,255,255,.02);
  overflow:hidden;
}
.px-map:before{
  content:"";
  position:absolute; inset:-10%;
  background-image: radial-gradient(rgba(255,255,255,.16) 1px, transparent 1px);
  background-size: 18px 18px;
  opacity:.25;
  transform: rotate(8deg);
}
.px-pin{
  position:absolute; width:14px; height:14px;
  border-radius:999px;
  background: var(--px-brand3);
  box-shadow: 0 10px 22px rgba(0,0,0,.35);
  border: 2px solid rgba(0,0,0,.35);
}
.px-pin:after{
  content:"";
  position:absolute; inset:-6px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.35);
  opacity:.35;
}
.px-pin.uk{left:38%; top:38%; background: var(--px-brand3);}
.px-pin.us{left:62%; top:52%; background: var(--px-brand4);}

footer a{text-decoration:none}
footer a:hover{text-decoration:underline}