/**
 * shazhouy · 季节 / 昼夜氛围（全站光影与色调）
 */

body.shazhouy-app {
  transition: background-color 0.5s ease;
}

/* —— 季节色调 —— */
body.shazhouy-season-spring {
  --atmo-hero-filter: saturate(1.08) brightness(1.04) hue-rotate(-6deg);
  --atmo-veil-hero: linear-gradient(180deg, rgba(18, 42, 28, 0.26) 0%, rgba(12, 28, 20, 0.46) 100%);
  --atmo-page-tint: rgba(168, 220, 180, 0.06);
}
body.shazhouy-season-summer {
  --atmo-hero-filter: saturate(1.12) brightness(1.02);
  --atmo-veil-hero: linear-gradient(180deg, rgba(10, 24, 20, 0.3) 0%, rgba(8, 18, 14, 0.5) 100%);
  --atmo-page-tint: rgba(120, 200, 160, 0.05);
}
body.shazhouy-season-autumn {
  --atmo-hero-filter: saturate(0.95) brightness(0.96) sepia(0.12) hue-rotate(-8deg);
  --atmo-veil-hero: linear-gradient(180deg, rgba(36, 22, 10, 0.32) 0%, rgba(24, 14, 8, 0.52) 100%);
  --atmo-page-tint: rgba(220, 170, 100, 0.06);
}
body.shazhouy-season-winter {
  --atmo-hero-filter: saturate(0.82) brightness(1.06) hue-rotate(12deg);
  --atmo-veil-hero: linear-gradient(180deg, rgba(16, 24, 36, 0.34) 0%, rgba(10, 16, 28, 0.54) 100%);
  --atmo-page-tint: rgba(180, 210, 240, 0.06);
}

/* —— 昼夜 —— */
body.shazhouy-phase-day {
  --atmo-hero-filter: saturate(1.06) brightness(1.02) contrast(1.01);
  --atmo-veil-hero:
    linear-gradient(180deg, rgba(8, 16, 20, 0.06) 0%, rgba(6, 12, 16, 0.16) 62%, rgba(6, 12, 16, 0.28) 100%),
    radial-gradient(ellipse 50% 40% at 72% 14%, rgba(255, 220, 130, 0.12) 0%, transparent 58%);
}
body.shazhouy-phase-night {
  --atmo-hero-filter: brightness(0.86) saturate(0.92) contrast(1.02);
  --atmo-veil-hero: linear-gradient(180deg, rgba(8, 14, 22, 0.28) 0%, rgba(6, 10, 18, 0.4) 100%);
  --atmo-page-tint: rgba(80, 120, 180, 0.04);
}

body.shazhouy-phase-night #pageHome {
  --atmo-hero-filter: brightness(0.94) saturate(0.96) contrast(1.01);
  --atmo-veil-hero:
    linear-gradient(
      180deg,
      rgba(8, 16, 24, 0.12) 0%,
      rgba(6, 12, 18, 0.22) 65%,
      rgba(6, 10, 16, 0.3) 88%,
      rgba(245, 242, 235, 0.06) 96%,
      rgba(245, 242, 235, 0.18) 100%
    ),
    radial-gradient(ellipse 50% 38% at 72% 14%, rgba(255, 220, 130, 0.14) 0%, transparent 58%);
}

body.shazhouy-season-spring.shazhouy-phase-night,
body.shazhouy-season-summer.shazhouy-phase-night,
body.shazhouy-season-autumn.shazhouy-phase-night,
body.shazhouy-season-winter.shazhouy-phase-night {
  --atmo-hero-filter: brightness(0.82) saturate(0.9) contrast(1.04);
}

#pageHome .lp-scene__photo {
  transition: filter 0.6s ease;
  filter: var(--atmo-hero-filter, none);
}
#pageHome .lp-scene__veil--hero {
  transition: background 0.6s ease;
  background: var(--atmo-veil-hero, linear-gradient(to bottom, rgba(0, 0, 0, 0.28) 0%, rgba(0, 0, 0, 0.42) 100%)) !important;
}
#pageHome {
  background-image: radial-gradient(ellipse 80% 50% at 50% 0%, var(--atmo-page-tint, var(--qq-page-tint)) 0%, transparent 55%);
}

body.shazhouy-app .main-page:not(#pageHome) {
  background-image: radial-gradient(ellipse 80% 50% at 50% 0%, var(--atmo-page-tint, var(--qq-page-tint)) 0%, transparent 55%);
}

@media (min-width: 1024px) {
  body.shazhouy-phase-day {
    --atmo-veil-hero:
      linear-gradient(
        180deg,
        rgba(8, 16, 20, 0.04) 0%,
        rgba(6, 12, 16, 0.12) 62%,
        rgba(6, 12, 16, 0.22) 84%,
        rgba(245, 242, 235, 0.1) 94%,
        rgba(245, 242, 235, 0.32) 100%
      ),
      radial-gradient(ellipse 50% 40% at 72% 12%, rgba(255, 220, 130, 0.14) 0%, transparent 58%);
  }
}

body.shazhouy-phase-night #pageGallery {
  background:
    radial-gradient(ellipse 70% 45% at 30% 0%, rgba(60, 90, 140, 0.08) 0%, transparent 55%),
    var(--qq-bg, #1a201e);
}
body.shazhouy-phase-night #pageCapsule {
  background:
    radial-gradient(ellipse 70% 45% at 50% 0%, rgba(232, 184, 74, 0.06) 0%, transparent 55%),
    var(--capsule-bg, #1e1c18);
}
body.shazhouy-season-autumn #pageWish {
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(200, 140, 60, 0.1) 0%, transparent 55%),
    linear-gradient(180deg, #ece4d8 0%, var(--qq-bg, #f4f8f6) 40%);
}
body.shazhouy-season-autumn #pageCapsule {
  background:
    radial-gradient(ellipse 75% 50% at 50% 0%, rgba(200, 140, 60, 0.12) 0%, transparent 55%),
    var(--capsule-bg, #f5f0e8);
}

/* 氛围选择面板 */
.lp-live-env { position: relative; }
.lp-live-pill--env {
  cursor: pointer;
  transition: background 0.2s ease, transform 0.15s ease;
}
.lp-live-pill--env:hover { transform: translateY(-1px); }
.lp-scene-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 220px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(10, 16, 14, 0.94);
  backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.32);
  z-index: 30;
}
.lp-scene-menu-section { margin-bottom: 10px; }
.lp-scene-menu-section:last-child { margin-bottom: 0; }
.lp-scene-menu-label {
  display: block;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 6px;
  letter-spacing: 0.08em;
}
.lp-scene-menu-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.lp-scene-menu-row button {
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.88);
  font-size: 12px;
  cursor: pointer;
}
.lp-scene-menu-row button:hover,
.lp-scene-menu-row button.active {
  background: rgba(61, 139, 122, 0.28);
  border-color: rgba(110, 201, 168, 0.45);
  color: #fff;
}

/* API 文档弹窗 */
.api-doc-modal .modal-box {
  max-width: 640px;
  max-height: min(82vh, 720px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.api-doc-body {
  overflow-y: auto;
  padding: 0 20px 20px;
  font-size: 13px;
  line-height: 1.75;
  color: var(--qq-text-sub);
}
.api-doc-body h3 {
  font-size: 14px;
  color: var(--qq-text);
  margin: 16px 0 8px;
}
.api-doc-body code {
  font-size: 12px;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(61, 139, 122, 0.08);
  color: var(--qq-primary);
}
.api-doc-body pre {
  margin: 8px 0;
  padding: 12px;
  border-radius: 10px;
  background: var(--qq-bg);
  border: 1px solid var(--qq-border-light);
  overflow-x: auto;
  font-size: 11px;
  line-height: 1.6;
}