/* ============================================================
 * depth-vr.css v3 · 2026-10-01 纵深/VR 增强层【极限版】
 * v2 反馈"还是不够" → v3 三大升级：
 *   ①透视网格地平线（持续向前飞行的舱底，VR 空间感核心）
 *   ②镜头常时漂移（不碰鼠标画面也是活的——JS 配合）
 *   ③倾角 4°→6.5°，晨检条 3.2°→6°，视差 13px→18px
 * 铁律不变：纯新增零侵入；精简模式/触屏/减弱动效自动拉平
 * ============================================================ */

:root{ --dvX:9deg; --dvY:0deg; --dvPx:0; --dvPy:0; --dvBob:0px; --dvZ:0px; }

/* ---------- 1. 驾驶舱边框层：暗角 + 扫描线 + 四角舱框 + 扫描带 + 网格地平线 ---------- */
#vrLens{position:fixed;inset:0;pointer-events:none;z-index:39;opacity:0;transition:opacity 1.2s ease;
  background:
    radial-gradient(120% 92% at 50% 42%, transparent 50%, rgba(2,6,14,.5) 82%, rgba(2,6,14,.72) 100%),
    repeating-linear-gradient(0deg, rgba(160,220,255,.055) 0 1px, transparent 1px 4px);}
#vrLens::before{content:'';position:absolute;left:0;right:0;top:0;height:160px;
  background:radial-gradient(58% 100% at 50% 0%, rgba(47,216,255,.16), transparent 72%);}
#vrLens::after{content:'';position:absolute;left:0;right:0;bottom:0;height:190px;
  background:radial-gradient(58% 100% at 50% 100%, rgba(176,38,207,.20), transparent 72%);}
#vrLens.on{opacity:1}

/* 四角舱框括号 */
#vrLens .lens-corner{position:absolute;width:72px;height:72px;pointer-events:none}
#vrLens .lens-corner.tl{left:10px;top:10px;border-left:3px solid rgba(47,216,255,.95);border-top:3px solid rgba(47,216,255,.95);filter:drop-shadow(0 0 12px rgba(47,216,255,.8))}
#vrLens .lens-corner.tr{right:10px;top:10px;border-right:3px solid rgba(47,216,255,.95);border-top:3px solid rgba(47,216,255,.95);filter:drop-shadow(0 0 12px rgba(47,216,255,.8))}
#vrLens .lens-corner.bl{left:10px;bottom:10px;border-left:3px solid rgba(193,63,224,.95);border-bottom:3px solid rgba(193,63,224,.95);filter:drop-shadow(0 0 12px rgba(193,63,224,.8))}
#vrLens .lens-corner.br{right:10px;bottom:10px;border-right:3px solid rgba(193,63,224,.95);border-bottom:3px solid rgba(193,63,224,.95);filter:drop-shadow(0 0 12px rgba(193,63,224,.8))}
/* 舱盖顶/底细边线 */
#vrLens .lens-edge{position:absolute;left:96px;right:96px;height:1px;pointer-events:none}
#vrLens .lens-edge.top{top:12px;background:linear-gradient(90deg,transparent,rgba(47,216,255,.65),transparent)}
#vrLens .lens-edge.bot{bottom:12px;background:linear-gradient(90deg,transparent,rgba(193,63,224,.65),transparent)}
/* 全屏横向扫描光带（双带：青 7s / 紫 11s 交错） */
#vrLens .lens-sweep{position:absolute;left:0;right:0;height:130px;pointer-events:none;top:-150px;
  background:linear-gradient(180deg,transparent,rgba(47,216,255,.13) 45%,rgba(193,63,224,.14) 55%,transparent);
  animation:dvSweep 7s linear infinite}
#vrLens .lens-sweep.alt{animation-duration:11s;animation-delay:-4s;
  background:linear-gradient(180deg,transparent,rgba(193,63,224,.10) 50%,rgba(252,211,77,.07) 60%,transparent);height:90px}
@keyframes dvSweep{0%{top:-160px}100%{top:112vh}}
/* ★ 透视网格地平线：舱底网格持续向前飞（VR 空间感核心） */
#vrLens .lens-grid{position:absolute;left:-30%;right:-30%;bottom:-8vh;height:36vh;pointer-events:none;opacity:.55;
  background:
    linear-gradient(rgba(47,216,255,.24) 1.5px, transparent 1.5px),
    linear-gradient(90deg, rgba(47,216,255,.24) 1.5px, transparent 1.5px);
  background-size:58px 58px;
  transform:perspective(400px) rotateX(63deg);
  transform-origin:50% 0%;
  -webkit-mask-image:linear-gradient(180deg,transparent 2%,rgba(0,0,0,.95) 52%);
          mask-image:linear-gradient(180deg,transparent 2%,rgba(0,0,0,.95) 52%);
  animation:dvGrid 2.4s linear infinite}
@keyframes dvGrid{0%{background-position:0 0}100%{background-position:0 58px}}

/* ---------- 2. 驾驶舱卡：v5 悬浮舱体 —— 切角轮廓 + SVG 发光描边 + 进场飞入 + 持续悬浮 ---------- */
.cosmic-core{
  transform:perspective(750px) rotateX(var(--dvX)) rotateY(var(--dvY)) translate3d(0, var(--dvBob), var(--dvZ));
  transition:transform .16s ease-out;
  will-change:transform;
  /* 切掉四个直角：告别"方框"，全息操作台轮廓 */
  clip-path:polygon(22px 0, calc(100% - 22px) 0, 100% 22px, 100% calc(100% - 22px), calc(100% - 22px) 100%, 22px 100%, 0 calc(100% - 22px), 0 22px);
  filter:drop-shadow(0 34px 60px rgba(0,0,0,.6)) drop-shadow(0 0 26px rgba(47,216,255,.16))}
/* SVG 切角发光描边（JS 注入，按卡片实际尺寸绘制，青→紫渐变） */
.cosmic-core .dv-frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:7;
  filter:drop-shadow(0 0 8px rgba(47,216,255,.5)) drop-shadow(0 0 14px rgba(176,38,207,.35))}
.cosmic-core .dv-sheen{position:absolute;left:-30%;top:0;bottom:0;width:26%;pointer-events:none;z-index:5;
  background:linear-gradient(105deg,transparent,rgba(150,225,255,.16) 48%,rgba(193,63,224,.13) 52%,transparent);
  transform:skewX(-12deg);animation:dvSheen 5.5s ease-in-out infinite}
@keyframes dvSheen{0%{left:-32%}55%{left:118%}100%{left:118%}}
.cosmic-core .dv-topbar{position:absolute;left:4%;right:4%;top:0;height:2px;z-index:5;pointer-events:none;
  background:linear-gradient(90deg,transparent 4%,rgba(47,216,255,.9) 30%,rgba(193,63,224,.9) 70%,transparent 96%);
  filter:drop-shadow(0 0 10px rgba(47,216,255,.85));border-radius:2px}
/* 旧直角括号退役（切角轮廓 + SVG 描边取代） */
.cosmic-core::before,.cosmic-core::after{content:none}
/* 内层视差（三层速率差 = 可见的纵深分离） */
.cosmic-core .core-head{transform:translate3d(calc(var(--dvPx)*2.6px),calc(var(--dvPy)*2.6px),0)}
.cosmic-core .core-grid{transform:translate3d(calc(var(--dvPx)*1.4px),calc(var(--dvPy)*1.4px),0)}
.cosmic-core .core-vital{transform:translate3d(calc(var(--dvPx)*.6px),calc(var(--dvPy)*.6px),0)}

/* ---------- 3. 晨检条：8° 斜面 + 反向视差 + 进场升起 ---------- */
.morning-brief{transform:perspective(1200px) rotateX(8deg) translate3d(calc(var(--dvPx)*-0.9px),calc(var(--dvPy)*-0.45px),0);
  transform-origin:50% 0%}
.morning-brief .planet-cell{filter:drop-shadow(0 22px 30px rgba(0,0,0,.55)) drop-shadow(0 0 16px rgba(47,216,255,.12))}
/* 进场：开屏结束（点进入）后整排从下方升起 = "进入舱内"的瞬间 */
@keyframes dvRowIn{from{opacity:0;transform:perspective(1200px) rotateX(14deg) translateY(40px)}
                   to{opacity:1;transform:perspective(1200px) rotateX(8deg)}}
body.dv-in .morning-brief{animation:dvRowIn .9s cubic-bezier(.2,.85,.25,1) backwards}
/* 仅当增强脚本已启动(dv-ready)且开屏已结束但进场未触发时才隐藏，防脚本失败吞内容 */
body.dv-ready.vr-ended:not(.dv-in) .morning-brief{opacity:0}

/* ---------- 4. HUD 状态条：能量内辉光 ---------- */
.hud{box-shadow:0 0 0 1px rgba(47,216,255,.18) inset, 0 8px 22px rgba(0,0,0,.45), 0 0 34px rgba(47,216,255,.12)}

/* ---------- 7. ★左上角品牌徽标：归吟田园商标 · 透视全息投影芯片 ---------- */
.logo-mark{position:relative}
.logo-mark > svg{display:none !important}
.dvl{display:inline-block;width:46px;height:46px;position:relative}
.dvl-chip{position:absolute;inset:0;border-radius:13px;overflow:hidden;
  background:radial-gradient(circle at 30% 22%, rgba(47,216,255,.15), rgba(9,15,28,.94) 66%);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 18px rgba(47,216,255,.18), 0 4px 14px rgba(0,0,0,.4)}
.dvl-chip::before{content:'';position:absolute;inset:0;border-radius:13px;padding:1.5px;
  background:linear-gradient(140deg,#2FD8FF,rgba(47,216,255,.12) 42%,rgba(176,38,207,.75));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
          mask-composite:exclude;pointer-events:none;z-index:3}
/* 芯片底部：透视投影网格（全息发射台） */
.dvl-grid{position:absolute;left:8%;right:8%;bottom:4px;height:15px;opacity:.55;
  background:linear-gradient(rgba(47,216,255,.55) 1px,transparent 1px),linear-gradient(90deg,rgba(47,216,255,.4) 1px,transparent 1px);
  background-size:9px 6px;transform:perspective(60px) rotateX(58deg);transform-origin:50% 0;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 72%);mask-image:linear-gradient(180deg,transparent,#000 72%)}
/* 商标本体：透视悬浮 + 绿金双辉光（商标原色） */
.dvl-mark{position:relative;z-index:2;width:100%;height:100%;object-fit:contain;object-position:center;
  transform:perspective(240px) rotateX(22deg) translateY(-1px);
  filter:drop-shadow(0 0 7px rgba(55,168,92,.6)) drop-shadow(0 3px 12px rgba(240,204,114,.28));
  animation:dvlFloat 4.2s ease-in-out infinite}
@keyframes dvlFloat{0%,100%{transform:perspective(240px) rotateX(22deg) translateY(-1px)}
                    50%{transform:perspective(240px) rotateX(17deg) translateY(-4px)}}

/* ---------- 8. 球面图标徽章：配全息球去塑料感（更透明 · 更冷 · 更细） ---------- */
html.has-stellar-webgl .se .se-i{
  background:radial-gradient(circle at 32% 26%, rgba(47,216,255,.13), rgba(4,12,24,.5) 70%) !important;
  border-color:rgba(127,227,255,.4) !important;
  box-shadow:0 0 14px rgba(47,216,255,.16), inset 0 0 10px rgba(47,216,255,.08) !important}
html.has-stellar-webgl .se .se-i svg{opacity:.95}

/* ---------- 5. 精简模式：不拉平了，换一套「冷静但科技」的专属装饰 ---------- */
body.simple-mode #vrLens{display:none}
/* 背景提亮：#150A18 太黑 → 主理人标准「暗紫夜调」系（2026-08-30 终版色板） */
body.simple-mode{background:#241129 !important}
/* 舱卡：深色玻璃 + 细发光包边 + 保留四角括号与顶部能量条（去倾斜/去流光/去视差） */
body.simple-mode .cosmic-core{
  transform:none !important;
  background:rgba(45,20,52,.72);
  border:1px solid rgba(176,38,207,.30);
  box-shadow:0 12px 36px rgba(0,0,0,.34), 0 0 0 1px rgba(47,216,255,.18) inset, 0 0 26px rgba(47,216,255,.07);
}
body.simple-mode .cosmic-core::before,body.simple-mode .cosmic-core::after{display:block}
body.simple-mode .cosmic-core .dv-topbar{display:block}
body.simple-mode .cosmic-core .dv-sheen{display:none}
body.simple-mode .cosmic-core .core-head,body.simple-mode .cosmic-core .core-grid,
body.simple-mode .cosmic-core .core-vital,body.simple-mode .morning-brief{transform:none !important}
/* 精简模式顶栏：提亮面板 + 标题渐变 + 底部能量线 */
body.simple-mode .topbar{border-bottom:0 !important;background:rgba(51,20,58,.72) !important}
body.simple-mode .topbar::after{content:'';display:block;height:2px;margin-top:8px;border-radius:2px;
  background:linear-gradient(90deg,transparent,rgba(47,216,255,.7) 30%,rgba(176,38,207,.7) 70%,transparent)}
body.simple-mode .topbar h1{background:linear-gradient(92deg,#F7EAFB 0%,#7FE3FF 60%,#D98CF0 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
/* 精简模式 HUD：青色数据条 */
body.simple-mode .hud{border-color:rgba(47,216,255,.24) !important;background:rgba(26,13,31,.85) !important}
/* 精简模式晨检卡：提亮面板 + 青→紫渐变指标条 + 悬停浮起 */
body.simple-mode .planet-cell{background:rgba(56,24,64,.72) !important;border-left:0 !important;position:relative;overflow:hidden;transition:transform .18s, box-shadow .18s}
body.simple-mode .planet-cell::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,#2FD8FF,#B026CF)}
body.simple-mode .planet-cell:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.35), 0 0 18px rgba(47,216,255,.12)}
body.simple-mode .planet-cell .planet-label{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:1.5px}
/* 精简模式舱卡布局：环仪表被隐藏 → 三列改两列（球 | 数据墙），消灭中间空洞 */
body.simple-mode .core-grid{grid-template-columns:minmax(170px,230px) 1fr !important;gap:10px 30px !important;align-items:center !important}
/* ★ 数据墙重设计：宽棒条 → 细线分隔列表（青点 + mono 小字标签 + 发光数值右对齐） */
body.simple-mode .core-stats{gap:0 !important;padding:4px 2px 4px 14px}
body.simple-mode .stat-row{
  background:transparent !important;border:0 !important;border-radius:0 !important;
  box-shadow:none !important;padding:13px 8px 13px 18px !important;
  display:flex;justify-content:space-between;align-items:center;position:relative;
  border-bottom:1px solid rgba(220,195,222,.16)}
body.simple-mode .stat-row:last-child{border-bottom:0}
body.simple-mode .stat-row::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:5px;height:5px;border-radius:50%;background:#2FD8FF;box-shadow:0 0 9px rgba(47,216,255,.85)}
body.simple-mode .stat-row .stat-k{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;
  letter-spacing:2.5px;color:#DCC3DE;background:none;border:0;padding:0}
body.simple-mode .stat-row .stat-v{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:16px;font-weight:700;
  text-shadow:0 0 12px rgba(47,216,255,.30)}

/* ---------- 6. ★驾驶舱标题重排版：居中 · 分层 · 能量下划线 ---------- */
.cosmic-core .core-head{
  flex-direction:column;justify-content:center;text-align:center;gap:8px;margin-bottom:16px}
.cosmic-core .core-kicker{
  font-size:11px;letter-spacing:6px;color:rgba(127,227,255,.9);
  background:transparent;border:0;border-radius:0;padding:0;
  text-shadow:0 0 12px rgba(47,216,255,.55);
  display:inline-flex;align-items:center;gap:12px}
.cosmic-core .core-kicker::before,.cosmic-core .core-kicker::after{
  content:'';display:inline-block;width:34px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(47,216,255,.7))}
.cosmic-core .core-kicker::after{background:linear-gradient(90deg,rgba(47,216,255,.7),transparent)}
.cosmic-core .core-title{
  font-size:27px;letter-spacing:2.5px;line-height:1.25;
  background:linear-gradient(92deg,#F7EAFB 0%,#7FE3FF 36%,#FCD34D 62%,#D277F0 100%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 0 16px rgba(47,216,255,.28)) drop-shadow(0 2px 5px rgba(0,0,0,.5))}
.cosmic-core .core-title b{
  font-size:31px;letter-spacing:1px;
  background:linear-gradient(90deg,#FCD34D,#FDE68A);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 14px rgba(252,211,77,.45))}
/* 能量下划线（伪元素排在标题之后，自动落到下方） */
.cosmic-core .core-head::after{
  content:'';display:block;width:min(320px,60%);height:2px;margin-top:2px;border-radius:2px;
  background:linear-gradient(90deg,transparent,rgba(47,216,255,.85) 30%,rgba(193,63,224,.85) 70%,transparent);
  filter:drop-shadow(0 0 8px rgba(47,216,255,.6))}

/* ---------- 8.5 触屏降级（2026-10-02 拆分重构） ----------
   旧版把「触屏」和「减少动效」合并成一条媒体查询，并对 .core-head/.core-grid/.core-vital/.morning-brief
   写了 transform:none !important —— 结果手机上进阶层的 3D 位移被 CSS 用 !important 强制清零，
   即使 depth-vr.js 写入内联变量也压不过（!important 优先于 inline style）。
   主理人 2026-10-02 反馈"手机端一点科技感都没有"，根因之一即此。
   现拆成两条：①触屏 = 只关掉会触发 layout/paint 的高频动画（top/background-position/left），
   镜头位移改由 depth-vr.js 以 LITE 幅度（小一半、30fps）驱动；②减少动效 = 保持全静态。 */
@media (pointer:coarse){
  /* 省电防烫：只停掉重绘型动画，保留静态装饰层 */
  .cosmic-core{transition:none}
  .cosmic-core .dv-sheen{animation:none;opacity:.5}
  #vrLens .lens-sweep{animation:none;display:none}
  #vrLens .lens-grid{animation:none;opacity:.35}
}
@media (prefers-reduced-motion:reduce){
  :root{--dvX:9deg;--dvY:0deg;--dvPx:0;--dvPy:0;--dvBob:0px;--dvZ:0px}
  .cosmic-core{transition:none}
  .cosmic-core .dv-sheen{animation:none;opacity:.5}
  #vrLens .lens-sweep{animation:none;display:none}
  #vrLens .lens-grid{animation:none;opacity:.35}
  .cosmic-core .core-head,.cosmic-core .core-grid,.cosmic-core .core-vital,
  .morning-brief{transform:none !important}
}

/* ---------- 9. 球面图标 → 悬浮点（2026-10-01 主理人：图标不要贴在球上，做成"靠近才浮出"的悬浮点） ----------
   默认态：球心一颗呼吸光点（干净，不遮球面）
   靠近态：光点隐去，图标玻璃片从球上方浮出 + 引线（离开自动收起） */
#stellar-emojis .se{filter:none}
#stellar-emojis .se .se-dot{
  width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 34% 30%, #fff, var(--se-glow,#7FE3FF) 58%, rgba(127,227,255,0) 82%);
  box-shadow:0 0 10px var(--se-glow,#7FE3FF), 0 0 22px rgba(127,227,255,.30);
  animation:seDotPulse 2.6s ease-in-out infinite;
  transition:opacity .2s ease, transform .24s ease}
@keyframes seDotPulse{
  0%,100%{transform:scale(1);box-shadow:0 0 10px var(--se-glow,#7FE3FF),0 0 22px rgba(127,227,255,.28)}
  50%    {transform:scale(1.18);box-shadow:0 0 14px var(--se-glow,#7FE3FF),0 0 30px rgba(127,227,255,.46)}}
/* 引线：光点 → 浮出的图标 */
#stellar-emojis .se .se-line{
  position:absolute;left:50%;top:50%;width:1px;
  height:calc(var(--se-h,80px) / 2 + 18px);
  transform:translate(-50%,-100%);
  background:linear-gradient(0deg, rgba(255,255,255,.5), var(--se-glow,#7FE3FF) 42%, rgba(127,227,255,0));
  opacity:0;transition:opacity .26s ease}
#stellar-emojis .se.open .se-line{opacity:.8}
/* 图标玻璃片：默认收在球心且透明；靠近才浮出到球上方 */
#stellar-emojis .se .se-i{
  position:absolute;left:50%;top:50%;
  animation:none !important;
  opacity:0;pointer-events:none;
  transform:translate(-50%,-50%) scale(.55);
  transition:opacity .22s ease, transform .30s cubic-bezier(.2,.9,.25,1.08)}
#stellar-emojis .se.hero .se-i{
  width:38px;height:38px;
  background:radial-gradient(circle at 32% 26%, rgba(190,235,255,.20), rgba(5,12,24,.62) 70%);
  border:1px solid rgba(160,225,255,.40);
  box-shadow:0 0 14px rgba(47,216,255,.20), inset 0 1px 0 rgba(255,255,255,.16)}
#stellar-emojis .se.hero .se-i svg{width:22px;height:22px}
#stellar-emojis .se.core .se-i{width:64px;height:64px}
#stellar-emojis .se.core .se-i svg{width:36px;height:36px}
#stellar-emojis .se.open .se-dot{opacity:0;transform:scale(.35)}
#stellar-emojis .se.open .se-i{
  opacity:1;
  transform:translate(-50%,-50%) translateY(calc(-1 * (var(--se-h,80px) / 2 + 26px))) scale(1)}