/* ── ПРОКРУТКА ВАЖНЕЕ ВРАЩЕНИЯ ─────────────────────────────────────────
   Было touch-action: none — браузер отдавал скрипту все жесты, включая
   вертикальные, и палец, начавший листать страницу на шаре, крутил шар
   вместо прокрутки. Шар стоит ровно там, откуда большой палец начинает
   движение, поэтому попадали в это почти все.
   pan-y возвращает вертикаль браузеру. Горизонталь остаётся шару, и как
   только жест признан горизонтальным, внутри него снова работают обе оси.
   На мыши ничего не меняется: touch-action действует только на касание. */
.planet-stage.earth-3d-stage { touch-action: pan-y; }
.earth-3d-stage .planet { background: transparent; overflow: visible; transform: none !important; box-shadow: none; touch-action: pan-y; }
.earth-3d-stage .planet::before,.earth-3d-stage .planet::after { pointer-events: none; }
.earth-3d-stage .planet #earth { display: none !important; }
.earth-3d-stage canvas.earth-3d { display: block; width: 100%; height: 100%; position: absolute; inset: 0; border-radius: 50%; cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; outline-offset: 4px; filter: none; mix-blend-mode: normal; }
.earth-3d-stage canvas.earth-3d.is-dragging { cursor: grabbing; }
.earth-3d-stage canvas.earth-3d:focus-visible { outline: 2px solid #a78bfa; }
.earth-3d-stage .planet-tag { pointer-events: none; }
.earth-3d-controls { position: absolute; left: 18%; right: 8%; bottom: 0; z-index: 3; display: flex; justify-content: center; align-items: center; gap: 10px; font: 10px/1.5 Arial,sans-serif; color: #c3c7bb; touch-action: pan-y; }
.earth-3d-controls button { flex: none; min-width: 44px; min-height: 44px; padding: 8px 10px; border: 1px solid #4c5736; border-radius: 24px; background: #080b04; color: #a78bfa; font: inherit; cursor: pointer; }
.earth-3d-controls button:focus-visible { outline: 2px solid #a78bfa; outline-offset: 3px; }
.earth-3d-controls button:active { background: #27330f; }
.earth-3d-controls > span { white-space: nowrap; }
.earth-3d-stage .planet-coordinate { display: none; }
.earth-3d-fallback { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: grayscale(1); }
@media(max-width:600px) { .earth-3d-controls { left: 8%; right: 3%; bottom: -3px; font-size: 10px; } }