/* Sitewide layered background system */
html, body { height: 100%; }
body { min-height: 100vh; position: relative; }
#app-layers, #site-content { position: relative; }
#app-layers { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
#app-layers .layer { position: absolute; inset: 0; display: grid; place-items: center; }
#app-layers .layer img { width: 100%; height: 100%; object-fit: cover; }
#app-layers .layer-background { z-index: 0; }
#app-layers .layer-seasonal   { z-index: 1; }
#app-layers .layer-showcase   { z-index: 2; }
#site-content { position: relative; z-index: 3; min-height: 100vh; }
#app-layers .layer-seasonal img { opacity: 0.5; }
#app-layers .layer-showcase img { opacity: 0.5; }

/* DSNET_LAYERS_ZINDEX_FIX
   Ensure background/layer elements sit BEHIND page content and do not block clicks.
   This is an additive safety override.
*/
#app-layers {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
#app-layers * { pointer-events: none; }
#site-root, #site-content, main, header, footer {
  position: relative;
  z-index: 10;
}