/* /map — гостевой гейт карты: живой canvas-фон (мигающие звёзды).
 * ТЗ Ехе 2026-07-06: синий фон, за ним точки — чуть размыто, светятся и
 * мигают как на основной карте. Никаких статичных скринов.
 * Виньетка запечена в градиент (guest-dim не используется — гасил звёзды).
 * Copyright © 2026 Bratish Ltd & ExeCode Studio. */

.gate-stars-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 45%, rgba(12, 23, 50, 0.9) 0%, rgba(5, 7, 15, 0.95) 70%),
    #04060c;
}
.gate-stars-bg canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  filter: blur(1.2px); /* «чуть размыто» */
}

/* клики сквозь оверлей к канвасу (карточка-модалка остаётся кликабельной) */
.guest-wrap .guest-overlay { pointer-events: none; }
.guest-wrap .guest-overlay-card { pointer-events: auto; }

/* ---------- модалка живой карточки (iframe на /star/<code>) ---------- */
.star-frame-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  /* лёгкое затемнение — фон с мигающими звёздами остаётся виден */
  background: rgba(2, 4, 10, 0.45);
  backdrop-filter: blur(2px);
}
.star-frame-modal[hidden] { display: none !important; }
.star-frame-box {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  /* впритык к голой embed-карточке (.star-mount 330px + отступы) */
  width: min(360px, 94vw);
  height: min(90vh, 700px);
}
.star-frame-box iframe {
  width: 100%;
  height: 100%;
  border: 0;
  /* никакого своего фона/тени — карточка embed прозрачная, вокруг неё
     должен остаться живой звёздный фон, а не тёмный квадрат */
  background: transparent;
  box-shadow: none;
}
/* специфичность (0,2,0): перебивает жёлтый глобал .auth-card button:where(...)
   из auth/_base.html. Голый крестик — без круга/овала/рамок (ТЗ Ехе). */
.star-frame-modal .star-frame-close {
  position: absolute;
  top: -34px;
  right: 0;
  width: auto;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 4px 6px;
  display: block;
  border: 0;
  border-radius: 0;
  background: none;
  color: #9db2cc;
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  z-index: 2;
  box-shadow: none;
  transform: none;
  outline: none;
}
.star-frame-modal .star-frame-close:hover { color: #ffffff; background: none; box-shadow: none; }
.star-frame-modal .star-frame-close:focus,
.star-frame-modal .star-frame-close:focus-visible { outline: none; box-shadow: none; }