/* ===== XILET · 强制浅色 + 图片资源 ===== */

/* ---------- ① 禁用浏览器强制暗色反转 ---------- */
/* 部分安卓浏览器/WebView 在系统开启深色模式时，
   会自动反转页面颜色，导致白底变黑底、配色全乱。
   这里显式声明本页只支持浅色方案，阻止自动反转。 */
:root{
  color-scheme: only light;
  supported-color-schemes: light;
}

html{
  color-scheme: only light;
  background:#ffffff;
  /* 阻止部分浏览器的智能反色 */
  -webkit-text-size-adjust:100%;
  forced-color-adjust:none;
}

body{
  color-scheme: only light;
  background:#ffffff;
  color:#1A1F2E;
  forced-color-adjust:none;
  -webkit-font-smoothing:antialiased;
}

/* 明确锁定所有主要容器背景，防止继承被改写 */
.topbar,
.masthead,
.nav,
.section,
.section--soft,
.footer,
.slide,
.pagewrap,
.sub-main,
.article,
.side-card{
  forced-color-adjust:none;
}

/* 输入类元素同样锁定 */
input, textarea, select, button{
  color-scheme: only light;
  forced-color-adjust:none;
}

/* ---------- ② 轮播图片背景 ---------- */
.slide{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  /* 图片与文字一起向左滑动切换（transform 可动画，兼容性好） */
  transition:transform .75s cubic-bezier(.22,.61,.36,1),opacity .75s ease;
}

/* 轮播文字加投影，保证压在照片上依然清晰 */
/* 注意：不要覆盖 position，保持 components.css 的 absolute + inset:0 全区域可点 */
.slide-inner{
  z-index:2;
}
.slide-title{
  text-shadow:0 2px 16px rgba(5,18,36,.55);
}
.slide-tag{
  text-shadow:0 1px 8px rgba(5,18,36,.5);
}
.slide-desc{
  text-shadow:0 1px 10px rgba(5,18,36,.5);
}

/* ---------- ③ 关于页配图 ---------- */
.about-photo{
  margin:0 0 26px;
  border-radius:var(--r-6,6px);
  overflow:hidden;
  border:1px solid var(--line-lt,#EEF2F6);
  background:var(--bg-soft,#F7F9FB);
}
.about-photo img{
  display:block;
  width:100%;
  height:auto;
}
.about-photo figcaption{
  padding:11px 16px;
  font-size:12.5px;
  color:var(--ink-300,#9AA3B0);
  border-top:1px solid var(--line-lt,#EEF2F6);
  background:#fff;
}

/* ---------- 移动端 ---------- */
@media (max-width:768px){
  .slide{
    background-position:center 30%;
  }
  .about-photo{
    margin-bottom:20px;
  }
  .about-photo figcaption{
    padding:9px 12px;
    font-size:12px;
  }
}