/* ELO Websites — "Help us go WorldWide" section (uses the site's own tokens from styles.css) */
.ww{position:relative;isolation:isolate;overflow:hidden;margin:0 clamp(6px,1.6vw,22px) clamp(48px,8vw,96px);
  border-radius:clamp(32px,5vw,64px);border:1px solid var(--line);
  background:
    radial-gradient(60% 80% at 24% 56%,rgba(91,33,245,.34) 0%,rgba(91,33,245,0) 70%),
    radial-gradient(42% 52% at 94% 6%,rgba(224,64,251,.15) 0%,rgba(224,64,251,0) 72%),
    radial-gradient(48% 60% at 100% 100%,rgba(5,5,110,.6) 0%,rgba(5,5,110,0) 72%),
    linear-gradient(160deg,#0a0420 0%,#07030f 55%,#0b0530 100%)}
.ww::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:3px 3px;opacity:.22;mix-blend-mode:overlay}
.ww-stars{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}

.ww-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:clamp(8px,2vw,32px);
  max-width:1380px;margin:0 auto;min-height:clamp(600px,92vh,920px);min-height:clamp(600px,92svh,920px);padding:clamp(28px,4vw,56px) clamp(20px,4vw,56px)}

/* globe stage */
.ww-globe{position:relative;justify-self:start;width:min(118%,920px);width:min(118%,920px,112vh);width:min(118%,920px,112svh);aspect-ratio:1;margin-left:-9%;-webkit-tap-highlight-color:transparent}
.ww-globe::before{content:"";position:absolute;inset:12%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 32% 30%,#5a35e6 0%,#1c0f6a 46%,#07031c 76%);box-shadow:0 0 90px 8px rgba(110,70,255,.38),inset 0 0 40px rgba(190,160,255,.18);transition:opacity .9s ease}
.ww-globe.ready::before{opacity:0}
.ww-gl,.ww-fx{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.1s ease}
.ww-globe.ready .ww-gl,.ww-globe.ready .ww-fx{opacity:1}
.ww-fx{cursor:grab;touch-action:pan-y;outline-offset:-6px;border-radius:50%;-webkit-user-select:none;user-select:none}
.ww-globe.grab .ww-fx{cursor:grabbing}

/* HUD callout */
.ww-card{position:absolute;left:24%;bottom:14%;z-index:2;display:grid;pointer-events:none;min-width:238px;max-width:300px;padding:14px 16px;border-radius:10px;
  font-family:var(--mono);background:rgba(10,4,26,.62);border:1px solid rgba(183,156,255,.4);
  box-shadow:0 18px 50px rgba(5,2,20,.6),0 0 44px rgba(124,77,255,.2),inset 0 1px 0 rgba(255,255,255,.06);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ww-card::before{content:"";position:absolute;left:-1px;top:-1px;width:26px;height:26px;border-top:2px solid #c9b3ff;border-left:2px solid #c9b3ff;border-top-left-radius:10px;opacity:.9}
.ww-item{grid-area:1/1;display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:3px;align-items:start;opacity:0;transform:translateY(7px);transition:opacity .55s ease,transform .55s ease;visibility:hidden}
.ww-item.on{opacity:1;transform:none;visibility:visible}
.ww-item svg{grid-row:1/3;width:20px;height:20px;margin-top:1px;fill:none;stroke:#b79cff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ww-item b{font-weight:500;font-size:.74rem;line-height:1.3;letter-spacing:.05em;text-transform:uppercase;color:#fff}
.ww-item span{font-size:.72rem;line-height:1.35;letter-spacing:.05em;text-transform:uppercase;background:linear-gradient(90deg,#c9b3ff,#f08bff);-webkit-background-clip:text;background-clip:text;color:transparent}

.ww-meter{position:absolute;right:8%;top:15%;z-index:2;display:grid;gap:7px;width:clamp(128px,18%,168px);pointer-events:none;font-family:var(--mono);text-transform:uppercase}
.ww-meter-k{font-size:.62rem;letter-spacing:.12em;color:var(--dim);white-space:nowrap}
.ww-meter b{font-weight:500;font-size:1.25rem;line-height:1;letter-spacing:-.02em;color:#fff}
.ww-meter em{font-style:normal}
.ww-meter small{font-size:.7rem;color:var(--dim);letter-spacing:.04em}
.ww-bar{display:block;height:3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.ww-bar span{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#8e66ff,#e040fb);box-shadow:0 0 10px rgba(224,64,251,.6);transition:transform .6s cubic-bezier(.2,.7,.2,1)}

.ww-hint{position:absolute;left:50%;bottom:3%;transform:translateX(-50%);z-index:2;display:flex;align-items:center;gap:12px;margin:0;pointer-events:none;white-space:nowrap;
  font:500 .68rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);transition:opacity .6s ease}
.ww-hint i{width:3px;height:3px;border-radius:50%;background:var(--lav);opacity:.7}
.ww-globe.used .ww-hint{opacity:0}

/* copy */
.ww-copy{position:relative;max-width:520px;padding-left:clamp(0px,1.5vw,20px)}
.ww-kicker{display:flex;align-items:center;gap:10px;margin-bottom:22px;font:500 .76rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--lav)}
.ww-kicker i{width:7px;height:7px;border-radius:50%;background:#e040fb;box-shadow:0 0 12px #e040fb;animation:wwPing 2.4s ease-out infinite}
.ww h2{font-size:clamp(2.7rem,6.6vw,5.3rem);font-weight:500;letter-spacing:-.057em;line-height:.98}
.ww-grad{display:inline-block;padding-bottom:.08em;background:linear-gradient(100deg,#fff 0%,#d3c0ff 35%,#e040fb 72%,#8e66ff 100%);background-size:230% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wwSheen 8s ease-in-out infinite alternate}
.ww-sub{margin-top:26px;max-width:30em;color:var(--mute);font-size:clamp(1rem,1.5vw,1.2rem);line-height:1.55}
.ww-actions{margin-top:34px;display:flex;flex-wrap:wrap;gap:12px}
.ww-actions .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ww-note{margin-top:22px;font-size:.88rem;color:var(--dim)}

/* follow card */
.ww-follow{position:absolute;z-index:4;right:clamp(16px,3vw,40px);bottom:clamp(16px,3vw,36px);display:flex;align-items:center;gap:12px;padding:10px 16px 10px 10px;border-radius:16px;
  background:rgba(14,6,34,.7);border:1px solid var(--line2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform .25s ease,border-color .25s ease,background .25s ease}
.ww-follow:hover{transform:translateY(-3px);border-color:rgba(183,156,255,.55);background:rgba(34,16,76,.8)}
.ww-follow img{width:46px;height:46px;border-radius:11px;object-fit:contain;padding:7px;background:radial-gradient(circle at 30% 25%,#2a1170,#0d0524)}
.ww-follow small{display:block;font-size:.72rem;color:var(--mute);line-height:1.2}
.ww-follow b{display:block;font-size:.95rem;font-weight:600;letter-spacing:-.02em;line-height:1.3}
.ww-follow svg{width:16px;height:16px;fill:none;stroke:var(--lav);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-left:4px}

@keyframes wwPing{0%{box-shadow:0 0 0 0 rgba(224,64,251,.65)}70%,100%{box-shadow:0 0 0 12px rgba(224,64,251,0)}}
@keyframes wwSheen{from{background-position:0 0}to{background-position:100% 0}}

/* tablet + phone */
@media (max-width:960px){
  .ww-inner{grid-template-columns:1fr;min-height:0;gap:0;padding:28px clamp(18px,5vw,36px) 28px}
  .ww-globe{justify-self:center;width:min(130%,700px);margin:-2% 0 14px}
  .ww-card{left:50%;bottom:9%;transform:translateX(-50%);min-width:226px}
  .ww-copy{max-width:560px;margin:0 auto;padding:0;text-align:center}
  .ww-kicker,.ww-actions{justify-content:center}
  .ww-sub{margin-left:auto;margin-right:auto}
  .ww-follow{position:relative;right:auto;bottom:auto;width:max-content;margin:0 auto 34px}
  .ww-hint{bottom:1%}
}
@media (max-width:960px){
  .ww::after{display:none}
  .ww-card{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(12,5,32,.86)}
  .ww-meter{right:7%;top:9%;width:116px}
  .ww-meter b{font-size:1.05rem}
}
@media (max-width:420px){
  .ww{margin-left:4px;margin-right:4px}
  .ww-globe{width:min(138%,700px)}
  .ww-card{min-width:200px;max-width:84%;bottom:8%}
  .ww-item b,.ww-item span{font-size:.68rem}
  .ww-meter{top:7%;right:5%;width:auto;min-width:92px}
  .ww-meter-k{font-size:.56rem;white-space:nowrap}
  .ww-sub{font-size:1rem}
}
@media (max-width:960px) and (orientation:landscape) and (max-height:520px){
  .ww-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;padding:20px 24px}
  .ww-globe{width:min(118%,520px);margin:0 0 0 -8%;justify-self:start}
  .ww-copy{text-align:left;margin:0}
  .ww-kicker,.ww-actions{justify-content:flex-start}
  .ww h2{font-size:clamp(2.2rem,6vw,3.4rem)}
  .ww-card{left:24%;transform:none;bottom:10%}
}
@media (max-width:640px){
  .ww-hint{display:none}
  .ww-actions .btn{flex:1 1 100%}
  .ww-card{padding:12px 14px;min-width:212px}
}
@media (prefers-reduced-motion:reduce){
  .ww-grad,.ww-kicker i{animation:none}
  .ww-item,.ww-gl,.ww-fx,.ww-globe::before{transition:none}
}