/* ============================================================
   A股量化分析 —— 启动画面 + 网页科技感背景 + 内容分层入场
   ============================================================ */
:root {
  --ease-boot: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ================= 进入动画：全屏启动画面 ================= */
#boot {
  position: fixed; inset: 0; z-index: 2147483000; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  background: radial-gradient(1000px 620px at 50% 28%, #1d1710 0%, #120e08 52%, #060503 100%);
  transition: opacity 0.8s var(--ease-boot), visibility 0.8s;
}
#boot.done { opacity: 0; visibility: hidden; pointer-events: none; }
/* [2026-09-11] 本会话已看过启动屏(刷新/返回/自动刷新): 头部脚本已置 html.bootseen,
   直接不渲染覆盖层, 避免每次刷新都先闪一遍启动屏再硬切到内容。 */
html.bootseen #boot { display: none; }

/* 入场动画期间:左上角 HUD 隐藏,避免与启动画面 logo 重复 */
#hud { transition: opacity 0.6s var(--ease-boot); }
body.boot-locked #hud { opacity: 0 !important; pointer-events: none; }

/* 透视网格地面 */
.boot-grid {
  position: absolute; inset: -30% -12% -12%; pointer-events: none;
  background-image:
    linear-gradient(rgba(217, 180, 120, 0.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(217, 180, 120, 0.14) 1px, transparent 1px);
  background-size: 46px 46px;
  transform: perspective(620px) rotateX(60deg);
  transform-origin: 50% 0;
  animation: bootGrid 9s linear infinite;
  opacity: 0.5;
  -webkit-mask-image: radial-gradient(closest-side at 50% 0, #000 22%, transparent 82%);
  mask-image: radial-gradient(closest-side at 50% 0, #000 22%, transparent 82%);
}
@keyframes bootGrid { to { background-position: 0 46px; } }

.boot-scan {
  position: absolute; left: 0; right: 0; height: 46%; top: -50%;
  background: linear-gradient(180deg, transparent, rgba(242, 196, 106, 0.10) 60%, transparent);
  animation: bootScan 2.8s var(--ease-boot) infinite;
  pointer-events: none;
}
@keyframes bootScan { to { top: 110%; } }

/* ---------- 启动画面 LOGO(六边形棱镜徽标) ----------
   ▲ 与左上角 HUD(见 techbg.css #hud)同一套视觉语言,居中作为品牌徽标,
     以多边形切面 + 双轨道 + 晶体核心 + 品牌字标构成,不使用圆形。 */
.boot-logo {
  position: relative;
  width: 116px; height: 116px;
  margin-bottom: 26px;
  filter: drop-shadow(0 2px 24px rgba(217, 164, 65, 0.38));
  animation: bootFade 0.9s 0.05s var(--ease-boot) both;
}
/* 六边形棱镜框架 —— 负空间镂空出锐利渐变描边 */
.boot-logo .bc-seg {
  position: absolute; inset: 0;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background: linear-gradient(135deg, rgba(246,223,168,0.92), rgba(150,112,42,0.28) 48%, rgba(242,196,106,0.68));
}
.boot-logo .bc-seg::after {
  content: ""; position: absolute; inset: 1.5px;
  clip-path: polygon(50% 2%, 97.5% 26.5%, 97.5% 73.5%, 50% 98%, 2.5% 73.5%, 2.5% 26.5%);
  background: #171208;
}
/* 顺时针旋转的锐角菱形轨道 */
.boot-logo .bc-ticks {
  position: absolute; inset: 13px;
  border: 1px solid rgba(242, 196, 106, 0.60);
  background: linear-gradient(135deg, rgba(242, 196, 106, 0.08), transparent 62%);
  transform: rotate(45deg);
  box-shadow: inset 0 0 12px rgba(217, 164, 65, 0.18);
  animation: bootSpin 11s linear infinite;
}
/* 逆向旋转的内层菱形轨道 —— 增加景深 */
.boot-logo .bc-orbit {
  position: absolute; inset: 19px;
  border: 1px solid rgba(242, 196, 106, 0.36);
  transform: rotate(45deg);
  box-shadow: inset 0 0 9px rgba(217, 164, 65, 0.14);
  animation: bootSpinRev 7.5s linear infinite;
}
/* 顶点巡航光点 */
.boot-logo .bc-orbit::before {
  content: ""; position: absolute; top: -2px; left: 50%; width: 7px; height: 7px;
  margin-left: -3.5px; transform: rotate(45deg); background: #fff6df;
  box-shadow: 0 0 11px 3px rgba(242, 196, 106, 0.90);
}
.boot-logo .bc-orbit::after {
  content: ""; position: absolute; bottom: -2px; left: 50%; width: 7px; height: 7px;
  margin-left: -3.5px; transform: rotate(45deg); background: rgba(242, 196, 106, 0.62);
  box-shadow: 0 0 9px 2px rgba(242, 196, 106, 0.55);
}
/* 内层六边形轮廓 —— 晶体边界 */
.boot-logo .bc-portal {
  position: absolute; inset: 26px;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background: linear-gradient(135deg, rgba(242,214,150,0.30), rgba(242,214,150,0.04) 55%, rgba(242,214,150,0.22));
  opacity: 0.80;
}
/* 中心晶体核心 —— 菱形切面 + 高光 */
.boot-logo .bc-halo {
  position: absolute; inset: 30px;
  transform: rotate(45deg);
  border-radius: 4px;
  background:
    linear-gradient(135deg, rgba(251, 238, 203, 0.32), transparent 42%),
    linear-gradient(135deg, rgba(217, 164, 65, 0.46), rgba(140, 96, 22, 0.26));
  border: 1px solid rgba(242, 196, 106, 0.52);
  box-shadow: 0 0 20px rgba(217, 164, 65, 0.45), inset 0 0 12px rgba(217, 164, 65, 0.38);
  animation: bootHalo 4.6s ease-in-out infinite;
}
/* 中心能量核心 —— 与左上角 HUD 的 bc-dot 同款脉动光点 */
.boot-logo .bc-dot {
  position: absolute; left: 50%; top: 50%; width: 13px; height: 13px;
  margin: -6.5px 0 0 -6.5px; transform: rotate(45deg);
  background: radial-gradient(circle, #fffdf5, rgba(242, 214, 150, 0.92) 52%, rgba(217, 164, 65, 0.00) 76%);
  box-shadow: 0 0 16px 6px rgba(217, 164, 65, 0.65);
  animation: bootDot 2.4s ease-in-out infinite;
  z-index: 2;
}

.boot-title { font-size: 1.9rem; font-weight: 800; letter-spacing: 2px; color: #f2e9d5; text-shadow: 0 0 18px rgba(217, 164, 65, 0.55); animation: bootFade 1s 0.2s var(--ease-boot) both; }
.boot-tag { margin-top: 8px; font-size: 0.7rem; letter-spacing: 4px; color: #d9a441; text-transform: uppercase; animation: bootFade 1s 0.5s var(--ease-boot) both; }
@keyframes bootFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes bootDot { 0%, 100% { transform: rotate(45deg) scale(0.72); opacity: 0.7; } 50% { transform: rotate(45deg) scale(1.18); opacity: 1; } }

.boot-barwrap { width: min(300px, 72vw); height: 4px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); overflow: hidden; margin-top: 32px; animation: bootFade 1s 0.62s var(--ease-boot) both; }
.boot-bar { height: 100%; width: 0; background: linear-gradient(90deg, #96702a, #d9a441, #f2c46a); border-radius: 999px; box-shadow: 0 0 14px rgba(217, 164, 65, 0.7); }
.boot-sub { margin-top: 16px; font-size: 0.8rem; color: #a59c86; letter-spacing: 1px; animation: bootFade 1s 0.62s var(--ease-boot) both; }

/* ---------- 进度条 JS 失效兜底 ----------
   boot.js 正常运行时会给 <html> 加 jsboot 标记, 此规则不生效, 进度条由 JS 逐帧驱动;
   boot.js 被 SW 首次接管竞态中止/加载失败时, html 无 jsboot,
   进度条改由纯 CSS 关键帧驱动 0→100%, 不再冻结在 0%。 */
html:not(.jsboot) .boot-bar {
  width: 100%;
  animation: bootBarAuto 2.6s var(--ease-boot) forwards;
}
@keyframes bootBarAuto { from { width: 0; } to { width: 100%; } }

/* ================= 网页科技感背景 =================
   说明:全站共用背景已独立到 techbg.css(登录页+主面板页+后台+信号详情页),
   避免与详情页/后台的 .card 等类名冲突,此处不再重复定义。 */

/* ================= 内容分层入场(配合 body.ready) =================
   默认内容可见;仅当 body.boot-locked(启动动画播放中)且尚未 ready 时才隐藏,
   避免页面(尤其登录页/详情页)因 JS 异常或未引入 boot.js 而永久空白。 */
body.boot-locked:not(.ready) .masthead,
body.boot-locked:not(.ready) .card,
body.boot-locked:not(.ready) .box { opacity: 0 !important; animation: none !important; }
body.ready .masthead { opacity: 1; animation: bootRise 0.7s var(--ease-boot) both; }
body.ready .card { opacity: 1; animation: bootReveal 0.6s var(--ease-boot) both; }
body.ready .box  { opacity: 1; animation: bootReveal 0.6s var(--ease-boot) both; }
body.ready .card:nth-of-type(1) { animation-delay: 0.08s; }
body.ready .card:nth-of-type(2) { animation-delay: 0.20s; }
body.ready .card:nth-of-type(3) { animation-delay: 0.32s; }
@keyframes bootRise { from { opacity: 0; transform: translateY(-14px); filter: blur(6px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes bootReveal { from { opacity: 0; transform: translateY(18px); filter: blur(4px); } to { opacity: 1; transform: none; filter: blur(0); } }

/* ================= 移动端自适应 ================= */
@media (max-width: 480px) {
  /* 启动画面：更紧凑的标题 + 降低 GPU 开销的科技感背景 */
  .boot-title { font-size: 1.55rem; letter-spacing: 1.5px; }
  .boot-tag { font-size: 0.6rem; letter-spacing: 3px; }
  .boot-logo { width: 96px; height: 96px; margin-bottom: 20px; }
  .boot-logo .bc-dot { width: 11px; height: 11px; margin: -5.5px 0 0 -5.5px; }
  .boot-barwrap { margin-top: 26px; width: min(260px, 74vw); }
  .boot-sub { font-size: 0.75rem; }
  /* 背景降级已在 techbg.css 中处理,此处仅保留启动画面尺寸调整 */
}
/* 网页主内容在带刘海/圆角的手机上留出安全区 */
body { padding-left: max(var(--sp-4, 16px), env(safe-area-inset-left)); padding-right: max(var(--sp-4, 16px), env(safe-area-inset-right)); }
@media (max-width: 480px) {
  body { padding-bottom: calc(env(safe-area-inset-bottom) + 8px); }
}

/* ================= 无障碍：减少动态效果 ================= */
@media (prefers-reduced-motion: reduce) {
  .boot-grid, .boot-scan, .boot-bar,
  .boot-logo, .boot-logo .bc-ticks, .boot-logo .bc-orbit, .boot-logo .bc-halo { animation: none !important; transition: none !important; }
  body.ready .card, body.ready .masthead, body.ready .box { animation: none !important; }
}