/* ============================================================
   基础层：reset / 排版 / 焦点 / 滚动条
   ============================================================ */

*,*::before,*::after{ box-sizing:border-box; }

html,body{ height:100%; }

body{
  margin:0;
  min-width:320px;
  background:var(--ink);
  color:var(--text);
  font-family:var(--sans);
  font-size:var(--step-body);
  letter-spacing:var(--track-body);
  line-height:1.65;
  overflow:hidden;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

::selection{ background:rgba(242,192,120,.22); color:#fff; }

button,textarea,input{ font:inherit; color:inherit; letter-spacing:inherit; }
button{ cursor:pointer; }
h1,h2,h3,h4,p,figure,blockquote{ margin:0; }
ol,ul{ margin:0; padding:0; list-style:none; }

/* ---------- 焦点 ----------
   暖金而非浏览器默认蓝。只在键盘导航时出现，鼠标点击不出环。 */
:focus{ outline:none; }
:focus-visible{
  outline:1px solid var(--gold);
  outline-offset:2px;
}

/* ---------- 滚动条 ----------
   近乎不可见的 chrome。悬停才稍微显形。 */
*{ scrollbar-width:thin; scrollbar-color:var(--hair) transparent; }
::-webkit-scrollbar{ width:4px; height:4px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:var(--hair); border-radius:0; }
::-webkit-scrollbar-thumb:hover{ background:var(--hair-strong); }

/* ---------- 画布与暗角 ---------- */
/* 全站一层天：原站的 WebGL 粒子星系，由 ui/galaxy3d.js 画。
   两个视图共用它，区别只在亮度（切在 layout.css 的视图段）。 */
#galaxy{
  position:fixed; inset:0; z-index:0;
  display:block;
  pointer-events:none;      /* 画布不接收指针：工具站的中心是输入框，不是「我」 */
}

.vignette{
  position:fixed; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 42%, transparent 55%, rgba(2,3,8,.55) 100%),
    radial-gradient(60% 40% at 50% 108%, rgba(80,64,30,.10), transparent 70%);
}

/* 这里**故意没有**横向压暗层。
   曾经加过一层 `.stage-wash`（85% 黑的横向渐变盖住正文列），结果是整片星海
   被压成了死黑 —— 而"夜空看得见"正是这套视觉本身，不是可选的装饰。
   正文的可读性交给另外两件事，它们比盖一层灰膜干净：
     1. 进工具页时整块画布**均匀**压暗（layout.css 的 .28）
     2. 标题与衬线正文挂的 --ink-shadow（贴字描一圈黑晕）
   还有承载文字的面板自己那层 rgba(10,14,28,.72)+blur，字落在平静的
   暗面上，而不是星星上。
   所以：**不要**再加回来。 */

/* ---------- 工具类 ---------- */
.visually-hidden{
  position:absolute; width:1px; height:1px;
  margin:-1px; padding:0; border:0;
  clip:rect(0 0 0 0); clip-path:inset(50%); overflow:hidden; white-space:nowrap;
}

[hidden]{ display:none !important; }

/* 压在星光上的 micro 字补墨影。正文不需要（它落在不透明的面板上）。 */
.inked{ text-shadow:var(--ink-shadow); }