/* ============================================================
全站背景轮播 · 独立样式
用法：任意页面加一行 即可
再引入 （或由 portal.js 自动调用）
设计依据（四图实测平均色，见 _peek/analyze_bg_color.py）：
bg-gown 橙棕 71% 亮度 105
bg-lavender 蓝 50% 红 34% 亮度 149
bg-profile 蓝 53% 红 35% 亮度 143
bg-hanfu 黄 44% 橙棕 27% 亮度 101
四图总平均 (128,124,115) 亮度 124 → 暖调为主，需压暗后配浅色文字。
故底色取「暖炭」而非原来的青玉色，避免与照片的橙棕/黄打架。
可调参数（由 bg.js 写到 的行内 style，设置页改完即时生效）：
--bg-opacity 背景图层不透明度（0~1，默认 .62）
--bg-interval 每张停留秒数（默认 12s）
--card-opacity 卡片/按钮底色不透明度（默认 .76）
============================================================ */
:root {
--bg-base: #14110e; /* 暖炭底：照片未加载完时的兜底色 */
--bg-veil: 11, 9, 7; /* 蒙版基色（暖黑），配合 rgba 使用 */
--bg-opacity: .62; /* 背景图层不透明度，可被设置页覆盖 */
--bg-interval: 12s; /* 每张停留时长，可被设置页覆盖 */
--card-opacity: .76; /* 卡片底色不透明度，可被设置页覆盖 */
}
/* 兜底底色挂在 html，body 必须透明，否则会盖住轮播层 */
html { background: var(--bg-base); }
body { background: transparent; }
/* ---------- 轮播容器 ---------- */
.bgslides {
position: fixed; inset: 0; z-index: 0;
pointer-events: none;
overflow: hidden;
background: var(--bg-base);
opacity: var(--bg-opacity);
transition: opacity .28s ease;
}
.bgslides i {
position: absolute; inset: 0;
background-size: cover;
background-repeat: no-repeat;
opacity: 0;
will-change: opacity, transform;
/* 周期由 JS 按「张数 × interval」写死在 animation-duration 上；
这里给默认值，保证没跑 JS 时也能动 */
animation:
bgfade 48s ease-in-out infinite,
bgzoom 48s ease-in-out infinite alternate;
}
/* 每张图占 1/4 周期：前 6% 淡入 → 中段常亮 → 后 6% 淡出 → 其余全暗。
注意：张数变了以后 animation-duration 会变，此时比例仍是「每张 25%」 */
@keyframes bgfade {
0% { opacity: 0; }
6% { opacity: 1; }
25% { opacity: 1; }
31%, 100% { opacity: 0; }
}
/* 缓慢放大，给静止画面呼吸感 */
@keyframes bgzoom {
from { transform: scale(1.00); }
to { transform: scale(1.07); }
}
/* ---------- 可读性蒙版 ----------
中间偏亮（让照片看得见）、四周压暗（文字压得住） */
body::after {
content: "";
position: fixed; inset: 0; z-index: 0; pointer-events: none;
background:
radial-gradient(1100px 680px at 76% -6%, rgba(214,168,110,.14), transparent 62%),
radial-gradient(880px 600px at 6% 104%, rgba(120,150,190,.13), transparent 60%),
linear-gradient(168deg,
rgba(var(--bg-veil), .50) 0%,
rgba(var(--bg-veil), .30) 36%,
rgba(var(--bg-veil), .60) 100%);
}
/* ---------- 正文层 ----------
背景是 z-index:0 的 fixed 元素，正文要显式抬到它上面。
这里覆盖全站已知的容器类名；新页面加容器时把它补进这一行。 */
.box, .wrap, .lawwrap, .topbar, main, .grid, .panel,
.content, .container, .page, .app, .main {
position: relative;
z-index: 1;
}
/* ---------- 无障碍 ---------- */
@media (prefers-reduced-motion: reduce) {
.bgslides i { animation: none; }
}