/* Quiet, fixed side scenery. Content stays in the body's normal stacking layer. */
body.cscom-unified.cscom-ambient-bg {
    --cscom-ambient-image: url('/assets/cscom-night-operation-v1.webp');
    background: #090d13 !important;
    isolation: isolate;
}

.cscom-ambient-background {
    --cscom-ambient-left: max(28px, calc((100vw - 1520px) / 2));
    --cscom-ambient-right: max(28px, calc((100vw - 1520px) / 2));
    position: fixed;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    contain: strict;
    background: #090d13;
}

.cscom-ambient-background::before,
.cscom-ambient-background::after {
    content: '';
    position: absolute;
    z-index: 0;
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
    background-image: linear-gradient(180deg, #090d13 0%, rgba(9, 13, 19, .08) 12%, rgba(9, 13, 19, .04) 78%, #090d13 100%), var(--cscom-ambient-image, none);
    background-size: 100% 100%, min(500%, 177.68vh) auto;
    background-repeat: no-repeat;
    filter: brightness(var(--cscom-ambient-brightness, .78)) saturate(.88);
}

.cscom-ambient-background::before {
    --cscom-ambient-brightness: .72;
    left: 0;
    width: var(--cscom-ambient-left);
    height: min(100%, calc(var(--cscom-ambient-left) * 2.814));
    background-position: center, left center;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 74%, transparent 100%);
    mask-image: linear-gradient(90deg, #000 0%, #000 74%, transparent 100%);
}

.cscom-ambient-background::after {
    --cscom-ambient-brightness: .82;
    right: 0;
    width: var(--cscom-ambient-right);
    height: min(100%, calc(var(--cscom-ambient-right) * 2.814));
    background-position: center, right center;
    -webkit-mask-image: linear-gradient(270deg, #000 0%, #000 74%, transparent 100%);
    mask-image: linear-gradient(270deg, #000 0%, #000 74%, transparent 100%);
}

.cscom-ambient-background canvas {
    display: block;
    position: absolute;
    z-index: 1;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: .92;
    pointer-events: none;
}

.cscom-ambient-background[data-ambient-gutters='narrow']::before,
.cscom-ambient-background[data-ambient-gutters='narrow']::after { display: none; }

@media (max-width: 1100px) {
    .cscom-ambient-background::before,
    .cscom-ambient-background::after { display: none; }
}

@media (max-width: 900px) {
    .cscom-ambient-background canvas { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .cscom-ambient-background canvas { display: none; }
}
