/* ============================================================
 * Longlight - 长光雨滴小站 | 页面样式：index / 基座与启动画面
 * pages/index/boot.css
 * 区块：页面基座（body.ui-cui）、启动画面容器、进站预判定态 / 关机静置态、
 *       全息网格 / 扫描线 / 屏幕闪烁
 * 说明：设计令牌统一引用 tokens.css（含 --bg-primary/--green-primary 等语义别名）
 *       本目录仅保留首页私有样式，不重复定义 :root / [data-theme]
 *       引入顺序：boot → power → boot-content → terminal
 * ============================================================ */

/* ========== 页面基座（终端页需铺满且不滚动） ==========
   首页双视图：本目录只承载 CUI 视图的样式，根级样式按视图作用域
   （视图类 ui-cui / ui-home 由入口 main.js 按账号模式添加），
   避免与 GUI 主页视图（pages/home/）在同文档中互相污染。
   终端页整体字阶：Mono 13/18 400（风格.字阶.Mono）；
   背景/文字的主题过渡由 base.css 的 body 统一提供，此处不重复声明 */
body.ui-cui {
  overflow: hidden;
  font: var(--text-mono);
  background: var(--bg-primary);
  color: var(--text-primary);
}

/* ========== 启动画面 ========== */
#boot-screen {
  position: fixed;
  inset: 0;
  background: var(--bg-secondary);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

#boot-screen.fade-out {
  opacity: 0;
  pointer-events: none;
  /* 开屏淡出属页面切换，取风格.动效.页面切换时长（boot.js 另有 600ms 兜底等待，不受影响） */
  transition: opacity var(--duration-page) var(--ease-out);
}

/* 进站预判定态：仅保留深色底，隐藏开机按钮与开屏内容。
   CUI 模块在开屏音效就绪后移除该类点亮开机按钮；
   gui 模式下入口会连同 CUI 视图整体移除，不会出现该界面 */
#boot-screen.pre-boot .power-btn,
#boot-screen.pre-boot .hologram-grid,
#boot-screen.pre-boot .scan-line,
#boot-screen.pre-boot .boot-content,
#boot-screen.pre-boot::after {
  display: none;
}

/* 关机静置态：隐藏开屏内容，仅保留待机的开机按钮 */
#boot-screen.off .hologram-grid,
#boot-screen.off .scan-line,
#boot-screen.off .boot-content,
#boot-screen.off::after {
  animation: none;
  opacity: 0;
}

/* ========== 全息网格 / 扫描线 / 闪烁 ========== */

/* 全息网格：亮色主题用更深网格线 + 更高透明度（--grid-line / --grid-opacity），暗色回退默认 */
.hologram-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--grid-line, var(--border)) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line, var(--border)) 1px, transparent 1px);
  background-size: 40px 40px;
  opacity: 0;
  animation: none;
}

/* 开机后（.on）再按延迟触发全息网格、扫描线、闪烁、Logo、文本 等开屏动画 */
#boot-screen.on .hologram-grid { animation: gridActivate 1.2s var(--ease-out) 0.5s forwards; }

@keyframes gridActivate {
  0%   { opacity: 0; transform: scale(1.5); }
  50%  { opacity: 0.3; }
  100% { opacity: var(--grid-opacity, 0.15); transform: scale(1); }
}

/* 扫描线 */
.scan-line {
  position: absolute;
  left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--green-primary), transparent);
  box-shadow: 0 0 20px var(--green-primary);
  top: -2px;
  opacity: 0;
  animation: none;
}

#boot-screen.on .scan-line { animation: scanMove 1.5s var(--ease-in-out) 0.8s forwards; }

@keyframes scanMove {
  0%   { top: -2px; opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { top: 100%; opacity: 0; }
}

/* 屏幕闪烁 */
#boot-screen::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--green-primary);
  opacity: 0;
  pointer-events: none;
  animation: none;
}

#boot-screen.on::after { animation: flicker 0.15s var(--ease-out) 1.0s; }

@keyframes flicker {
  0%   { opacity: 0; }
  50%  { opacity: 0.08; }
  100% { opacity: 0; }
}