.beypok-sphere-block{width:100%}
.beypok-sphere-stage{
  position:relative;
  width:100%;
  min-height:420px;
  height:620px;
  isolation:isolate;
  overflow:hidden;
  border-radius:24px;
  background:
    radial-gradient(circle at 28% 26%, rgba(0,236,170,.18) 0%, rgba(0,236,170,0) 34%),
    radial-gradient(circle at 70% 68%, rgba(188,120,248,.18) 0%, rgba(188,120,248,0) 34%),
    radial-gradient(circle at 54% 46%, rgba(0,155,223,.10) 0%, rgba(0,155,223,0) 42%),
    transparent;
}
.beypok-sphere-canvas,
.beypok-sphere-canvas canvas{
  width:100% !important;
  height:100% !important;
  display:block;
}
.beypok-sphere-canvas{touch-action:none;cursor:grab}
.beypok-sphere-canvas.is-dragging{cursor:grabbing}
.beypok-sphere-tooltip{
  position:absolute;
  left:0;top:0;
  width:320px;
  min-height:132px;
  transform:translate3d(-9999px,-9999px,0);
  pointer-events:none;
  opacity:0;
  transition:opacity .18s ease;
  z-index:12;
}
.beypok-sphere-tooltip.is-visible{opacity:1}
.beypok-sphere-tooltip-line{
  position:absolute;
  left:18px;
  bottom:0;
  width:2px;
  height:54px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(230,242,255,.95) 55%, rgba(191,215,255,.95) 100%);
  box-shadow:0 0 10px rgba(230,242,255,.65),0 0 18px rgba(191,215,255,.3);
}
.beypok-sphere-tooltip-line:after{
  content:"";
  position:absolute;
  left:50%;bottom:-2px;
  transform:translateX(-50%);
  width:8px;height:8px;border-radius:50%;
  background:radial-gradient(circle, #fff 0%, #eaf2ff 55%, rgba(234,242,255,0) 76%);
}
.beypok-sphere-tooltip-card{
  position:absolute;
  left:0;top:0;
  width:100%;
  max-width:320px;
  min-height:94px;
  padding:12px 14px;
  border-radius:16px;
  font:600 13px/1.35 Manrope, Arial, sans-serif;
  color:#f8fafc;
  white-space:normal;
  background:linear-gradient(135deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.06) 100%);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 16px 32px rgba(0,0,0,.24),0 0 18px rgba(230,242,255,.15),inset 0 1px 0 rgba(255,255,255,.12);
  box-sizing:border-box;
}
.beypok-sphere-tooltip-row{display:block;margin:0 0 7px;white-space:normal;word-break:normal;overflow-wrap:break-word}
.beypok-sphere-tooltip-row:last-child{margin-bottom:0}
.beypok-sphere-tooltip-key{font-weight:700;color:#fff;opacity:.96}
.beypok-sphere-tooltip-value{font-weight:500;color:#f8fafc;opacity:.96}
.beypok-sphere-tooltip-row.is-empty{display:none}
.beypok-sphere-error{
  padding:14px 16px;border-radius:12px;background:#fff6f6;border:1px solid #ffc9c9;color:#991b1b
}
@media (max-width:767px){
  .beypok-sphere-stage{min-height:280px;height:440px;border-radius:18px}
  .beypok-sphere-tooltip{width:240px;min-height:112px}
  .beypok-sphere-tooltip-card{max-width:240px;padding:10px 12px;font-size:11px;line-height:1.35;border-radius:12px}
  .beypok-sphere-tooltip-line{height:36px;left:14px}
}


/* v1.5 tooltip modes and responsive controls */
.beypok-sphere-stage[data-tooltip-mode="portal"] .beypok-sphere-tooltip{display:none !important}
.beypok-sphere-tooltip.beypok-tooltip-portal{position:fixed;left:0;top:0;z-index:99999;pointer-events:none}
.beypok-sphere-tooltip.beypok-tooltip-portal .beypok-sphere-tooltip-line{display:none}
.beypok-sphere-stage[data-tooltip-mode="fixed"] .beypok-sphere-tooltip{
  width:auto;
  min-height:0;
  left:50%; top:50%;
  transform:translate3d(-50%,-50%,0);
}
.beypok-sphere-stage[data-tooltip-mode="fixed"] .beypok-sphere-tooltip-line{display:none}
.beypok-sphere-stage[data-tooltip-mode="fixed"] .beypok-sphere-tooltip-card{position:relative;left:auto;top:auto}

.beypok-sphere-tooltip-card{white-space:normal !important;overflow:visible}
.beypok-sphere-tooltip-row,.beypok-sphere-tooltip-value{white-space:normal !important;overflow-wrap:anywhere !important}
.beypok-sphere-tooltip.beypok-tooltip-portal{opacity:0}
.beypok-sphere-tooltip.beypok-tooltip-portal.is-visible{opacity:1}
.beypok-sphere-stage[data-tooltip-mode="fixed"] .beypok-sphere-tooltip{pointer-events:none;z-index:20}


/* v1.5.6 mobile/fixed tooltip guards */
.beypok-sphere-stage[data-tooltip-mode="fixed"] .beypok-sphere-tooltip-card{
  max-width:min(320px, calc(100vw - 24px));
}
.beypok-sphere-tooltip.beypok-tooltip-portal .beypok-sphere-tooltip-card{
  max-width:min(320px, calc(100vw - 24px));
}
@media (max-width:767px){
  .beypok-sphere-stage[data-tooltip-mode="fixed"] .beypok-sphere-tooltip{
    width:min(260px, calc(100vw - 16px));
    max-width:min(260px, calc(100vw - 16px));
  }
  .beypok-sphere-stage[data-tooltip-mode="fixed"] .beypok-sphere-tooltip-card,
  .beypok-sphere-tooltip.beypok-tooltip-portal .beypok-sphere-tooltip-card{
    width:min(260px, calc(100vw - 16px)) !important;
    max-width:min(260px, calc(100vw - 16px)) !important;
  }
}
