/* PandaAV desktop-only access guard. Independent from the existing site styles. */
html.pandaav-device-blocked,
html.pandaav-device-blocked body {
  min-height: 100%;
  margin: 0;
  background: #06080c;
}

html.pandaav-device-blocked body {
  visibility: hidden;
  overflow: hidden;
}

html.pandaav-device-blocked.pandaav-device-ready body {
  visibility: visible;
}

.pandaav-device-gate {
  --gate-bg: #070a0f;
  --gate-panel: #0d121b;
  --gate-line: #242d3a;
  --gate-text: #f3f5f8;
  --gate-muted: #9ca6b7;
  --gate-pink: #e83d72;
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto;
  padding: max(28px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 50% 34%, rgba(31, 43, 63, .20), transparent 38%),
    var(--gate-bg);
  color: var(--gate-text);
  font-family: "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.pandaav-device-gate__shell {
  width: min(430px, 100%);
  margin: auto;
  text-align: center;
}

.pandaav-device-gate__brand {
  margin: 0 0 26px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -1.3px;
  color: #f4f5f7;
}

.pandaav-device-gate__brand span {
  color: var(--gate-pink);
}

.pandaav-device-gate__card {
  padding: 42px 28px 38px;
  border: 1px solid var(--gate-line);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(16, 22, 32, .98), rgba(10, 14, 21, .98));
  box-shadow: 0 22px 70px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.pandaav-device-gate__icon {
  position: relative;
  width: 112px;
  height: 112px;
  margin: 0 auto 30px;
  border: 1px solid #2a3442;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 42%, #192131 0, #0c1119 68%);
  box-shadow: 0 16px 38px rgba(0, 0, 0, .35), 0 0 34px rgba(232, 61, 114, .08);
}

.pandaav-device-gate__phone {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 42px;
  height: 68px;
  transform: translate(-50%, -50%);
  border: 5px solid #8e98a8;
  border-radius: 8px;
}

.pandaav-device-gate__phone::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 5px;
  width: 14px;
  height: 3px;
  border-radius: 3px;
  transform: translateX(-50%);
  background: #8e98a8;
}

.pandaav-device-gate__phone::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 5px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  transform: translateX(-50%);
  background: #8e98a8;
}

.pandaav-device-gate__slash {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 82px;
  height: 7px;
  border-radius: 8px;
  transform: translate(-50%, -50%) rotate(45deg);
  background: var(--gate-pink);
  box-shadow: 0 0 18px rgba(232, 61, 114, .32);
}

.pandaav-device-gate h1 {
  margin: 0;
  font-size: 28px;
  line-height: 1.35;
  font-weight: 750;
  letter-spacing: .3px;
  color: #f7f8fa;
}

.pandaav-device-gate h1 span {
  color: var(--gate-pink);
}

.pandaav-device-gate__copy {
  margin: 20px auto 0;
  color: var(--gate-muted);
  font-size: 16px;
  line-height: 1.9;
  font-weight: 400;
}

.pandaav-device-gate__desktop {
  position: relative;
  width: 118px;
  height: 76px;
  margin: 32px auto 10px;
  border: 3px solid #505a69;
  border-radius: 8px;
  opacity: .72;
}

.pandaav-device-gate__desktop::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -22px;
  width: 4px;
  height: 20px;
  transform: translateX(-50%);
  background: #505a69;
}

.pandaav-device-gate__desktop::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -26px;
  width: 48px;
  height: 4px;
  border-radius: 3px;
  transform: translateX(-50%);
  background: #505a69;
}

.pandaav-device-gate__footer {
  margin-top: 42px;
  color: #596273;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .1px;
}

.pandaav-device-gate__footer span {
  color: #a22f53;
}

@media (max-width: 390px) {
  .pandaav-device-gate { padding-left: 14px; padding-right: 14px; }
  .pandaav-device-gate__brand { margin-bottom: 20px; font-size: 27px; }
  .pandaav-device-gate__card { padding: 34px 20px 34px; border-radius: 16px; }
  .pandaav-device-gate__icon { width: 100px; height: 100px; margin-bottom: 25px; }
  .pandaav-device-gate h1 { font-size: 25px; }
  .pandaav-device-gate__copy { font-size: 15px; line-height: 1.85; }
  .pandaav-device-gate__footer { margin-top: 34px; }
}
