/* Keep the illustration visible while separating it from dashboard content. */
body:has(#image-background[style*="ChineseNewYear3_4k.jpg"]) {
  --newyear-glass: rgba(255, 248, 242, .84);
  --newyear-veil: rgba(255, 248, 240, .08);
  --newyear-edge: rgba(74, 35, 31, 0);
  --newyear-image-filter: saturate(1) brightness(1.12);
}
body:has(#image-background[style*="ChineseNewYear3_4k.jpg"]):has(.radix-themes.dark) {
  --newyear-glass: rgba(30, 24, 29, .86);
  --newyear-veil: rgba(23, 20, 29, 0);
  --newyear-edge: rgba(12, 10, 19, 0);
  --newyear-image-filter: saturate(1) brightness(1.08);
}
body:has(#image-background[style*="ChineseNewYear3_4k.jpg"]) #image-background {
  filter: var(--newyear-image-filter);
}
body:has(#image-background[style*="ChineseNewYear3_4k.jpg"]) #image-background::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(var(--newyear-veil), var(--newyear-veil)),
    radial-gradient(ellipse at 62% 42%, transparent 20%, var(--newyear-edge) 100%);
}
body:has(#image-background[style*="ChineseNewYear3_4k.jpg"]) .purcarte-blur {
  background-color: var(--newyear-glass) !important;
  --purcarte-blur: 18px;
  box-shadow: 0 8px 28px rgba(38, 18, 26, .10), inset 0 1px 0 rgba(255, 232, 212, .10);
}
@media (prefers-reduced-transparency: reduce) {
  body:has(#image-background[style*="ChineseNewYear3_4k.jpg"]) .purcarte-blur {
    background-color: rgb(255, 248, 242) !important;
    backdrop-filter: none !important;
  }
  body:has(#image-background[style*="ChineseNewYear3_4k.jpg"]):has(.radix-themes.dark) .purcarte-blur {
    background-color: rgb(30, 24, 29) !important;
  }
}