/* ============================================================
   p3.css — 分色域校正 v2
   三星（sRGB OLED）默认鲜艳模式会自己提亮暗部 → #08080a 看着合适
   iPhone（P3 OLED）忠实还原暗部 → #08080a 会显得过黑
   所以 P3 单独提亮 3 档到 #0b0b0e
   ============================================================ */

html, body { background: #08080a; }

/* ---------- sRGB 屏（三星等）：保持不动 ---------- */
@media (color-gamut: srgb) {
  html, body { background: #08080a; }
  .spot {
    background: radial-gradient(380px circle at var(--mx,50%) var(--my,42%),
      rgba(200,168,96,.055), transparent 62%);
  }
}

/* ---------- P3 屏（iPhone）：背景提亮，不再是黑洞 ---------- */
@media (color-gamut: p3) {
  html, body { background: #111116 !important; }

  body, h1, .toptabs .brand, .px, .chg { color: #ffffff; }
  h1 .gold, .toptabs .live { color: #eec257; }
  .toptabs .live i { background:#eec257; box-shadow:0 0 14px #eec257; }
  .toptabs .tab::after { background:#eec257; }
  .toptabs .tab { color:#8d8d87; }
  .toptabs .tab.on, .toptabs .tab:hover { color:#ffffff; }
  .toptabs .langbtn { color:#8d8d87; border-color:rgba(255,255,255,.18); }
  .toptabs .langbtn:hover { color:#ffffff; border-color:rgba(255,255,255,.4); }
  .langsw.on .langbtn { border-color:rgba(238,194,87,.6); color:#eec257; }
  .lede { color:#b9b9b1; }
  .lede b { color:#ffffff; }
  .pxl, .pxmeta, .kick, .pillars dt { color:#9a9a94; }
  .pxmeta b, .pillars dd { color:#ffffff; }
  .pillars dd small { color:#9a9a94; }
  .pillars, .pillars > div { border-color:rgba(255,255,255,.13) !important; }
  .bottabs { color:#8a8a84; }
  .bottabs .tag { color:#a8a8a2; border-color:rgba(255,255,255,.13); }
  .btn { background:#ffffff; color:#050507; }
  .btn:hover { background:#eec257; color:#000; }
  .wm { color:rgba(255,255,255,.03); }

  /* 背景已提亮，光晕略降避免再次发灰 */
  .spot {
    background: radial-gradient(400px circle at var(--mx,50%) var(--my,42%),
      rgba(200,168,96,.045), transparent 62%);
  }
}

/* ---------- 触摸设备：光晕固定偏上，更弱 ---------- */
@media (hover: none) {
  .spot {
    background: radial-gradient(320px circle at 50% 30%,
      rgba(200,168,96,.048), transparent 62%) !important;
  }
}

/* ===== 手机/触摸设备：背景固定光晕（不跟随，位置 50% 30%）2026-10-25 v2 ===== */
@media (hover: none), (pointer: coarse) {
  .spot{
    background: radial-gradient(520px circle at 50% 30%,
      rgba(200,168,96,.17), rgba(200,168,96,.07) 44%, transparent 70%) !important;
    transition: none !important;
  }
}

/* iPhone / P3 广色域：暖金（H≈33°，亮度回到 .135）v4-rollback */
@media (hover: none) and (color-gamut: p3),
       (pointer: coarse) and (color-gamut: p3) {
  .spot{
    background: radial-gradient(480px circle at 50% 30%,
      rgba(244,180,96,.118),
      rgba(240,166,84,.049) 44%,
      transparent 70%) !important;
    transition: none !important;
  }
}


/* 滚动条占位，避免页面切换时内容横向跳动 */



/* ===== 光晕最终规则：固定位置，不跟随鼠标（消除进页面时背景跳动）===== */
.spot{
  background: radial-gradient(520px circle at 30% 30%,
    rgba(200,168,96,.17), rgba(200,168,96,.07) 44%, transparent 70%) !important;
  transition: none !important;
}
@media (hover:hover) and (pointer:fine) and (color-gamut:p3){
  .spot{
    background: radial-gradient(480px circle at 30% 30%,
      rgba(244,180,96,.135), rgba(240,166,84,.055) 44%, transparent 70%) !important;
  }
}
body.touchdev .spot{
  background: radial-gradient(520px circle at 50% 30%,
    rgba(200,168,96,.17), rgba(200,168,96,.07) 44%, transparent 70%) !important;
}
body.touchdev.p3dev .spot{
  background: radial-gradient(500px circle at 50% 30%,
    rgba(244,180,96,.15), rgba(240,166,84,.062) 44%, transparent 70%) !important;
}
