/* Shared decorative layer for Lifetime and Timed. Storefront layouts stay unchanged. */
body.order-atmosphere {
    background-color: #080d13;
    isolation: isolate;
}

.order-atmosphere .site-bg {
    inset: 0;
    z-index: -1;
    transform: none;
    transition: none;
    background:
        radial-gradient(ellipse 28% 70% at 0% 45%, rgba(30, 109, 153, .18), transparent 78%),
        radial-gradient(ellipse 28% 70% at 100% 45%, rgba(30, 124, 100, .14), transparent 78%),
        radial-gradient(ellipse 50% 35% at 50% 0%, rgba(33, 65, 78, .10), transparent 80%),
        linear-gradient(180deg, #0a1119, #080d13 65%, #060b10);
}

/* Quiet, oversized arcs replace the moving grid and purple glow. */
.order-scenery::before,
.order-scenery::after {
    content: "";
    position: absolute;
    top: 12%;
    width: 720px;
    height: 960px;
    border: 1px solid rgba(118, 187, 208, .055);
    border-radius: 50%;
    box-shadow: 0 0 0 42px rgba(118, 187, 208, .018), 0 0 0 105px rgba(118, 187, 208, .012);
}
.order-scenery::before { right: calc(100% - 260px); }
.order-scenery::after { left: calc(100% - 260px); border-color: rgba(118, 208, 175, .055); }

.order-art-rail {
    position: absolute;
    top: clamp(160px, 19vh, 230px);
    bottom: 28px;
    width: max(0px, calc((100% - 1440px) / 2));
    display: flex;
    justify-content: center;
    align-items: flex-start;
    overflow: hidden;
    padding-inline: 12px;
}
.order-art-rail-left { left: 0; }
.order-art-rail-right { right: 0; }
.order-side-art {
    display: block;
    width: 100%;
    max-width: 390px;
    height: auto;
    max-height: calc(100vh - 200px);
    object-fit: contain;
    object-position: top center;
    opacity: .82;
    user-select: none;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 6%, #000 80%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent, #000 6%, #000 80%, transparent 100%);
}
.order-atmosphere .ambient-glow { display: none; }

@media (min-width: 2240px) {
    .order-art-rail { top: 145px; }
    .order-side-art { opacity: .9; }
}
@media (max-width: 1799px) {
    .order-side-art { opacity: .56; }
}
@media (max-width: 1599px) {
    .order-art-rail { display: none; }
    .order-atmosphere .site-bg {
        background:
            radial-gradient(ellipse 65% 60% at 0% 25%, rgba(30, 109, 153, .12), transparent 80%),
            radial-gradient(ellipse 65% 60% at 100% 60%, rgba(30, 124, 100, .09), transparent 80%),
            linear-gradient(180deg, #0a1119, #080d13 65%, #060b10);
    }
}
@media (max-width: 680px) {
    .order-scenery::before, .order-scenery::after { display: none; }
}
