/* 首屏加载动画（森林夜色主题，与登录后页面同源）：logo 旋转 + 品牌渐变文字 + 渐变进度条 */
/* 抽离到 public/ 以 <link> 引入，避开 vite html-inline-proxy 在 Node25 + vite6.4.3 下的已知 bug */
/* ⚠️ 根因修复：必须同时给 html,body 设深色底并清默认边距。
   否则 body 画布在 first-screen.css 网络加载完成前是浏览器默认白底，
   客户端 WebView2 在 load_url 切页瞬间会露出白色背板（约百毫秒）。该 css 为渲染阻塞，
   首屏第一帧即深底，彻底消除白闪。 */
html, body {
  margin: 0;
  background: #070f0c;
}
#app-loading {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 26px;
  background: linear-gradient(180deg, #0d1f18 0%, #070f0c 100%);
  font-family: -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
/* logo：favicon 本身是弧线造型，旋转即成加载环 */
#app-loading .logo {
  width: 76px;
  height: 76px;
  animation: yg-spin 1.1s cubic-bezier(0.6, 0.15, 0.4, 0.85) infinite;
  filter: drop-shadow(0 0 18px rgba(168, 255, 94, 0.35));
}
@keyframes yg-spin {
  to {
    transform: rotate(360deg);
  }
}
/* 品牌名 + 加载文案：渐变字 + 呼吸流光 */
#app-loading .text {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 2px;
  background: linear-gradient(90deg, #6ede4f 0%, #a8ff5e 45%, #c8ff70 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: yg-flow 2.2s ease-in-out infinite;
}
@keyframes yg-flow {
  0%,
  100% {
    background-position: 0 0;
  }
  50% {
    background-position: 100% 0;
  }
}
/* 细进度条：渐变段来回扫，暗示加载进行中 */
#app-loading .bar {
  position: relative;
  width: 180px;
  height: 3px;
  border-radius: 999px;
  background: rgba(168, 255, 94, 0.14);
  overflow: hidden;
}
#app-loading .bar::after {
  content: '';
  position: absolute;
  top: 0;
  left: -45%;
  width: 45%;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #6ede4f, #c8ff70);
  animation: yg-sweep 1.4s ease-in-out infinite;
}
@keyframes yg-sweep {
  to {
    left: 100%;
  }
}