/* Edge artwork belongs to the page background, never the content flow. */
body.united-store .united-main,body.united-identity .identity-main{position:relative;isolation:isolate}
.page-background-layer{position:absolute;z-index:-1;inset:0 auto 0 calc(50% - 50vw);width:100vw;overflow-x:clip;overflow-y:visible;pointer-events:none;user-select:none}
/* Facing and resting angle are shared by the still pose and the floating animation. */
.page-background-layer .ambient-character{--art-facing:1;--art-angle:0deg;--art-y:55%;--art-clearance:calc(var(--art-size)*.2 + 12px);position:absolute;top:clamp(var(--art-clearance),var(--art-y),calc(100% - var(--art-size) - var(--art-clearance)));display:block;max-width:none;width:var(--art-size);height:var(--art-size);object-fit:contain;opacity:1;filter:none;transform:rotate(var(--art-angle)) scaleX(var(--art-facing));transform-origin:center;animation:ambient-drift 7s ease-in-out infinite alternate;animation-play-state:paused}
.page-background-layer .ambient-character--recycle{--art-size:clamp(220px,23vw,330px);left:clamp(-95px,-5vw,-55px);--art-y:32%}
.page-background-layer .ambient-character--cart{--art-size:clamp(245px,25vw,360px);right:clamp(-100px,-5vw,-60px);--art-y:57%;animation-delay:-3s}
.page-background-layer .ambient-character--card{--art-size:clamp(235px,24vw,340px);right:clamp(-85px,-4vw,-48px);--art-y:34%;animation-delay:-1.5s}
.page-background-layer .ambient-character--human{--art-size:clamp(290px,31vw,440px);left:clamp(-16px,-.6vw,-8px);--art-y:55%;--art-clearance:calc(var(--art-size)*.1 + 12px);height:calc(var(--art-size)*1.25);animation-delay:-4s}
/* Each page gets its own composition. Figures stay behind panels and outside layout flow. */
.page-background--sellnow .ambient-character--recycle{left:auto;right:clamp(-95px,-5vw,-55px);--art-y:18%;--art-angle:14deg}
.page-background--productdetail .ambient-character--cart{left:clamp(-100px,-5vw,-60px);right:auto;--art-y:calc(100% - 8% - var(--art-size));--art-facing:-1;--art-angle:-7deg}
.page-background--cart .ambient-character--recycle{left:auto;right:clamp(-90px,-5vw,-55px);--art-y:64%;--art-angle:-18deg;--art-size:clamp(220px,24vw,350px)}
.page-background--buyinbulk .ambient-character--cart{left:auto;right:clamp(-105px,-5vw,-60px);--art-y:42%;--art-angle:-8deg;--art-size:clamp(245px,27vw,380px)}
.page-background--buyinbulk .ambient-character--recycle{--art-y:calc(100% - 6% - var(--art-size));--art-angle:-16deg}
.page-background--contactus .ambient-character--human{left:auto;right:clamp(-16px,-.6vw,-8px);--art-y:calc(57% + 24px);--art-clearance:12px;--art-facing:-1;--art-angle:5deg}
.page-background--faqs .ambient-character--recycle{--art-y:58%;--art-angle:24deg;--art-size:clamp(205px,21vw,310px)}
.page-background--instructions .ambient-character--cart{left:clamp(-100px,-5vw,-60px);right:auto;--art-y:9%;--art-facing:-1;--art-angle:-6deg}
.page-background--instructions .ambient-character--recycle{left:auto;right:clamp(-95px,-5vw,-55px);--art-y:72%;--art-angle:18deg}
.page-background--aboutus .ambient-character--human{--art-y:20%;--art-angle:-5deg;--art-size:clamp(300px,32vw,460px)}
.page-background--aboutus .ambient-character--recycle{--art-y:calc(100% - 14% - var(--art-size));--art-angle:-22deg}
.page-background--success .ambient-character--human{--art-y:27%;--art-angle:6deg;--art-size:clamp(295px,31vw,450px)}
.page-background--account .ambient-character--card{left:clamp(-85px,-4vw,-48px);right:auto;--art-y:73%;--art-angle:-13deg}
.page-background--paymentandshippinginfo .ambient-character--card{--art-y:22%;--art-angle:12deg;--art-size:clamp(240px,26vw,360px)}
.page-background--manageprofile .ambient-character--human{left:auto;right:clamp(-16px,-.6vw,-8px);--art-y:calc(100% - 12% - var(--art-size));--art-facing:-1;--art-angle:5deg}
.page-background--affiliateprogram .ambient-character--human{left:auto;right:clamp(-16px,-.6vw,-8px);--art-y:67%;--art-facing:-1;--art-angle:-5deg}
.page-background--affiliateprogram .ambient-character--card{left:clamp(-85px,-4vw,-48px);right:auto;--art-y:18%;--art-angle:15deg;--art-size:clamp(225px,23vw,325px)}
.page-background--login .ambient-character--human{--art-y:calc(100% - 8% - var(--art-size));--art-angle:5deg}
.page-background--register .ambient-character--recycle{--art-y:67%;--art-angle:-16deg;--art-size:clamp(210px,22vw,320px)}
.page-background-layer .ambient-wave{position:absolute;left:-120px;top:26%;width:calc(100% + 240px);height:360px;opacity:.18;pointer-events:none;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 600' preserveAspectRatio='none'%3E%3Cpath d='M-180 340C120 100 330 520 650 300S1080 110 1390 300 1720 180 1800 220' fill='none' stroke='black' stroke-width='190'/%3E%3C/svg%3E") center/100% 100% no-repeat;animation:ambient-wave-sway 8s ease-in-out infinite alternate;animation-play-state:paused}
.page-background-layer .ambient-wave::before{content:'';position:absolute;inset:0 auto 0 0;width:200%;background:linear-gradient(100deg,#12304a 0%,#7fa3bb 20%,#c7ef52 38%,#12304a 50%,#7fa3bb 70%,#c7ef52 88%,#12304a 100%);animation:ambient-wave-flow 8s ease-in-out infinite alternate;animation-play-state:paused}
.page-background-layer .ambient-motion[data-visible=true],.page-background-layer .ambient-wave[data-visible=true]::before{animation-play-state:running}
html[data-page-hidden=true] .page-background-layer .ambient-motion,html[data-page-hidden=true] .page-background-layer .ambient-wave::before{animation-play-state:paused}
@keyframes ambient-drift{from{transform:translate3d(0,-7px,0) rotate(calc(var(--art-angle) - 3deg)) scaleX(var(--art-facing))}to{transform:translate3d(0,7px,0) rotate(calc(var(--art-angle) + 3deg)) scaleX(var(--art-facing))}}
@keyframes ambient-wave-sway{from{transform:translate3d(0,-10px,0) scaleY(.95)}to{transform:translate3d(0,10px,0) scaleY(1.05)}}
@keyframes ambient-wave-flow{from{transform:translate3d(0,0,0)}to{transform:translate3d(-40%,0,0)}}
@media(min-width:900px){.page-background-layer .ambient-wave{height:420px}}
@media(prefers-reduced-motion:reduce){.page-background-layer .ambient-motion,.page-background-layer .ambient-wave::before{animation:none!important}}
html[data-united-motion=reduced] .page-background-layer .ambient-motion,html[data-united-motion=reduced] .page-background-layer .ambient-wave::before{animation:none!important}
/* Image-led banners need one responsive photograph, not a second CSS copy. */
.storefront-banner:has(>img){background-image:none}
/* Keep reading groups opaque over the decorative layer. These surfaces add no layout space. */
.united-main:has(>.page-background-layer) :is(
 #recycleCatalog .catalog-filters,
 #recycleCatalog .catalog-results-toolbar,
 #recycleCatalog .catalog-estimate-note,
 #recycleCatalog .product-card,
 #productQuoteDetail .product-breadcrumb,
 #productQuoteDetail .quote-builder-product,
 #productQuoteDetail .product-gallery-details,
 #productQuoteDetail .related-supplies-heading,
 #productQuoteDetail .similar-product-card,
 #cartPage .quote-workspace-header,
 #cartPage .quote-help>div,
 #bulkRecyclingPage .bulk-review-overview,
 #contactUsPage .contact-location,
 #faqPage .answer-topic-nav,
 #faqPage .faq-results-toolbar,
 #faqPage .faq-support-intro,
 #shippingGuide .shipping-video-intro,
 #shippingGuide .shipping-step-sidebar,
 #aboutUnited .about-service-copy,
 #aboutUnited .about-values>header,
 #aboutUnited .about-next-copy,
 #successPage .success-heading-copy,
 #successPage .success-footer-links,
 #accountPage .account-desk-header,
 #accountPage .account-overview,
 #accountPage .account-history-heading,
 #accountPage .account-history-results,
 #accountPage .account-page-position,
 #paymentShippingPage .saved-details-heading,
 #paymentShippingPage .section-header,
 #affiliatePage .affiliate-page-heading,
 #affiliatePage .affiliate-overview>h2,
 #affiliatePage .affiliate-how>h2,
 #manageProfilePage .profile-page-heading,
 #manageProfilePage .profile-settings-help
){background-color:#fff;position:relative;isolation:isolate}
/* The homepage credit card also stays behind an opaque heading group. */
body.united-store #howItWorks.has-journey-art .section-heading{background-color:#fff}

/* Extend the reading surface over font overhang without changing layout or spacing. */
.united-main:has(>.page-background-layer) :is(
 #recycleCatalog .catalog-filters,
 #recycleCatalog .catalog-results-toolbar,
 #recycleCatalog .catalog-estimate-note,
 #recycleCatalog .product-card,
 #productQuoteDetail .product-breadcrumb,
 #productQuoteDetail .quote-builder-product,
 #productQuoteDetail .product-gallery-details,
 #productQuoteDetail .related-supplies-heading,
 #productQuoteDetail .similar-product-card,
 #cartPage .quote-workspace-header,
 #cartPage .quote-help>div,
 #bulkRecyclingPage .bulk-review-overview,
 #contactUsPage .contact-location,
 #faqPage .answer-topic-nav,
 #faqPage .faq-results-toolbar,
 #faqPage .faq-support-intro,
 #shippingGuide .shipping-video-intro,
 #shippingGuide .shipping-step-sidebar,
 #aboutUnited .about-service-copy,
 #aboutUnited .about-values>header,
 #aboutUnited .about-next-copy,
 #successPage .success-heading-copy,
 #successPage .success-footer-links,
 #accountPage .account-desk-header,
 #accountPage .account-overview,
 #accountPage .account-history-heading,
 #accountPage .account-history-results,
 #accountPage .account-page-position,
 #paymentShippingPage .saved-details-heading,
 #paymentShippingPage .section-header,
 #affiliatePage .affiliate-page-heading,
 #affiliatePage .affiliate-overview>h2,
 #affiliatePage .affiliate-how>h2,
 #manageProfilePage .profile-page-heading,
 #manageProfilePage .profile-settings-help
)::before{content:"";position:absolute;inset:-10px;z-index:-1;background:inherit;border-radius:inherit;pointer-events:none}

/* Preserve the guide's desktop sticky navigation within its reading surface. */
@media(min-width:1000px){.united-main:has(>.page-background-layer) #shippingGuide .shipping-step-sidebar{position:sticky}}

@media(min-width:64rem){.united-main:has(>.page-background-layer) #recycleCatalog .catalog-filters{position:sticky}}
/* Later content must paint above artwork in the preceding homepage section. */
body.united-store .hero-art>.collection-heading{position:relative;z-index:1;isolation:isolate;background:#fff}
body.united-store #united-tutorial-home{position:relative;isolation:isolate}