/* ============================================================
   LIGHT — 登录背景光照氛围，由 js/effects/light.js 控制
   四层：空气色调 / 天际辉光 / 前景沉黑 / 星空（另有一个"远景提亮"默认关闭）
   ★ 外观固定：原来靠 B/C/G/N/L 五个键切换，调试结束后键位已删除，
     取值定在 js 的 light.js 里。body class 仍按取值挂：
     light-off-bright / -tint / -glow / -stars（哪个为 off 就挂哪个）
   想整体移除：删 index.html 里 light.css / light.js 两行引用即可
   #fx-light 不设 z-index（z-index:auto 不形成堆叠上下文），
   否则内部混合会被隔离、无法作用到城市。
   ============================================================ */

#fx-light {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

/* ---------- B：空气透视（越远对比越低、越淡越灰越朦胧，近景越实越暗；不动 mask/位置） ----------
   关键改动：所有"变淡"全部由 brightness 承担，不再用 opacity。
   opacity 是"整体透光"——楼体和天空一起变半透明，于是后面的一切（远景 ASCII 城市、
   星空、炮火暖光）都会从楼里透上来，"最远"这个层次就失效了，看起来像浮在前面。
   改成亮度后楼体 alpha 是满的：该挡住的真正挡住，只在自己轮廓之外才露出后面的东西。
   下面每行的 brightness 都等于原来的 brightness × opacity，观感不变。 */
#bg-building { filter: grayscale(1) contrast(.45) brightness(.432); opacity: 1; }  /* 最远：1.08×.40 */
#bg-f5       { filter: grayscale(1) contrast(.60) brightness(.570); opacity: 1; }  /* .95×.60 */
#bg-f3       { filter: grayscale(1) contrast(.78) brightness(.680); opacity: 1; }  /* .85×.80 */
#bg-f2       { filter: grayscale(1) contrast(.92) brightness(.684); opacity: 1; }  /* .72×.95 */
#bg-near     { filter: grayscale(1) contrast(1.06) brightness(.600); opacity: 1; } /* 最近：实、暗、清晰 */
body.light-off-bright #bg-building,
body.light-off-bright #bg-f5,
body.light-off-bright #bg-f3,
body.light-off-bright #bg-f2,
body.light-off-bright #bg-near {
  filter: grayscale(1) brightness(0.55) !important;
  opacity: 1 !important;
}
/* 原先这里靠 opacity .3 把最远景压暗；同样折成亮度：0.55 × 0.30 = 0.165 */
body.light-off-bright #bg-building { filter: grayscale(1) brightness(0.165) !important; }

/* ---------- N：星空（静态贴片，置于城市层之下 z0；楼挡星、天空露星，固定合理） ---------- */
#starfield {
  position: absolute;
  left: 0;
  width: 100%;
  top: 2%;
  height: 34%;
  z-index: 0;
  background-repeat: repeat-x;
  background-size: 100% 100%;
  mix-blend-mode: screen;
}
body.light-off-stars #starfield { display: none; }

/* ---------- C：大气色调（fading-16.gpl；远冷青→中暖灰→近褐黑；color 只上色、不改明度） ---------- */
#air-tint {
  position: absolute;
  inset: 0;
  z-index: 5;
  mix-blend-mode: color;
opacity: 0.5;
background: linear-gradient(to bottom,
  #aaa25d 0%,
  #b9906a 26%,
  #8c6f56 48%,
  #774251 70%,
  #2a2024 100%);
}
body.light-off-tint #air-tint { display: none; }

/* ---------- G：天际线辉光（screen 加色，黑底不发光、绝不遮挡；冷青在上、暖橘压基线） ---------- */
#sky-glow {
  position: absolute;
  left: 0;
  width: 100%;
  top: 12%;
  height: 46%;
  z-index: 5;
  mix-blend-mode: screen;
  background:
    radial-gradient(120% 130% at 50% 100%, rgba(96,150,184,.22), rgba(96,150,184,0) 64%),
    linear-gradient(to bottom,
      rgba(70,110,140,0) 0%,
      rgba(94,150,186,.15) 46%,
      rgba(214,150,92,.08) 72%,
      rgba(0,0,0,0) 100%);
}

/* G：前景沉黑——在城市带截止线(~52%)处快速压到纯黑，线下整片同色，硬线无灰阶差可显 */
#fg-veil {
  position: absolute;
  left: 0;
  width: 100%;
  top: 48%;
  height: 52%;
  z-index: 5;
  background: linear-gradient(to bottom,
    rgba(6,6,8,0) 0%,
    rgba(6,6,8,.78) 9%,
    rgba(6,6,8,1) 22%,
    rgba(6,6,8,1) 100%);
}
/* 开机 crtPowerOn 会把亮度拉到 6 倍；开机期间让沉黑更早到纯黑，避免截止线被高亮度放大。
   注意：这段**不能**直接改写 #fg-veil 的 background —— background 上没有过渡，
   而 Chrome 对两个 stop 数不同的渐变不做插值（实测撤类后 +0ms 就跳到终值），
   于是开机结束（main.js 里 boot-animation 移除）的瞬间，纯黑边缘会硬跳约 22px。
   改成叠一层只有 opacity 在动的伪元素：两个渐变都是静态的，合成结果连续，
   视觉上变成 1s 内缓缓压下去 / 缓缓退回来。 */
#fg-veil::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom,
    rgba(6,6,8,0) 0%,
    rgba(6,6,8,.9) 6%,
    #060608 16%,
    #060608 100%);
  opacity: 0;
  transition: opacity 1s ease;
}
body.boot-animation #fg-veil::after { opacity: 1; }
/* G：远景雾幕——只在远方水平把楼洗白变淡(screen 暖雾)，向近景淡出；与下方沉黑一抬一压构成空气透视 */
#haze {
  position: absolute;
  left: 0;
  width: 100%;
  top: 17%;
  height: 40%;
  z-index: 5;
  mix-blend-mode: screen;
  background: linear-gradient(to bottom,
    rgba(206,196,170,0) 0%,
    rgba(206,196,170,.16) 42%,
    rgba(206,196,170,.08) 72%,
    rgba(0,0,0,0) 100%);
}
body.light-off-glow #sky-glow,
body.light-off-glow #haze,
body.light-off-glow #fg-veil { display: none; }

