/* ============================================================================
   开场层（Landing）样式 · v4「作者图标 + 团队字幕 + 缩小大脑 + 丝滑交接」
   失效开放约定：.ego-landing 默认 display:none，只有 JS 给它加上 .is-on 才显示。
   —— 因此禁用 JS 时开场层绝不遮挡正文，正文直接可见。
   垂直层次：图标 → 三词组 → 产品名 → 大脑（canvas，绝对铺满在文字之下）→ 按钮。
   ============================================================================ */

/* 开场层打开时锁滚动（进入后由 JS 移除此类，恢复正常滚动） */
html.ego-landing-open{overflow:hidden;}
html.ego-landing-open body{overflow:hidden;height:100%;}

/* v5 修正（真回归，非动画中途）：v4 曾在这里给 body 加 opacity:.55 想「压暗正文层」，
   但 .ego-landing 本身是 body 的子节点，opacity 会把整棵子树（含开场层）一起合成到 55%，
   再与浅色页面底 (#F4F7FB) 叠加 ⇒ 静止态实测角落 (113,117,124) 中灰、文字发白。
   现在不再动 body：开场层自己就是不透明深底，正文被它完全盖住，不需要压暗；
   离场只做本层 opacity 1→0 的交叉淡出，入口没有任何透明度动画。
   实证见 .dsh-switchman/ui-upgrade/开场页报告.md「第五轮」：
   修复前 layer.opacity=1 / body.opacity=0.55 / 角落 (113,117,124)（灰）
   → 修复后 body.opacity=1 / 角落 (7,13,24)（深）。 */

.ego-landing{
  display:none;
  position:fixed; inset:0; z-index:9000;
  /* v5：底色拆成「不透明 background-color 兜底 + 渐变叠加」。
     从第一帧起本层就是不透明深蓝（#070D18），即使渐变没画出来、或任何祖先层参与合成，
     屏幕上也不会出现浅底透出的中间态。 */
  background-color:#070D18;
  background-image:radial-gradient(118% 94% at 50% 44%, #0C1D33 0%, #070D18 52%, #04060C 100%);
  color:#DCE8F5;
  overflow:hidden;
  -webkit-user-select:none; user-select:none;
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior:none;
  /* 交接动画的起点态（is-leaving 时才真正变化） */
  opacity:1; transform:scale(1);
  transition:opacity .52s cubic-bezier(.4,0,.2,1), transform .52s cubic-bezier(.4,0,.2,1);
}
.ego-landing.is-on{display:block;}

/* 离场：淡出 + 轻微放大（1 → 1.03），期间不可点击，避免「双层同时可点」 */
.ego-landing.is-leaving{
  opacity:0; transform:scale(1.03);
  pointer-events:none;
}

/* 画布：吃满整屏；touch-action:none 保证触摸拖动不滚动页面 */
.ego-landing__canvas{
  position:absolute; inset:0; display:block;
  width:100%; height:100%;
  touch-action:none; cursor:grab;
}
.ego-landing.is-dragging .ego-landing__canvas{cursor:grabbing;}

/* 中上方信息组：作者图标 + 三词组 + 产品名（纯展示，不进 Tab 序列）
   v6（作者要求「文字再大一点，至少要占整个页面三分之一」）：
   文字区从 157px / 17% 提到 ≥300px / ≥33%（1600×900），三词组 15→38px、
   产品名 21→48px、图标 68→120px，行高同步放大；全部用 clamp() 随视口降档。
   尺寸同时受「大脑必须在文字下方完整可见、按钮必须留在首屏」约束 ——
   大脑的位置/大小不再硬编码（见 ego-ui-v3-landing.js 的 layoutBand()），
   它按本组实际底边与按钮顶边之间的空档自动居中缩放。 */
.ego-landing__head{
  position:absolute; top:3vh; left:0; right:0; z-index:2;
  display:flex; flex-direction:column; align-items:center;
  padding:0 20px;
  pointer-events:none;
  text-align:center;
}
.ego-landing__mark{
  display:block;
  /* v7（第八轮）：「文字占三分之一」是**高度**指标，只挂 vw 的话宽而高的屏
     （1920×1080）会被 vw 上限卡住、占比反而掉到 29%。所以图标/字号/间距全部改成
     max(vw 项, vh 项)：哪种极端都不会掉回小字，同时上限同步放开（旧上限 120px/38px
     正是 1080p 掉档的原因）。任一档都仍受「大脑要在文字下完整可见、按钮留首屏」约束，
     尺寸由 ego-ui-v3-landing.js 的 layoutBand() 从真实点云几何反解。 */
  width:clamp(72px, max(7.5vw, 13.3vh), 148px); height:clamp(72px, max(7.5vw, 13.3vh), 148px);
  margin:0 auto;
  image-rendering:auto;
  -webkit-user-drag:none;
  filter:drop-shadow(0 6px 18px rgba(6,20,44,.55));
}
.ego-landing__words{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:clamp(6px, .9vw, 14px) clamp(16px, 2.5vw, 42px);
  margin:clamp(16px, max(2.6vw, 4.65vh), 52px) 0 0;
  /* v7：1500px 的上限会让 1920×1080 档（字号 45.9px，三词组一行约 1530px）被迫换行，
     文字区虚高到 42.6%；放到 1680px 后该档恢复一行，占比回到 ≈36%（仍 >33%）。 */
  max-width:min(96vw, 1680px);
  font-size:clamp(17px, max(2.375vw, 4.25vh), 50px); font-weight:600; letter-spacing:.3px;
  line-height:1.42;
  color:#8FE6DC;                       /* 对 #0C1D33 对比度 11.72:1（WCAG 实测见报告） */
}
.ego-landing__word{white-space:nowrap;}
.ego-landing__name{
  margin:clamp(14px, max(2.375vw, 4.22vh), 46px) 0 0;
  font-size:clamp(21px, max(3vw, 5.35vh), 62px); font-weight:700; letter-spacing:.06em;
  line-height:1.32;
  max-width:96vw;
  color:#DCE8F5;                       /* 对 #0C1D33 对比度 13.64:1（WCAG 实测见报告） */
  text-shadow:0 2px 14px rgba(4,10,22,.65);
}

/* 打开时字幕自上而下渐显：图标 → 三词组 → 产品名 → 按钮，逐级错开 140ms。
   纯 CSS 动画（display:none → block 会重新触发），不用 JS 定时器堆叠。 */
.ego-landing__mark,
.ego-landing__words,
.ego-landing__name,
.ego-landing__foot{
  opacity:0;
  animation:ego-landing-drop .72s cubic-bezier(.22,.61,.36,1) both;
}
.ego-landing__mark{animation-delay:.02s;}
.ego-landing__words{animation-delay:.16s;}
.ego-landing__name{animation-delay:.30s;}
.ego-landing__foot{animation-delay:.44s;}

@keyframes ego-landing-drop{
  from{opacity:0; transform:translateY(-14px);}
  to{opacity:1; transform:translateY(0);}
}

/* 底部：进入网页端按钮（唯一的操作入口） */
/* v9（作者：「这个图标再大一点」）：按钮整体放大约 1.16–1.24×。
   所有尺寸统一从 --btn-fs 派生（字号 / 字间距 / 内边距 / 圆角 / 描边 / 阴影），
   改 --btn-fs 一条 clamp 就等比缩放，双层描边（外 border + 内 inset 环）观感不变。
   --btn-fs 随 max(vw,vh) 平滑放大：1920×1080 档 18.58px（≈1.24×），
   下限 17.4px（=1.16×，最小的档也一定变大）、上限 20px（超大屏 ≈1.33×）。
   bottom 同步补偿：墨迹居中在「文字底边 → 按钮顶边」的空档里，按钮变高 ΔH 会把两侧间隙
   各压低 ΔH/2；底边随之下移 ΔH/2 后只损失 ΔH/4，g1/g2 仍保 ≥8px（九档 × 20 相位实测见报告）。
   按钮高 ≈ 3.1333×--btn-fs ⇒ ΔH = 3.1333×(fs−15px) ⇒ bottom = 59.5px − 1.5667×fs。 */
.ego-landing__foot{
  --btn-fs:clamp(17.4px, max(.96vw, 1.72vh), 20px);
  position:absolute; left:0; right:0; z-index:2;
  bottom:calc(59.5px - 1.5667 * var(--btn-fs));
  display:flex; justify-content:center;
}
.ego-landing__enter{
  font-family:inherit; font-size:var(--btn-fs); font-weight:700;
  letter-spacing:calc(var(--btn-fs) * .1333);          /* 2px @15px */
  color:#EAF6FF; background:rgba(53,227,208,.10);
  border:calc(var(--btn-fs) / 15) solid rgba(53,227,208,.55);   /* 1px @15px */
  border-radius:calc(var(--btn-fs) * .6667);                    /* 10px @15px */
  padding:calc(var(--btn-fs) * .8667) calc(var(--btn-fs) * 2.2667);  /* 13/34px @15px */
  cursor:pointer;
  box-shadow:0 0 0 calc(var(--btn-fs) / 15) rgba(53,227,208,.10) inset,
             0 calc(var(--btn-fs) * .6667) calc(var(--btn-fs) * 2) rgba(53,227,208,.16);
  transition:background .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}
.ego-landing__enter:hover{
  background:rgba(53,227,208,.18);
  border-color:rgba(53,227,208,.88);
  box-shadow:0 0 0 calc(var(--btn-fs) / 15) rgba(53,227,208,.18) inset,
             0 calc(var(--btn-fs) * .8) calc(var(--btn-fs) * 2.2667) rgba(53,227,208,.24);
  transform:translateY(-1px);
}
.ego-landing__enter:focus-visible{outline:2px solid #35E3D0; outline-offset:3px;}

/* 进入后右上角的「返回开场页」小按钮：默认 display:none（禁用 JS 时不该出现），JS 启用后加 .is-ready */
.ego-back-intro{
  display:none;
  position:fixed; top:78px; right:12px; z-index:70;
  font-family:inherit; font-size:11px; font-weight:700; letter-spacing:.5px;
  color:#5B6B7C; background:rgba(255,255,255,.82);
  border:1px solid rgba(147,161,177,.55); border-radius:8px;
  padding:5px 9px; cursor:pointer; opacity:.55;
  transition:opacity .18s ease, color .18s ease, border-color .18s ease;
}
.ego-back-intro.is-ready{display:inline-flex; align-items:center; gap:4px;}
.ego-back-intro:hover{opacity:1; color:#2F6FED; border-color:#2F6FED;}
.ego-back-intro:focus-visible{opacity:1; outline:2px solid #2F6FED; outline-offset:2px;}

/* 窄屏：三词组可换行（每个词组自身 nowrap），但层级不变
   （图标 → 词组 → 产品名 → 大脑 → 按钮），且不得横向溢出。
   v6：字号只降档、不回到「一句话占半行」的小字——窄屏也保持文字区显眼。 */
@media (max-width:1024px){
  .ego-landing__head{top:3.4vh;}
  /* v7：这一档宽度不够放下基础字号的三个词组，改用「vh 主导 + 宽度封顶」的较窄字号：
     words 27.6px@768 高、name 34.2px@768 高，实测仍是一行（不换行），
     1024×768 的文字区因此从 26.3% 提到 ≈33%；再大就会换行，属于宽度受限。 */
  .ego-landing__words{font-size:clamp(20px, max(2.375vw, 3.6vh), 30px);}
  .ego-landing__name{font-size:clamp(23px, max(3vw, 4.45vh), 36px);}
}

@media (max-width:760px){
  .ego-landing__head{top:3.4vh; padding:0 14px;}
  .ego-landing__mark{width:72px; height:72px;}
  .ego-landing__words{gap:6px 16px; font-size:18px; max-width:94vw; margin-top:18px;}
  .ego-landing__name{font-size:24px; letter-spacing:.5px; max-width:94vw; margin-top:16px;}
}

@media (max-width:640px){
  .ego-landing__head{top:3.2vh;}
  .ego-landing__mark{width:64px; height:64px;}
  .ego-landing__words{font-size:17.5px; margin-top:16px;}
  .ego-landing__name{font-size:22px; margin-top:14px;}
  .ego-landing__foot{bottom:24px;}
  /* v9：这一档把 --btn-fs 钉回 14px（按钮高 43.9px ≈ 改前 44px，尺寸不变），
     bottom:24px 仍由上面一条覆盖 —— 640 档原本就豁免文字区占比，按钮不动。 */
  .ego-landing__enter{--btn-fs:14px;}
  .ego-back-intro{top:70px; right:8px;}
}

/* 尊重系统「减少动态效果」：不自转由 JS 负责，这里把入场/交接动画降级为即时 */
@media (prefers-reduced-motion: reduce){
  .ego-landing, .ego-landing.is-leaving{
    transition:none !important;
    transform:none !important;
  }
  .ego-landing__mark,
  .ego-landing__words,
  .ego-landing__name,
  .ego-landing__foot{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
  }
  html.ego-landing-open body,
  html.ego-landing-open.ego-landing-leaving body{
    opacity:1 !important;
    transition:none !important;
  }
}