/* Stellar rework: the interactive globe (globe.js). */
svg.globe{aspect-ratio:1/1;height:auto;margin-bottom:38px}
.sg{position:relative;width:100%;margin:0 auto}
.sg-stage{position:relative;width:100%;aspect-ratio:1/1}
.sg canvas{display:block;width:100%;height:100%;border-radius:50%;cursor:grab;touch-action:pan-y;-webkit-tap-highlight-color:transparent;outline:none}
.sg canvas:focus-visible{outline:3px solid #13863f;outline-offset:-3px}
.sg.is-drag canvas{cursor:grabbing}
.sg-tip{position:absolute;left:0;top:0;z-index:2;display:flex;align-items:center;gap:7px;padding:7px 11px;border-radius:10px;background:#13211b;color:#fff;font:500 12.5px/1.2 "Inter",system-ui,sans-serif;white-space:nowrap;pointer-events:none;box-shadow:0 1px 3px rgba(18,22,20,.08);opacity:0;transition:opacity .12s}
.sg-tip.on{opacity:1}
.sg-tip.lit::before{content:"";width:7px;height:7px;border-radius:50%;background:#3cc27a}
.sg-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin:10px 0 0;font:500 12.5px/1.2 "Inter",system-ui,sans-serif;color:#5b6762}
.sg-legend span{display:inline-flex;align-items:center;gap:7px}
.sg-legend i{display:inline-block;width:10px;height:10px;border-radius:3px}
.sg-key-land{background:#24985a}
.sg-key-city{border-radius:50%!important;background:#f29a2e;box-shadow:0 0 0 2px #fff}
.sg-hint{color:#7a8580;font-weight:500}
.sg-hint::before{content:"";width:12px;height:12px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M8 8l-4 4 4 4M16 8l4 4-4 4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M8 8l-4 4 4 4M16 8l4 4-4 4'/%3E%3C/svg%3E") center/contain no-repeat}
@media (prefers-reduced-motion:reduce){.sg-tip{transition:none}}

/* final pass 2026-10-22: the hint was 3.8:1 on white; the muted token passes 4.5:1 in both themes */
.sg-legend .sg-hint{color:var(--muted,#69726e)}

/* ---------- the world card (owner 2026-10-22 20:15: "the world card looks a bit basic", and the big 40k band moved
   into it). Scoped to .gw so the language pages, which share this file and keep the old markup, are unchanged.
   Left: title, one caption line with real numbers (cities, from globe.js's list), the three stats as large regular
   numbers between hairlines (count up once, bignum.js), and the globe's legend. Right: the globe, larger, cut by the
   card's right edge, standing on a soft ground shadow over a quiet field of paper squares (bignum.js). ---------- */
#reviews .global.gw{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;align-items:stretch;padding:0;
  position:relative;overflow:hidden;isolation:isolate}
.gw .gw-copy{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:64px 8px 64px 56px}
.gw .gw-copy .h2{margin:0;max-width:12ch}
.gw .gw-cap{margin:18px 0 0;max-width:36ch;font:400 16px/1.5 var(--font);color:var(--text)}
#reviews .gw .gstats{display:grid!important;grid-template-columns:repeat(3,auto);justify-content:start;margin-top:40px!important;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
#reviews .gw .gstats>div{padding:22px 26px 20px!important;border-left:1px solid var(--line)!important}
#reviews .gw .gstats>div:first-child{padding-left:0!important;border-left:0!important}
#reviews .gw .gstats b{font:400 clamp(32px,2.9vw,42px)/1 var(--font)!important;letter-spacing:-.035em;color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap}
#reviews .gw .gstats span:not(.sr-only):not(.gw-n){margin-top:10px!important;font:400 14px/1.2 var(--font)!important}
/* the counting digits sit inside <b>: undo the page's .gstats span label rule for them */
#reviews .gw .gstats b span{display:inline;margin:0!important;font:inherit!important;letter-spacing:inherit!important;color:inherit!important}
.gw .gw-key .sg-legend{justify-content:flex-start;margin:28px 0 0;gap:8px 20px}
.gw .gw-art{position:relative;z-index:1;min-width:0}
.gw .gw-field{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:0}
.gw .gw-art svg.globe{display:block;width:84%;max-width:none;margin:8% 0 8% 22%}
.gw .gw-art .sg{position:relative;z-index:1;width:100%;max-width:none;margin:0 0 0 17%}
.gw .sg canvas{position:relative;z-index:1;border-radius:0}
.gw .sg canvas:focus-visible{outline:2px solid var(--green,#13863f);outline-offset:-8px;border-radius:var(--radius-l,16px)}
/* the ground shadow: a soft ink ellipse under the sphere (the sphere's bottom is at 92% of the stage) */
.gw .sg-stage::before{content:"";position:absolute;left:24%;width:52%;top:92.5%;height:4.5%;border-radius:50%;
  background:rgba(18,22,20,.13);filter:blur(12px);z-index:0;pointer-events:none}
html.dark .gw .sg-stage::before{background:rgba(0,0,0,.55)}
@media (max-width:1024px){
  #reviews .global.gw{grid-template-columns:1fr}
  .gw .gw-copy{padding:56px 48px 8px}
  .gw .gw-art .sg{width:84%;margin:0 auto 0 14%}
}
@media (max-width:720px){
  .gw .gw-copy{padding:36px 20px 0}
  .gw .gw-cap{font-size:15px}
  #reviews .gw .gstats{grid-template-columns:repeat(3,minmax(0,auto));margin-top:28px!important}
  #reviews .gw .gstats>div{padding:16px 14px 14px!important}
  #reviews .gw .gstats b{font-size:clamp(24px,7.4vw,30px)!important}
  #reviews .gw .gstats span:not(.sr-only):not(.gw-n){font-size:13px!important}
  .gw .gw-key .sg-legend{margin-top:20px;gap:8px 14px}
  .gw .gw-art .sg{width:118%;margin:-2% 0 0 4%}
}

/* owner 20:40 (fix-home2040): "Globe got cut". The whole globe sits inside the card, centred in its half and still
   large. The page-wide green focus rectangle no longer draws around the canvas box after a click or drag: keyboard
   focus only shows a soft green ring on the sphere itself. */
.gw .gw-art{display:flex;align-items:center;justify-content:center}
.gw .gw-art .sg{width:92%;margin:0 auto}
.gw .gw-art svg.globe{width:84%;margin:8% auto}
.gw .sg canvas,.gw .sg canvas:focus,.gw .sg canvas:focus-visible{outline:none!important}
.gw .sg-stage::after{content:"";position:absolute;inset:8%;border-radius:50%;pointer-events:none;z-index:2;
  box-shadow:0 0 0 2px var(--green,#13863f);opacity:0;transition:opacity .15s}
.gw .sg-stage:has(canvas:focus-visible)::after{opacity:.45}
@media (max-width:1024px){.gw .gw-art .sg{width:78%;margin:0 auto}}
@media (max-width:720px){.gw .gw-art .sg{width:96%;margin:0 auto}}
@media (prefers-reduced-motion:reduce){.gw .sg-stage::after{transition:none}}