section[id]{scroll-margin-top:72px}
@media (max-width:640px){header>div{padding-top:12px!important;padding-bottom:12px!important}}
.globe-wrap{position:relative;width:min(100%,640px,max(320px,calc(100vh - 230px)))}
#globe{position:relative;width:100%;aspect-ratio:1;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
#globe.dragging{cursor:grabbing}
#globe svg{display:block;width:100%;height:100%;overflow:visible}
#globe .c{stroke-width:.6;transition:fill .2s}
#globe .c.d{fill:#245241;stroke:#3C7C62}
#globe .c.b{fill:#1D262E;stroke:#334150}
#globe .c.on{fill:var(--accent);stroke:#0A0C0F}
#globe .dot{fill:var(--accent);stroke:#0A0C0F;stroke-width:1.5}
#globe .dot.on{fill:#FFFFFF}
/* Placeholder sphere, same size as the drawn globe, so the first paint already shows it. */
.globe-loading{position:absolute;inset:4.67%;border-radius:50%;border:1px solid #2F5747;background:radial-gradient(circle at 38% 34%,#0F1E24,#0A1216 60%,#06090B);box-shadow:0 0 70px rgba(61,220,151,.16);display:grid;place-items:center}
.globe-loading span{font-family:'JetBrains Mono',monospace;font-size:13px;color:#6B7684}
/* Keyboard route: the country list stays hidden until it gets focus. */
.globe-jump{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.globe-jump:focus-within{z-index:4;top:0;left:50%;transform:translateX(-50%);width:auto;height:auto;overflow:visible;clip-path:none;display:flex;flex-direction:column;gap:6px;background:#11151A;border:1px solid #2E3742;border-radius:12px;padding:10px 12px}
.globe-jump span{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#8A94A3}
.globe-jump select{background:#0D1014;color:#E8ECF1;border:1px solid #2E3742;border-radius:8px;padding:10px 12px;min-height:44px}
#globe-card{position:absolute;z-index:3;width:288px;max-width:calc(100% - 16px);pointer-events:none;background:rgba(17,21,26,.96);border:1px solid #2E3742;border-radius:14px;padding:16px 16px 12px;box-shadow:0 18px 48px rgba(0,0,0,.55);font-size:14px;color:#E8ECF1;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
#globe-card.pop{animation:gc-in .28s cubic-bezier(.2,.8,.2,1)}
#globe-card.out{animation:gc-out .2s ease-in forwards}
@keyframes gc-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes gc-out{to{opacity:0;transform:translateY(16px)}}
@media (prefers-reduced-motion:reduce){#globe-card.pop,#globe-card.out{animation-duration:1ms}}
#globe-card .h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
#globe-card .n{font-family:'Space Grotesk',sans-serif;font-size:19px;font-weight:700;line-height:1.15}
#globe-card .iso{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--accent);border:1px solid #2F5747;border-radius:6px;padding:2px 6px}
#globe-card .x{display:none}
#globe-card dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px}
#globe-card dt{color:#8A94A3}
#globe-card dd{margin:0;text-align:right}
#globe-card dd small{color:#6B7684;font-size:12px}
#globe-card .s{margin:14px 0 8px;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#8A94A3}
#globe-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
#globe-card li{position:relative;display:flex;justify-content:space-between;gap:10px;padding:5px 8px;border-radius:6px;overflow:hidden}
#globe-card li i{position:absolute;inset:0 auto 0 0;background:rgba(61,220,151,.16)}
#globe-card li span,#globe-card li b{position:relative}
#globe-card li b{font-family:'JetBrains Mono',monospace;font-weight:500;color:var(--accent)}
#globe-card .bar{display:flex;height:8px;border-radius:4px;overflow:hidden;gap:2px}
#globe-card .lg{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:12px;color:#A9B3C0}
#globe-card .lg i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px}
#globe-card .none{color:#8A94A3;font-size:13px;margin:12px 0 0}
#globe-card .src{margin-top:12px;font-size:11px;color:#6B7684}
/* Phones: the card is a sheet pinned to the bottom of the screen, so the globe never moves. */
@media (max-width:640px){
#globe-card{position:fixed;left:10px;right:10px;top:auto!important;bottom:calc(10px + env(safe-area-inset-bottom));width:auto;max-width:480px;margin:0 auto;max-height:52vh;overflow:auto;pointer-events:auto;padding:14px 14px 10px}
#globe-card .h{margin-bottom:10px}
#globe-card .x{display:inline-grid;place-items:center;width:36px;height:36px;margin:-6px -6px -6px 0;border:0;border-radius:8px;background:transparent;color:#8A94A3;font-size:22px;line-height:1;cursor:pointer}
#globe-card .h>span:last-child{display:flex;align-items:center;gap:6px}
#globe-card dl{grid-template-columns:none;grid-template-rows:auto auto;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px 12px}
#globe-card dt{font-size:12px}
#globe-card dd{text-align:left}
#globe-card .s{margin:10px 0 6px}
#globe-card ul{gap:4px}
#globe-card li{padding:4px 8px}
}