/* ============================================================
   首页「思想星云」总控台 · 页面级补充样式
   ------------------------------------------------------------
   为什么需要这个文件（main.css 确实缺这些样式，写明缘由）：
   1) 活体层的 <canvas>：main.css 的 .nebula-canvas 只按样机规则排版
      其内部 SVG（.nebula-canvas svg），没有任何 canvas 规则 ——
      交互区的 WebGL 画布需要 display:block + 宽度铺满（高度由画布
      属性的宽高比决定），以及拖拽时禁止页面滚动的 touch-action。
   2) 轴端点出口：样机里 .axis-end 是 SVG 内的 <a>（靠 .axis-end text
      上色）；集成后交互区是 WebGL 画布，出口必须是画布上方的 HTML
      浮层（<nav class="axis-exits"> + <a class="axis-exit">），需要
      自行绝对定位与配色，main.css 无对应规则。
   3) WebGL 初始化失败（无 GPU / 上下文被拒）时的兜底：把交互区换回
      静态降级态，避免留下空画布（钩子由 nebula.js 打在 <html> 上）。
   降级态三通道（无 JS / 窄屏 <48rem / prefers-reduced-motion）与
   .ni-*、.weights、.neb-* 等其余标记均已由 main.css 覆盖，此处不重复。
   ============================================================ */

/* ---- 1. 活体层画布：铺满容器，宽高比取自 canvas 属性（640×520） ---- */
.nebula-live .nebula-canvas { position: relative; }
.nebula-live .nebula-canvas canvas {
  display: block;
  width: 100%;
  height: auto; /* 高度跟随 setSize(w, h) 写入的属性比例，与 nebula.js 的 520/640 一致 */
  touch-action: none; /* 指针拖拽旋转时不触发页面滚动 */
  cursor: grab;
}
.nebula-live .nebula-canvas canvas:active { cursor: grabbing; }
.nebula-live .nebula-canvas canvas:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}

/* ---- 2. 三轴端点出口：画布上方的 HTML 浮层 <a> ---- */
.axis-exits {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none; /* 只让链接可点，不挡画布拖拽 */
}
.axis-exit {
  position: absolute;
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--axis);
  text-decoration: none;
  white-space: nowrap;
  text-shadow: 0 0 6px var(--surface), 0 0 3px var(--surface); /* 压住底下的星点 */
}
.axis-exit::before {
  content: "";
  width: 0.5em;
  height: 0.5em;
  background: var(--axis);
  flex: none;
}
.axis-exit:hover { text-decoration: underline; text-underline-offset: 3px; }
.axis-exit:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
/* 样机 SVG 布局：Y（格物）在正上方，X（行路）在右下，Z（见心）在左下 */
.axis-exit[data-axis="y"] { top: var(--space-3); left: 50%; transform: translateX(-50%); }
.axis-exit[data-axis="x"] { right: var(--space-3); bottom: var(--space-3); }
.axis-exit[data-axis="z"] { left: var(--space-3); bottom: var(--space-3); }

/* ---- 3. WebGL 初始化失败的兜底（nebula.js 在 <html> 打 data-neb-fallback） ---- */
html[data-neb-fallback] .nebula-live { display: none !important; }
html[data-neb-fallback] .nebula-fallback { display: block !important; }

/* ---- 4. 检视器「投影后进入该轴」链接容器（main.css 有 .ni-more 无 .ni-enter） ---- */
.nebula-inspector .ni-enter {
  margin: var(--space-3) 0 0;
  padding-top: var(--space-3);
  border-top: var(--rule-w) solid var(--rule);
}
