/*
 * 小泡狐云端加速 · 纯粹黑白磨砂蒙版 UI
 * 
 * 严格执行设计准则:
 * 1. 窗口: 半透明磨砂玻璃蒙版质感 (backdrop-filter: blur(40px))
 * 2. 按钮: 无边框，纯白胶囊或半透明磨砂胶囊
 * 3. 字体: 严格仅限纯黑与纯白，全站严禁出现任何其他彩色字体
 * 4. 卡片切换: 物理绝对隔离 (display: none)，彻底杜绝重叠与模糊重影
 * 5. 顶部导航: position: relative，绝不与下方标题重叠碰撞
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;900&family=JetBrains+Mono:wght@500;600;700&display=swap');

/* ==================== 0. 严格黑白与字体色彩全局约束 ==================== */
* {
  --primary: #ffffff !important;
  --accent: #ffffff !important;
  --primary-glow: rgba(255, 255, 255, 0.2) !important;
}

body:has(#viewGuest:not([style*="display: none"])) {
  background-color: #0b0d14 !important;
  color: #111827;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Noto Sans SC", sans-serif;
}

/* 强制全站访客界面字体纯白或纯黑，严禁彩色 */
#viewGuest span,
#viewGuest p,
#viewGuest h1,
#viewGuest h2,
#viewGuest h3,
#viewGuest h4,
#viewGuest strong,
#viewGuest label,
#viewGuest a {
  color: inherit;
}

/* ==================== 1. 全屏柔美动态视频与风景底图 ==================== */
body:has(#viewGuest:not([style*="display: none"])) .ambient-glow {
  display: none !important;
}

/* 莫斯科冬日航拍 (DJI X7 实拍底图与 YouTube 流畅图层) */
.ambient-video-container {
  position: fixed;
  inset: 0;
  z-index: -4;
  overflow: hidden;
  background-color: #080a10;
}

.ambient-moscow-poster {
  position: absolute;
  inset: 0;
  background-image: url('/assets/bg_moscow_winter.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  filter: brightness(0.92) contrast(1.08) saturate(1.1);
  z-index: 1;
}

.ambient-yt-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 56.25vw;
  min-height: 100vh;
  min-width: 177.78vh;
  transform: translate(-50%, -50%);
  pointer-events: none;
  overflow: hidden;
  z-index: 2;
}

.ambient-yt-wrap iframe {
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: none;
  filter: brightness(0.92) contrast(1.08) saturate(1.15);
  transform: scale(1.08);
}

.video-overlay-tint,
body:has(#viewGuest:not([style*="display: none"]))::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 3;
  background: linear-gradient(
    180deg,
    rgba(14, 165, 233, 0.08) 0%,
    rgba(56, 189, 248, 0.03) 18%,
    transparent 36%,
    rgba(14, 17, 26, 0.65) 58%,
    rgba(8, 10, 16, 0.94) 78%,
    #080a10 100%
  );
  pointer-events: none;
}
